@iapps/ng-dhis2-ui 1.2.68 → 1.2.71

package/fesm2022/iapps-ng-dhis2-ui.mjs

@@ -3305,7 +3305,7 @@ const OrgUnitSelector = ({ hide, setHide, selectedOrgUnit, setSelectedOrgUnit, s
 const FilterToolbar = ({ orgUnitLabel, selectedOrgUnit, setSelectedOrgUnit, setOrgUnitState, defaultOrgUnit, setHide, startDateState, setStartDateState, endDateState, setEndDateState, visibleFilters, dateStates, inputValues, setInputValues, handleInputChange, handleInputChangeForSelectField, handleDateSelect, prevValue, setPrevValue, showAllFilters, setShowAllFilters, handleSearch, setTempStartDateState, setTempEndDateState, setTempOrgUnitState, tempStartDateState, tempEndDateState, tempOrgUnitState, dataQueryFiltersState, setDataQueryFiltersState, SetOrgUnitModalVisible, showEnrollmentDates, }) => (React__default.createElement(DataTableToolbar, { className: "table-top-toolbar" },
     React__default.createElement("div", { style: {
             display: 'flex',
-            flexDirection: 'column',
+            // flexDirection: 'column',
             gap: '10px',
             flexWrap: 'wrap',
         } },
@@ -3339,20 +3339,14 @@ const FilterToolbar = ({ orgUnitLabel, selectedOrgUnit, setSelectedOrgUnit, setO
                         if (selectedDate.calendarDateString === null) {
                             setEndDateState(selectedDate.calendarDateString);
                         }
-                    } }))),
-            React__default.createElement(Button$1, { onClick: handleSearch }, "Search"),
-            React__default.createElement(Button$1, { onClick: () => setShowAllFilters(!showAllFilters) }, showAllFilters ? 'Less Filters' : 'More Filters')),
-        visibleFilters?.length > 0 && (React__default.createElement("div", { style: {
-                display: 'flex',
-                alignItems: 'center',
-                gap: '10px',
-                flexWrap: 'wrap',
-            } }, (visibleFilters ?? []).map(({ label, key, valueType, options }) => {
+                    } })))),
+        (visibleFilters ?? []).map(({ label, key, valueType, options }) => {
             if (valueType === 'DATE') {
                 return (React__default.createElement(CalendarInput, { key: key, label: `${label}:`, calendar: "gregory", locale: "en-GB", timeZone: "Africa/Dar_es_Salaam", className: "custom-input", clearable: !!dateStates[key], date: dateStates[key], onDateSelect: (selectedDate) => {
                         handleDateSelect(key, selectedDate);
                         const filteredFilters = dataQueryFiltersState.filter((f) => f.attribute !== key);
-                        if (selectedDate === null) {
+                        if (selectedDate.calendarDateString === null) {
+                            console.log('selectedDate', selectedDate);
                             setDataQueryFiltersState(filteredFilters);
                         }
                     } }));
@@ -3387,164 +3381,15 @@ const FilterToolbar = ({ orgUnitLabel, selectedOrgUnit, setSelectedOrgUnit, setO
                         setPrevValue(currentValue);
                     }
                 } }));
-        })))))
-// <DataTableToolbar className="table-top-toolbar">
-//   <div
-//     style={{
-//       display: 'flex',
-//       alignItems: 'center',
-//       gap: '10px',
-//       flexWrap: 'wrap',
-//     }}
-//   >
-//     <InputField
-//       key="location"
-//       label={orgUnitLabel ? orgUnitLabel : 'registering unit:'}
-//       value={selectedOrgUnit}
-//       onFocus={() => setHide(false)}
-//       className="custom-input"
-//       clearable
-//       onChange={(event: { value: string }) => {
-//         setSelectedOrgUnit(event.value);
-//         setOrgUnitState(defaultOrgUnit);
-//       }}
-//     />
-//     <CalendarInput
-//       label="Start date:"
-//       calendar="gregory"
-//       locale="en-GB"
-//       timeZone="Africa/Dar_es_Salaam"
-//       className="custom-input"
-//       clearable={!!tempStartDateState}
-//       date={tempStartDateState}
-//       onDateSelect={(selectedDate: any) => {
-//         // if (!(selectedDate.calendarDateString === null)) {
-//         setTempStartDateState(selectedDate.calendarDateString);
-//         //}
-//         if (selectedDate.calendarDateString === null) {
-//           setStartDateState(selectedDate.calendarDateString);
-//         }
-//       }}
-//     />
-//     <CalendarInput
-//       label="End date:"
-//       calendar="gregory"
-//       locale="en-GB"
-//       timeZone="Africa/Dar_es_Salaam"
-//       className="custom-input"
-//       clearable={!!tempEndDateState}
-//       date={tempEndDateState}
-//       onDateSelect={(selectedDate: any) => {
-//         // if (!(selectedDate.calendarDateString === null)) {
-//         setTempEndDateState(selectedDate.calendarDateString);
-//         //}
-//         if (selectedDate.calendarDateString === null) {
-//           setEndDateState(selectedDate.calendarDateString);
-//         }
-//       }}
-//     />
-//     <Button onClick={() => handleSearch()}>Search</Button>
-//     <Button onClick={() => setShowAllFilters(!showAllFilters)}>
-//       {showAllFilters ? 'Less Filters' : 'More Filters'}
-//     </Button>
-//     {(visibleFilters ?? []).map(({ label, key, valueType, options }: any) => {
-//       if (valueType === 'DATE') {
-//         return (
-//           <CalendarInput
-//             key={key}
-//             label={`${label}:`}
-//             calendar="gregory"
-//             locale="en-GB"
-//             timeZone="Africa/Dar_es_Salaam"
-//             className="custom-input"
-//             clearable={!!dateStates[key]}
-//             date={dateStates[key]}
-//             onDateSelect={(selectedDate: any) => {
-//               handleDateSelect(key, selectedDate);
-//               const filteredFilters = dataQueryFiltersState.filter(
-//                 (f: { attribute: any }) => f.attribute !== key
-//               );
-//               if (selectedDate === null) {
-//                 setDataQueryFiltersState(filteredFilters);
-//               }
-//             }}
-//           />
-//         );
-//       }
-//       // const filteredFilters = prevFilters.filter((f) => f.attribute !== key);
-//       if (options && options.options.length > 0) {
-//         return (
-//           <SingleSelectField
-//             key={key}
-//             label={`${label}:`}
-//             selected={inputValues[key] || ''}
-//             className="custom-select-input"
-//             clearable
-//             onChange={({ selected }: { selected: string }) => {
-//               setInputValues((prevValues: any) => ({
-//                 ...prevValues,
-//                 [key]: selected ?? '',
-//               }));
-//               handleInputChangeForSelectField(key, selected ?? '');
-//               const filteredFilters = dataQueryFiltersState.filter(
-//                 (f: { attribute: any }) => f.attribute !== key
-//               );
-//               if (selected === '') {
-//                 setDataQueryFiltersState(filteredFilters);
-//               }
-//             }}
-//           >
-//             {(options.options ?? []).map((opt: any) => (
-//               <SingleSelectOption
-//                 key={opt.id}
-//                 label={opt.name}
-//                 value={opt.code}
-//               />
-//             ))}
-//           </SingleSelectField>
-//         );
-//       }
-//       return (
-//         <InputField
-//           key={key}
-//           label={`${label}:`}
-//           className="custom-input"
-//           value={inputValues[key] || ''}
-//           clearable
-//           onChange={(e: any) => {
-//             const currentValue =
-//               'target' in e ? e.target.value : e.value ?? '';
-//             setInputValues((prevValues: any) => ({
-//               ...prevValues,
-//               [key]: currentValue,
-//             }));
-//             // if (currentValue === '') {
-//             //   handleInputChange(key, '');
-//             // }
-//             const filteredFilters = dataQueryFiltersState.filter(
-//               (f: { attribute: any }) => f.attribute !== key
-//             );
-//             if (currentValue === '') {
-//               setDataQueryFiltersState(filteredFilters);
-//             }
-//           }}
-//           onBlur={(e: any) => {
-//             const currentValue =
-//               'target' in e ? e.target.value : e.value ?? '';
-//             if (currentValue !== '' && currentValue !== prevValue) {
-//               handleInputChange(key, currentValue);
-//               setPrevValue(currentValue);
-//             }
-//           }}
-//         />
-//       );
-//     })}
-//     <div>
-//       {/* <p>hello</p> */}
-//     </div>
-//   </div>
-// </DataTableToolbar>
-);
+        }),
+        React__default.createElement("div", { style: {
+                display: 'flex',
+                // alignItems: 'center',
+                gap: '10px',
+                // flexWrap: 'wrap',
+            } },
+            React__default.createElement(Button$1, { onClick: handleSearch }, "Search"),
+            React__default.createElement(Button$1, { onClick: () => setShowAllFilters(!showAllFilters) }, showAllFilters ? 'Less Filters' : 'More Filters')))));
 
 // export const TableHeader = ({
 //   columns,
@@ -4174,6 +4019,7 @@ class LineListTableComponent extends ReactWrapperModule {
     constructor() {
         super(...arguments);
         this.actionOptionOrientation = 'DROPDOWN';
+        this.dataQueryFilters = [];
         this.isButtonLoading = false;
         this.filterRootOrgUnit = false;
         this.showFilters = false;