- Remove Joyride and its cause

- Package updates (front + back)

Signed-off-by: Dave Richer <dave@imexsystems.ca>

client/src/components/dashboard-components/scheduled-out-today/scheduled-out-today.component.jsx

@@ -36,9 +36,6 @@ export default function DashboardScheduledOutToday({ data, ...cardProps }) {
     };
   });
 
-  console.log("Scheduled Out Today");
-  console.dir(scheduledOutToday);
-
   const tvFontSize = 18;
   const tvFontWeight = "bold";
 

client/src/components/jobs-list/jobs-list.component.jsx

@@ -16,18 +16,15 @@ import useLocalStorage from "../../utils/useLocalStorage";
 import AlertComponent from "../alert/alert.component";
 import ChatOpenButton from "../chat-open-button/chat-open-button.component";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
-import { setJoyRideSteps } from "../../redux/application/application.actions";
 import { OwnerNameDisplayFunction } from "./../owner-name-display/owner-name-display.component";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
 });
 
-const mapDispatchToProps = (dispatch) => ({
-  setJoyRideSteps: (steps) => dispatch(setJoyRideSteps(steps))
-});
+const mapDispatchToProps = (dispatch) => ({});
 
-export function JobsList({ bodyshop, setJoyRideSteps }) {
+export function JobsList({ bodyshop }) {
   const searchParams = queryString.parse(useLocation().search);
   const { selected } = searchParams;
   const selectedBreakpoint = Object.entries(Grid.useBreakpoint())

client/src/components/update-alert/update-alert.component.jsx

@@ -1,7 +1,7 @@
 import { AlertOutlined } from "@ant-design/icons";
 import { Alert, Button, Col, Row, Space } from "antd";
 import i18n from "i18next";
-import React from "react";
+import React, { useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
@@ -12,39 +12,42 @@ import InstanceRenderManager from "../../utils/instanceRenderMgr";
 const mapStateToProps = createStructuredSelector({
   updateAvailable: selectUpdateAvailable
 });
+
 const mapDispatchToProps = (dispatch) => ({
-  //setUserLanguage: language => dispatch(setUserLanguage(language))
+  // setUserLanguage: language => dispatch(setUserLanguage(language))
 });
-export default connect(mapStateToProps, mapDispatchToProps)(UpdateAlert);
-const intervalMS = 10 * 60 * 1000;
+
 export function UpdateAlert({ updateAvailable }) {
   const { t } = useTranslation();
-
   const {
-    offlineReady: [
-      offlineReady //setOfflineReady
-    ],
-    needRefresh: [
-      needRefresh //setNeedRefresh
-    ],
+    offlineReady: [offlineReady],
+    needRefresh: [needRefresh],
     updateServiceWorker
   } = useRegisterSW({
     onRegistered(r) {
-      // eslint-disable-next-line prefer-template
-      console.log("SW Registered: " + r);
-      r &&
-        setInterval(() => {
-          r.update();
-        }, intervalMS);
+      console.log("SW Registered:", r);
+      if (r) {
+        setInterval(
+          () => {
+            r.update();
+          },
+          10 * 60 * 1000
+        );
+      }
     },
     onRegisterError(error) {
-      console.log("SW registration error", error);
+      console.error("SW registration error", error);
     }
   });
 
-  if (import.meta.env.DEV) console.log(`SW Status => Refresh? ${needRefresh} - offlineReady? ${offlineReady}`);
+  useEffect(() => {
+    if (import.meta.env.DEV) {
+      console.log(`SW Status => Refresh? ${needRefresh} - offlineReady? ${offlineReady}`);
+    }
+  }, [needRefresh, offlineReady]);
 
   if (!needRefresh) return null;
+
   return (
     <Alert
       message={t("general.messages.newversiontitle", {
@@ -69,19 +72,10 @@ export function UpdateAlert({ updateAvailable }) {
           </Col>
           <Col sm={24} md={8} lg={6}>
             <Space wrap>
-              <Button
-                onClick={async () => {
-                  window.open("https://imex-online.noticeable.news/", "_blank");
-                }}
-              >
+              <Button onClick={() => window.open("https://imex-online.noticeable.news/", "_blank")}>
                 {i18n.t("general.actions.viewreleasenotes")}
               </Button>
-              <Button
-                type="primary"
-                onClick={async () => {
-                  updateServiceWorker(true);
-                }}
-              >
+              <Button type="primary" onClick={() => updateServiceWorker(true)}>
                 {i18n.t("general.actions.refresh")}
               </Button>
             </Space>
@@ -93,3 +87,5 @@ export function UpdateAlert({ updateAvailable }) {
     />
   );
 }
+
+export default connect(mapStateToProps, mapDispatchToProps)(UpdateAlert);

client/src/pages/manage/manage.page.component.jsx

@@ -12,7 +12,6 @@ import ErrorBoundary from "../../components/error-boundary/error-boundary.compon
 //import FooterComponent from "../../components/footer/footer.component";
 //Component Imports
 import * as Sentry from "@sentry/react";
-import Joyride from "react-joyride";
 import TestComponent from "../../components/_test/test.page";
 import HeaderContainer from "../../components/header/header.container";
 import LoadingSpinner from "../../components/loading-spinner/loading-spinner.component";
@@ -23,8 +22,6 @@ import { requestForToken } from "../../firebase/firebase.utils";
 import { selectBodyshop, selectInstanceConflict } from "../../redux/user/user.selectors";
 
 import UpdateAlert from "../../components/update-alert/update-alert.component";
-import { setJoyRideFinished } from "../../redux/application/application.actions.js";
-import { selectEnableJoyRide, selectJoyRideSteps } from "../../redux/application/application.selectors.js";
 import InstanceRenderManager from "../../utils/instanceRenderMgr.js";
 import "./manage.page.styles.scss";
 
@@ -105,16 +102,12 @@ const { Content, Footer } = Layout;
 
 const mapStateToProps = createStructuredSelector({
   conflict: selectInstanceConflict,
-  bodyshop: selectBodyshop,
-  enableJoyRide: selectEnableJoyRide,
-  joyRideSteps: selectJoyRideSteps
+  bodyshop: selectBodyshop
 });
 
-const mapDispatchToProps = (dispatch) => ({
-  setJoyRideFinished: (steps) => dispatch(setJoyRideFinished(steps))
-});
+const mapDispatchToProps = (dispatch) => ({});
 
-export function Manage({ conflict, bodyshop, enableJoyRide, joyRideSteps, setJoyRideFinished }) {
+export function Manage({ conflict, bodyshop }) {
   const { t } = useTranslation();
   const [chatVisible] = useState(false);
 
@@ -583,21 +576,6 @@ export function Manage({ conflict, bodyshop, enableJoyRide, joyRideSteps, setJoy
         <UpdateAlert />
         <HeaderContainer />
         <Content className="content-container">
-          <Joyride
-            debug
-            run={enableJoyRide}
-            steps={joyRideSteps}
-            continuous
-            hideCloseButton
-            scrollToFirstStep
-            showProgress
-            showSkipButton
-            callback={(props) => {
-              if (props.action === "reset") {
-                setJoyRideFinished();
-              }
-            }}
-          />
           <PartnerPingComponent />
           <Sentry.ErrorBoundary fallback={<ErrorBoundary />} showDialog>
             {PageContent}

client/src/redux/application/application.actions.js

@@ -67,11 +67,3 @@ export const setUpdateAvailable = (isUpdateAvailable) => ({
   type: ApplicationActionTypes.SET_UPDATE_AVAILABLE,
   payload: isUpdateAvailable
 });
-export const setJoyRideSteps = (steps) => ({
-  type: ApplicationActionTypes.SET_JOYRIDE_STEPS,
-  payload: steps
-});
-export const setJoyRideFinished = () => ({
-  type: ApplicationActionTypes.SET_JOYRIDE_FINISHED
-  //payload: isUpdateAvailable,
-});

client/src/redux/application/application.reducer.js

@@ -14,9 +14,7 @@ const INITIAL_STATE = {
     error: null
   },
   jobReadOnly: false,
-  partnerVersion: null,
-  enableJoyRide: false,
-  joyRideSteps: []
+  partnerVersion: null
 };
 
 const applicationReducer = (state = INITIAL_STATE, action) => {
@@ -89,12 +87,6 @@ const applicationReducer = (state = INITIAL_STATE, action) => {
     case ApplicationActionTypes.SET_PROBLEM_JOBS: {
       return { ...state, problemJobs: action.payload };
     }
-    case ApplicationActionTypes.SET_JOYRIDE_STEPS: {
-      return { ...state, enableJoyRide: true, joyRideSteps: action.payload };
-    }
-    case ApplicationActionTypes.SET_JOYRIDE_FINISHED: {
-      return { ...state, enableJoyRide: false, joyRideSteps: [] };
-    }
     default:
       return state;
   }

client/src/redux/application/application.selectors.js

@@ -22,5 +22,3 @@ export const selectJobReadOnly = createSelector([selectApplication], (applicatio
 export const selectOnline = createSelector([selectApplication], (application) => application.online);
 export const selectProblemJobs = createSelector([selectApplication], (application) => application.problemJobs);
 export const selectUpdateAvailable = createSelector([selectApplication], (application) => application.updateAvailable);
-export const selectEnableJoyRide = createSelector([selectApplication], (application) => application.enableJoyRide);
-export const selectJoyRideSteps = createSelector([selectApplication], (application) => application.joyRideSteps);

client/src/redux/application/application.types.js

@@ -12,8 +12,6 @@ const ApplicationActionTypes = {
   SET_ONLINE_STATUS: "SET_ONLINE_STATUS",
   INSERT_AUDIT_TRAIL: "INSERT_AUDIT_TRAIL",
   SET_PROBLEM_JOBS: "SET_PROBLEM_JOBS",
-  SET_UPDATE_AVAILABLE: "SET_UPDATE_AVAILABLE",
-  SET_JOYRIDE_STEPS: "SET_JOYRIDE_STEPS",
-  SET_JOYRIDE_FINISHED: "SET_JOYRIDE_FINISHED"
+  SET_UPDATE_AVAILABLE: "SET_UPDATE_AVAILABLE"
 };
 export default ApplicationActionTypes;