diff --git a/client/app/App.tsx b/client/app/App.tsx
index 5b5fb72a..ce68d443 100644
--- a/client/app/App.tsx
+++ b/client/app/App.tsx
@@ -1,37 +1,15 @@
-import { ReactElement, Suspense } from 'react';
-import { Container } from 'react-bootstrap';
+import { ReactElement } from 'react';
import { RouterProvider } from 'react-router-dom';
-import { ToastContainer } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';
-import { ErrorBoundary } from '~/components/Error';
-import { Notifications } from '~/components/Notifications/Notifications';
+import { AppProvider } from '~/providers';
import { router } from '~/routes';
-import { Spinner } from './components/ui';
import './globals.css';
-const GlobalSpinner = () => (
-
-
-
-);
-
function App(): ReactElement {
return (
-
-
-
- }>
-
-
-
+
+
+
);
}
diff --git a/client/app/features/layout/Root.tsx b/client/app/features/layout/Root.tsx
index 804d26a1..c366a648 100644
--- a/client/app/features/layout/Root.tsx
+++ b/client/app/features/layout/Root.tsx
@@ -1,6 +1,8 @@
-import React, { createContext, Dispatch, SetStateAction, Suspense, useState } from 'react';
+import React, { createContext, Dispatch, SetStateAction, useState } from 'react';
import { LoaderFunction, Outlet } from 'react-router-dom';
-import { Spinner } from '~/components/ui';
+import { ToastContainer } from 'react-toastify';
+import { ErrorBoundary } from '~/components/Error';
+import { Notifications } from '~/components/Notifications/Notifications';
import { rootStore as store } from '~/store';
import { haztrakApi } from '~/store/htApi.slice';
import { Sidebar } from './Sidebar/Sidebar';
@@ -32,9 +34,19 @@ export function Root() {
- }>
+
+
+
-
+
);
diff --git a/client/app/index.tsx b/client/app/index.tsx
index 58c72750..7be1f269 100644
--- a/client/app/index.tsx
+++ b/client/app/index.tsx
@@ -1,8 +1,6 @@
+import React from 'react';
import { createRoot } from 'react-dom/client';
-import { Provider } from 'react-redux';
-import { rootStore } from '~/store';
import App from './App';
-import React from 'react';
// Start mock service worker in development mode
async function enableMocking() {
@@ -19,9 +17,7 @@ const root = createRoot(container);
enableMocking().then(() => {
root.render(
-
-
-
+
);
});
diff --git a/client/app/providers.tsx b/client/app/providers.tsx
new file mode 100644
index 00000000..9cc19a92
--- /dev/null
+++ b/client/app/providers.tsx
@@ -0,0 +1,25 @@
+import React, { Suspense } from 'react';
+import { Provider } from 'react-redux';
+import { ErrorBoundary } from '~/components/Error';
+import { Spinner } from '~/components/ui';
+import { rootStore } from '~/store';
+
+interface AppProviderProps {
+ children: React.ReactNode;
+}
+
+const GlobalSpinner = () => (
+
+
+
+);
+
+export const AppProvider = ({ children }: AppProviderProps) => {
+ return (
+ }>
+
+ {children}
+
+
+ );
+};