Import Notifications
How can I generate a notification with refine and antd when using useImport to show either the error or success message? The notification automatically pops up when you, for example, create a record in a database.
message and type properties are required, while description is optional.refineCoreProps object to specify these properties. Here is how you can do it:refineCoreProps object, which should resolve the issue of unknown properties.useImportuseImportuseImportuseImportsuccessNotificationsuccessNotificationsuccessNotificationsuccessNotificationsuccessNotificationerrorNotificationerrorNotificationerrorNotificationerrorNotificationerrorNotificationImportOptions import { notificationProvider } from "@refinedev/antd";
return (
<Refine
//...
notificationProvider={notificationProvider}
/>
); import { useImport } from "@refinedev/core";
const { mutate: importData } = useImport({
resource: "your-resource",
successNotification: (data, values, resource) => {
return {
message: `Successfully imported ${data.length} records.`,
description: "All records have been imported successfully.",
type: "success",
};
},
errorNotification: (error, values, resource) => {
return {
message: `Failed to import records.`,
description: error.message,
type: "error",
};
},
});
// Call the importData function with the necessary parameters
importData({ /* your import parameters */ });import { useImport } from "@refinedev/core";
const { mutate: importData } = useImport({
resource: "your-resource",
refineCoreProps: {
successNotification: (data, values, resource) => {
return {
message: `Successfully imported ${data.length} records.`,
description: "All records have been imported successfully.",
type: "success",
};
},
errorNotification: (error, values, resource) => {
return {
message: `Failed to import records.`,
description: error.message,
type: "error",
};
},
},
});
// Call the importData function with the necessary parameters
importData({ /* your import parameters */ });