feat: added action button for notification toast and one action each for forbidden error and validation error details

frontend/src/components/notifications/Notifications.tsx

@@ -4,13 +4,15 @@ import { Id, toast, ToastContainer, ToastOptions, TypeOptions } from "react-toas
 export type TNotification = {
   title?: string;
   text: ReactNode;
+  children?: ReactNode;
 };
 
-export const NotificationContent = ({ title, text }: TNotification) => {
+export const NotificationContent = ({ title, text, children }: TNotification) => {
   return (
     <div className="msg-container">
       {title && <div className="text-md mb-1 font-medium">{title}</div>}
-      <div className={title ? "text-sm" : "text-md"}>{text}</div>
+      <div className={title ? "text-sm text-neutral-400" : "text-md"}>{text}</div>
+      {children && <div className="mt-2">{children}</div>}
     </div>
   );
 };
@@ -23,7 +25,13 @@ export const createNotification = (
     position: "bottom-right",
     ...toastProps,
     theme: "dark",
-    type: myProps?.type || "info",
+    type: myProps?.type || "info"
   });
 
-export const NotificationContainer = () => <ToastContainer pauseOnHover toastClassName="border border-mineshaft-500" style={{ width: "400px" }} />;
+export const NotificationContainer = () => (
+  <ToastContainer
+    pauseOnHover
+    toastClassName="border border-mineshaft-500"
+    style={{ width: "400px" }}
+  />
+);