diff --git a/src/components/sectionList/filters/DynamicFilters.tsx b/src/components/sectionList/filters/DynamicFilters.tsx index c668feb5..7d9e955e 100644 --- a/src/components/sectionList/filters/DynamicFilters.tsx +++ b/src/components/sectionList/filters/DynamicFilters.tsx @@ -7,6 +7,8 @@ import { DomainTypeSelectionFilter, ValueTypeSelectionFilter, PublicAccessFilter, + DataElementFilter, + DataElementGroupFilter, } from './filterSelectors' import { useFilterKeys } from './useFilterKeys' @@ -15,6 +17,8 @@ type FilterKeyToComponentMap = Partial> const filterKeyToComponentMap: FilterKeyToComponentMap = { categoryCombo: CategoryComboFilter, dataSet: DataSetFilter, + dataElement: DataElementFilter, + dataElementGroup: DataElementGroupFilter, domainType: DomainTypeSelectionFilter, valueType: ValueTypeSelectionFilter, aggregationType: AggregationTypeFilter, diff --git a/src/components/sectionList/filters/filterSelectors/DataElementFilter.tsx b/src/components/sectionList/filters/filterSelectors/DataElementFilter.tsx new file mode 100644 index 00000000..0015f20e --- /dev/null +++ b/src/components/sectionList/filters/filterSelectors/DataElementFilter.tsx @@ -0,0 +1,24 @@ +import i18n from '@dhis2/d2-i18n' +import React from 'react' +import { useSectionListFilter } from '../../../../lib' +import { createFilterDataQuery } from './createFilterDataQuery' +import { ModelFilterSelect } from './ModelFilter' + +const query = createFilterDataQuery('dataElements') + +export const DataElementFilter = () => { + const [filter, setFilter] = useSectionListFilter('dataElement') + + const selected = filter?.[0] + + return ( + + setFilter(selected ? [selected] : undefined) + } + /> + ) +} diff --git a/src/components/sectionList/filters/filterSelectors/DataElementGroupFilter.tsx b/src/components/sectionList/filters/filterSelectors/DataElementGroupFilter.tsx new file mode 100644 index 00000000..13aaed82 --- /dev/null +++ b/src/components/sectionList/filters/filterSelectors/DataElementGroupFilter.tsx @@ -0,0 +1,24 @@ +import i18n from '@dhis2/d2-i18n' +import React from 'react' +import { useSectionListFilter } from '../../../../lib' +import { createFilterDataQuery } from './createFilterDataQuery' +import { ModelFilterSelect } from './ModelFilter' + +const query = createFilterDataQuery('dataElementGroups') + +export const DataElementGroupFilter = () => { + const [filter, setFilter] = useSectionListFilter('dataElementGroup') + + const selected = filter?.[0] + + return ( + + setFilter(selected ? [selected] : undefined) + } + /> + ) +} diff --git a/src/components/sectionList/filters/filterSelectors/index.ts b/src/components/sectionList/filters/filterSelectors/index.ts index 55442aca..e67dffd7 100644 --- a/src/components/sectionList/filters/filterSelectors/index.ts +++ b/src/components/sectionList/filters/filterSelectors/index.ts @@ -4,3 +4,5 @@ export * from './CategoryComboFilter' export * from './IdentifiableFilter' export * from './ConstantSelectionFilter' export * from './PublicAccessFilter' +export * from './DataElementFilter' +export * from './DataElementGroupFilter' diff --git a/src/lib/sectionList/filters/filterConfig.tsx b/src/lib/sectionList/filters/filterConfig.tsx index f850ce1a..85b482e5 100644 --- a/src/lib/sectionList/filters/filterConfig.tsx +++ b/src/lib/sectionList/filters/filterConfig.tsx @@ -13,6 +13,8 @@ export const filterParamsSchema = z [IDENTIFIABLE_FILTER_KEY]: z.string(), aggregationType: z.array(z.nativeEnum(DataElement.aggregationType)), categoryCombo: zodArrayIds, + dataElement: zodArrayIds, + dataElementGroup: zodArrayIds, dataSet: zodArrayIds, domainType: z.array(z.nativeEnum(DataElement.domainType)), publicAccess: z.array( @@ -29,6 +31,8 @@ export const filterQueryParamType = { aggregationType: CustomDelimitedArrayParam, domainType: CustomDelimitedArrayParam, valueType: CustomDelimitedArrayParam, + dataElement: CustomDelimitedArrayParam, + dataElementGroup: CustomDelimitedArrayParam, dataSet: CustomDelimitedArrayParam, categoryCombo: CustomDelimitedArrayParam, publicAccess: CustomDelimitedArrayParam, diff --git a/src/lib/sectionList/filters/parseFiltersToQueryParams.ts b/src/lib/sectionList/filters/parseFiltersToQueryParams.ts index 0fcb7e84..cb23357d 100644 --- a/src/lib/sectionList/filters/parseFiltersToQueryParams.ts +++ b/src/lib/sectionList/filters/parseFiltersToQueryParams.ts @@ -35,6 +35,8 @@ const filterToQueryParamMap: FilterToQueryParamsMap = { section.name === SchemaName.dataElement ? inFilter('dataSetElements.dataSet.id', value) : defaultFilter('dataSet', value), + dataElement: (value) => inFilter('dataElements.id', value), + dataElementGroup: (value) => inFilter('dataElementGroups.id', value), publicAccess: (value) => inFilter('sharing.public', value), } diff --git a/src/lib/sectionList/listViews/sectionListViewsConfig.ts b/src/lib/sectionList/listViews/sectionListViewsConfig.ts index c83141c5..9ae3a425 100644 --- a/src/lib/sectionList/listViews/sectionListViewsConfig.ts +++ b/src/lib/sectionList/listViews/sectionListViewsConfig.ts @@ -1,4 +1,5 @@ import i18n from '@dhis2/d2-i18n' +import { SectionName } from '../../constants' import type { ConfigurableFilterKey } from '../filters' export interface ModelPropertyDescriptor { @@ -97,4 +98,26 @@ export const modelListViewsConfig = { default: ['domainType', 'valueType', 'dataSet', 'categoryCombo'], }, }, -} satisfies SectionListViewConfig + dataElementGroup: { + columns: {}, + filters: { + default: [ + { + label: i18n.t('Data element'), + filterKey: 'dataElement', + }, + ], + }, + }, + dataElementGroupSet: { + columns: {}, + filters: { + default: [ + { + label: i18n.t('Data element group'), + filterKey: 'dataElementGroup', + }, + ], + }, + }, +} satisfies SectionListViewConfig diff --git a/src/pages/DefaultSectionList.tsx b/src/pages/DefaultSectionList.tsx index fcfdfa62..67ae91d5 100644 --- a/src/pages/DefaultSectionList.tsx +++ b/src/pages/DefaultSectionList.tsx @@ -34,7 +34,8 @@ export const DefaultSectionList = () => { }, }, } - const { error, data } = useQuery({ + + const { error, data, refetch } = useQuery({ queryKey: [query], queryFn: ({ queryKey: [query], signal }) => { return engine.query(query, { signal }) as Promise @@ -48,6 +49,7 @@ export const DefaultSectionList = () => { error={error as FetchError | undefined} data={modelList} pager={data?.result.pager} + refetch={refetch} /> ) diff --git a/src/pages/dataElements/List.tsx b/src/pages/dataElements/List.tsx index 51c39765..e03292f8 100644 --- a/src/pages/dataElements/List.tsx +++ b/src/pages/dataElements/List.tsx @@ -1,64 +1,3 @@ -import { useDataQuery } from '@dhis2/app-runtime' -import { SharingDialog } from '@dhis2/ui' -import React, { useEffect } from 'react' -import { SectionListWrapper } from '../../components' -import { useModelListView } from '../../components/sectionList/listView' -import { - useSchemaFromHandle, - useParamsForDataQuery, - DEFAULT_FIELD_FILTERS, - DefaultFields, -} from '../../lib/' -import { getFieldFilter } from '../../lib/models/path' -import { Query, WrapQueryResponse } from '../../types' -import { DataElement, ModelCollectionResponse } from '../../types/models' +import { DefaultSectionList } from '../DefaultSectionList' -type FilteredDataElement = Pick & - Partial - -type DataElements = ModelCollectionResponse - -type DataElementsResponse = WrapQueryResponse - -const query: Query = { - result: { - resource: 'dataElements', - params: (params) => params, - }, -} - -export const Component = () => { - const { columns, query: listViewQuery } = useModelListView() - const initialParams = useParamsForDataQuery() - const schema = useSchemaFromHandle() - const { refetch, error, data } = useDataQuery( - query, - // refetched on mount by effect below - { lazy: true } - ) - - useEffect(() => { - // wait to fetch until selected-columns are loaded - // so we dont fetch data multiple times - if (listViewQuery.isLoading) { - return - } - refetch({ - ...initialParams, - fields: columns - .map((column) => getFieldFilter(schema, column.path)) - .concat(DEFAULT_FIELD_FILTERS), - }) - }, [refetch, initialParams, columns, listViewQuery.isLoading, schema]) - - return ( -
- -
- ) -} +export const Component = DefaultSectionList