Questionnnaire Details working again in the new way in AnswerQuestion…

…sForm AnswerQuestionsForm did rely on Actions that no longer worked, then the last bit of Actions tracked down and eliminated in files where they did not do anything as of the December 28th fork.
wevote · Jan 25, 2025 · 41b4621 · 41b4621
1 parent d07dbaf
commit 41b4621
Show file tree

Hide file tree

Showing 8 changed files with 141 additions and 127 deletions.
diff --git a/src/App.jsx b/src/App.jsx
@@ -10,6 +10,7 @@ import { normalizedHref } from './js/common/utils/hrefUtils';
 import initializejQuery from './js/common/utils/initializejQuery';
 import { renderLog } from './js/common/utils/logging';
 import Drawers from './js/components/Drawers/Drawers';
+import webAppConfig from './js/config';
 import ConnectAppContext from './js/contexts/ConnectAppContext';
 import Login from './js/pages/Login';
 
@@ -34,6 +35,7 @@ const Teams = React.lazy(() => import(/* webpackChunkName: 'Teams' */ './js/page
 function App () {
   renderLog('App');
   const [hideHeader] = useState(false);
+  const [showDevtools] = useState(webAppConfig.ENABLE_REACT_QUERY_TOOLS !== undefined ? webAppConfig.ENABLE_REACT_QUERY_TOOLS : true);
 
 
   // Inject this once for the app, for all react-query queries
@@ -88,7 +90,9 @@ function App () {
                     <Route path="*" element={<PageNotFound />} />
                   </Routes>
                   {/* Hack 1/14/25 <Footer /> */}
-                  <ReactQueryDevtools />
+                  {showDevtools && (
+                    <ReactQueryDevtools />
+                  )}
                 </WeVoteBody>
               </BrowserRouter>
             </ThemeProvider>

diff --git a/src/js/components/Questionnaire/EditQuestionForm.jsx b/src/js/components/Questionnaire/EditQuestionForm.jsx
@@ -109,7 +109,7 @@ const EditQuestionForm = ({ classes }) => {
   const updateSaveButton = () => {
     if (questionTextFldRef.current.value && questionTextFldRef.current.value.length &&
       questionInstructionsFldRef.current.value && questionInstructionsFldRef.current.value.length &&
-      questionInstructionsFldRef.current.value && questionInstructionsFldRef.current.value.length) {
+      questionInstructionsFldRef.current.value && questionInstructionsFldRef.current.value.length)  {
       if (!saveButtonActive) {
         setSaveButtonActive(true);
       }
@@ -118,6 +118,10 @@ const EditQuestionForm = ({ classes }) => {
 
   const handleRadioChange = (event) => {
     setRadioValue(event.target.value);
+    if (!saveButtonActive) {
+      setSaveButtonActive(true);
+    }
+
   };
 
   return (

diff --git a/src/js/components/Questionnaire/QuestionnaireResponsesList.jsx b/src/js/components/Questionnaire/QuestionnaireResponsesList.jsx
@@ -22,35 +22,17 @@ const QuestionnaireResponsesList = ({ personId }) => {
   // Although we are sending a list, there will only be one person id, if there were more, just append them with commas
   const requestParams = `personIdList[]=${person.id}`;
 
-  const { data: dataQRS, isSuccess: isSuccessQRS, isFetching: isFetchingQRS } = useFetchData(['questionnaire-responses-list-retrieve'], requestParams);
-  if (isFetchingQRS) {
+  const { data: dataQRL, isSuccess: isSuccessQRL, isFetching: isFetchingQRL } = useFetchData(['questionnaire-responses-list-retrieve'], requestParams);
+  if (isFetchingQRL) {
     console.log('isFetching  ------------ \'questionnaire-responses-list-retrieve\'');
   }
   useEffect(() => {
-    if (dataQRS !== undefined && isFetchingQRS === false && person) {
-      console.log('useFetchData in QuestionnaireResponsesList useEffect dataQRS is good:', dataQRS, isSuccessQRS, isFetchingQRS);
+    if (dataQRL !== undefined && isFetchingQRL === false && person) {
+      console.log('useFetchData in QuestionnaireResponsesList useEffect dataQRL is good:', dataQRL, isSuccessQRL, isFetchingQRL);
       console.log('Successfully retrieved QuestionnaireResponsesList...');
-
-      // TODO: 1/20/25 is this questionList or questionnaireList?
-      // It seems like an answered questionnaire question should be a questionAnswerList, but questionnaire and question seem tyo be used inconsistently
-      // So this is hard to figure out without having some "answers" data
-
-      // const questionnaireListTempModified = [];
-      // for (let i = 0; i < questionnaireListTemp.length; i++) {
-      //   const questionnaire = questionnaireListTemp[i];
-      //   if (dateQuestionnairesCompletedDictTemp[questionnaire.questionnaireId]) {
-      //     questionnaire.dateQuestionnaireCompleted = new Date(dateQuestionnairesCompletedDictTemp[questionnaire.questionnaireId]);
-      //   } else {
-      //     questionnaire.dateQuestionnaireCompleted = null;
-      //   }
-      //   // console.log('QuestionnaireList questionnaire:', questionnaire);
-      //   questionnaireListTempModified[i] = questionnaire;
-      // }
-      // setQuestionnaireList(questionnaireListTempModified);
-
-      setQuestionnaireList(dataQRS.questionnaireList);
+      setQuestionnaireList(dataQRL.questionnaireList);
     }
-  }, [dataQRS, isFetchingQRS, person]);
+  }, [dataQRL, isFetchingQRL, person]);
 
   return (
     <div>

diff --git a/src/js/components/Task/EditTaskDefinitionDrawerMainContent.jsx b/src/js/components/Task/EditTaskDefinitionDrawerMainContent.jsx
@@ -1,21 +1,12 @@
 import React from 'react';
 import styled from 'styled-components';
-import { withStyles } from '@mui/styles';
-import PersonActions from '../../actions/PersonActions';
-import apiCalming from '../../common/utils/apiCalming';
 import { renderLog } from '../../common/utils/logging';
 import EditTaskDefinitionForm from './EditTaskDefinitionForm';
 
 
 const EditTaskDefinitionDrawerMainContent = () => {
   renderLog('EditTaskDefinitionDrawerMainContent');  // Set LOG_RENDER_EVENTS to log all renders
 
-  React.useEffect(() => {
-    if (apiCalming('personListRetrieve', 30000)) {
-      PersonActions.personListRetrieve();
-    }
-  }, []);
-
   return (
     <EditTaskDefinitionDrawerMainContentWrapper>
       <AddTaskDefinitionWrapper>
@@ -25,14 +16,11 @@ const EditTaskDefinitionDrawerMainContent = () => {
   );
 };
 
-const styles = () => ({
-});
-
 const EditTaskDefinitionDrawerMainContentWrapper = styled('div')`
 `;
 
 const AddTaskDefinitionWrapper = styled('div')`
   margin-top: 32px;
 `;
 
-export default withStyles(styles)(EditTaskDefinitionDrawerMainContent);
+export default EditTaskDefinitionDrawerMainContent;
diff --git a/src/js/components/Task/EditTaskGroupDrawerMainContent.jsx b/src/js/components/Task/EditTaskGroupDrawerMainContent.jsx
@@ -1,21 +1,13 @@
 import React from 'react';
 import styled from 'styled-components';
 import { withStyles } from '@mui/styles';
-import PersonActions from '../../actions/PersonActions';
-import apiCalming from '../../common/utils/apiCalming';
 import { renderLog } from '../../common/utils/logging';
 import EditTaskGroupForm from './EditTaskGroupForm';
 
 
 const EditTaskGroupDrawerMainContent = () => {
   renderLog('EditTaskGroupDrawerMainContent');  // Set LOG_RENDER_EVENTS to log all renders
 
-  React.useEffect(() => {
-    if (apiCalming('personListRetrieve', 30000)) {
-      PersonActions.personListRetrieve();
-    }
-  }, []);
-
   return (
     <EditTaskGroupDrawerMainContentWrapper>
       <AddTaskGroupWrapper>

diff --git a/src/js/config-template.js b/src/js/config-template.js
@@ -51,9 +51,10 @@ module.exports = {
   LOG_ONLY_FIRST_RENDER_EVENTS: false,
   LOG_HTTP_REQUESTS: false,
   LOG_ROUTING: false,
-  LOG_SIGNIN_STEPS: false,  // oAuthLog function prints to console
+  LOG_SIGNIN_STEPS: false,          // oAuthLog function prints to console
   LOG_CORDOVA_OFFSETS: false,
-  SHOW_CORDOVA_URL_FIELD: false,  // Only needed for debugging in Cordova
+  SHOW_CORDOVA_URL_FIELD: false,    // Only needed for debugging in Cordova
+  ENABLE_REACT_QUERY_TOOLS: false,  // Show ReactQueryDevtools icon/console
 
   // Use 1 or 0 as opposed to true or false
   test: {