feat(templates): option to use person full name in S-140

sws2apps · Feb 21, 2023 · 7e48e10 · 7e48e10
1 parent bfc6ef3
commit 7e48e10
Show file tree

Hide file tree

Showing 16 changed files with 252 additions and 161 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/config/firebase.js b/src/config/firebase.js
@@ -7,15 +7,18 @@ const firebaseConfig = {
   projectId: import.meta.env.VITE_FIREBASE_PROJECTID,
 };
 
-const firebaseAnalyticsConfig = {
-  apiKey: import.meta.env.VITE_FIREBASE_ANALYTICS_APIKEY,
-  authDomain: import.meta.env.VITE_FIREBASE_ANALYTICS_AUTHDOMAIN,
-  projectId: import.meta.env.VITE_FIREBASE_ANALYTICS_PROJECTID,
-  appId: import.meta.env.VITE_FIREBASE_ANALYTICS_APPID,
-  measurementId: import.meta.env.VITE_FIREBASE_ANALYTICS_MEASUREMENTID,
-};
-
 initializeApp(firebaseConfig);
 
-const appAnalytics = initializeApp(firebaseAnalyticsConfig, 'appAnalytics');
-getAnalytics(appAnalytics);
+const isDev = process.env.NODE_ENV === 'development';
+if (!isDev) {
+  const firebaseAnalyticsConfig = {
+    apiKey: import.meta.env.VITE_FIREBASE_ANALYTICS_APIKEY,
+    authDomain: import.meta.env.VITE_FIREBASE_ANALYTICS_AUTHDOMAIN,
+    projectId: import.meta.env.VITE_FIREBASE_ANALYTICS_PROJECTID,
+    appId: import.meta.env.VITE_FIREBASE_ANALYTICS_APPID,
+    measurementId: import.meta.env.VITE_FIREBASE_ANALYTICS_MEASUREMENTID,
+  };
+
+  const appAnalytics = initializeApp(firebaseAnalyticsConfig, 'appAnalytics');
+  getAnalytics(appAnalytics);
+}
diff --git a/src/features/schedules/S140AssignedPerson.jsx b/src/features/schedules/S140AssignedPerson.jsx
@@ -1,9 +1,10 @@
+import { Markup } from 'interweave';
 import Typography from '@mui/material/Typography';
 
 const S140AssignedPerson = ({ person }) => {
   return (
     <Typography sx={{ color: 'black', fontSize: '12px', padding: '0 0 0 8px', width: '180px', lineHeight: '20px' }}>
-      {person}
+      <Markup content={person}></Markup>
     </Typography>
   );
 };

diff --git a/src/features/settings/BasicSettings.jsx b/src/features/settings/BasicSettings.jsx
@@ -1,18 +1,15 @@
 import { useEffect, useState } from 'react';
-import { useRecoilState, useSetRecoilState } from 'recoil';
+import { useRecoilState, useRecoilValue } from 'recoil';
 import { useTranslation } from 'react-i18next';
 import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
 import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
 import { TimePicker } from '@mui/x-date-pickers/TimePicker';
 import Box from '@mui/material/Box';
-import Button from '@mui/material/Button';
 import Divider from '@mui/material/Divider';
 import MenuItem from '@mui/material/MenuItem';
-import SaveIcon from '@mui/icons-material/Save';
 import TextField from '@mui/material/TextField';
 import Typography from '@mui/material/Typography';
 import { dbGetAppSettings, dbUpdateAppSettings } from '../../indexedDb/dbAppSettings';
