itchy-amethyst
itchy-amethyst9mo ago

saveProps

How to after save props open view page?
43 Replies
kapa.ai
kapa.ai9mo ago
Hi @Sly. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Hmm, I don't know enough to give you a confident answer yet. However, you can refer to the documentation for more details on how to use save props in Refine: - SaveButtonProps in Ant Design (https://refine.dev/docs/ui-integrations/ant-design/components/basic-views/create#savebuttonprops) - SaveButtonProps in Material UI (https://refine.dev/docs/ui-integrations/material-ui/components/basic-views/create#savebuttonprops) - SaveButtonProps in Chakra UI (https://refine.dev/docs/ui-integrations/chakra-ui/components/basic-views/create#savebuttonprops) These documents provide examples of how to customize the save button in the Create and Edit components using the saveButtonProps property. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai9mo ago
<@1172098337760096258> kapa.ai is still learning and improving, please let us know how it did by reacting below
itchy-amethyst
itchy-amethystOP9mo ago
@kapa.ai on click save button perform he saveprops and also open another page or resorce
kapa.ai
kapa.ai9mo ago
Let me check the knowledge base for you. One moment! :books: ---------------------- To perform an action after saving, you can use the onSuccess prop in the Create or Edit component. This prop is a callback function that is executed after the mutation is successfully completed. However, the provided knowledge sources do not include an example of how to use onSuccess to navigate to another page. For that, you would typically use a routing library like react-router-dom or next/router to programmatically navigate to another page. Here's a general example:
import { Create } from "@refinedev/antd";
import { useHistory } from "react-router-dom";

const PostCreate: React.FC = () => {
const history = useHistory();

return (
<Create
saveButtonProps={{ size: "small" }}
onSuccess={() => history.push('/another-page')}
>
<p>Rest of your page here</p>
</Create>
);
};
import { Create } from "@refinedev/antd";
import { useHistory } from "react-router-dom";

