diff --git a/src/App.jsx b/src/App.jsx
index 1b78b52..a46de93 100644
--- 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 () {
} />
} />
- } />
+ {/* } /> */}
} />
} />
} />
diff --git a/src/js/components/Drawers/DrawerTemplateA.jsx b/src/js/components/Drawers/DrawerTemplateA.jsx
index 44105dd..ec169a1 100644
--- 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
index 4773d62..807945e 100644
--- 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 = () => {
-
+ {/* TODO: Still causing infinite loop: */}
>
diff --git a/src/js/components/Drawers/EditPersonDrawer.jsx b/src/js/components/Drawers/EditPersonDrawer.jsx
index 3044c43..488a96d 100644
--- 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 (
{
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 (
{
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>);
@@ -23,7 +23,8 @@ const EditQuestionnaireDrawer = () => {
setHeaderTitleJsx(<>Add Questionnaire>);
}
}
- }, [getAppContextValue]);
+ });
+ // }, [getAppContextValue]); // TODO DALE: commented out for now to avoid infinite loop
return (
{
// };
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 (
{
@@ -16,8 +17,8 @@ const 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
index a43802e..a80b76e 100644
--- 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
index ca56648..be1a4e4 100644
--- 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 (
diff --git a/src/js/components/Person/EditPersonForm.jsx b/src/js/components/Person/EditPersonForm.jsx
index bdf8dcf..7dacdb0 100644
--- a/src/js/components/Person/EditPersonForm.jsx
+++ b/src/js/components/Person/EditPersonForm.jsx
@@ -7,15 +7,18 @@ import { renderLog } from '../../common/utils/logging';
import webAppConfig from '../../config';
import { useConnectAppContext } from '../../contexts/ConnectAppContext';
import makeRequestParams from '../../react-query/makeRequestParams';
-import { usePersonSaveMutation } from '../../react-query/mutations';
+// import { usePersonSaveMutation } from '../../react-query/mutations';
+import { useGetPersonById, usePersonSave } from '../../models/PersonModel';
const EditPersonForm = ({ classes }) => {
renderLog('EditPersonForm');
const { getAppContextValue } = useConnectAppContext();
- const { mutate } = usePersonSaveMutation();
+ // const { mutate } = usePersonSaveMutation();
+ const { mutate: personSave } = usePersonSave();
const [saveButtonActive, setSaveButtonActive] = useState(false);
- const [initialPerson] = useState(getAppContextValue('personDrawersPerson'));
+ // const [initialPerson] = useState(getAppContextValue('personDrawersPerson'));
+ const [initialPerson] = useState(useGetPersonById(getAppContextValue('personDrawersPersonId')));
const [activePerson, setActivePerson] = useState({ ...initialPerson });
const emailPersonal = useRef('');
@@ -24,6 +27,7 @@ const EditPersonForm = ({ classes }) => {
const jobTitle = useRef('');
const lastName = useRef('');
const location = useRef('');
+ const stateCode = useRef('');
const savePerson = () => {
activePerson.emailPersonal = emailPersonal.current.value;
@@ -32,9 +36,10 @@ const EditPersonForm = ({ classes }) => {
activePerson.jobTitle = jobTitle.current.value;
activePerson.lastName = lastName.current.value;
activePerson.location = location.current.value;
+ activePerson.stateCode = stateCode.current.value;
setActivePerson(activePerson);
- console.log('savePerson data:', JSON.stringify(activePerson));
+ // console.log('savePerson data:', JSON.stringify(activePerson));
const data = {};
// for (const key in activePerson) {
@@ -49,7 +54,8 @@ const EditPersonForm = ({ classes }) => {
personId: activePerson.id,
};
- mutate(makeRequestParams(plainParams, data));
+ // mutate(makeRequestParams(plainParams, data));
+ personSave(makeRequestParams(plainParams, data));
setSaveButtonActive(false);
};
@@ -58,77 +64,88 @@ const EditPersonForm = ({ classes }) => {
setSaveButtonActive(true)}
placeholder="First Name (legal name)"
- defaultValue={activePerson.firstName || ''}
variant="outlined"
/>
setSaveButtonActive(true)}
+ placeholder="First Name to use in meetings"
+ variant="outlined"
/>
setSaveButtonActive(true)}
+ placeholder="Last Name"
+ variant="outlined"
/>
setSaveButtonActive(true)}
placeholder="Email Address, Personal"
- defaultValue={activePerson.emailPersonal || ''}
- onChange={() => setSaveButtonActive(true)}
/>
setSaveButtonActive(true)}
placeholder="City, State"
- defaultValue={activePerson.location || ''}
+ variant="outlined"
+ />
+ setSaveButtonActive(true)}
+ placeholder="State Code (2 characters)"
+ variant="outlined"
/>
setSaveButtonActive(true)}
+ placeholder={`Job Title here at ${webAppConfig.ORGANIZATION_NAME}`}
+ variant="outlined"
/>
diff --git a/src/js/components/Person/PersonProfile.jsx b/src/js/components/Person/PersonProfile.jsx
index d535911..8c70eed 100644
--- a/src/js/components/Person/PersonProfile.jsx
+++ b/src/js/components/Person/PersonProfile.jsx
@@ -2,24 +2,27 @@ import React, { useEffect, useState } from 'react';
import styled from 'styled-components';
import { renderLog } from '../../common/utils/logging';
import { useConnectAppContext } from '../../contexts/ConnectAppContext';
-import useGetFullNamePreferred from '../../react-query/useGetFullNamePreferred';
+// import useGetFullNamePreferredReactQuery from '../../react-query/useGetFullNamePreferredReactQuery';
import CopyQuestionnaireLink from '../Questionnaire/CopyQuestionnaireLink';
+import { useGetFullNamePreferred, useGetPersonById } from '../../models/PersonModel';
const PersonProfile = () => {
renderLog('PersonProfile'); // Set LOG_RENDER_EVENTS to log all renders
const { getAppContextValue, setAppContextValue } = useConnectAppContext();
- const [person] = useState(getAppContextValue('personDrawersPerson'));
+ // const [person] = useState(getAppContextValue('personDrawersPerson'));
+ const [person] = useState(useGetPersonById(getAppContextValue('personDrawersPersonId')));
useEffect(() => {
+ // Hard coded temporarily while we are in development
setAppContextValue('QuestionnaireId', 1);
}, []);
return (
- {useGetFullNamePreferred(person)}
+ {useGetFullNamePreferred(person.personId)}
{/* This was commented out as of January 28th, 2025 */}
diff --git a/src/js/components/Person/PersonProfileDrawerMainContent.jsx b/src/js/components/Person/PersonProfileDrawerMainContent.jsx
index d545209..4049850 100644
--- a/src/js/components/Person/PersonProfileDrawerMainContent.jsx
+++ b/src/js/components/Person/PersonProfileDrawerMainContent.jsx
@@ -11,7 +11,7 @@ const PersonProfileDrawerMainContent = () => {
return (
-
+ {/* */}
);
};
diff --git a/src/js/components/Person/PersonSummaryHeader.jsx b/src/js/components/Person/PersonSummaryHeader.jsx
index ff8056a..de1dd37 100644
--- a/src/js/components/Person/PersonSummaryHeader.jsx
+++ b/src/js/components/Person/PersonSummaryHeader.jsx
@@ -9,17 +9,17 @@ const PersonSummaryHeader = () => {
return (
{/* Width (below) of this PersonHeaderCell comes from the combined widths of the first x columns in PersonMemberList */}
- {/* Name */}
+
-
+
Location
-
+
Title / Volunteering Love
{/* Edit icon */}
-
+
);
};
@@ -32,18 +32,18 @@ const OnePersonHeader = styled('div')`
`;
const PersonHeaderCell = styled('div', {
- shouldForwardProp: (prop) => !['largeFont', 'titleCell', 'width'].includes(prop),
-})(({ largeFont, titleCell, width }) => (`
+ shouldForwardProp: (prop) => !['largeFont', 'titleCell', 'cellwidth'].includes(prop),
+})(({ largeFont, titleCell, cellwidth }) => (`
align-content: center;
${(titleCell) ? '' : 'border-bottom: 1px solid #ccc;'}
${(largeFont) ? 'font-size: 1.1em;' : 'font-size: .8em;'};
${(titleCell) ? '' : 'font-weight: 550;'}
height: 22px;
- ${width ? `max-width: ${width}px;` : ''};
- ${width ? `min-width: ${width}px;` : ''};
+ ${cellwidth ? `max-width: ${cellwidth}px;` : ''};
+ ${cellwidth ? `min-width: ${cellwidth}px;` : ''};
overflow: hidden;
white-space: nowrap;
- ${width ? `width: ${width}px;` : ''};
+ ${cellwidth ? `width: ${cellwidth}px;` : ''};
`));
export default PersonSummaryHeader;
diff --git a/src/js/components/Person/PersonSummaryRow.jsx b/src/js/components/Person/PersonSummaryRow.jsx
index 8977190..7d70a0c 100644
--- a/src/js/components/Person/PersonSummaryRow.jsx
+++ b/src/js/components/Person/PersonSummaryRow.jsx
@@ -5,34 +5,46 @@ import styled from 'styled-components';
import DesignTokenColors from '../../common/components/Style/DesignTokenColors';
import { renderLog } from '../../common/utils/logging';
import { useConnectAppContext } from '../../contexts/ConnectAppContext';
-import useGetFullNamePreferred from '../../react-query/useGetFullNamePreferred';
-import { useRemoveTeamMemberMutation } from '../../react-query/mutations';
+import { useGetFullNamePreferred } from '../../models/PersonModel';
+import { useRemoveTeamMemberMutation } from '../../models/TeamModel';
+// import useGetFullNamePreferredReactQuery from '../../react-query/useGetFullNamePreferredReactQuery';
+// import { useRemoveTeamMemberMutation } from '../../react-query/mutations';
import { DeleteStyled, EditStyled } from '../Style/iconStyles';
const PersonSummaryRow = ({ person, rowNumberForDisplay, teamId }) => {
renderLog('PersonSummaryRow'); // Set LOG_RENDER_EVENTS to log all renders
+ // const [person, setPerson] = useState(useGetPersonById(personId));
const { setAppContextValue } = useConnectAppContext();
const { mutate } = useRemoveTeamMemberMutation();
const removeTeamMemberClick = () => {
- const personId = person.id;
- const params = { personId, teamId };
+ const params = { personId: person.personId, teamId };
mutate(params);
};
const editPersonClick = (hasEditRights = true) => {
if (hasEditRights) {
setAppContextValue('editPersonDrawerOpen', true);
- setAppContextValue('personDrawersPerson', person);
+ // setAppContextValue('personDrawersPerson', person);
+ setAppContextValue('personDrawersPersonId', person.personId);
}
};
const personProfileClick = () => {
setAppContextValue('personProfileDrawerOpen', true);
- setAppContextValue('personDrawersPerson', person);
+ // setAppContextValue('personDrawersPerson', person);
+ setAppContextValue('personDrawersPersonId', person.personId);
};
+ // useEffect(() => {
+ // console.log('PersonSummaryRow person: ', person, ' useEffect apiDataCache:', apiDataCache);
+ // const { allPeopleCache } = apiDataCache;
+ // if (allPeopleCache) {
+ // setPerson(allPeopleCache[personId] || {});
+ // }
+ // }, [apiDataCache]);
+
const hasEditRights = true;
return (
@@ -53,7 +65,7 @@ const PersonSummaryRow = ({ person, rowNumberForDisplay, teamId }) => {
}}
width={200}
>
- {useGetFullNamePreferred(person)}
+ {useGetFullNamePreferred(person.personId)}
{person.location}
diff --git a/src/js/components/Questionnaire/CopyQuestionnaireLink.jsx b/src/js/components/Questionnaire/CopyQuestionnaireLink.jsx
index 87335ef..bea256e 100644
--- a/src/js/components/Questionnaire/CopyQuestionnaireLink.jsx
+++ b/src/js/components/Questionnaire/CopyQuestionnaireLink.jsx
@@ -6,13 +6,15 @@ import { renderLog } from '../../common/utils/logging';
import webAppConfig from '../../config';
import { useConnectAppContext } from '../../contexts/ConnectAppContext';
import { SpanWithLinkStyle } from '../Style/linkStyles';
+import { useGetPersonById } from '../../models/PersonModel';
const CopyQuestionnaireLink = () => {
renderLog('CopyQuestionnaireLink');
const { getAppContextValue } = useConnectAppContext();
- const [person] = useState(getAppContextValue('personDrawersPerson'));
+ // const [person] = useState(getAppContextValue('personDrawersPerson'));
+ const [person] = useState(useGetPersonById(getAppContextValue('personDrawersPersonId')));
const [questionnaireId] = useState(getAppContextValue('QuestionnaireId'));
const [linkCopied, setLinkCopied] = useState(false);
const [linkToBeShared] = useState(`${webAppConfig.PROTOCOL}${webAppConfig.HOSTNAME}/q/${questionnaireId}/${person.id}`);
diff --git a/src/js/components/Questionnaire/QuestionnaireResponsesList.jsx b/src/js/components/Questionnaire/QuestionnaireResponsesList.jsx
index a3aa4b8..c50221c 100644
--- a/src/js/components/Questionnaire/QuestionnaireResponsesList.jsx
+++ b/src/js/components/Questionnaire/QuestionnaireResponsesList.jsx
@@ -9,6 +9,7 @@ import webAppConfig from '../../config';
import { useConnectAppContext } from '../../contexts/ConnectAppContext';
import { useFetchData } from '../../react-query/WeConnectQuery';
import CopyQuestionnaireLink from './CopyQuestionnaireLink';
+import { useGetPersonById } from '../../models/PersonModel';
const OpenExternalWebSite = React.lazy(() => import(/* webpackChunkName: 'OpenExternalWebSite' */ '../../common/components/Widgets/OpenExternalWebSite'));
@@ -16,7 +17,8 @@ const QuestionnaireResponsesList = ({ personId }) => {
renderLog('QuestionnaireList'); // Set LOG_RENDER_EVENTS to log all renders
const { getAppContextValue } = useConnectAppContext();
- const [person] = useState(getAppContextValue('personDrawersPerson'));
+ // const [person] = useState(getAppContextValue('personDrawersPerson'));
+ const [person] = useState(useGetPersonById(getAppContextValue('personDrawersPersonId')));
const [questionnaireList, setQuestionnaireList] = useState([]);
// Although we are sending a list, there will only be one person id, if there were more, just append them with commas
diff --git a/src/js/components/Task/TaskListForPerson.jsx b/src/js/components/Task/TaskListForPerson.jsx
index 6728582..dbedb02 100644
--- a/src/js/components/Task/TaskListForPerson.jsx
+++ b/src/js/components/Task/TaskListForPerson.jsx
@@ -7,27 +7,30 @@ import TaskSummaryRow from './TaskSummaryRow';
const TaskListForPerson = ({ personId, showCompletedTasks, taskDefinitionList, taskListForPersonId }) => {
renderLog('TaskListForPerson'); // Set LOG_RENDER_EVENTS to log all renders
-
+ let taskDefinition = {};
return (
- {taskListForPersonId.map((task, index) => (
- taskDefEntry.taskDefinitionId === task.taskDefinitionId)}
- task={task}
- rowNumberForDisplay={index + 1}
- />
- ))}
+ {taskListForPersonId.map((task, index) => {
+ taskDefinition = taskDefinitionList.find((taskDef) => taskDef.taskDefinitionId === task.taskDefinitionId) || {};
+ return (
+
+ );
+ })}
);
};
TaskListForPerson.propTypes = {
personId: PropTypes.number.isRequired,
showCompletedTasks: PropTypes.bool,
- taskDefinitionList: PropTypes.object,
- taskListForPersonId: PropTypes.object,
+ taskDefinitionList: PropTypes.array,
+ taskListForPersonId: PropTypes.array,
};
const TaskListWrapper = styled('div')`
diff --git a/src/js/components/Task/TaskSummaryRow.jsx b/src/js/components/Task/TaskSummaryRow.jsx
index 304df4c..1eea952 100644
--- a/src/js/components/Task/TaskSummaryRow.jsx
+++ b/src/js/components/Task/TaskSummaryRow.jsx
@@ -36,7 +36,7 @@ const TaskSummaryRow = ({ classes, hideIfCompleted, personId, rowNumberForDispla
if (hideIfCompleted && task.statusDone) {
return null;
}
- const taskDef = taskDefinition[0];
+ // console.log('TaskSummaryRow taskDefinition:', taskDefinition);
return (
{rowNumberForDisplay && (
@@ -46,13 +46,13 @@ const TaskSummaryRow = ({ classes, hideIfCompleted, personId, rowNumberForDispla
)}
-
- {taskDef.taskDescription ? (
-
- {taskDef.taskName}
+
+ {taskDefinition.taskDescription ? (
+
+ {taskDefinition.taskName}
) : (
- {taskDef.taskName}
+ {taskDefinition.taskName}
)}
@@ -87,27 +87,27 @@ const TaskSummaryRow = ({ classes, hideIfCompleted, personId, rowNumberForDispla
)}
- {(taskDef.taskInstructions) && (
+ {(taskDefinition.taskInstructions) && (
)}
- {(taskDef.taskActionUrl) && (
+ {(taskDefinition.taskActionUrl) && (
>}>
+
)}
diff --git a/src/js/components/Team/TeamMemberList.jsx b/src/js/components/Team/TeamMemberList.jsx
index 91d0210..67116cf 100644
--- a/src/js/components/Team/TeamMemberList.jsx
+++ b/src/js/components/Team/TeamMemberList.jsx
@@ -1,36 +1,48 @@
import { withStyles } from '@mui/styles';
import PropTypes from 'prop-types';
-import React from 'react';
+import React, { useEffect, useState } from 'react';
import styled from 'styled-components';
import { renderLog } from '../../common/utils/logging';
-import { useConnectAppContext } from '../../contexts/ConnectAppContext';
import PersonSummaryRow from '../Person/PersonSummaryRow';
+import {
+ GetTeamMembersListByTeamId,
+ // useGetTeamMembersListByTeamId,
+} from '../../models/TeamModel';
+import { useConnectAppContext } from '../../contexts/ConnectAppContext';
-const TeamMemberList = ({ teamId }) => {
+const TeamMemberList = ({ teamId }) => { // teamMemberList
renderLog('TeamMemberList');
- const { getAppContextValue } = useConnectAppContext();
+ const { apiDataCache } = useConnectAppContext();
+ const { allPeopleCache, allTeamsCache } = apiDataCache;
+ // const [teamMemberList, setTeamMemberList] = useState(useGetTeamMembersListByTeamId(teamId));
+ const [teamMemberList, setTeamMemberList] = useState([]);
+ // const teamMemberList = useGetTeamMembersListByTeamId(teamId);
+ // console.log('TeamMemberList teamMemberList:', teamMemberList);
- let teamMemberList = [];
- const teamListFromContext = getAppContextValue('teamListNested');
- if (teamListFromContext) {
- const oneTeam = teamListFromContext.find((staff) => staff.teamId === parseInt(teamId));
- if (oneTeam && oneTeam.teamMemberList.length > 0) {
- teamMemberList = oneTeam.teamMemberList;
- }
- } else {
- console.log('no teamListFromContext yet!');
- }
+ useEffect(() => {
+ // console.log(`TeamMemberList useEffect teamId: ${teamId} apiDataCache:`, apiDataCache);
+ const updatedTeamMemberList = GetTeamMembersListByTeamId(teamId, apiDataCache);
+ // console.log(`TeamMemberList useEffect teamId: ${teamId} updatedTeamMemberList:`, updatedTeamMemberList);
+ setTeamMemberList(updatedTeamMemberList);
+ }, [allPeopleCache, allTeamsCache, teamId]);
return (
- {teamMemberList.map((person, index) => (
-
- ))}
+ {teamMemberList.map((person, index) => {
+ // console.log(`TeamMemberList teamId: ${teamId}, person:`, person);
+ if (person) {
+ return (
+
+ );
+ } else {
+ return null; // Empty row for non-existing members
+ }
+ })}
);
};
diff --git a/src/js/contexts/ConnectAppContext.jsx b/src/js/contexts/ConnectAppContext.jsx
index ce7f6dd..b44c5b4 100644
--- a/src/js/contexts/ConnectAppContext.jsx
+++ b/src/js/contexts/ConnectAppContext.jsx
@@ -1,19 +1,48 @@
-import React, { createContext, useContext, useEffect, useState } from 'react';
+import React, { createContext, useContext, useEffect, useReducer, useState } from 'react';
import PropTypes from 'prop-types';
import { useFetchData } from '../react-query/WeConnectQuery';
+import { getInitialGlobalPersonVariables, PersonListRetrieveDataCapture } from '../models/PersonModel';
+import { getInitialGlobalTaskVariables } from '../models/TaskModel';
+import { getInitialGlobalTeamVariables } from '../models/TeamModel';
// Replaces AppObservableStore.js
// Create the context
const ConnectAppContext = createContext({});
+const ConnectDispatch = createContext(null);
+const initialCachedApiPersonVariables = getInitialGlobalPersonVariables();
+const initialCachedApiTaskVariables = getInitialGlobalTaskVariables();
+const initialCachedApiTeamVariables = getInitialGlobalTeamVariables();
+
+function apiDataCacheReducer (apiDataCache, action) {
+ let revisedApiDataCache = { ...apiDataCache };
+ switch (action.type) {
+ case 'updateByKeyValue': {
+ revisedApiDataCache = { ...revisedApiDataCache, [action.key]: action.value };
+ return revisedApiDataCache;
+ }
+ default: {
+ return revisedApiDataCache;
+ }
+ }
+}
+
+const initialApiDataCache = {
+ ...initialCachedApiPersonVariables,
+ ...initialCachedApiTaskVariables,
+ ...initialCachedApiTeamVariables,
+};
// Create the provider component
// eslint-disable-next-line no-unused-vars
export const ConnectAppContextProvider = ({ children }) => {
- console.log('initialization of ConnectAppContextProvider ===============');
+ // console.log('initialization of ConnectAppContextProvider ===============');
const [data, setData] = useState({});
-
+ const [apiDataCache, dispatch] = useReducer(
+ apiDataCacheReducer,
+ initialApiDataCache,
+ );
const setAppContextValue = (key, value) => {
- console.log('------------ setAppContextValue ', key, ' : ', value);
+ // console.log('------------ setAppContextValue ', key, ' : ', value);
setData((prevStore) => ({ ...prevStore, [key]: value }));
};
@@ -29,19 +58,42 @@ export const ConnectAppContextProvider = ({ children }) => {
}
};
- const { data: dataP, isSuccess: isSuccessP, isFetching: isFetchingP, isStale: isStaleP } = useFetchData(['person-list-retrieve'], {});
+ // const { data: dataP, isSuccess: isSuccessP, isFetching: isFetchingP, isStale: isStaleP } = useFetchData(['person-list-retrieve'], {});
+ const personListRetrieveResults = useFetchData(['person-list-retrieve'], {});
+ // This is not currently the right place to pass these values, but I'm saving these here for the next 30 days until we work out the correct place.
+ // {
+ // cacheTime: 0,
+ // networkMode: 'no-cache',
+ // refetchOnMount: true,
+ // refetchOnWindowFocus: true,
+ // refetchInterval: 0,
+ // staleTime: 0,
+ // }
+ const { data: dataP, isSuccess: isSuccessP, isFetching: isFetchingP, isStale: isStaleP } = personListRetrieveResults;
+ useEffect(() => {
+ // console.log('useFetchData person-list-retrieve in Teams useEffect:', personListRetrieveResults);
+ if (personListRetrieveResults) {
+ // console.log('In useEffect apiDataCache:', apiDataCache);
+ // const changeResults =
+ PersonListRetrieveDataCapture(personListRetrieveResults, apiDataCache, dispatch);
+ // console.log('ConnectAppContext useEffect PersonListRetrieveDataCapture changeResults:', changeResults);
+ }
+ }, [personListRetrieveResults]);
+
useEffect(() => {
- console.log('useFetchData in TeamHome (person-list-retrieve) useEffect:', dataP, isSuccessP, isFetchingP, isStaleP);
+ // console.log('useFetchData in TeamHome (person-list-retrieve) useEffect:', dataP, isSuccessP, isFetchingP, isStaleP);
if (isSuccessP) {
// console.log('useFetchData in TeamHome (person-list-retrieve)useEffect data good:', dataP, isSuccessP, isFetchingP, isStaleP);
setAppContextValue('allStaffList', dataP ? dataP.personList : []);
- console.log('allStaffList fetched in ConnectAppContext');
+ // console.log('ConnectAppContext useEffect allStaffList fetched');
}
}, [dataP, isSuccessP, isFetchingP]);
return (
-
- {children}
+
+
+ {children}
+
);
};
@@ -54,7 +106,9 @@ export function useConnectAppContext () {
return useContext(ConnectAppContext);
}
-
+export function useConnectDispatch () {
+ return useContext(ConnectDispatch);
+}
diff --git a/src/js/models/PersonModel.jsx b/src/js/models/PersonModel.jsx
new file mode 100644
index 0000000..12d9936
--- /dev/null
+++ b/src/js/models/PersonModel.jsx
@@ -0,0 +1,126 @@
+import isEqual from 'lodash-es/isEqual';
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import weConnectQueryFn from '../react-query/WeConnectQuery';
+import { useConnectAppContext } from '../contexts/ConnectAppContext';
+
+// These are the "AppContextValues" (i.e., global state variables) used in the PersonModel
+export function getInitialGlobalPersonVariables () {
+ return {
+ allPeopleCache: {}, // This is a dictionary key: personId, value: person dict
+ mostRecentPersonIdSaved: -1,
+ mostRecentPersonSaved: {
+ firstName: '',
+ lastName: '',
+ personId: '',
+ },
+ searchResults: [],
+ };
+}
+
+export const useGetPersonById = (personId) => {
+ const { apiDataCache } = useConnectAppContext();
+ const { allPeopleCache } = apiDataCache;
+ // console.log('useGetPersonById personId:', personId, ', allPeopleCache:', allPeopleCache);
+ if (allPeopleCache) {
+ return allPeopleCache[personId] || {};
+ } else {
+ return {};
+ }
+};
+
+export const useGetFullNamePreferred = (personId) => {
+ const person = useGetPersonById(personId);
+ let fullName = '';
+ if (person.id >= 0) {
+ if (person.firstNamePreferred) {
+ fullName += person.firstNamePreferred;
+ } else if (person.firstName) {
+ fullName += person.firstName;
+ }
+ if (fullName.length > 0 && person.lastName) {
+ fullName += ' ';
+ }
+ if (person.lastName) {
+ fullName += person.lastName;
+ }
+ }
+ return fullName;
+};
+
+export function PersonListRetrieveDataCapture (incomingResults = {}, apiDataCache = {}, dispatch) {
+ const { data, isSuccess } = incomingResults;
+ const allPeopleCache = apiDataCache.allPeopleCache || {};
+ let changeResults = {
+ allPeopleCache,
+ allPeopleCacheChanged: false,
+ };
+ const allPeopleCacheNew = { ...allPeopleCache };
+ // console.log('PersonListRetrieve data: ', data, ', isFetching:', isFetching, ', isSuccess:', isSuccess);
+ // We need to only update allPeopleCache the first time we have received new data from the API server
+ if (data && data.personList && isSuccess === true) {
+ let newDataReceived = false;
+ data.personList.forEach((person) => {
+ if (person && person.personId && person.personId >= 0) {
+ if (!allPeopleCacheNew[person.personId]) {
+ allPeopleCacheNew[person.personId] = person;
+ newDataReceived = true;
+ } else if (!isEqual(person, allPeopleCacheNew[person.personId])) {
+ allPeopleCacheNew[person.personId] = person;
+ newDataReceived = true;
+ }
+ }
+ });
+ // console.log('person-list-retrieve setting allPeopleCacheNew:', allPeopleCacheNew, ', newDataReceived:', newDataReceived);
+ if (newDataReceived) {
+ // setAppContextValue('allPeopleCache', allPeopleCache);
+ dispatch({ type: 'updateByKeyValue', key: 'allPeopleCache', value: allPeopleCacheNew });
+ changeResults = {
+ allPeopleCache: allPeopleCacheNew,
+ allPeopleCacheChanged: true,
+ };
+ }
+ }
+ return changeResults;
+}
+
+export const usePersonSave = () => {
+ // PLEASE DO NOT REMOVE
+ // const { apiDataCache } = useConnectAppContext();
+ // const dispatch = useConnectDispatch();
+
+ const queryClient = useQueryClient();
+ return useMutation({
+ mutationFn: (params) => weConnectQueryFn('person-save', params),
+ networkMode: 'always', // Send queries to the server even if the cache has the data
+ onError: (error) => {
+ console.log('onError in usePersonSave: ', error);
+ queryClient.refetchQueries({ queryKey: ['person-list-retrieve'], refetchType: 'active', exact: true, force: true })
+ .then(() => console.log('PersonModel API call error recovery refetch completed'))
+ .catch((error2) => console.error('PersonModel API call refetch failed:', error2));
+ },
+ onSuccess: (results) => {
+ // console.log('person-save onSuccess true, results: ', results);
+
+ // PLEASE DO NOT REMOVE
+ // const { allPeopleCache } = apiDataCache;
+ // const allPeopleCacheNew = { ...allPeopleCache };
+ // console.log('useGetPersonById personId:', personId, ', allPeopleCacheNew:', allPeopleCacheNew);
+ if (results.success === false) {
+ console.log('usePersonSave onSuccess failed results:', results);
+ } else if (results.personId >= 0) {
+ // PLEASE DO NOT REMOVE
+ // console.log('usePersonSave personId:', results.personId, ', results: ', results);
+ // allPeopleCacheNew[results.personId] = results;
+ // dispatch({ type: 'updateByKeyValue', key: 'allPeopleCache', value: allPeopleCacheNew });
+
+ // setTimeout(() => {
+ queryClient.refetchQueries({ queryKey: ['person-list-retrieve'], refetchType: 'active', exact: true, force: true })
+ .then(() => console.log('PersonModel refetch completed'))
+ .catch((error) => console.error('PersonModel refetch failed:', error));
+ // }, 1000); // 1 second delay
+ } else {
+ console.log('usePersonSave personId not >= 0:', results);
+ }
+ },
+ });
+};
diff --git a/src/js/models/TaskModel.jsx b/src/js/models/TaskModel.jsx
new file mode 100644
index 0000000..4d5fb28
--- /dev/null
+++ b/src/js/models/TaskModel.jsx
@@ -0,0 +1,152 @@
+import isEqual from 'lodash-es/isEqual';
+// import { useMutation, useQueryClient } from '@tanstack/react-query';
+// import weConnectQueryFn from '../react-query/WeConnectQuery';
+// import { useConnectAppContext } from '../contexts/ConnectAppContext';
+
+// These are the "AppContextValues" (i.e., global state variables) used in the PersonModel
+export function getInitialGlobalTaskVariables () {
+ return {
+ allTaskGroupsCache: {}, // This is a dictionary key: taskGroupId, value: TaskGroup dict
+ allTaskDefinitionsCache: {}, // This is a dictionary key: taskDefinitionId, value: TaskDefinition dict
+ allTaskDependenciesCache: {}, // This is a dictionary key: taskDependencyId, value: TaskDependency dict
+ allTasksCache: {}, // This is a dictionary key: personId, value: another dictionary key: taskDefinitionId, value: Task dict
+ mostRecentTaskDefinitionIdSaved: -1,
+ mostRecentTaskDefinitionSaved: {
+ taskDefinitionId: -1,
+ },
+ mostRecentTaskGroupIdSaved: -1,
+ mostRecentTaskGroupSaved: {
+ firstName: '',
+ lastName: '',
+ taskDefinitionId: -1,
+ },
+ taskDefinitionsCompletedPersonIdList: {}, // This is a dictionary key: taskDefinitionId, value: list of personIds who have completed the TaskDefinition
+ taskGroupCompletedByPersonList: {}, // This is a dictionary key: taskGroupId, value: list of personIds who have completed the TaskGroup
+ searchResults: [],
+ };
+}
+
+// This is called after making this fetchData request:
+// const taskStatusListRetrieveResults = useFetchData(['task-status-list-retrieve'], { personIdList: personIdsList });
+export function TaskStatusListRetrieveDataCapture (
+ incomingRetrieveResults = {},
+ apiDataCache = {},
+ dispatch,
+) {
+ const { data, isSuccess } = incomingRetrieveResults;
+ const allTaskDefinitionsCache = apiDataCache.allTaskDefinitionsCache || {};
+ const allTaskDependenciesCache = apiDataCache.allTaskDependenciesCache || {};
+ const allTaskGroupsCache = apiDataCache.allTaskGroupsCache || {};
+ const allTasksCache = apiDataCache.allTasksCache || {};
+ const changeResults = {
+ allTaskDefinitionsCache,
+ allTaskDefinitionsCacheChanged: false,
+ allTaskDependenciesCache,
+ allTaskDependenciesCacheChanged: false,
+ allTaskGroupsCache,
+ allTaskGroupsCacheChanged: false,
+ allTasksCache,
+ allTasksCacheChanged: false,
+ };
+ const allTaskDefinitionsCacheNew = { ...allTaskDefinitionsCache };
+ // const allTaskDependenciesCacheNew = { ...allTaskDependenciesCache };
+ const allTaskGroupsCacheNew = { ...allTaskGroupsCache };
+ const allTasksCacheNew = { ...allTasksCache };
+ let newTaskDefinitionListDataReceived = false;
+ if (data && data.taskDefinitionList && isSuccess === true) {
+ data.taskDefinitionList.forEach((taskDefinition) => {
+ if (taskDefinition && taskDefinition.taskDefinitionId && taskDefinition.taskDefinitionId >= 0) {
+ if (!allTaskDefinitionsCacheNew[taskDefinition.taskDefinitionId]) {
+ allTaskDefinitionsCacheNew[taskDefinition.taskDefinitionId] = taskDefinition;
+ newTaskDefinitionListDataReceived = true;
+ } else if (!isEqual(taskDefinition, allTaskDefinitionsCacheNew[taskDefinition.taskDefinitionId])) {
+ allTaskDefinitionsCacheNew[taskDefinition.taskDefinitionId] = taskDefinition;
+ newTaskDefinitionListDataReceived = true;
+ }
+ }
+ });
+ }
+ // let newTaskDependenciesListDataReceived = false;
+ // TODO TaskDependencies API processing when data available
+ let newTaskGroupListDataReceived = false;
+ if (data && data.taskGroupList && isSuccess === true) {
+ data.taskGroupList.forEach((taskGroup) => {
+ if (taskGroup && taskGroup.taskGroupId && taskGroup.taskGroupId >= 0) {
+ if (!allTaskGroupsCacheNew[taskGroup.taskGroupId]) {
+ allTaskGroupsCacheNew[taskGroup.taskGroupId] = taskGroup;
+ newTaskGroupListDataReceived = true;
+ } else if (!isEqual(taskGroup, allTaskGroupsCacheNew[taskGroup.taskGroupId])) {
+ allTaskGroupsCacheNew[taskGroup.taskGroupId] = taskGroup;
+ newTaskGroupListDataReceived = true;
+ }
+ }
+ });
+ }
+ let newTaskListDataReceived = false;
+ if (data && data.taskList && isSuccess === true) {
+ data.taskList.forEach((task) => {
+ if (task && task.personId && task.personId >= 0 && task.taskDefinitionId && task.taskDefinitionId >= 0) {
+ if (!allTasksCacheNew[task.personId]) {
+ allTasksCacheNew[task.personId] = {};
+ }
+ if (!allTasksCacheNew[task.personId][task.taskDefinitionId]) {
+ allTasksCacheNew[task.personId][task.taskDefinitionId] = task;
+ newTaskListDataReceived = true;
+ } else if (!isEqual(task, allTasksCacheNew[task.personId][task.taskDefinitionId])) {
+ allTasksCacheNew[task.personId][task.taskDefinitionId] = task;
+ newTaskListDataReceived = true;
+ }
+ }
+ });
+ if (newTaskDefinitionListDataReceived) {
+ // console.log('TaskStatusListRetrieve setting allTaskDefinitionsCacheNew:', allTaskDefinitionsCacheNew);
+ dispatch({ type: 'updateByKeyValue', key: 'allTaskDefinitionsCache', value: allTaskDefinitionsCacheNew });
+ changeResults.allTaskDefinitionsCache = allTaskDefinitionsCacheNew;
+ changeResults.allTaskDefinitionsCacheChanged = true;
+ }
+ // if (newTaskDependenciesListDataReceived) {
+ // // console.log('TaskStatusListRetrieve setting allTaskDependenciesCacheNew:', allTaskDependenciesCacheNew);
+ // dispatch({ type: 'updateByKeyValue', key: 'allTaskDependenciesCache', value: allTaskDependenciesCacheNew });
+ // changeResults.allTaskDependenciesCache = allTaskDependenciesCacheNew;
+ // changeResults.allTaskDependenciesCacheChanged = true;
+ // }
+ if (newTaskListDataReceived) {
+ // console.log('TaskStatusListRetrieve setting allTasksCacheNew:', allTasksCacheNew);
+ dispatch({ type: 'updateByKeyValue', key: 'allTasksCache', value: allTasksCacheNew });
+ changeResults.allTasksCache = allTasksCacheNew;
+ changeResults.allTasksCacheChanged = true;
+ }
+ if (newTaskGroupListDataReceived) {
+ // console.log('TaskStatusListRetrieve setting allTaskGroupsCacheNew:', allTaskGroupsCacheNew);
+ dispatch({ type: 'updateByKeyValue', key: 'allTaskGroupsCache', value: allTaskGroupsCacheNew });
+ changeResults.allTaskGroupsCache = allTaskGroupsCacheNew;
+ changeResults.allTaskGroupsCacheChanged = true;
+ }
+ }
+ return changeResults;
+}
+
+// TODO Update to task-definition-save
+// export function TaskDefinitionSave () {
+// // Transferred from react-query/mutation.jsx to test a new approach
+// const { getAppContextValue, setAppContextValue } = useConnectAppContext();
+// const queryClient = useQueryClient();
+//
+// // We want to add to onSuccess below a function that stores in the Context the person data which was stored on the API server
+// return useMutation({
+// mutationFn: (params) => weConnectQueryFn('person-save', params),
+// onError: (error) => console.log('error in personSaveMutation: ', error),
+// onSuccess: (results) => {
+// // Update the cached people with the new/changed person data, stored in allPeopleCache
+// // console.log('person-save onSuccess true, results: ', results);
+// const allPeopleCache = getAppContextValue('allPeopleCache');
+// if (results.personId >= 0) {
+// allPeopleCache[results.personId] = results;
+// setAppContextValue('allPeopleCache', allPeopleCache);
+// }
+// // And now invalidate other queries that pulled in this data
+// queryClient.invalidateQueries('person-list-retrieve');
+// queryClient.invalidateQueries('team-list-retrieve');
+// },
+// });
+// }
diff --git a/src/js/models/TeamModel.jsx b/src/js/models/TeamModel.jsx
new file mode 100644
index 0000000..fec1b46
--- /dev/null
+++ b/src/js/models/TeamModel.jsx
@@ -0,0 +1,160 @@
+import { useMemo } from 'react';
+import isEqual from 'lodash-es/isEqual';
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import weConnectQueryFn from '../react-query/WeConnectQuery';
+import { useConnectAppContext } from '../contexts/ConnectAppContext';
+
+// These are the "AppContextValues" (i.e., global state variables) used in the TeamModel
+export function getInitialGlobalTeamVariables () {
+ return {
+ allTeamsCache: {}, // This is a dictionary key: teamId, value: team dict
+ allTeamMembersCache: {}, // This is a dictionary key: teamId, value: list of personIds in the team
+ mostRecentTeamIdSaved: -1,
+ mostRecentTeamMemberIdSaved: -1,
+ mostRecentTeamSaved: {
+ teamName: '',
+ teamId: '',
+ },
+ };
+}
+
+export const useGetTeamById = (teamId) => {
+ const { apiDataCache } = useConnectAppContext();
+ const { allTeamsCache } = apiDataCache;
+ // console.log('useGetTeamById teamId:', teamId, ', allTeamsCache:', allTeamsCache);
+ if (allTeamsCache) {
+ return allTeamsCache[teamId] || {};
+ } else {
+ return {};
+ }
+};
+
+export const GetTeamMembersListByTeamId = (teamId, apiDataCache) => {
+ const { allPeopleCache, allTeamMembersCache } = apiDataCache;
+ if (!allTeamMembersCache || !allTeamMembersCache[teamId]) {
+ return [];
+ }
+ const personIds = allTeamMembersCache[teamId];
+ return personIds.map((personId) => allPeopleCache[personId] || null);
+};
+
+export const useGetTeamMembersListByTeamId = (teamId) => {
+ const { apiDataCache } = useConnectAppContext();
+ const { allPeopleCache, allTeamMembersCache } = apiDataCache;
+ return useMemo(() => {
+ if (!allTeamMembersCache || !allTeamMembersCache[teamId]) {
+ return [];
+ }
+ const personIds = allTeamMembersCache[teamId];
+ return personIds.map((personId) => allPeopleCache[personId] || null);
+ }, [allTeamMembersCache, teamId]);
+};
+
+// This is called following:
+// const teamListRetrieveResults = useFetchData(['team-list-retrieve'], {});
+export function TeamListRetrieveDataCapture (
+ incomingRetrieveResults = {},
+ apiDataCache = {},
+ dispatch,
+) {
+ const { data, isSuccess } = incomingRetrieveResults;
+ const allTeamMembersCache = apiDataCache.allTeamMembersCache || {};
+ const allTeamsCache = apiDataCache.allTeamsCache || {};
+ // console.log('TeamListRetrieve data: ', data, ', isFetching:', isFetching, ', isSuccess:', isSuccess);
+ const changeResults = {
+ allTeamMembersCache,
+ allTeamMembersCacheChanged: false,
+ allTeamsCache,
+ allTeamsCacheChanged: false,
+ };
+ const allTeamMembersCacheNew = { ...allTeamMembersCache };
+ const allTeamsCacheNew = { ...allTeamsCache };
+ if (data && data.teamList && isSuccess === true) {
+ let newTeamDataReceived = false;
+ let teamTrimmed;
+ let newTeamMemberDataReceived = false;
+ let teamMemberListOfPersonIdsAtStart = [];
+
+ data.teamList.forEach((team) => {
+ if (team && team.teamId && team.teamId >= 0) {
+ teamTrimmed = { ...team };
+ delete teamTrimmed.teamMemberList;
+ if (!allTeamsCacheNew[teamTrimmed.teamId]) {
+ allTeamsCacheNew[teamTrimmed.teamId] = teamTrimmed;
+ newTeamDataReceived = true;
+ } else if (!isEqual(teamTrimmed, allTeamsCacheNew[teamTrimmed.teamId])) {
+ allTeamsCacheNew[teamTrimmed.teamId] = teamTrimmed;
+ newTeamDataReceived = true;
+ }
+ }
+ if (team && team.teamMemberList) {
+ if (!allTeamMembersCacheNew[team.teamId]) {
+ allTeamMembersCacheNew[team.teamId] = [];
+ }
+ // Reset this list, so we can see if any former team members have been removed
+ teamMemberListOfPersonIdsAtStart = [...allTeamMembersCacheNew[team.teamId]];
+ team.teamMemberList.forEach((person) => {
+ if (person && person.personId && person.personId >= 0) {
+ // Capture which team this person is in
+ if (!allTeamMembersCacheNew[team.teamId].includes(person.personId)) {
+ allTeamMembersCacheNew[team.teamId].push(person.personId);
+ newTeamMemberDataReceived = true;
+ }
+ // Remove the person from the list of team members in the cache so we know if anyone has been removed
+ if (teamMemberListOfPersonIdsAtStart.includes(person.personId)) {
+ try {
+ const index = teamMemberListOfPersonIdsAtStart.indexOf(person.personId);
+ teamMemberListOfPersonIdsAtStart.splice(index, 1);
+ } catch (error) {
+ console.error('Error removing team member from teamMemberListOfPersonIdsAtStart:', error);
+ }
+ }
+ }
+ });
+ if (teamMemberListOfPersonIdsAtStart.length > 0) {
+ // We need to remove these people from the cache as they have been removed from the team
+ // console.log('+++ team members leftover in teamMemberListOfPersonIdsAtStart');
+ allTeamMembersCacheNew[team.teamId] = allTeamMembersCacheNew[team.teamId].filter(
+ (personId) => !teamMemberListOfPersonIdsAtStart.includes(personId),
+ );
+ newTeamMemberDataReceived = true;
+ }
+ }
+ if (newTeamMemberDataReceived) {
+ dispatch({ type: 'updateByKeyValue', key: 'allTeamMembersCache', value: allTeamMembersCacheNew });
+ changeResults.allTeamMembersCache = allTeamMembersCacheNew;
+ changeResults.allTeamMembersCacheChanged = true;
+ }
+ if (newTeamDataReceived) {
+ dispatch({ type: 'updateByKeyValue', key: 'allTeamsCache', value: allTeamsCacheNew });
+ changeResults.allTeamsCache = allTeamsCacheNew;
+ changeResults.allTeamsCacheChanged = true;
+ }
+ });
+ }
+ return changeResults;
+}
+
+export const useRemoveTeamMemberMutation = () => {
+ const queryClient = useQueryClient();
+ return useMutation({
+ mutationFn: (params) => weConnectQueryFn('remove-person-from-team', params),
+ networkMode: 'always', // Send queries to the server even if the cache has the data
+ onError: (error) => {
+ console.log('onError in useRemoveTeamMemberMutation: ', error);
+ queryClient.refetchQueries({ queryKey: ['team-list-retrieve'], refetchType: 'active', exact: true, force: true })
+ .then(() => console.log('TeamModel team-list-retrieve API call error recovery refetch completed'))
+ .catch((error2) => console.error('TeamModel team-list-retrieve API call refetch failed:', error2));
+ },
+ onSuccess: (results) => {
+ // console.log('team-list-retrieve onSuccess true, results: ', results);
+ if (results.success === false) {
+ console.log('useRemoveTeamMemberMutation onSuccess failed results:', results);
+ } else {
+ queryClient.refetchQueries({ queryKey: ['team-list-retrieve'], refetchType: 'active', exact: true, force: true })
+ .then(() => console.log('TeamModel team-list-retrieve refetch completed'))
+ .catch((error) => console.error('TeamModel team-list-retrieve refetch failed:', error));
+ }
+ },
+ });
+};
diff --git a/src/js/pages/QuestionnaireAnswers.jsx b/src/js/pages/QuestionnaireAnswers.jsx
index e54b4f5..cf70ddf 100644
--- a/src/js/pages/QuestionnaireAnswers.jsx
+++ b/src/js/pages/QuestionnaireAnswers.jsx
@@ -9,8 +9,9 @@ import DesignTokenColors from '../common/components/Style/DesignTokenColors';
import { renderLog } from '../common/utils/logging';
import { PageContentContainer } from '../components/Style/pageLayoutStyles';
import webAppConfig from '../config';
-import useGetFullNamePreferred from '../react-query/useGetFullNamePreferred';
+// import useGetFullNamePreferred from '../react-query/useGetFullNamePreferred';
import { useFetchData } from '../react-query/WeConnectQuery';
+import { useGetFullNamePreferred } from '../models/PersonModel';
// eslint-disable-next-line no-unused-vars
@@ -53,8 +54,8 @@ const QuestionnaireAnswers = ({ classes, match }) => {
/* eslint-disable arrow-body-style */
// eslint-disable-next-line no-unused-vars
const getAnswerValue = (questionId) => {
- // if (allCachedAnswersDict && allCachedAnswersDict[questionId]) {
- // const questionAnswer = allCachedAnswersDict[questionId];
+ // if (allAnswersCache && allAnswersCache[questionId]) {
+ // const questionAnswer = allAnswersCache[questionId];
// return getAnswerValueFromAnswerDict(questionAnswer);
// }
return '';
@@ -79,7 +80,8 @@ const QuestionnaireAnswers = ({ classes, match }) => {
Answered by:
{' '}
- {useGetFullNamePreferred(person)}
+ {/* {useGetFullNamePreferred(person)} */}
+ {person ? useGetFullNamePreferred(person.personId) : 'tbd'}
{questionList && questionList.map((question) => (
diff --git a/src/js/pages/Tasks.jsx b/src/js/pages/Tasks.jsx
index 6ecc100..02cfc1b 100644
--- a/src/js/pages/Tasks.jsx
+++ b/src/js/pages/Tasks.jsx
@@ -1,4 +1,3 @@
-import { CircularProgress } from '@mui/material';
import { withStyles } from '@mui/styles';
import PropTypes from 'prop-types';
import React, { useEffect, useState } from 'react';
@@ -11,44 +10,72 @@ import { SpanWithLinkStyle } from '../components/Style/linkStyles';
import { PageContentContainer } from '../components/Style/pageLayoutStyles';
import TaskListForPerson from '../components/Task/TaskListForPerson';
import webAppConfig from '../config';
+import { useConnectAppContext, useConnectDispatch } from '../contexts/ConnectAppContext';
+import { TaskStatusListRetrieveDataCapture } from '../models/TaskModel';
+import { TeamListRetrieveDataCapture } from '../models/TeamModel';
import { useFetchData } from '../react-query/WeConnectQuery';
// eslint-disable-next-line no-unused-vars
const Tasks = ({ classes, match }) => {
renderLog('Tasks'); // Set LOG_RENDER_EVENTS to log all renders
+ const { apiDataCache } = useConnectAppContext();
+ const { allPeopleCache, allTaskDefinitionsCache, allTasksCache } = apiDataCache;
+ const dispatch = useConnectDispatch();
const [showCompletedTasks, setShowCompletedTasks] = useState(false);
- const [taskList, setTaskList] = useState(undefined);
- const [taskDefinitionList, setTaskDefinitionList] = useState(undefined);
- const [allStaffList, setAllStaffList] = useState([]);
- const [isFetching, setIsFetching] = useState([false]);
- const [personIdsList, setPersonIdsList] = useState();
+ const [taskListByPersonId, setTaskListByPersonId] = useState({});
+ const [taskDefinitionList, setTaskDefinitionList] = useState([]);
+ const [selectedPersonList, setSelectedPersonList] = useState([]);
+ const [personIdsList, setPersonIdsList] = useState([]);
- // Roughly equivalent to PersonStore.getAllCachedPeopleList(); and TaskActions.taskStatusListRetrieve();
- const { data: dataPerson, isSuccess: isSuccessPerson, isFetching: isFetchingPerson } = useFetchData(['person-list-retrieve'], {});
+ const taskStatusListRetrieveResults = useFetchData(['task-status-list-retrieve'], { personIdList: personIdsList });
useEffect(() => {
- if (dataPerson) {
- setPersonIdsList(dataPerson.personList.map((dataPersonObj) => dataPersonObj.id));
- setAllStaffList(dataPerson.personList);
+ if (taskStatusListRetrieveResults) {
+ // const changeResults =
+ TaskStatusListRetrieveDataCapture(taskStatusListRetrieveResults, apiDataCache, dispatch);
+ // console.log('Tasks useEffect changeResults:', changeResults);
}
- }, [dataPerson, isSuccessPerson]);
+ }, [personIdsList, taskStatusListRetrieveResults]);
- const { data: dataTask, isSuccess: isSuccessTask, isFetching: isFetchingTask } = useFetchData(['task-status-list-retrieve'], { personIdList: personIdsList });
useEffect(() => {
- console.log('useFetchData in Tasks (person-list-retrieve) useEffect:', isSuccessPerson, isFetchingPerson, dataPerson);
- console.log('useFetchData in Tasks (task-status-list-retrieve) useEffect:', isSuccessTask, isFetchingTask, dataTask);
- setIsFetching(isFetchingTask || isFetchingPerson);
- if (isSuccessPerson && isSuccessTask) {
- setTaskDefinitionList(dataTask.taskDefinitionList);
- setTaskList(dataTask.taskList);
+ // console.log('Tasks useEffect allTaskDefinitionsCache:', allTaskDefinitionsCache);
+ if (allTaskDefinitionsCache) {
+ setTaskDefinitionList(Object.values(allTaskDefinitionsCache));
}
- }, [personIdsList, dataTask, isSuccessPerson, isSuccessTask]);
+ }, [allTaskDefinitionsCache]);
+
+ const teamListRetrieveResults = useFetchData(['team-list-retrieve'], {});
+ useEffect(() => {
+ // console.log('useFetchData team-list-retrieve in Teams useEffect:', teamListRetrieveResults);
+ if (teamListRetrieveResults) {
+ // console.log('In useEffect apiDataCache:', apiDataCache);
+ // const changeResults =
+ TeamListRetrieveDataCapture(teamListRetrieveResults, apiDataCache, dispatch);
+ // console.log('Teams useEffect changeResults:', changeResults);
+ }
+ }, [teamListRetrieveResults]);
+
+ useEffect(() => {
+ // console.log('Tasks useEffect allPeopleCache:', allPeopleCache);
+ if (allPeopleCache) {
+ const allCachedPeopleList = Object.values(allPeopleCache);
+ setPersonIdsList(allCachedPeopleList.map((person) => person.personId));
+ setSelectedPersonList(allCachedPeopleList);
+ }
+ }, [allPeopleCache]);
+
+ useEffect(() => {
+ const taskListByPersonIdTemp = {};
+ if (allTasksCache) {
+ Object.entries(allTasksCache).forEach(([personIdTemp, taskDictByDefinitionId]) => {
+ taskListByPersonIdTemp[personIdTemp] = Object.values(taskDictByDefinitionId);
+ });
+ }
+ setTaskListByPersonId(taskListByPersonIdTemp);
+ // console.log('=== taskListByPersonIdTemp:', taskListByPersonIdTemp);
+ }, [allTasksCache]);
- if (taskDefinitionList) {
- const test = taskDefinitionList.filter((taskDefEntry) => taskDefEntry.personId === 1);
- console.log(test);
- }
const teamId = 0; // hack 1/15/25
return (
@@ -58,7 +85,7 @@ const Tasks = ({ classes, match }) => {
{' '}
{webAppConfig.NAME_FOR_BROWSER_TAB_TITLE}
- {/* Executing a link to a full url restarts the session, */}
+ {/* Executing a link to a full url restarts the session, */}
{/* Latest Helmet wont take a link or Link, Home */}
{/* browser.js:38 Uncaught Invariant Violation: Only elements types base, body, head, html, link, meta, noscript, script, style, title, Symbol(react.fragment) are allowed. Helmet does not support rendering <[object Object]> elements. Refer to our API for more information. */}
@@ -72,19 +99,14 @@ const Tasks = ({ classes, match }) => {
)}