(refactor): remove repeated code

openmrs · Jun 27, 2024 · a7cfdcc · a7cfdcc
1 parent 17a7ceb
commit a7cfdcc
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 43 deletions.
diff --git a/src/components/interactive-builder/add-question.modal.tsx b/src/components/interactive-builder/add-question.modal.tsx
@@ -73,6 +73,21 @@ interface RequiredLabelProps {
   t: TFunction;
 }
 
+export const updateDatePickerType = (concept: Concept): DatePickerType | null => {
+  const conceptDataType = concept.datatype.name;
+  switch (conceptDataType) {
+    case 'Datetime':
+      return 'both';
+    case 'Date':
+      return 'calendar';
+    case 'Time':
+      return 'timer';
+    default:
+      console.warn(`Unsupported datatype for date fields: ${conceptDataType}`);
+      return null;
+  }
+};
+
 const AddQuestionModal: React.FC<AddQuestionModalProps> = ({
   closeModal,
   onSchemaChange,
@@ -139,25 +154,9 @@ const AddQuestionModal: React.FC<AddQuestionModalProps> = ({
 
   const handleConceptChange = (event: React.ChangeEvent<HTMLInputElement>) => setConceptToLookup(event.target.value);
 
-  const updateDatePickerType = (concept: Concept) => {
-    const conceptDataType = concept.datatype.name;
-    switch (conceptDataType) {
-      case 'Datetime':
-        setDatePickerType('both');
-        break;
-      case 'Date':
-        setDatePickerType('calendar');
-        break;
-      case 'Time':
-        setDatePickerType('timer');
-        break;
-      default:
-        break;
-    }
-  };
-
   const handleConceptSelect = (concept: Concept) => {
-    updateDatePickerType(concept);
+    const updatedDatePickerType = updateDatePickerType(concept);
+    if (updatedDatePickerType) setDatePickerType(updatedDatePickerType);
     setConceptToLookup('');
     setSelectedConcept(concept);
     setAnswers(
@@ -213,7 +212,8 @@ const AddQuestionModal: React.FC<AddQuestionModalProps> = ({
         type: questionType,
         required: isQuestionRequired,
         id: questionId ?? computedQuestionId,
-        ...((renderingType === 'date' || renderingType === 'datetime') && { datePickerFormat: datePickerType }),
+        ...((renderingType === 'date' || renderingType === 'datetime') &&
+          datePickerType && { datePickerFormat: datePickerType }),
         questionOptions: {
           rendering: renderingType,
           concept: selectedConcept?.uuid ? selectedConcept?.uuid : '',

diff --git a/src/components/interactive-builder/edit-question.modal.tsx b/src/components/interactive-builder/edit-question.modal.tsx
@@ -53,6 +53,7 @@ import { usePersonAttributeName } from '../../hooks/usePersonAttributeName';
 import { usePersonAttributeTypes } from '../../hooks/usePersonAttributeTypes';
 import { usePrograms, useProgramWorkStates } from '../../hooks/useProgramStates';
 import styles from './question-modal.scss';
+import { updateDatePickerType } from './add-question.modal';
 
 interface EditQuestionModalProps {
   closeModal: () => void;
@@ -85,12 +86,6 @@ const EditQuestionModal: React.FC<EditQuestionModalProps> = ({
   const { t } = useTranslation();
   const { fieldTypes, questionTypes } = useConfig<ConfigObject>();
 
-  const datePickerTypeOptions: DatePickerTypeOptions = {
-    datetime: [{ value: 'both', label: t('calendarAndTimer', 'Calendar and timer'), defaultChecked: true }],
-    date: [{ value: 'calendar', label: t('calendarOnly', 'Calendar only'), defaultChecked: false }],
-    time: [{ value: 'timer', label: t('timerOnly', 'Timer only'), defaultChecked: false }],
-  };
-
   const [answersChanged, setAnswersChanged] = useState(false);
   const [answersFromConcept, setAnswersFromConcept] = useState<
     Array<{
@@ -152,6 +147,12 @@ const EditQuestionModal: React.FC<EditQuestionModalProps> = ({
   const hasConceptChanged = selectedConcept && questionToEdit?.questionOptions?.concept !== selectedConcept?.uuid;
   const [addInlineDate, setAddInlineDate] = useState(false);
 
+  const datePickerTypeOptions: DatePickerTypeOptions = {
+    datetime: [{ value: 'both', label: t('calendarAndTimer', 'Calendar and timer'), defaultChecked: true }],
+    date: [{ value: 'calendar', label: t('calendarOnly', 'Calendar only'), defaultChecked: false }],
+    time: [{ value: 'timer', label: t('timerOnly', 'Timer only'), defaultChecked: false }],
+  };
+
   const debouncedSearch = useMemo(() => {
     return debounce((searchTerm: string) => setConceptToLookup(searchTerm), 500) as (searchTerm: string) => void;
   }, []);
@@ -172,25 +173,9 @@ const EditQuestionModal: React.FC<EditQuestionModalProps> = ({
     setSelectedPersonAttributeType(attributeType);
   };
 
-  const updateDatePickerType = (concept: Concept) => {
-    const conceptDataType = concept.datatype.name;
-    switch (conceptDataType) {
-      case 'Datetime':
-        setDatePickerType('both');
-        break;
-      case 'Date':
-        setDatePickerType('calendar');
-        break;
-      case 'Time':
-        setDatePickerType('timer');
-        break;
-      default:
-        break;
-    }
-  };
-
   const handleConceptSelect = (concept: Concept) => {
-    updateDatePickerType(concept);
+    const datePickerType = updateDatePickerType(concept);
+    if (datePickerType) setDatePickerType(datePickerType);
     setConceptToLookup('');
     setSelectedAnswers([]);
     setSelectedConcept(concept);