const PostCreate: React.FC = () => {
const history = useHistory();

return (
<Create
saveButtonProps={{ size: "small" }}
onSuccess={() => history.push('/another-page')}
>
<p>Rest of your page here</p>
</Create>
);
};
In this example, after the form is successfully submitted, the user is redirected to '/another-page'. Please note that this is a general example and might need adjustments based on your actual routing setup and the UI library you are using. For more information on how to use saveButtonProps, you can refer to the documentation: - SaveButtonProps in Ant Design (https://refine.dev/docs/ui-integrations/ant-design/components/basic-views/create#savebuttonprops) - SaveButtonProps in Material UI (https://refine.dev/docs/ui-integrations/material-ui/components/basic-views/create#savebuttonprops) - SaveButtonProps in Chakra UI (https://refine.dev/docs/ui-integrations/chakra-ui/components/basic-views/create#savebuttonprops) ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai9mo ago
<@1172098337760096258> kapa.ai is still learning and improving, please let us know how it did by reacting below
itchy-amethyst
itchy-amethystOP9mo ago
@kapa.ai after save edit the same row
kapa.ai
kapa.ai9mo ago
Let me check the knowledge base for you. One moment! :books: ---------------------- To perform an action after saving an edited row, you can use the onSuccess prop in the Edit component. This prop is a callback function that is executed after the mutation is successfully completed. However, the provided knowledge sources do not include an example of how to use onSuccess to edit the same row. For that, you would typically use a state management library like React Context or Redux to keep track of the row that is currently being edited. Here's a general example:
import { Edit } from "@refinedev/antd";
import { useHistory } from "react-router-dom";

const PostEdit: React.FC = () => {
const history = useHistory();

return (
<Edit
saveButtonProps={{ size: "small" }}
onSuccess={() => history.push('/edit-same-row')}
>
<p>Rest of your page here</p>
</Edit>
);
};
import { Edit } from "@refinedev/antd";
import { useHistory } from "react-router-dom";

const PostEdit: React.FC = () => {
const history = useHistory();

return (
<Edit
saveButtonProps={{ size: "small" }}
onSuccess={() => history.push('/edit-same-row')}
>
<p>Rest of your page here</p>
</Edit>
);
};
In this example, after the form is successfully submitted, the user is redirected to '/edit-same-row'. Please note that this is a general example and might need adjustments based on your actual routing setup and the UI library you are using. For more information on how to use saveButtonProps, you can refer to the documentation: - SaveButtonProps in Ant Design (https://refine.dev/docs/ui-integrations/ant-design/components/basic-views/create#savebuttonprops) - SaveButtonProps in Material UI (https://refine.dev/docs/ui-integrations/material-ui/components/basic-views/create#savebuttonprops) - SaveButtonProps in Chakra UI (https://refine.dev/docs/ui-integrations/chakra-ui/components/basic-views/create#savebuttonprops) ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai9mo ago
<@1172098337760096258> kapa.ai is still learning and improving, please let us know how it did by reacting below
itchy-amethyst
itchy-amethystOP9mo ago
@kapa.ai DatePicker errror on edit: "date.locale is not a function"
kapa.ai
kapa.ai9mo ago
Let me check the knowledge base for you. One moment! :books: ---------------------- The error "date.locale is not a function" is a known issue when using the DatePicker component in the edit form of a Refine project. This error is related to the dayjs library and the Ant Design's DatePicker which is default for Refine. To resolve this issue, you need to wrap the date string value fetched from the API in getValueProps. Here is an example of how to do this:
<Form.Item
label="Published At"
name="publishedAt"
getValueProps={(value) => ({
value: value ? dayjs(value) : "",
})}
>
<DatePicker />
</Form.Item>
<Form.Item
label="Published At"
name="publishedAt"
getValueProps={(value) => ({
value: value ? dayjs(value) : "",
})}
>
<DatePicker />
</Form.Item>
In this example, dayjs(value) is used to convert the value into a format that the DatePicker component can understand. Also, ensure that you are using the same version of dayjs that Refine is using. As of the time the issue was reported, the version was 1.10.5. If you are using yarn, you might encounter problems, so it's recommended to use npm instead. You can find more information and a working example in the Refine DatePicker example (https://refine.dev/docs/examples/inputs/datePicker/) and the related Github issues (https://github.com/refinedev/refine/issues/1259) and Github issues (https://github.com/refinedev/refine/issues/1813). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai9mo ago
<@1172098337760096258> kapa.ai is still learning and improving, please let us know how it did by reacting below
itchy-amethyst
itchy-amethystOP9mo ago
@kapa.ai Cannot find name 'dayjs'
kapa.ai
kapa.ai9mo ago
Let me check the knowledge base for you. One moment! :books: ---------------------- The error "Cannot find name 'dayjs'" typically occurs when the dayjs library is not installed or not imported correctly in your project. dayjs is a lightweight JavaScript library that parses, validates, manipulates, and displays dates and times for modern browsers. It's often used in Refine projects for handling date and time data. To resolve this issue, you need to install dayjs in your project. You can do this using npm or yarn:
npm install dayjs
npm install dayjs
or
yarn add dayjs
yarn add dayjs
After installing dayjs, you need to import it in the file where you want to use it:
import dayjs from 'dayjs';
import dayjs from 'dayjs';
Now, you should be able to use dayjs in your project without any issues. For more information on how to use dayjs in a Refine project, you can refer to the Refine blog post (https://refine.dev/blog/daisy-ui-react-admin-panel#other-packages) and the Github issues (https://github.com/refinedev/refine/issues/4251) related to this topic. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai9mo ago
<@1172098337760096258> kapa.ai is still learning and improving, please let us know how it did by reacting below
itchy-amethyst
itchy-amethystOP9mo ago
@kapa.ai how to after saving perform or open the view page
kapa.ai
kapa.ai9mo ago
Let me check the knowledge base for you. One moment! :books: ---------------------- To perform an action after saving, you can use the onSuccess prop in the Create or Edit component. This prop is a callback function that is executed after the mutation is successfully completed. However, the provided knowledge sources do not include an example of how to use onSuccess to navigate to a view page. For that, you would typically use a routing library like react-router-dom or next/router to programmatically navigate to the view page. Here's a general example:
import { Edit } from "@refinedev/antd";
import { useHistory } from "react-router-dom";

const PostEdit: React.FC = () => {
const history = useHistory();

return (
<Edit
saveButtonProps={{ size: "small" }}
onSuccess={() => history.push('/view-page')}
>
<p>Rest of your page here</p>
</Edit>
);
};
import { Edit } from "@refinedev/antd";
import { useHistory } from "react-router-dom";

const PostEdit: React.FC = () => {
const history = useHistory();

return (
<Edit
saveButtonProps={{ size: "small" }}
onSuccess={() => history.push('/view-page')}
>
<p>Rest of your page here</p>
</Edit>
);
};
In this example, after the form is successfully submitted, the user is redirected to '/view-page'. Please note that this is a general example and might need adjustments based on your actual routing setup and the UI library you are using. For more information on how to use saveButtonProps, you can refer to the documentation: - SaveButtonProps in Ant Design (https://refine.dev/docs/ui-integrations/ant-design/components/basic-views/create#savebuttonprops) - SaveButtonProps in Material UI (https://refine.dev/docs/ui-integrations/material-ui/components/basic-views/create#savebuttonprops) - SaveButtonProps in Chakra UI (https://refine.dev/docs/ui-integrations/chakra-ui/components/basic-views/create#savebuttonprops) ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai9mo ago
<@1172098337760096258> kapa.ai is still learning and improving, please let us know how it did by reacting below
itchy-amethyst
itchy-amethystOP9mo ago
@kapa.ai Im using modalProps to create a resource. How to do this
kapa.ai
kapa.ai9mo ago
Let me check the knowledge base for you. One moment! :books: ---------------------- To create a resource using modalProps in Refine, you can use the useModalForm hook. This hook manages UI, state, error, and data fetching for the modal and form components. Here's a general example of how to use useModalForm:
import { useModalForm } from "@pankod/refine";

const {
modalProps: createModalProps,
formProps: createFormProps,
show: createShow,
} = useModalForm({
action: "create",
resource: "posts",
});

// In your component
<Modal {...createModalProps} title="Create Post">
<Form {...createFormProps}>
{/* Your form fields go here */}
</Form>
</Modal>
import { useModalForm } from "@pankod/refine";

const {
modalProps: createModalProps,
formProps: createFormProps,
show: createShow,
} = useModalForm({
action: "create",
resource: "posts",
});

// In your component
<Modal {...createModalProps} title="Create Post">
<Form {...createFormProps}>
{/* Your form fields go here */}
</Form>
</Modal>
In this example, useModalForm is used to create a post. The action prop is set to "create" and the resource prop is set to "posts". The modalProps and formProps returned by useModalForm are then passed to the Modal and Form components respectively. You can find more information on how to use useModalForm in the Refine documentation (https://refine.dev/docs/api-reference/antd/hooks/form/useModalForm/). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai9mo ago
<@1172098337760096258> kapa.ai is still learning and improving, please let us know how it did by reacting below
itchy-amethyst
itchy-amethystOP9mo ago
@kapa.ai How to redirect a user to view page, after the form is successfully submitted. Im using this code: return ( <Modal {...modalProps} confirmLoading={loading} title="Adiconar IVA" width={560} onCancel={() => { if (onCancel) { onCancel(); return; } //TODO: modalProps.onCancel expect an event so, I used close. Actually both of them are same. close(); list("taxes", "replace"); }} > <Spin spinning={loading}> <hr /> <Form {...formProps} onFinish={(values) => { handleOnFinish(values as ITaxes); }} layout="vertical" > <Form.Item rules={[{ required: true, message: "Porfavor, insira a taxa de IVA" }]} name="taxa" label="IVA%" > <InputNumber min={0} /defaultValue={0}/ style={{ width: 220 }} placeholder="Insira a taxa de IVA"/> </Form.Item>
</Form> </Spin> </Modal> );
kapa.ai
kapa.ai9mo ago
Let me check the knowledge base for you. One moment! :books: ---------------------- To redirect a user to the view page after the form is successfully submitted, you can use the redirect function from the useForm hook in Refine. First, you need to import and use the useForm hook at the top of your component:
import { useForm } from "@pankod/refine";

const { redirect } = useForm();
import { useForm } from "@pankod/refine";

const { redirect } = useForm();
Then, in your onFinish function, you can call redirect to navigate to the view page. You would typically redirect to the "show" page of the resource with the ID of the newly created item:
<Form
{...formProps}
onFinish={async (values) => {
const data = await handleOnFinish(values as ITaxes);
redirect("show", data?.data?.id);
}}
layout="vertical"
>
<Form
{...formProps}
onFinish={async (values) => {
const data = await handleOnFinish(values as ITaxes);
redirect("show", data?.data?.id);
}}
layout="vertical"
>
In this example, handleOnFinish is assumed to be an async function that creates a new item and returns its data, including its ID. You would need to adjust this based on how your handleOnFinish function is implemented. Please note that this will only work if you have routerProvider defined in your <Refine> component along with the proper resource definition with routes and actions. You can find more information on how to use useForm and redirect in the Refine documentation (https://refine.dev/docs/data/hooks/use-form/#redirect). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai9mo ago
<@1172098337760096258> kapa.ai is still learning and improving, please let us know how it did by reacting below
itchy-amethyst
itchy-amethystOP9mo ago
@kapa.ai Im getting error: Property 'data' does not exist on type 'never'
kapa.ai
kapa.ai9mo ago
Let me check the knowledge base for you. One moment! :books: ---------------------- The error "Property 'data' does not exist on type 'never'" typically occurs when TypeScript cannot infer the correct type of a variable or the return type of a function. This can happen when you're trying to access a property on a variable that has not been properly typed. In your case, it seems like the function handleOnFinish might be returning a promise that TypeScript infers as Promise<never>, which means it's not expecting this promise to ever resolve. When you try to access the data property on the result, TypeScript throws an error because it doesn't expect the promise to have a data property. To fix this issue, you need to provide a type annotation for the return type of handleOnFinish. Here's an example of how to do this:
const handleOnFinish = async (values: ITaxes): Promise<{ data: { id: string } }> => {
// Your code here
};
const handleOnFinish = async (values: ITaxes): Promise<{ data: { id: string } }> => {
// Your code here
};
In this example, handleOnFinish is declared as an async function that takes an ITaxes object as a parameter and returns a promise that resolves to an object with a data property, which is an object with an id property of type string. Please adjust this based on the actual shape of the data returned by your handleOnFinish function. For more information on how to handle TypeScript errors in Refine, you can refer to the Refine GitHub discussions (https://github.com/refinedev/refine/discussions/4794) and GitHub issues (https://github.com/refinedev/refine/issues/2090) related to this topic. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai9mo ago
<@1172098337760096258> kapa.ai is still learning and improving, please let us know how it did by reacting below
itchy-amethyst
itchy-amethystOP9mo ago
@kapa.ai this is the code, how to correct:? onFinish={async (values) => { const data = handleOnFinish(values as IPurchases); redirect("show", data?.data.id); }}
kapa.ai
kapa.ai9mo ago
Let me check the knowledge base for you. One moment! :books: ---------------------- The handleOnFinish function seems to be asynchronous, which means it returns a Promise. You need to await the Promise to get the actual data. Here's how you can modify your code:
onFinish={async (values) => {
const data = await handleOnFinish(values as IPurchases);
redirect("show", data?.data?.id);
}}
onFinish={async (values) => {
const data = await handleOnFinish(values as IPurchases);
redirect("show", data?.data?.id);
}}
In this example, I've added the await keyword before handleOnFinish to wait for the Promise to resolve. Now, data should contain the actual data returned by handleOnFinish, and you should be able to access data?.data?.id without any TypeScript errors. Please note that this will only work if handleOnFinish is defined as an async function that returns a Promise. If handleOnFinish is not an async function, you'll need to modify it to return a Promise. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai9mo ago
<@1172098337760096258> kapa.ai is still learning and improving, please let us know how it did by reacting below
itchy-amethyst
itchy-amethystOP9mo ago
@kapa.ai still getting those errors: 'await' has no effect on the type of this expression; Property 'data' does not exist on type 'never'; in this code: onFinish={async (values) => { const data = await handleOnFinish(values as IPurchases); redirectForm("show", data?.data?.id); }}
kapa.ai
kapa.ai9mo ago
Let me check the knowledge base for you. One moment! :books: Sorry @Sly, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
itchy-amethyst
itchy-amethystOP9mo ago
@kapa.ai still getting those errors: 'await' has no effect on the type of this expression; Property 'data' does not exist on type 'never';
kapa.ai
kapa.ai9mo ago
Let me check the knowledge base for you. One moment! :books: ---------------------- The error "await has no effect on the type of this expression" typically occurs when you're using the await keyword on a value that is not a Promise. This means that TypeScript does not recognize handleOnFinish as an async function that returns a Promise. The error "Property 'data' does not exist on type 'never'" occurs when TypeScript infers the type of data as never, which means it's not expecting this variable to ever have a value. This can happen when TypeScript cannot infer the correct type of a variable or the return type of a function. To fix these issues, you need to ensure that handleOnFinish is declared as an async function that returns a Promise. Here's an example of how to do this:
const handleOnFinish = async (values: IPurchases): Promise<{ data: { id: string } }> => {
// Your code here
};
const handleOnFinish = async (values: IPurchases): Promise<{ data: { id: string } }> => {
// Your code here
};
In this example, handleOnFinish is declared as an async function that takes an IPurchases object as a parameter and returns a Promise that resolves to an object with a data property, which is an object with an id property of type string. Then, in your onFinish function, you can use the await keyword to wait for the Promise to resolve:
onFinish={async (values) => {
const data = await handleOnFinish(values as IPurchases);
redirect("show", data?.data?.id);
}}
onFinish={async (values) => {
const data = await handleOnFinish(values as IPurchases);
redirect("show", data?.data?.id);
}}
Please adjust this based on the actual shape of the data returned by your handleOnFinish function. For more information on how to handle TypeScript errors in Refine, you can refer to the Refine GitHub discussions (https://github.com/refinedev/refine/discussions/4794) and GitHub issues (https://github.com/refinedev/refine/issues/2090) related to this topic. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai9mo ago
<@1172098337760096258> kapa.ai is still learning and improving, please let us know how it did by reacting below
itchy-amethyst
itchy-amethystOP9mo ago
@kapa.ai still getting those errors on "Promise<{ data: { id: string } }>" the error is: A function whose declared type is neither 'undefined', 'void', nor 'any' must return a value
kapa.ai
kapa.ai9mo ago
Let me check the knowledge base for you. One moment! :books: ---------------------- The error "A function whose declared type is neither 'undefined', 'void', nor 'any' must return a value" typically occurs when a function is declared to return a specific type, but there's a code path that does not return a value. In your case, you've declared handleOnFinish as an async function that returns a Promise<{ data: { id: string } }>. This means that TypeScript expects every code path in handleOnFinish to return a Promise that resolves to an object of the shape { data: { id: string } }. Here's an example of how to ensure that handleOnFinish always returns a Promise:
const handleOnFinish = async (values: IPurchases): Promise<{ data: { id: string } }> => {
// Your code here
// Make sure to return a Promise that resolves to an object of the shape { data: { id: string } }
return new Promise((resolve, reject) => {
// Your async code here
// Call resolve with the data when the async operation is successful
// Call reject with an error if the async operation fails
});
};
const handleOnFinish = async (values: IPurchases): Promise<{ data: { id: string } }> => {
// Your code here
// Make sure to return a Promise that resolves to an object of the shape { data: { id: string } }
return new Promise((resolve, reject) => {
// Your async code here
// Call resolve with the data when the async operation is successful
// Call reject with an error if the async operation fails
});
};
In this example, handleOnFinish is declared as an async function that returns a new Promise. Inside the Promise, you can put your async code. When the async operation is successful, you call resolve with the data. If the async operation fails, you call reject with an error. Please adjust this based on the actual async operations performed by your handleOnFinish function. For more information on how to handle TypeScript errors in Refine, you can refer to the Refine GitHub discussions (https://github.com/refinedev/refine/discussions/4794) and GitHub issues (https://github.com/refinedev/refine/issues/2090) related to this topic. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai9mo ago
<@1172098337760096258> kapa.ai is still learning and improving, please let us know how it did by reacting below
itchy-amethyst
itchy-amethystOP9mo ago
@kapa.ai the code is: const handleOnFinish = async (values: IPurchases): Promise<{ data: { id: string } }> => { onFinish({ rqp_produto_id: values.rqp_produto_id, fornecedor_id: values.fornecedor_id, cod: values.cod, purchaseDate: values.purchaseDate, isoCode: values.isoCode, currency_id: values.currency_id, iva: taxa, closed: 0, });
};
kapa.ai
kapa.ai9mo ago
Let me check the knowledge base for you. One moment! :books: ---------------------- The handleOnFinish function you provided is declared as an async function that returns a Promise<{ data: { id: string } }>. However, the function is not actually returning anything. This is why TypeScript is giving you an error. The onFinish function seems to be performing some action with the form values, but it's not clear from the provided code whether this function is asynchronous or whether it returns the necessary data. If onFinish is an asynchronous function that returns the necessary data, you can return its result in handleOnFinish:
const handleOnFinish = async (values: IPurchases): Promise<{ data: { id: string } }> => {
return onFinish({
rqp_produto_id: values.rqp_produto_id,
fornecedor_id: values.fornecedor_id,
cod: values.cod,
purchaseDate: values.purchaseDate,
isoCode: values.isoCode,
currency_id: values.currency_id,
iva: taxa,
closed: 0,
});
};
const handleOnFinish = async (values: IPurchases): Promise<{ data: { id: string } }> => {
return onFinish({
rqp_produto_id: values.rqp_produto_id,
fornecedor_id: values.fornecedor_id,
cod: values.cod,
purchaseDate: values.purchaseDate,
isoCode: values.isoCode,
currency_id: values.currency_id,
iva: taxa,
closed: 0,
});
};
In this example, I've added the return keyword before onFinish to return its result. Now, handleOnFinish should return a Promise<{ data: { id: string } }>, as declared. Please adjust this based on the actual behavior of your onFinish function. If onFinish is not asynchronous or does not return the necessary data, you'll need to modify it accordingly. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai9mo ago
<@1172098337760096258> kapa.ai is still learning and improving, please let us know how it did by reacting below
itchy-amethyst
itchy-amethystOP9mo ago
@kapa.ai Type 'void | UpdateResponse<IPurchases> | CreateResponse<IPurchases>' is not assignable to type '{ data: { id: string; }; }'. Type 'void' is not assignable to type '{ data: { id: string; }; }'.
kapa.ai
kapa.ai9mo ago
Let me check the knowledge base for you. One moment! :books: ---------------------- The error message "Type 'void | UpdateResponse<IPurchases> | CreateResponse<IPurchases>' is not assignable to type '{ data: { id: string; }; }'. Type 'void' is not assignable to type '{ data: { id: string; }; }'." is indicating that the function onFinish can return either void, UpdateResponse<IPurchases>, or CreateResponse<IPurchases>, but the expected return type of handleOnFinish is Promise<{ data: { id: string; }; }>. The void type is not compatible with { data: { id: string; }; }, hence the error. To fix this, you need to ensure that all code paths in onFinish return a value of the correct type. If onFinish can return void (for example, in case of an error), you need to handle this case in handleOnFinish and return a Promise that resolves to an object of the shape { data: { id: string; }; }. Here's an example of how to do this:
const handleOnFinish = async (values: IPurchases): Promise<{ data: { id: string; }; }> => {
const result = await onFinish({
rqp_produto_id: values.rqp_produto_id,
fornecedor_id: values.fornecedor_id,
cod: values.cod,
purchaseDate: values.purchaseDate,
isoCode: values.isoCode,
currency_id: values.currency_id,
iva: taxa,
closed: 0,
});

if (!result) {
// Handle the case where onFinish returns void
// You might want to throw an error, return a default value, etc.
throw new Error("onFinish did not return a result");
}

return result;
};
const handleOnFinish = async (values: IPurchases): Promise<{ data: { id: string; }; }> => {
const result = await onFinish({
rqp_produto_id: values.rqp_produto_id,
fornecedor_id: values.fornecedor_id,
cod: values.cod,
purchaseDate: values.purchaseDate,
isoCode: values.isoCode,
currency_id: values.currency_id,
iva: taxa,
closed: 0,
});

if (!result) {
// Handle the case where onFinish returns void
// You might want to throw an error, return a default value, etc.
throw new Error("onFinish did not return a result");
}

return result;
};
In this example, I've added error handling for the case where onFinish returns void. If onFinish does not return a result, an error is thrown. You might want to adjust this based on how you want to handle this case in your application. Please adjust this based on the actual behavior of your onFinish function. If onFinish is not asynchronous or does not return the necessary data, you'll need to modify it accordingly. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai9mo ago
<@1172098337760096258> kapa.ai is still learning and improving, please let us know how it did by reacting below