Merge pull request #21 from DaleMcGrew/Dale_WCC_Feb1-2025

Introduced ConnectDispatch and apiDataCacheReducer. Organizing organized API data into ‘apiDataCache’ dictionary. (and more)
wevote · Feb 3, 2025 · 14c4d1c · 14c4d1c
2 parents f3415fc + 318c596
commit 14c4d1c
Show file tree

Hide file tree

Showing 36 changed files with 1,002 additions and 416 deletions.
diff --git a/src/App.jsx b/src/App.jsx
@@ -42,6 +42,7 @@ function App () {
   const queryClient = new QueryClient({
     defaultOptions: {
       queries: {
+        networkMode: 'always', // Send queries to the server even if the cache has the data
         refetchOnWindowFocus: false,
         refetchOnMount: true,
         staleTime: 1000 * 60 * 5, // 5 minutes
@@ -50,7 +51,7 @@ function App () {
   });
 
   useEffect(() => {
-    console.log('--------- initializejQuery() ---------');
+    console.log('--------- App.jsx loading ---------');
     initializejQuery(() => {
       console.log('--------- jQuery has been initialized ---------');
     });
@@ -61,7 +62,9 @@ function App () {
 
 
   const isAuth = localStorage.getItem('isAuthenticated');
-  console.log('======================================== isAuthenticated: "  ', isAuth, ' =============================');
+  if (isAuth) {
+    console.log('======================================== isAuthenticated: "  ', isAuth, ' =============================');
+  }
 
   return (
     <>
@@ -79,7 +82,7 @@ function App () {
                       <Route path="/faq" element={<FAQ />} />
                     </Route>
                     <Route path="/login" element={<Login />} />
-                    <Route path="/q/:questionnaireId/:personId" element={<AnswerQuestionsForm />} />
+                    {/* <Route path="/q/:questionnaireId/:personId" element={<AnswerQuestionsForm />} /> */}
                     <Route path="/questionnaire/:questionnaireId" element={<QuestionnaireQuestionList />} />
                     <Route path="/system-settings" element={<SystemSettings />} />
                     <Route path="/tasks" element={<Tasks />} />

diff --git a/src/js/components/Drawers/DrawerTemplateA.jsx b/src/js/components/Drawers/DrawerTemplateA.jsx
@@ -18,7 +18,7 @@ const DrawerTemplateA = ({ classes, drawerId, drawerOpenGlobalVariableName, head
   const [scrolledDown, setScrolledDown] = useState(false);
   const drawerOpen = getAppContextValue(drawerOpenGlobalVariableName);
 
-  console.log('DrawerTemplateA drawerOpen: ', drawerOpenGlobalVariableName, drawerOpen);
+  // console.log('DrawerTemplateA drawerOpen: ', drawerOpenGlobalVariableName, drawerOpen);
 
   const handleScrolledDownDrawer = (evt) => {
     const { scrollTop } = evt.target;
@@ -31,9 +31,9 @@ const DrawerTemplateA = ({ classes, drawerId, drawerOpenGlobalVariableName, head
   };
 
   useEffect(() => {
-    console.log('DrawerTemplateA: Context value changed: ',
-      drawerId, drawerOpenGlobalVariableName, getAppContextValue(drawerOpenGlobalVariableName));
-    setScrolledDown(getAppContextValue('scrolledDownDrawer'));
+    // console.log('DrawerTemplateA: Context value changed: ',
+    //   drawerId, drawerOpenGlobalVariableName, getAppContextValue(drawerOpenGlobalVariableName));
+    // TEMP DALE: setScrolledDown(getAppContextValue('scrolledDownDrawer'));
   }, [getAppContextData]);
 
   React.useEffect(() => {
@@ -42,7 +42,7 @@ const DrawerTemplateA = ({ classes, drawerId, drawerOpenGlobalVariableName, head
       if (drawer) {
         drawer.addEventListener('scroll', handleScrolledDownDrawer);
       } else {
-        console.log('Drawer element NOT found make timeout longer.');
+        // console.log('Drawer element NOT found make timeout longer.');
       }
     }, 100);
 

diff --git a/src/js/components/Drawers/Drawers.jsx b/src/js/components/Drawers/Drawers.jsx
@@ -4,7 +4,7 @@ import AddPersonDrawer from './AddPersonDrawer';
 import AddTeamDrawer from './AddTeamDrawer';
 import EditPersonDrawer from './EditPersonDrawer';
 import EditQuestionDrawer from './EditQuestionDrawer';
-import EditQuestionnaireDrawer from './EditQuestionnaireDrawer';
+// import EditQuestionnaireDrawer from './EditQuestionnaireDrawer';
 import EditTaskDefinitionDrawer from './EditTaskDefinitionDrawer';
 import EditTaskGroupDrawer from './EditTaskGroupDrawer';
 import PersonProfileDrawer from './PersonProfileDrawer';
@@ -20,7 +20,7 @@ const Drawers = () => {
       <AddTeamDrawer />
       <EditPersonDrawer />
       <EditQuestionDrawer />
-      <EditQuestionnaireDrawer />
+      {/* TODO: Still causing infinite loop: <EditQuestionnaireDrawer /> */}
       <EditTaskDefinitionDrawer />
       <EditTaskGroupDrawer />
     </>

diff --git a/src/js/components/Drawers/EditPersonDrawer.jsx b/src/js/components/Drawers/EditPersonDrawer.jsx
@@ -9,7 +9,6 @@ const EditPersonDrawer = () => {
   const [headerTitleJsx] = useState(<></>);
   const [headerFixedJsx] = useState(<></>);
 
-
   return (
     <DrawerTemplateA
       drawerId="editPersonDrawer"

diff --git a/src/js/components/Drawers/EditQuestionDrawer.jsx b/src/js/components/Drawers/EditQuestionDrawer.jsx
@@ -12,14 +12,15 @@ const EditQuestionDrawer = () => {
   const [headerFixedJsx] = useState(<></>);
 
   useEffect(() => {
-    console.log('EditQuestionDrawer: Context value changed:', true);
+    // console.log('EditQuestionDrawer: Context value changed:', true);
     const question = getAppContextValue('selectedQuestion');
-    if (question && question.id >= 0) {
-      setHeaderTitleJsx(<>Edit Question</>);
-    } else {
-      setHeaderTitleJsx(<>Add Question</>);
-    }
-  }, [getAppContextValue]);
+    // if (question && question.id >= 0) {
+    //   setHeaderTitleJsx(<>Edit Question</>);
+    // } else {
+    //   setHeaderTitleJsx(<>Add Question</>);
+    // }
+  });
+  // }, [getAppContextValue]);  // TODO DALE: commented out for now to avoid infinite loop
 
   return (
     <DrawerTemplateA

diff --git a/src/js/components/Drawers/EditQuestionnaireDrawer.jsx b/src/js/components/Drawers/EditQuestionnaireDrawer.jsx
@@ -15,15 +15,16 @@ const EditQuestionnaireDrawer = () => {
 
   useEffect(() => {
     if (getAppContextValue('editQuestionnaireDrawerOpen')) {
-      console.log('EditQuestionnaireDrawer: Context value changed:', true);
+      // console.log('EditQuestionnaireDrawer: Context value changed:', true);
       const questionnaire = getAppContextValue('selectedQuestionnaire');
       if (questionnaire) {
         setHeaderTitleJsx(<>Edit Questionnaire</>);
       } else {
         setHeaderTitleJsx(<>Add Questionnaire</>);
       }
     }
-  }, [getAppContextValue]);
+  });
+  // }, [getAppContextValue]);  // TODO DALE: commented out for now to avoid infinite loop
 
   return (
     <DrawerTemplateA

diff --git a/src/js/components/Navigation/HeaderBar.jsx b/src/js/components/Navigation/HeaderBar.jsx
@@ -31,32 +31,32 @@ const HeaderBar = () => {
   // };
 
   const initializeTabValue = () => {
-    console.log('initializeTabValue normalizedHrefPage():', normalizedHrefPage());
+    // console.log('initializeTabValue normalizedHrefPage():', normalizedHrefPage());
     switch (normalizedHrefPage()) {
       case 'tasks':
         setTabsValue('1');
-        console.log('initializeTabValue  setTabsValue: 1');
+        // console.log('initializeTabValue  setTabsValue: 1');
         break;
       case 'team-home':
       case 'teams':
         setTabsValue('2');
-        console.log('initializeTabValue  setTabsValue: 2');
+        // console.log('initializeTabValue  setTabsValue: 2');
         break;
       case 'questionnaire':
       case 'system-settings':
       case 'task-group':
         setTabsValue('3');
-        console.log('initializeTabValue  setTabsValue: 3');
+        // console.log('initializeTabValue  setTabsValue: 3');
         break;
       default:
         setTabsValue('1');
-        console.log('initializeTabValue  setTabsValue default: 1');
+        // console.log('initializeTabValue  setTabsValue default: 1');
         break;
     }
   };
 
   const handleTabChange = (event, newValue) => {
-    console.log(`handleTabChange newValue: ${newValue}`);
+    // console.log(`handleTabChange newValue: ${newValue}`);
     // setTabsValue(newValue);
     switch (newValue) {
       case '1':
@@ -96,7 +96,7 @@ const HeaderBar = () => {
   //   // console.log('------ HeaderBar, onAppObservableStoreChange received: ', msg);
   //   setScrolledDown(false);
   // };
-  console.log('tabs value ==== ', tabsValue);
+  // console.log('tabs value ==== ', tabsValue);
   return (
     <HeaderBarWrapper
       $hasNotch={hasIPhoneNotch()}

diff --git a/src/js/components/Person/AddPersonDrawerMainContent.jsx b/src/js/components/Person/AddPersonDrawerMainContent.jsx
@@ -9,15 +9,16 @@ import makeRequestParams from '../../react-query/makeRequestParams';
 import { useAddPersonToTeamMutation } from '../../react-query/mutations';
 import { SpanWithLinkStyle } from '../Style/linkStyles';
 import AddPersonForm from './AddPersonForm';
+// import { GetTeamListArray } from '../../models/TeamModel';
 
 
 const AddPersonDrawerMainContent = () => {
   renderLog('AddPersonDrawerMainContent');
   const { getAppContextValue } = useConnectAppContext();
   const { mutate } = useAddPersonToTeamMutation();
 
-  const params  = useParams();
-  console.log('AddPersonDrawerMainContent params: ', params);
+  // const params  = useParams();
+  // console.log('AddPersonDrawerMainContent params: ', params);
 
   const [allStaffList] = useState(getAppContextValue('allStaffList'));
   const [remainingStaffToAdd, setRemainingStaffToAdd] = useState(getAppContextValue('allStaffList'));
@@ -32,19 +33,20 @@ const AddPersonDrawerMainContent = () => {
   const searchStringRef = useRef('');
 
   let memberList = [];
-  const teamListFromContext = getAppContextValue('teamListNested');
-  if (teamListFromContext  && thisTeamsCurrentMembersList.length === 0 && teamName === '') {
-    const oneTeam = teamListFromContext.find((team) => team.id === parseInt(teamId));
-    setTeamName(oneTeam.teamName);
-    setTeamId(oneTeam.id);
-
-    if (oneTeam && oneTeam.teamMemberList.length > 0) {
-      memberList = oneTeam.teamMemberList;
-      setThisTeamsCurrentMembersList(memberList);
-    }
-  } else {
-    // console.log('no teamListFromContext yet!');
-  }
+  // const teamListFromContext = getAppContextValue('teamListNested');
+  // const teamListFromContext = GetTeamListArray();
+  // if (teamListFromContext  && thisTeamsCurrentMembersList.length === 0 && teamName === '') {
+  //   const oneTeam = teamListFromContext.find((team) => team.id === parseInt(teamId));
+  //   setTeamName(oneTeam.teamName);
+  //   setTeamId(oneTeam.id);
+  //
+  //   if (oneTeam && oneTeam.teamMemberList.length > 0) {
+  //     memberList = oneTeam.teamMemberList;
+  //     setThisTeamsCurrentMembersList(memberList);
+  //   }
+  // } else {
+  //   // console.log('no teamListFromContext yet!');
+  // }
 
   const initializeRemainingStaffToAddList = () => {
     console.log('initializeTheRemainingStaffToAddListList in AddPersonDrawerMainContent');
@@ -84,7 +86,7 @@ const AddPersonDrawerMainContent = () => {
       if (matchingElements && matchingElements.length) {
         setSearchResultsList(matchingElements);
         setMatchingCounter(matchingElements);
-        console.log(matchingElements);
+        // console.log(matchingElements);
       } else {
         setMatchingCountText('');
       }

diff --git a/src/js/components/Person/AddPersonForm.jsx b/src/js/components/Person/AddPersonForm.jsx
@@ -22,10 +22,11 @@ const AddPersonForm = ({ classes }) => {  //  classes, teamId
   const emailFldRef = useRef('');
 
   useEffect(() => {  // Replaces onAppObservableStoreChange and will be called whenever the context value changes
-    console.log('AddPersonForm: Context value changed:', true);
+    // console.log('AddPersonForm: Context value changed:', true);
     setTeamId(getAppContextValue('addPersonDrawerTeam').id);
     setTeamName(getAppContextValue('addPersonDrawerTeam').teamName);
-  }, [getAppContextValue]);
+  }, []);
+  // }, [getAppContextValue]);  // TODO DALE: commented out for now to avoid infinite loop
 
 
   const saveNewPerson = () => {

diff --git a/src/js/components/Person/EditPersonDrawerMainContent.jsx b/src/js/components/Person/EditPersonDrawerMainContent.jsx
@@ -13,10 +13,11 @@ const EditPersonDrawerMainContent = () => {
   const [teamId, setTeamId] = useState(-1);
 
   useEffect(() => {  // Replaces onAppObservableStoreChange and will be called whenever the context value changes
-    console.log('EditPersonDrawerMainContent: Context value changed:', true);
+    // console.log('EditPersonDrawerMainContent: Context value changed:', true);
     const teamIdTemp = getAppContextValue('editPersonDrawerTeamId');
     setTeamId(teamIdTemp);
-  }, [getAppContextValue]);
+  });
+  // }, [getAppContextValue]);  // TODO DALE: commented out for now to avoid infinite loop
 
   return (
     <EditPersonDrawerMainContentWrapper>