Merge pull request #27358 from BeeMargarida/fix/regression-flat-trans…

…late

fix: regressions of flat translations
(cherry picked from commit c9580da)

src/CONST.ts

@@ -1684,61 +1684,6 @@ const CONST = {
  ZW: 'Zimbabwe',
  },
 
- ALL_US_ISO_STATES: [
- 'AK',
- 'AL',
- 'AR',
- 'AZ',
- 'CA',
- 'CO',
- 'CT',
- 'DE',
- 'FL',
- 'GA',
- 'HI',
- 'IA',
- 'ID',
- 'IL',
- 'IN',
- 'KS',
- 'KY',
- 'LA',
- 'MA',
- 'MD',
- 'ME',
- 'MI',
- 'MN',
- 'MO',
- 'MS',
- 'MT',
- 'NC',
- 'ND',
- 'NE',
- 'NH',
- 'NJ',
- 'NM',
- 'NV',
- 'NY',
- 'OH',
- 'OK',
- 'OR',
- 'PA',
- 'PR',
- 'RI',
- 'SC',
- 'SD',
- 'TN',
- 'TX',
- 'UT',
- 'VA',
- 'VT',
- 'WA',
- 'WI',
- 'WV',
- 'WY',
- 'DC',
- ],
-
  // Sources: https://github.com/Expensify/App/issues/14958#issuecomment-1442138427
  // https://github.com/Expensify/App/issues/14958#issuecomment-1456026810
  COUNTRY_ZIP_REGEX_DATA: {

src/components/StatePicker/StateSelectorModal.js

@@ -1,6 +1,7 @@
 import _ from 'underscore';
 import React, {useMemo, useEffect} from 'react';
 import PropTypes from 'prop-types';
+import {CONST as COMMON_CONST} from 'expensify-common/lib/CONST';
 import CONST from '../../CONST';
 import Modal from '../Modal';
 import HeaderWithBackButton from '../HeaderWithBackButton';
@@ -53,7 +54,7 @@ function StateSelectorModal({currentState, isVisible, onClose, onStateSelected,
 
  const countryStates = useMemo(
  () =>
- _.map(CONST.ALL_US_ISO_STATES, (state) => {
+ _.map(_.keys(COMMON_CONST.STATES), (state) => {
  const stateName = translate(`allStates.${state}.stateName`);
  const stateISO = translate(`allStates.${state}.stateISO`);
  return {

src/components/StatePicker/index.js

@@ -1,6 +1,8 @@
 import React, {useState} from 'react';
 import {View} from 'react-native';
 import PropTypes from 'prop-types';
+import _ from 'underscore';
+import {CONST as COMMON_CONST} from 'expensify-common/lib/CONST';
 import styles from '../../styles/styles';
 import MenuItemWithTopDescription from '../MenuItemWithTopDescription';
 import useLocalize from '../../hooks/useLocalize';
@@ -51,7 +53,7 @@ function StatePicker({value, errorText, onInputChange, forwardedRef, label}) {
  hidePickerModal();
  };
 
- const title = value ? translate(`allStates.${value}.stateName`) : '';
+ const title = value && _.keys(COMMON_CONST.STATES).includes(value) ? translate(`allStates.${value}.stateName`) : '';
  const descStyle = title.length === 0 ? styles.textNormal : null;
 
  return (

src/pages/ReimbursementAccount/CompanyStep.js

@@ -224,7 +224,7 @@ function CompanyStep({reimbursementAccount, reimbursementAccountDraft, getDefaul
  <Picker
  inputID="incorporationType"
  label={translate('companyStep.companyType')}
- items={_.map(translate('companyStep.incorporationTypes'), (label, value) => ({value, label}))}
+ items={_.map(_.keys(CONST.INCORPORATION_TYPES), (key) => ({value: key, label: translate(`companyStep.incorporationTypes.${key}`)}))}
  placeholder={{value: '', label: '-'}}
  defaultValue={getDefaultStateForField('incorporationType')}
  shouldSaveDraft

src/pages/settings/Preferences/PriorityModePage.js

@@ -26,12 +26,12 @@ const defaultProps = {
 };
 
 function PriorityModePage(props) {
- const priorityModes = _.map(props.translate('priorityModePage.priorityModes'), (mode, key) => ({
- value: key,
- text: mode.label,
- alternateText: mode.description,
- keyForList: key,
- isSelected: props.priorityMode === key,
+ const priorityModes = _.map(_.values(CONST.PRIORITY_MODE), (mode) => ({
+ value: mode,
+ text: props.translate(`priorityModePage.priorityModes.${mode}.label`),
+ alternateText: props.translate(`priorityModePage.priorityModes.${mode}.description`),
+ keyForList: mode,
+ isSelected: props.priorityMode === mode,
  }));
 
  const updateMode = useCallback(

src/pages/settings/Preferences/ThemePage.js

@@ -27,11 +27,11 @@ const defaultProps = {
 };
 
 function ThemePage(props) {
- const localesToThemes = _.map(props.translate('themePage.themes'), (theme, key) => ({
- value: key,
- text: theme.label,
- keyForList: key,
- isSelected: (props.preferredTheme || CONST.THEME.DEFAULT) === key,
+ const localesToThemes = _.map(_.values(_.omit(CONST.THEME, 'DEFAULT')), (theme) => ({
+ value: theme,
+ text: props.translate(`themePage.themes.${theme}.label`),
+ keyForList: theme,
+ isSelected: (props.preferredTheme || CONST.THEME.DEFAULT) === theme,
  }));
 
  return (

src/pages/settings/Profile/PronounsPage.js

@@ -31,7 +31,7 @@ function PronounsPage({currentUserPersonalDetails}) {
  .find((_value) => _value === currentPronounsKey)
  .value();
 
- return currentPronounsText || '';
+ return currentPronounsText ? translate(`pronouns.${currentPronounsText}`) : '';
  });
 
  const filteredPronounsList = useMemo(() => {

src/pages/settings/Report/NotificationPreferencePage.js

@@ -11,6 +11,7 @@ import withReportOrNotFound from '../../home/report/withReportOrNotFound';
 import FullPageNotFoundView from '../../../components/BlockingViews/FullPageNotFoundView';
 import reportPropTypes from '../../reportPropTypes';
 import ROUTES from '../../../ROUTES';
+import CONST from '../../../CONST';
 import * as Report from '../../../libs/actions/Report';
 import * as ReportUtils from '../../../libs/ReportUtils';
 import * as Expensicons from '../../../components/Icon/Expensicons';
@@ -26,17 +27,20 @@ const greenCheckmark = {src: Expensicons.Checkmark, color: themeColors.success};
 
 function NotificationPreferencePage(props) {
  const shouldDisableNotificationPreferences = ReportUtils.shouldDisableSettings(props.report) || ReportUtils.isArchivedRoom(props.report);
- const notificationPreferenceOptions = _.map(props.translate('notificationPreferencesPage.notificationPreferences'), (preference, key) => ({
- value: key,
- text: preference,
- keyForList: key,
+ const notificationPreferenceOptions = _.map(
+ _.filter(_.values(CONST.REPORT.NOTIFICATION_PREFERENCE), (pref) => pref !== CONST.REPORT.NOTIFICATION_PREFERENCE.HIDDEN),
+ (preference) => ({
+ value: preference,
+ text: props.translate(`notificationPreferencesPage.notificationPreferences.${preference}`),
+ keyForList: preference,
 
- // Include the green checkmark icon to indicate the currently selected value
- customIcon: key === props.report.notificationPreference ? greenCheckmark : null,
+  // Include the green checkmark icon to indicate the currently selected value
+  customIcon: preference === props.report.notificationPreference ? greenCheckmark : null,
 
- // This property will make the currently selected value have bold text
- boldStyle: key === props.report.notificationPreference,
- }));
+ // This property will make the currently selected value have bold text
+ boldStyle: preference === props.report.notificationPreference,
+ }),
+ );
 
  return (
  <ScreenWrapper includeSafeAreaPaddingBottom={false}>