Merge pull request #79 from JimTheCat/CU-8697352uj_Create-AlertProvid…

…er_Patryk-Kosiski

feature: Create AlertProvider

frontend/package.json

@@ -11,11 +11,12 @@
     "test": "jest"
   },
   "dependencies": {
-    "@mantine/core": "^7.14.1",
-    "@mantine/dates": "^7.14.1",
-    "@mantine/form": "^7.14.1",
-    "@mantine/hooks": "^7.14.1",
-    "@mantine/tiptap": "^7.14.1",
+    "@mantine/core": "^7.15.1",
+    "@mantine/dates": "^7.15.1",
+    "@mantine/form": "^7.15.1",
+    "@mantine/hooks": "^7.15.1",
+    "@mantine/notifications": "^7.15.1",
+    "@mantine/tiptap": "^7.15.1",
     "@tabler/icons-react": "^3.23.0",
     "@tiptap/extension-highlight": "^2.10.0",
     "@tiptap/extension-link": "^2.10.0",

frontend/src/Providers/AlertProvider.tsx

@@ -0,0 +1,47 @@
+// src/providers/AlertProvider.tsx
+import React, {createContext, ReactNode, useContext, useMemo} from 'react';
+import {Notifications, showNotification} from '@mantine/notifications';
+import {setApiErrorHandler} from "../Services/api.ts";
+
+// Context type
+interface AlertContextType {
+  showError: (message: string) => void;
+}
+
+const AlertContext = createContext<AlertContextType | undefined>(undefined);
+
+// Provider for AlertContext
+interface AlertProviderProps {
+  children: ReactNode;
+}
+
+export const AlertProvider: React.FC<AlertProviderProps> = ({children}) => {
+  const showError = (message: string) => {
+    showNotification({
+      title: 'Error',
+      message,
+      color: 'red',
+      position: 'bottom-right',
+    });
+  };
+
+  setApiErrorHandler(showError);
+
+  const contextValue = useMemo(() => ({showError}), [showError]);
+
+  return (
+    <AlertContext.Provider value={contextValue}>
+      <Notifications/>
+      {children}
+    </AlertContext.Provider>
+  );
+};
+
+// Hook for using AlertContext
+export const useAlert = (): AlertContextType => {
+  const context = useContext(AlertContext);
+  if (!context) {
+    throw new Error('useAlert must be used within an AlertProvider');
+  }
+  return context;
+};