Skip to content

Commit

Permalink
fix(list): use translated values for name and shortName (#438)
Browse files Browse the repository at this point in the history 
* fix: use displayName instead of name of lists

* fix(tests): fix tests to use displayName

* fix: identifiable width after UI upgrade

* fix: add missing indicatorType description

* fix(list): remove shortName as default - add translated to models

* fix(manageListView): hide filter tab if no filters, sort available
  • Loading branch information
@Birkbjo
Birkbjo authored Dec 3, 2024
1 parent 177220f commit 19a763d
Show file tree
Hide file tree
Showing 7 changed files with 105 additions and 46 deletions.
2 changes: 1 addition & 1 deletion src/components/sectionList/filters/filterSelectors/Filters.module.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
}

.identifiableSelectionFilter {
width: 320px;
width: 320px !important;
}

.filterWrapper {
Expand Down
33 changes: 19 additions & 14 deletions src/components/sectionList/listView/ManageListView.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,7 @@ export const ManageListView = ({
filtersConfig,
}
}, [section.name])
const hasAvailableFilters = filtersConfig.available.length > 0

const handleSave = async (values: FormValues) => {
const isDefault = (arr: string[], def: string[]) =>
Expand Down Expand Up @@ -133,12 +134,16 @@ export const ManageListView = ({
>
{i18n.t('Columns')}
</Tab>
<Tab
selected={selectedTab === 'filters'}
onClick={(_, e) => handleChangeTab('filters', e)}
>
{i18n.t('Filters')}
</Tab>
{hasAvailableFilters && (
<Tab
selected={selectedTab === 'filters'}
onClick={(_, e) =>
handleChangeTab('filters', e)
}
>
{i18n.t('Filters')}
</Tab>
)}
</TabBar>

<TabContent show={selectedTab === 'columns'}>
Expand All @@ -148,12 +153,12 @@ export const ManageListView = ({
selectedLabel={i18n.t('Selected columns')}
loading={query.isLoading}
defaultOptions={defaultColumns}
availableOptions={columnsConfig.available.map(
(c) => ({
availableOptions={columnsConfig.available
.map((c) => ({
label: c.label,
value: c.path,
})
)}
}))
.sort((a, b) => a.label.localeCompare(b.label))}
/>
</TabContent>
<TabContent show={selectedTab === 'filters'}>
Expand All @@ -163,12 +168,12 @@ export const ManageListView = ({
selectedLabel={i18n.t('Selected filters')}
loading={query.isLoading}
defaultOptions={defaultFilters}
availableOptions={filtersConfig.available.map(
(f) => ({
availableOptions={filtersConfig.available
.map((f) => ({
label: f.label,
value: f.filterKey,
})
)}
}))
.sort((a, b) => a.label.localeCompare(b.label))}
/>
</TabContent>
{submitError && (
Expand Down
2 changes: 2 additions & 0 deletions src/lib/constants/translatedModelProperties.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import i18n from '@dhis2/d2-i18n'

const TRANSLATED_PROPERTY: Record<string, string> = {
aggregationType: i18n.t('Aggregation type'),
category: i18n.t('Category'),
categoryCombo: i18n.t('Category combination'),
categoryOption: i18n.t('Category option'),
code: i18n.t('Code'),
Expand All @@ -11,6 +12,7 @@ const TRANSLATED_PROPERTY: Record<string, string> = {
formName: i18n.t('Form name'),
href: i18n.t('API URL'),
id: i18n.t('Id'),
indicatorType: i18n.t('Indicator type'),
lastUpdatedBy: i18n.t('Last updated by'),
created: i18n.t('Created'),
domainType: i18n.t('Domain type'),
Expand Down
85 changes: 58 additions & 27 deletions src/lib/sectionList/listViews/sectionListViewsConfig.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,23 +46,31 @@ const DESCRIPTORS = {
label: i18n.t('Public access'),
filterKey: 'publicAccess',
},
name: {
path: 'displayName',
label: i18n.t('Name'),
},
shortName: {
path: 'displayShortName',
label: i18n.t('Short name'),
},
} satisfies Record<string, Descriptor>

// This is the default views, and can be overriden per section in modelListViewsConfig below
export const defaultModelViewConfig = {
columns: {
available: [
'name',
'shortName',
DESCRIPTORS.name,
'code',
'created',
'createdBy',
'href',
'id',
'lastUpdatedBy',
'lastUpdated',
DESCRIPTORS.publicAccess,
],
default: ['name', DESCRIPTORS.publicAccess, 'lastUpdated'],
default: [DESCRIPTORS.name, DESCRIPTORS.publicAccess, 'lastUpdated'],
},
filters: {
available: [DESCRIPTORS.publicAccess],
Expand All @@ -73,6 +81,11 @@ export const defaultModelViewConfig = {
},
} satisfies ViewConfig

const defaultAvailableColumnsNoSharing =
defaultModelViewConfig.columns.available.filter(
(col) => col !== DESCRIPTORS.publicAccess
)

/* this is the default views (eg. which columns and filters) to show in the List-page for each section
Note: by default, the available columns are merged with columnsDefault.available above.
If it's needed to override this for a section, set overrideDefaultAvailable to true
Expand All @@ -83,9 +96,9 @@ export const defaultModelViewConfig = {
export const modelListViewsConfig = {
dataElement: {
columns: {
available: ['zeroIsSignificant'],
available: [DESCRIPTORS.shortName, 'zeroIsSignificant'],
default: [
'name',
DESCRIPTORS.name,
{ label: i18n.t('Domain type'), path: 'domainType' },
{ label: i18n.t('Value type'), path: 'valueType' },
'categoryCombo',
Expand All @@ -98,24 +111,37 @@ export const modelListViewsConfig = {
default: ['domainType', 'valueType', 'dataSet', 'categoryCombo'],
},
},
dataElementGroup: {
columns: {
available: [DESCRIPTORS.shortName],
},
filters: {},
},
dataElementGroupSet: {
columns: {
available: [DESCRIPTORS.shortName],
},
filters: {},
},
dataSet: {
columns: {
default: [
'name',
DESCRIPTORS.name,
{ label: i18n.t('Form type'), path: 'formType' },
{ label: i18n.t('Period type'), path: 'periodType' },
'lastUpdated',
DESCRIPTORS.publicAccess,
],
available: [DESCRIPTORS.shortName],
},
filters: {
default: ['formType'],
},
},
organisationUnit: {
columns: {
available: [],
default: ['name', 'id', 'code', 'lastUpdated'],
available: [DESCRIPTORS.shortName],
default: [DESCRIPTORS.name, 'id', 'code', 'lastUpdated'],
},
filters: {
default: [],
Expand All @@ -124,15 +150,20 @@ export const modelListViewsConfig = {
categoryOption: {
columns: {
available: [
'name',
DESCRIPTORS.name,
DESCRIPTORS.shortName,
'code',
'created',
'createdBy',
'href',
'id',
DESCRIPTORS.publicAccess,
],
default: ['name', DESCRIPTORS.publicAccess, 'lastUpdated'],
default: [
DESCRIPTORS.name,
DESCRIPTORS.publicAccess,
'lastUpdated',
],
overrideDefaultAvailable: true,
},
filters: {
Expand All @@ -142,11 +173,12 @@ export const modelListViewsConfig = {
category: {
columns: {
default: [
'name',
DESCRIPTORS.name,
'dataDimensionType',
DESCRIPTORS.publicAccess,
'lastUpdated',
],
available: [DESCRIPTORS.shortName],
},
filters: {
default: ['dataDimensionType', 'categoryCombo'],
Expand All @@ -155,11 +187,12 @@ export const modelListViewsConfig = {
indicator: {
columns: {
default: [
'name',
{ label: i18n.t('Indicator Type'), path: 'indicatorType' },
DESCRIPTORS.name,
'indicatorType',
DESCRIPTORS.publicAccess,
'lastUpdated',
],
available: [DESCRIPTORS.shortName],
},
filters: {
default: ['indicatorType'],
Expand All @@ -168,31 +201,28 @@ export const modelListViewsConfig = {
indicatorType: {
columns: {
default: [
'name',
DESCRIPTORS.name,
{ label: i18n.t('Factor'), path: 'factor' },
'lastUpdated',
],
available: [
'code',
'created',
'createdBy',
'href',
'id',
'lastUpdatedBy',
],
available: defaultAvailableColumnsNoSharing,
overrideDefaultAvailable: true,
},
filters: {
default: [],
available: [],
overrideDefaultAvailable: true,
},
},
categoryOptionGroupSet: {
columns: {
default: [
'name',
DESCRIPTORS.name,
'dataDimensionType',
DESCRIPTORS.publicAccess,
'lastUpdated',
],
available: [DESCRIPTORS.shortName],
},
filters: {
default: ['dataDimensionType'],
Expand All @@ -201,11 +231,12 @@ export const modelListViewsConfig = {
categoryOptionGroup: {
columns: {
default: [
'name',
DESCRIPTORS.name,
'dataDimensionType',
DESCRIPTORS.publicAccess,
'lastUpdated',
],
available: [DESCRIPTORS.shortName],
},
filters: {
default: ['dataDimensionType'],
Expand All @@ -214,7 +245,7 @@ export const modelListViewsConfig = {
categoryCombo: {
columns: {
default: [
'name',
DESCRIPTORS.name,
'dataDimensionType',
DESCRIPTORS.publicAccess,
'lastUpdated',
Expand All @@ -227,8 +258,8 @@ export const modelListViewsConfig = {
},
categoryOptionCombo: {
columns: {
default: ['name', 'code', 'lastUpdated'],
available: ['categoryCombo', 'ignoreApproval'],
default: [DESCRIPTORS.name, 'code', 'lastUpdated'],
available: defaultAvailableColumnsNoSharing,
// categoryOptionCombo does not have publicAccess
overrideDefaultAvailable: true,
},
Expand Down
8 changes: 4 additions & 4 deletions src/pages/dataElements/List.spec.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -172,7 +172,7 @@ describe('Data Elements List', () => {
dataElements: [
{
...FIRST_FILTERED_DATA_ELEMENT,
name: 'first page result',
displayName: 'first page result',
},
],
}
Expand All @@ -186,7 +186,7 @@ describe('Data Elements List', () => {
dataElements: [
{
...FIRST_FILTERED_DATA_ELEMENT,
name: 'second page result',
displayName: 'second page result',
},
],
}
Expand Down Expand Up @@ -218,7 +218,7 @@ describe('Data Elements List', () => {
).toHaveAttribute('disabled')
})
// next page
it('should allowing going to Next page', async () => {
it('should allow going to Next page', async () => {
const user = userEvent.setup()
const { getByTestId, findByText, queryByText } =
await renderWithPager()
Expand Down Expand Up @@ -270,7 +270,7 @@ describe('Data Elements List', () => {
result: [
{
...FIRST_FILTERED_DATA_ELEMENT,
name: 'last page result',
displayName: 'last page result',
},
],
},
Expand Down
Loading

0 comments on commit 19a763d

Please sign in to comment.