Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add sort function in report field pages #46757

Merged
merged 10 commits into from
Aug 6, 2024
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import React, {useMemo} from 'react';
import SelectionList from '@components/SelectionList';
import RadioListItem from '@components/SelectionList/RadioListItem';
import localeCompare from '@libs/LocaleCompare';

type ReportFieldsInitialListValuePickerProps = {
/** Options to select from if field is of type list */
Expand All @@ -22,6 +23,7 @@ function ReportFieldsInitialListValuePicker({listValues, disabledOptions, value,
{
data: Object.values(listValues ?? {})
.filter((listValue, index) => !disabledOptions[index])
.sort((a, b) => localeCompare(a, b))
cretadn22 marked this conversation as resolved.
Show resolved Hide resolved
.map((listValue) => ({
keyForList: listValue,
value: listValue,
Expand Down
35 changes: 19 additions & 16 deletions src/pages/workspace/reportFields/ReportFieldsListValuesPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ import useThemeStyles from '@hooks/useThemeStyles';
import {turnOffMobileSelectionMode} from '@libs/actions/MobileSelectionMode';
import * as ReportField from '@libs/actions/Policy/ReportField';
import * as DeviceCapabilities from '@libs/DeviceCapabilities';
import localeCompare from '@libs/LocaleCompare';
import Navigation from '@libs/Navigation/Navigation';
import * as PolicyUtils from '@libs/PolicyUtils';
import * as ReportUtils from '@libs/ReportUtils';
Expand Down Expand Up @@ -84,22 +85,24 @@ function ReportFieldsListValuesPage({
}, [formDraft?.disabledListValues, formDraft?.listValues, policy?.fieldList, reportFieldID]);

const listValuesSections = useMemo(() => {
const data = listValues.map<ValueListItem>((value, index) => ({
value,
index,
text: value,
keyForList: value,
isSelected: selectedValues[value],
enabled: !disabledListValues[index] ?? true,
pendingAction: reportFieldID ? policy?.fieldList?.[ReportUtils.getReportFieldKey(reportFieldID)]?.pendingAction : null,
rightElement: (
<ListItemRightCaretWithLabel
shouldShowCaret={false}
labelText={disabledListValues[index] ? translate('workspace.common.disabled') : translate('workspace.common.enabled')}
/>
),
}));

const data = listValues
// .sort((a, b) => localeCompare(a, b))
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please pay more attention to the code by double-checking when pushing it. This line is redundant.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@paultsimura Sorry, Update now

.map<ValueListItem>((value, index) => ({
value,
index,
text: value,
keyForList: value,
isSelected: selectedValues[value],
enabled: !disabledListValues[index] ?? true,
pendingAction: reportFieldID ? policy?.fieldList?.[ReportUtils.getReportFieldKey(reportFieldID)]?.pendingAction : null,
rightElement: (
<ListItemRightCaretWithLabel
shouldShowCaret={false}
labelText={disabledListValues[index] ? translate('workspace.common.disabled') : translate('workspace.common.enabled')}
/>
),
}))
.sort((a, b) => localeCompare(a.value, b.value));
return [{data, isDisabled: false}];
}, [disabledListValues, listValues, policy?.fieldList, reportFieldID, selectedValues, translate]);

Expand Down
35 changes: 19 additions & 16 deletions src/pages/workspace/reportFields/WorkspaceReportFieldsPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@ import useTheme from '@hooks/useTheme';
import useThemeStyles from '@hooks/useThemeStyles';
import {turnOffMobileSelectionMode} from '@libs/actions/MobileSelectionMode';
import * as DeviceCapabilities from '@libs/DeviceCapabilities';
import localeCompare from '@libs/LocaleCompare';
import Navigation from '@libs/Navigation/Navigation';
import type {FullScreenNavigatorParamList} from '@libs/Navigation/types';
import * as PolicyUtils from '@libs/PolicyUtils';
Expand Down Expand Up @@ -99,22 +100,24 @@ function WorkspaceReportFieldsPage({

return [
{
data: Object.values(filteredPolicyFieldList).map((reportField) => ({
value: reportField.name,
fieldID: reportField.fieldID,
keyForList: String(reportField.fieldID),
orderWeight: reportField.orderWeight,
pendingAction: reportField.pendingAction,
isSelected: selectedReportFields.find((selectedReportField) => selectedReportField.name === reportField.name) !== undefined,
isDisabled: reportField.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE,
text: reportField.name,
rightElement: (
<ListItemRightCaretWithLabel
shouldShowCaret={false}
labelText={Str.recapitalize(translate(WorkspaceReportFieldUtils.getReportFieldTypeTranslationKey(reportField.type)))}
/>
),
})),
data: Object.values(filteredPolicyFieldList)
.sort((a, b) => localeCompare(a.name, b.name))
.map((reportField) => ({
value: reportField.name,
fieldID: reportField.fieldID,
keyForList: String(reportField.fieldID),
orderWeight: reportField.orderWeight,
pendingAction: reportField.pendingAction,
isSelected: selectedReportFields.find((selectedReportField) => selectedReportField.name === reportField.name) !== undefined,
isDisabled: reportField.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE,
text: reportField.name,
rightElement: (
<ListItemRightCaretWithLabel
shouldShowCaret={false}
labelText={Str.recapitalize(translate(WorkspaceReportFieldUtils.getReportFieldTypeTranslationKey(reportField.type)))}
/>
),
})),
isDisabled: false,
},
];
Expand Down
Loading