-import { appMessageState, appSeverityState, appSnackOpenState } from '../../states/notification';
 import {
   classCountState,
   congNameState,
@@ -25,82 +22,52 @@ import { generateDisplayName } from '../../utils/person';
 const BasicSettings = () => {
   const { t } = useTranslation('ui');
 
-  const [isErrorCongName, setIsErrorCongName] = useState(false);
-  const [isErrorCongNumber, setIsErrorCongNumber] = useState(false);
-
-  const [congName, setCongName] = useRecoilState(congNameState);
-  const [congNumber, setCongNumber] = useRecoilState(congNumberState);
-  const [meetingDay, setMeetingDay] = useRecoilState(meetingDayState);
   const [classCount, setClassCount] = useRecoilState(classCountState);
+  const [meetingDay, setMeetingDay] = useRecoilState(meetingDayState);
   const [meetingTime, setMeetingTime] = useRecoilState(meetingTimeState);
 
-  const setAppSnackOpen = useSetRecoilState(appSnackOpenState);
-  const setAppSeverity = useSetRecoilState(appSeverityState);
-  const setAppMessage = useSetRecoilState(appMessageState);
+  const congName = useRecoilValue(congNameState);
+  const congNumber = useRecoilValue(congNumberState);
 
-  const [tempCongName, setTempCongName] = useState(congName);
-  const [tempCongNumber, setTempCongNumber] = useState(congNumber);
   const [tempMeetingDay, setTempMeetingDay] = useState(meetingDay);
   const [tempClassCount, setTempClassCount] = useState(classCount);
   const [tempMeetingTime, setTempMeetingTime] = useState(meetingTime);
   const [coName, setCoName] = useState('');
   const [coDisplayName, setCoDisplayName] = useState('');
 
-  const handleCongNameChange = (value) => {
-    if (value) {
-      setIsErrorCongName(false);
-    } else {
-      setIsErrorCongName(true);
-    }
-    setTempCongName(value);
-  };
-
-  const handleCongNumberChange = (value) => {
-    if (value) {
-      setIsErrorCongNumber(false);
-    } else {
-      setIsErrorCongNumber(true);
-    }
-    setTempCongNumber(value);
-  };
-
-  const handleMeetingDayChange = (e) => {
+  const handleMeetingDayChange = async (e) => {
     setTempMeetingDay(e.target.value);
+    await dbUpdateAppSettings({ meeting_day: e.target.value });
+    setMeetingDay(e.target.value);
   };
 
-  const handleClassChange = (e) => {
+  const handleClassChange = async (e) => {
     setTempClassCount(e.target.value);
+    await dbUpdateAppSettings({ class_count: e.target.value });
+    setClassCount(e.target.value);
   };
 
-  const handleMeetingTimeChange = (value) => {
+  const handleMeetingTimeChange = async (value) => {
     setTempMeetingTime(value);
+    await dbUpdateAppSettings({ meeting_time: value });
+    setMeetingTime(value);
   };
 
-  const handleChangeCOName = (value) => {
+  const handleChangeCOName = async (value) => {
     setCoName(value);
-    setCoDisplayName(generateDisplayName(value));
-  };
 
-  const saveAppSettings = async () => {
+    const dispName = generateDisplayName(value);
+    setCoDisplayName(dispName);
+
     const obj = {};
-    obj.cong_name = tempCongName;
-    obj.cong_number = tempCongNumber;
-    obj.class_count = tempClassCount;
-    obj.meeting_day = tempMeetingDay;
-    obj.meeting_time = tempMeetingTime;
-    obj.co_name = coName;
-    obj.co_displayName = coDisplayName;
+    obj.co_name = value;
+    obj.co_displayName = dispName;
     await dbUpdateAppSettings(obj);
+  };
 
-    setCongName(tempCongName);
-    setCongNumber(tempCongNumber);
-    setClassCount(tempClassCount);
-    setMeetingDay(tempMeetingDay);
-    setMeetingTime(tempMeetingTime);
-
-    setAppSnackOpen(true);
-    setAppSeverity('success');
-    setAppMessage(t('saved'));
+  const handleChangeCODispName = async (value) => {
+    setCoDisplayName(value);
+    await dbUpdateAppSettings({ co_displayName: value });
   };
 
   useEffect(() => {
@@ -126,11 +93,8 @@ const BasicSettings = () => {
             size="small"
             autoComplete="off"
             required
-            error={isErrorCongName ? true : false}
-            helperText={isErrorCongName ? t('blankRequired') : null}
             sx={{ width: '320px' }}
-            value={tempCongName}
-            onChange={(e) => handleCongNameChange(e.target.value)}
+            value={congName}
             InputProps={{
               readOnly: true,
             }}
@@ -143,11 +107,8 @@ const BasicSettings = () => {
             size="small"
             autoComplete="off"
             required
-            error={isErrorCongNumber ? true : false}
-            helperText={isErrorCongName ? t('blankRequired') : null}
             sx={{ width: '120px' }}
-            value={tempCongNumber}
-            onChange={(e) => handleCongNumberChange(e.target.value)}
+            value={congNumber}
             InputProps={{
               readOnly: true,
             }}
@@ -224,19 +185,9 @@ const BasicSettings = () => {
             autoComplete="off"
             sx={{ width: '200px' }}
             value={coDisplayName}
-            onChange={(e) => setCoDisplayName(e.target.value)}
+            onChange={(e) => handleChangeCODispName(e.target.value)}
           />
         </Box>
-
-        <Button
-          variant="contained"
-          color="primary"
-          startIcon={<SaveIcon />}
-          onClick={() => saveAppSettings()}
-          sx={{ marginTop: '20px' }}
-        >
-          {t('save')}
-        </Button>
       </Box>
     </Box>
   );

diff --git a/src/features/settings/DataStorage.jsx b/src/features/settings/DataStorage.jsx
@@ -21,7 +21,7 @@ const DataStorage = () => {
   const setIsDeleteDb = useSetRecoilState(isDeleteDbOpenState);
 
   const [isAutoBackup, setIsAutoBackup] = useState(false);
-  const [backupInterval, setBackupInterval] = useState(1);
+  const [backupInterval, setBackupInterval] = useState(5);
 
   const handleAutoBackupChange = async (value) => {
     setIsAutoBackup(value);
@@ -47,7 +47,7 @@ const DataStorage = () => {
     const fillDetails = async () => {
       const settings = await dbGetAppSettings();
       setIsAutoBackup(settings.autoBackup);
-      setBackupInterval(settings.autoBackup_interval || 1);
+      setBackupInterval(settings.autoBackup_interval || 5);
     };
 
     fillDetails();
@@ -72,11 +72,11 @@ const DataStorage = () => {
               label={t('backupIntervalLabel')}
               size="small"
               sx={{ minWidth: '130px' }}
-              defaultValue={1}
+              defaultValue={5}
               value={backupInterval}
               onChange={(e) => handleBackupIntervalChange(e.target.value)}
             >
-              {[1, 5, 15, 30].map((time) => (
+              {[5, 15, 30, 45].map((time) => (
                 <MenuItem key={time} value={time}>
                   {time} min.
                 </MenuItem>

diff --git a/src/features/settings/SourceLangSwitcher.jsx → ...eatures/settings/SourcesFormsSettings.jsx b/src/features/settings/SourceLangSwitcher.jsx → ...eatures/settings/SourcesFormsSettings.jsx
@@ -1,59 +1,54 @@
 import { useState } from 'react';
-import { useRecoilState, useSetRecoilState } from 'recoil';
+import { useRecoilState, useRecoilValue } from 'recoil';
 import { useTranslation } from 'react-i18next';
 import Box from '@mui/material/Box';
-import Button from '@mui/material/Button';
+import Checkbox from '@mui/material/Checkbox';
 import Divider from '@mui/material/Divider';
+import FormControlLabel from '@mui/material/FormControlLabel';
 import LanguageIcon from '@mui/icons-material/Language';
 import Link from '@mui/material/Link';
 import ListItemIcon from '@mui/material/ListItemIcon';
 import ListItemText from '@mui/material/ListItemText';
 import MenuItem from '@mui/material/MenuItem';
-import SaveIcon from '@mui/icons-material/Save';
 import TextField from '@mui/material/TextField';
 import Typography from '@mui/material/Typography';
 import { dbUpdateAppSettings } from '../../indexedDb/dbAppSettings';
-import { appMessageState, appSeverityState, appSnackOpenState } from '../../states/notification';
 import { sourceLangState } from '../../states/main';
 import { LANGUAGE_LIST } from '../../locales/langList';
+import { scheduleUseFullnameState } from '../../states/schedule';
 
-const SourceLangSwitcher = () => {
+const SourcesFormsSettings = () => {
   const { t } = useTranslation('ui');
 
-  const setAppSnackOpen = useSetRecoilState(appSnackOpenState);
-  const setAppSeverity = useSetRecoilState(appSeverityState);
-  const setAppMessage = useSetRecoilState(appMessageState);
-  const [sourceLang, setSourceLang] = useRecoilState(sourceLangState);
+  const [scheduleUseFullname, setScheduleUseFullname] = useRecoilState(scheduleUseFullnameState);
+
+  const sourceLang = useRecoilValue(sourceLangState);
 
   const [tempSourceLang, setTempSourceLang] = useState(sourceLang);
+  const [useFullname, setUseFullname] = useState(scheduleUseFullname);
 
   const listSourceLangs = LANGUAGE_LIST.filter((lang) => lang.isSource === true);
 
-  const handleSourceLangChange = (e) => {
+  const handleSourceLangChange = async (e) => {
     if (e.target.value === 'not_set') return;
     setTempSourceLang(e.target.value);
+    await dbUpdateAppSettings({ source_lang: e.target.value });
   };
 
-  const saveAppSettings = async () => {
-    const obj = {};
-    obj.source_lang = tempSourceLang;
-    await dbUpdateAppSettings(obj);
-
-    setSourceLang(tempSourceLang);
-
-    setAppSnackOpen(true);
-    setAppSeverity('success');
-    setAppMessage(t('saved'));
+  const handleChangeFullnameSwitch = async (value) => {
+    setUseFullname(value);
+    setScheduleUseFullname(value);
+    await dbUpdateAppSettings({ schedule_useFullname: value });
   };
 
   return (
     <Box sx={{ width: '100%' }}>
-      <Typography className={'settingHeader'}>{t('sourceTemplateLang')}</Typography>
+      <Typography className={'settingHeader'}>{t('sourcesFormsSettings')}</Typography>
       <Divider sx={{ borderWidth: '5px' }} />
-      <Box sx={{ padding: '20px 20px' }}>
-        <Typography sx={{ marginBottom: '15px' }}>{t('sourceTemplateLangDesc')}</Typography>
-
+      <Box sx={{ padding: '20px 20px', display: 'flex', flexDirection: 'column', gap: '15px' }}>
         <Box>
+          <Typography sx={{ marginBottom: '15px' }}>{t('sourceTemplateLangDesc')}</Typography>
+
           <TextField
             id="outlined-select-class"
             select
@@ -88,18 +83,15 @@ const SourceLangSwitcher = () => {
           </TextField>
         </Box>
 
-        <Button
-          variant="contained"
-          color="primary"
-          startIcon={<SaveIcon />}
-          onClick={() => saveAppSettings()}
-          sx={{ marginTop: '10px' }}
-        >
-          {t('save')}
-        </Button>
+        <Box>
+          <FormControlLabel
+            control={<Checkbox checked={useFullname} onChange={(e) => handleChangeFullnameSwitch(e.target.checked)} />}
+            label={t('scheduleUseFullname')}
+          />
+        </Box>
       </Box>
     </Box>
   );
 };
 
-export default SourceLangSwitcher;
+export default SourcesFormsSettings;
diff --git a/src/features/settings/index.jsx b/src/features/settings/index.jsx
@@ -2,7 +2,7 @@ export { default as BasicSettings } from './BasicSettings';
 export { default as DataStorage } from './DataStorage';
 export { default as DialogDbDeletion } from './DialogDbDeletion';
 export { default as MyAccount } from './MyAccount';
-export { default as SourceLangSwitcher } from './SourceLangSwitcher';
+export { default as SourcesFormsSettings } from './SourcesFormsSettings';
 export { default as User2FA } from './User2FA';
 export { default as UserFullname } from './UserFullname';
 export { default as UserSessionItem } from './UserSessionItem';

diff --git a/src/features/startup/CongregationCreate.jsx b/src/features/startup/CongregationCreate.jsx
@@ -135,7 +135,19 @@ const CongregationCreate = () => {
   };
 
   useEffect(() => {
-    if (user) setUserTmpFullname(user.displayName || '');
+    if (user) {
+      if (user.displayName !== null) {
+        setUserTmpFullname(user.displayName);
+        return;
+      }
+
+      if (user.displayName === null && user.providerData[0]?.displayName !== null) {
+        setUserTmpFullname(user.providerData[0].displayName);
+        return;
+      }
+
+      setUserTmpFullname('');
+    }
   }, [user]);
 
   useEffect(() => {