diff --git a/.changeset/fix-notification-type-provider.md b/.changeset/fix-notification-type-provider.md new file mode 100644 index 0000000000000..b123ed1a0dfca --- /dev/null +++ b/.changeset/fix-notification-type-provider.md @@ -0,0 +1,6 @@ +--- +"@refinedev/antd": patch +"@refinedev/mantine": patch +--- + +Fixed notification `type` handling in `useNotificationProvider` for `@refinedev/antd` and `@refinedev/mantine`. diff --git a/packages/antd/src/providers/notificationProvider/index.spec.tsx b/packages/antd/src/providers/notificationProvider/index.spec.tsx index 0cf483d96f8ea..ef86ec2cf3b9b 100644 --- a/packages/antd/src/providers/notificationProvider/index.spec.tsx +++ b/packages/antd/src/providers/notificationProvider/index.spec.tsx @@ -21,6 +21,8 @@ describe("Antd useNotificationProvider", () => { vi.clearAllMocks(); }); + const notificationSuccessSpy = vi.spyOn(notification, "success"); + const notificationErrorSpy = vi.spyOn(notification, "error"); const notificationOpenSpy = vi.spyOn(notification, "open"); const notificationCloseSpy = vi.spyOn(notification, "destroy"); @@ -29,9 +31,9 @@ describe("Antd useNotificationProvider", () => { result.current.open?.(mockNotification); - expect(notificationOpenSpy).toHaveBeenCalledTimes(1); - expect(notificationOpenSpy).toHaveBeenCalledWith({ - ...mockNotification, + expect(notificationSuccessSpy).toHaveBeenCalledTimes(1); + expect(notificationSuccessSpy).toHaveBeenCalledWith({ + key: mockNotification.key, message: null, description: mockNotification.message, }); @@ -45,12 +47,11 @@ describe("Antd useNotificationProvider", () => { type: "error", }); - expect(notificationOpenSpy).toHaveBeenCalledTimes(1); - expect(notificationOpenSpy).toHaveBeenCalledWith({ - ...mockNotification, + expect(notificationErrorSpy).toHaveBeenCalledTimes(1); + expect(notificationErrorSpy).toHaveBeenCalledWith({ + key: mockNotification.key, message: null, description: mockNotification.message, - type: "error", }); }); @@ -62,9 +63,9 @@ describe("Antd useNotificationProvider", () => { description: "Notification Description", }); - expect(notificationOpenSpy).toHaveBeenCalledTimes(1); - expect(notificationOpenSpy).toHaveBeenCalledWith({ - ...mockNotification, + expect(notificationSuccessSpy).toHaveBeenCalledTimes(1); + expect(notificationSuccessSpy).toHaveBeenCalledWith({ + key: mockNotification.key, message: "Notification Description", description: "Test Notification Message", }); @@ -108,12 +109,16 @@ describe("Antd useNotificationProvider", () => { }); describe("using with Ant design's App component", () => { + const successFn = vi.fn(); + const errorFn = vi.fn(); const openFn = vi.fn(); const destroyFn = vi.fn(); beforeAll(() => { vi.spyOn(App, "useApp").mockReturnValue({ notification: { + success: successFn, + error: errorFn, open: openFn, destroy: destroyFn, }, @@ -132,9 +137,9 @@ describe("Antd useNotificationProvider", () => { }); await waitFor(() => { - expect(openFn).toHaveBeenCalledTimes(1); - expect(openFn).toHaveBeenCalledWith({ - ...mockNotification, + expect(successFn).toHaveBeenCalledTimes(1); + expect(successFn).toHaveBeenCalledWith({ + key: mockNotification.key, message: null, description: mockNotification.message, }); @@ -152,12 +157,11 @@ describe("Antd useNotificationProvider", () => { }); await waitFor(() => { - expect(openFn).toHaveBeenCalledTimes(1); - expect(openFn).toHaveBeenCalledWith({ - ...mockNotification, + expect(errorFn).toHaveBeenCalledTimes(1); + expect(errorFn).toHaveBeenCalledWith({ + key: mockNotification.key, message: null, description: mockNotification.message, - type: "error", }); }); }); @@ -173,9 +177,9 @@ describe("Antd useNotificationProvider", () => { }); await waitFor(() => { - expect(openFn).toHaveBeenCalledTimes(1); - expect(openFn).toHaveBeenCalledWith({ - ...mockNotification, + expect(successFn).toHaveBeenCalledTimes(1); + expect(successFn).toHaveBeenCalledWith({ + key: mockNotification.key, message: "Notification Description", description: "Test Notification Message", }); diff --git a/packages/antd/src/providers/notificationProvider/index.tsx b/packages/antd/src/providers/notificationProvider/index.tsx index 9d77c91325344..c967c34466987 100644 --- a/packages/antd/src/providers/notificationProvider/index.tsx +++ b/packages/antd/src/providers/notificationProvider/index.tsx @@ -39,11 +39,15 @@ export const useNotificationProvider = (): NotificationProvider => { closeIcon: <>, }); } else { - notification.open({ + const notificationFn = + type && type in notification + ? notification[type as "success" | "error"] + : notification.open; + + notificationFn({ key, description: message, message: description ?? null, - type, }); } }, diff --git a/packages/mantine/src/providers/notificationProvider.tsx b/packages/mantine/src/providers/notificationProvider.tsx index d4caf5b1e3d69..fde0ad36db9fc 100644 --- a/packages/mantine/src/providers/notificationProvider.tsx +++ b/packages/mantine/src/providers/notificationProvider.tsx @@ -123,16 +123,20 @@ export const useNotificationProvider = (): NotificationProvider => { }); } } else { + const color = + type === "success" ? "primary" : type === "error" ? "red" : undefined; + const icon = + type === "success" ? ( + + ) : type === "error" ? ( + + ) : undefined; + if (isNotificationActive(key)) { updateNotification({ id: key!, - color: type === "success" ? "primary" : "red", - icon: - type === "success" ? ( - - ) : ( - - ), + color, + icon, message, title: description, autoClose: 5000, @@ -141,13 +145,8 @@ export const useNotificationProvider = (): NotificationProvider => { addNotification(key); showNotification({ id: key!, - color: type === "success" ? "primary" : "red", - icon: - type === "success" ? ( - - ) : ( - - ), + color, + icon, message, title: description, onClose: () => {