Reformat all project files to use the prettier config file.

client/src/App/App.container.jsx

@@ -1,59 +1,58 @@
-import {ApolloProvider} from "@apollo/client";
-import {SplitFactoryProvider, SplitSdk,} from '@splitsoftware/splitio-react';
-import {ConfigProvider} from "antd";
+import { ApolloProvider } from "@apollo/client";
+import { SplitFactoryProvider, SplitSdk } from "@splitsoftware/splitio-react";
+import { ConfigProvider } from "antd";
 import enLocale from "antd/es/locale/en_US";
 import dayjs from "../utils/day";
-import 'dayjs/locale/en';
+import "dayjs/locale/en";
 import React from "react";
-import {useTranslation} from "react-i18next";
+import { useTranslation } from "react-i18next";
 import GlobalLoadingBar from "../components/global-loading-bar/global-loading-bar.component";
 import client from "../utils/GraphQLClient";
 import App from "./App";
 import * as Sentry from "@sentry/react";
 
 import themeProvider from "./themeProvider";
-import { Userpilot } from 'userpilot'
+import { Userpilot } from "userpilot";
 
 // Initialize Userpilot
-if(import.meta.env.DEV){
-  Userpilot.initialize('NX-69145f08');
+if (import.meta.env.DEV) {
+  Userpilot.initialize("NX-69145f08");
 }
 
 dayjs.locale("en");
 
 const config = {
-    core: {
-        authorizationKey: import.meta.env.VITE_APP_SPLIT_API,
-        key: "anon",
-    },
+  core: {
+    authorizationKey: import.meta.env.VITE_APP_SPLIT_API,
+    key: "anon"
+  }
 };
 export const factory = SplitSdk(config);
 
-
 function AppContainer() {
-    const {t} = useTranslation();
+  const { t } = useTranslation();
 
-    return (
-        <ApolloProvider client={client}>
-            <ConfigProvider
-                //componentSize="small"
-                input={{autoComplete: "new-password"}}
-                locale={enLocale}
-                theme={themeProvider}
-                form={{
-                    validateMessages: {
-                        // eslint-disable-next-line no-template-curly-in-string
-                        required: t("general.validation.required", {label: "${label}"}),
-                    },
-                }}
-            >
-                <GlobalLoadingBar/>
-                <SplitFactoryProvider factory={factory}>
-                    <App/>
-                </SplitFactoryProvider>
-            </ConfigProvider>
-        </ApolloProvider>
-    );
+  return (
+    <ApolloProvider client={client}>
+      <ConfigProvider
+        //componentSize="small"
+        input={{ autoComplete: "new-password" }}
+        locale={enLocale}
+        theme={themeProvider}
+        form={{
+          validateMessages: {
+            // eslint-disable-next-line no-template-curly-in-string
+            required: t("general.validation.required", { label: "${label}" })
+          }
+        }}
+      >
+        <GlobalLoadingBar />
+        <SplitFactoryProvider factory={factory}>
+          <App />
+        </SplitFactoryProvider>
+      </ConfigProvider>
+    </ApolloProvider>
+  );
 }
 
 export default Sentry.withProfiler(AppContainer);

client/src/App/App.jsx

@@ -17,245 +17,225 @@ import TechPageContainer from "../pages/tech/tech.page.container";
 import { setOnline } from "../redux/application/application.actions";
 import { selectOnline } from "../redux/application/application.selectors";
 import { checkUserSession } from "../redux/user/user.actions";
-import {
-    selectBodyshop,
-    selectCurrentEula,
-    selectCurrentUser,
-} from "../redux/user/user.selectors";
+import { selectBodyshop, selectCurrentEula, selectCurrentUser } from "../redux/user/user.selectors";
 import PrivateRoute from "../components/PrivateRoute";
 import "./App.styles.scss";
 import handleBeta from "../utils/betaHandler";
 import Eula from "../components/eula/eula.component";
 import InstanceRenderMgr from "../utils/instanceRenderMgr";
-import { ProductFruits } from 'react-product-fruits';
+import { ProductFruits } from "react-product-fruits";
 
-const ResetPassword = lazy(() =>
-    import("../pages/reset-password/reset-password.component")
-);
+const ResetPassword = lazy(() => import("../pages/reset-password/reset-password.component"));
 const ManagePage = lazy(() => import("../pages/manage/manage.page.container"));
 const SignInPage = lazy(() => import("../pages/sign-in/sign-in.page"));
 
 const CsiPage = lazy(() => import("../pages/csi/csi.container.page"));
-const MobilePaymentContainer = lazy(() =>
-    import("../pages/mobile-payment/mobile-payment.container")
-);
+const MobilePaymentContainer = lazy(() => import("../pages/mobile-payment/mobile-payment.container"));
 const mapStateToProps = createStructuredSelector({
-    currentUser: selectCurrentUser,
-    online: selectOnline,
-    bodyshop: selectBodyshop,
-    currentEula: selectCurrentEula,
+  currentUser: selectCurrentUser,
+  online: selectOnline,
+  bodyshop: selectBodyshop,
+  currentEula: selectCurrentEula
 });
 const mapDispatchToProps = (dispatch) => ({
-    checkUserSession: () => dispatch(checkUserSession()),
-    setOnline: (isOnline) => dispatch(setOnline(isOnline)),
+  checkUserSession: () => dispatch(checkUserSession()),
+  setOnline: (isOnline) => dispatch(setOnline(isOnline))
 });
 
-export function App({
-    bodyshop,
-    checkUserSession,
-    currentUser,
-    online,
-    setOnline,
-    currentEula,
-}) {
-    const client = useSplitClient().client;
-    const [listenersAdded, setListenersAdded] = useState(false);
-    const { t } = useTranslation();
+export function App({ bodyshop, checkUserSession, currentUser, online, setOnline, currentEula }) {
+  const client = useSplitClient().client;
+  const [listenersAdded, setListenersAdded] = useState(false);
+  const { t } = useTranslation();
 
-    useEffect(() => {
-        if (!navigator.onLine) {
-            setOnline(false);
-        }
-
-        checkUserSession();
-    }, [checkUserSession, setOnline]);
-
-    //const b = Grid.useBreakpoint();
-    // console.log("Breakpoints:", b);
-
-    // Associate event listeners, memoize to prevent multiple listeners being added
-    useEffect(() => {
-        const offlineListener = (e) => {
-            setOnline(false);
-        };
-
-        const onlineListener = (e) => {
-            setOnline(true);
-        };
-
-        if (!listenersAdded) {
-            console.log("Added events for offline and online");
-            window.addEventListener("offline", offlineListener);
-            window.addEventListener("online", onlineListener);
-            setListenersAdded(true);
-        }
-
-        return () => {
-            window.removeEventListener("offline", offlineListener);
-            window.removeEventListener("online", onlineListener);
-        };
-    }, [setOnline, listenersAdded]);
-
-    useEffect(() => {
-        if (currentUser.authorized && bodyshop) {
-            client.setAttribute("imexshopid", bodyshop.imexshopid);
-
-            if (
-                client.getTreatment("LogRocket_Tracking") === "on" ||
-                window.location.hostname ===
-                    InstanceRenderMgr({
-                        imex: "beta.imex.online",
-                        rome: "beta.romeonline.io",
-                    })
-            ) {
-                console.log("LR Start");
-                LogRocket.init(
-                    InstanceRenderMgr({
-                        imex: "gvfvfw/bodyshopapp",
-                        rome: "rome-online/rome-online",
-                        promanager: "", //TODO:AIO Add in log rocket for promanager instances.
-                    })
-                );
-            }
-        }
-    }, [bodyshop, client, currentUser.authorized]);
-
-    if (currentUser.authorized === null) {
-        return <LoadingSpinner message={t("general.labels.loggingin")} />;
+  useEffect(() => {
+    if (!navigator.onLine) {
+      setOnline(false);
     }
 
-    handleBeta();
+    checkUserSession();
+  }, [checkUserSession, setOnline]);
 
-    if (!online)
-        return (
-            <Result
-                status="warning"
-                title={t("general.labels.nointernet")}
-                subTitle={t("general.labels.nointernet_sub")}
-                extra={
-                    <Button
-                        type="primary"
-                        onClick={() => {
-                            window.location.reload();
-                        }}
-                    >
-                        {t("general.actions.refresh")}
-                    </Button>
-                }
-            />
+  //const b = Grid.useBreakpoint();
+  // console.log("Breakpoints:", b);
+
+  // Associate event listeners, memoize to prevent multiple listeners being added
+  useEffect(() => {
+    const offlineListener = (e) => {
+      setOnline(false);
+    };
+
+    const onlineListener = (e) => {
+      setOnline(true);
+    };
+
+    if (!listenersAdded) {
+      console.log("Added events for offline and online");
+      window.addEventListener("offline", offlineListener);
+      window.addEventListener("online", onlineListener);
+      setListenersAdded(true);
+    }
+
+    return () => {
+      window.removeEventListener("offline", offlineListener);
+      window.removeEventListener("online", onlineListener);
+    };
+  }, [setOnline, listenersAdded]);
+
+  useEffect(() => {
+    if (currentUser.authorized && bodyshop) {
+      client.setAttribute("imexshopid", bodyshop.imexshopid);
+
+      if (
+        client.getTreatment("LogRocket_Tracking") === "on" ||
+        window.location.hostname ===
+          InstanceRenderMgr({
+            imex: "beta.imex.online",
+            rome: "beta.romeonline.io"
+          })
+      ) {
+        console.log("LR Start");
+        LogRocket.init(
+          InstanceRenderMgr({
+            imex: "gvfvfw/bodyshopapp",
+            rome: "rome-online/rome-online",
+            promanager: "" //TODO:AIO Add in log rocket for promanager instances.
+          })
         );
-
-    if (currentEula && !currentUser.eulaIsAccepted) {
-        return <Eula />;
+      }
     }
+  }, [bodyshop, client, currentUser.authorized]);
 
-    // Any route that is not assigned and matched will default to the Landing Page component
+  if (currentUser.authorized === null) {
+    return <LoadingSpinner message={t("general.labels.loggingin")} />;
+  }
+
+  handleBeta();
+
+  if (!online)
     return (
-
-        <Suspense
-            fallback={
-                <LoadingSpinner
-                    message={InstanceRenderMgr({
-                      imex: t("titles.imexonline"),
-                      rome: t("titles.romeonline"),
-                      promanager: t("titles.promanager")
-                    })}
-                />
-            }
-        >     
-         <ProductFruits 
-          workspaceCode={InstanceRenderMgr({imex:null, rome: null, promanager:"aoJoEifvezYI0Z0P"})}
-          debug
-          
-          language="en" user={{
-          email: currentUser.email,
-          username: currentUser.email,
-         }} />
-
-            <Routes>
-                <Route
-                    path="*"
-                    element={
-                        <ErrorBoundary>
-                            <LandingPage />
-                        </ErrorBoundary>
-                    }
-                />
-                <Route
-                    path="/signin"
-                    element={
-                        <ErrorBoundary>
-                            <SignInPage />
-                        </ErrorBoundary>
-                    }
-                />
-                <Route
-                    path="/resetpassword"
-                    element={
-                        <ErrorBoundary>
-                            <ResetPassword />
-                        </ErrorBoundary>
-                    }
-                />
-                <Route
-                    path="/csi/:surveyId"
-                    element={
-                        <ErrorBoundary>
-                            <CsiPage />
-                        </ErrorBoundary>
-                    }
-                />
-                <Route
-                    path="/disclaimer"
-                    element={
-                        <ErrorBoundary>
-                            <DisclaimerPage />
-                        </ErrorBoundary>
-                    }
-                />
-                <Route
-                    path="/mp/:paymentIs"
-                    element={
-                        <ErrorBoundary>
-                            <MobilePaymentContainer />
-                        </ErrorBoundary>
-                    }
-                />
-                <Route
-                    path="/manage/*"
-                    element={
-                        <ErrorBoundary>
-                            <PrivateRoute
-                                isAuthorized={currentUser.authorized}
-                            />
-                        </ErrorBoundary>
-                    }
-                >
-                    <Route path="*" element={<ManagePage />} />
-                </Route>
-                <Route
-                    path="/tech/*"
-                    element={
-                        <ErrorBoundary>
-                            <PrivateRoute
-                                isAuthorized={currentUser.authorized}
-                            />
-                        </ErrorBoundary>
-                    }
-                >
-                    <Route path="*" element={<TechPageContainer />} />
-                </Route>
-                <Route
-                    path="/edit/*"
-                    element={
-                        <PrivateRoute isAuthorized={currentUser.authorized} />
-                    }
-                >
-                    <Route path="*" element={<DocumentEditorContainer />} />
-                </Route>
-            </Routes>
-        </Suspense>
+      <Result
+        status="warning"
+        title={t("general.labels.nointernet")}
+        subTitle={t("general.labels.nointernet_sub")}
+        extra={
+          <Button
+            type="primary"
+            onClick={() => {
+              window.location.reload();
+            }}
+          >
+            {t("general.actions.refresh")}
+          </Button>
+        }
+      />
     );
+
+  if (currentEula && !currentUser.eulaIsAccepted) {
+    return <Eula />;
+  }
+
+  // Any route that is not assigned and matched will default to the Landing Page component
+  return (
+    <Suspense
+      fallback={
+        <LoadingSpinner
+          message={InstanceRenderMgr({
+            imex: t("titles.imexonline"),
+            rome: t("titles.romeonline"),
+            promanager: t("titles.promanager")
+          })}
+        />
+      }
+    >
+      <ProductFruits
+        workspaceCode={InstanceRenderMgr({
+          imex: null,
+          rome: null,
+          promanager: "aoJoEifvezYI0Z0P"
+        })}
+        debug
+        language="en"
+        user={{
+          email: currentUser.email,
+          username: currentUser.email
+        }}
+      />
+
+      <Routes>
+        <Route
+          path="*"
+          element={
+            <ErrorBoundary>
+              <LandingPage />
+            </ErrorBoundary>
+          }
+        />
+        <Route
+          path="/signin"
+          element={
+            <ErrorBoundary>
+              <SignInPage />
+            </ErrorBoundary>
+          }
+        />
+        <Route
+          path="/resetpassword"
+          element={
+            <ErrorBoundary>
+              <ResetPassword />
+            </ErrorBoundary>
+          }
+        />
+        <Route
+          path="/csi/:surveyId"
+          element={
+            <ErrorBoundary>
+              <CsiPage />
+            </ErrorBoundary>
+          }
+        />
+        <Route
+          path="/disclaimer"
+          element={
+            <ErrorBoundary>
+              <DisclaimerPage />
+            </ErrorBoundary>
+          }
+        />
+        <Route
+          path="/mp/:paymentIs"
+          element={
+            <ErrorBoundary>
+              <MobilePaymentContainer />
+            </ErrorBoundary>
+          }
+        />
+        <Route
+          path="/manage/*"
+          element={
+            <ErrorBoundary>
+              <PrivateRoute isAuthorized={currentUser.authorized} />
+            </ErrorBoundary>
+          }
+        >
+          <Route path="*" element={<ManagePage />} />
+        </Route>
+        <Route
+          path="/tech/*"
+          element={
+            <ErrorBoundary>
+              <PrivateRoute isAuthorized={currentUser.authorized} />
+            </ErrorBoundary>
+          }
+        >
+          <Route path="*" element={<TechPageContainer />} />
+        </Route>
+        <Route path="/edit/*" element={<PrivateRoute isAuthorized={currentUser.authorized} />}>
+          <Route path="*" element={<DocumentEditorContainer />} />
+        </Route>
+      </Routes>
+    </Suspense>
+  );
 }
 
 export default connect(mapStateToProps, mapDispatchToProps)(App);

client/src/App/App.styles.scss

@@ -154,7 +154,6 @@
   font-style: italic;
 }
 
-
 .ant-table-tbody > tr.ant-table-row:nth-child(2n) > td {
   background-color: #f4f4f4;
 }

client/src/App/themeProvider.js

@@ -1,8 +1,8 @@
-import {defaultsDeep} from "lodash";
-import {theme} from "antd";
-import InstanceRenderMgr from '../utils/instanceRenderMgr'
+import { defaultsDeep } from "lodash";
+import { theme } from "antd";
+import InstanceRenderMgr from "../utils/instanceRenderMgr";
 
-const {defaultAlgorithm, darkAlgorithm} = theme;
+const { defaultAlgorithm, darkAlgorithm } = theme;
 
 let isDarkMode = false;
 
@@ -13,28 +13,28 @@ let isDarkMode = false;
 const defaultTheme = {
   components: {
     Table: {
-      rowHoverBg: '#e7f3ff',
-      rowSelectedBg: '#e6f7ff',
-      headerSortHoverBg: 'transparent',
+      rowHoverBg: "#e7f3ff",
+      rowSelectedBg: "#e6f7ff",
+      headerSortHoverBg: "transparent"
     },
     Menu: {
-      darkItemHoverBg: '#1890ff',
-      itemHoverBg: '#1890ff',
-      horizontalItemHoverBg: '#1890ff',
-    },
+      darkItemHoverBg: "#1890ff",
+      itemHoverBg: "#1890ff",
+      horizontalItemHoverBg: "#1890ff"
+    }
   },
   token: {
-    colorPrimary: InstanceRenderMgr({ 
-      imex: '#1890ff',
-      rome: '#326ade',
-      promanager:"#1d69a6"
+    colorPrimary: InstanceRenderMgr({
+      imex: "#1890ff",
+      rome: "#326ade",
+      promanager: "#1d69a6"
     }),
     colorInfo: InstanceRenderMgr({
-      imex: '#1890ff',
-      rome: '#326ade',
-      promanager:"#1d69a6"
-    }),
-  },
+      imex: "#1890ff",
+      rome: "#326ade",
+      promanager: "#1d69a6"
+    })
+  }
 };
 
 /**
@@ -42,16 +42,16 @@ const defaultTheme = {
  * @type {{components: {Menu: {itemHoverBg: string, darkItemHoverBg: string, horizontalItemHoverBg: string}}, token: {colorPrimary: string}}}
  */
 const devTheme = {
-    components: {
-        Menu: {
-            darkItemHoverBg: '#a51d1d',
-            itemHoverBg: '#a51d1d',
-            horizontalItemHoverBg: '#a51d1d',
-        }
-    },
-    token: {
-        colorPrimary: '#a51d1d'
+  components: {
+    Menu: {
+      darkItemHoverBg: "#a51d1d",
+      itemHoverBg: "#a51d1d",
+      horizontalItemHoverBg: "#a51d1d"
     }
+  },
+  token: {
+    colorPrimary: "#a51d1d"
+  }
 };
 
 /**
@@ -60,11 +60,10 @@ const devTheme = {
  */
 const prodTheme = {};
 
-const currentTheme = import.meta.env.DEV ? devTheme
-    : prodTheme;
+const currentTheme = import.meta.env.DEV ? devTheme : prodTheme;
 
 const finaltheme = {
-    algorithm: isDarkMode ? darkAlgorithm : defaultAlgorithm,
-    ...defaultsDeep(currentTheme, defaultTheme)
-}
+  algorithm: isDarkMode ? darkAlgorithm : defaultAlgorithm,
+  ...defaultsDeep(currentTheme, defaultTheme)
+};
 export default finaltheme;