feat(client): Toast Provider to show Toasts from higher on the DOM tree (#1110)

client/src/Providers/ToastContext.tsx

@@ -0,0 +1,17 @@
+import { createContext } from 'react';
+import type { TShowToast } from '~/common';
+import { useToast } from '~/hooks';
+
+type ToastContextType = {
+  showToast: ({ message, severity, showIcon }: TShowToast) => void;
+};
+
+export const ToastContext = createContext<ToastContextType>({
+  showToast: () => ({}),
+});
+
+export default function ToastProvider({ children }) {
+  const { showToast } = useToast();
+
+  return <ToastContext.Provider value={{ showToast }}>{children}</ToastContext.Provider>;
+}

client/src/Providers/index.ts

@@ -0,0 +1,2 @@
+export { default as ToastProvider } from './ToastContext';
+export * from './ToastContext';