From c486f93e2fba0b17160b8d448356d08c048d3fd6 Mon Sep 17 00:00:00 2001 From: war-in Date: Fri, 22 Mar 2024 12:04:02 +0100 Subject: [PATCH 1/9] migrate `SetDatePage` --- .../{SetDatePage.js => SetDatePage.tsx} | 43 ++++++++----------- 1 file changed, 19 insertions(+), 24 deletions(-) rename src/pages/settings/Profile/CustomStatus/{SetDatePage.js => SetDatePage.tsx} (73%) diff --git a/src/pages/settings/Profile/CustomStatus/SetDatePage.js b/src/pages/settings/Profile/CustomStatus/SetDatePage.tsx similarity index 73% rename from src/pages/settings/Profile/CustomStatus/SetDatePage.js rename to src/pages/settings/Profile/CustomStatus/SetDatePage.tsx index 5b95ec757617..75d73a9da65b 100644 --- a/src/pages/settings/Profile/CustomStatus/SetDatePage.js +++ b/src/pages/settings/Profile/CustomStatus/SetDatePage.tsx @@ -1,38 +1,41 @@ -import lodashGet from 'lodash/get'; import React, {useCallback} from 'react'; import {withOnyx} from 'react-native-onyx'; +import type {OnyxEntry} from 'react-native-onyx'; import DatePicker from '@components/DatePicker'; import FormProvider from '@components/Form/FormProvider'; import InputWrapper from '@components/Form/InputWrapper'; +import type {FormOnyxValues} from '@components/Form/types'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; -import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; import * as User from '@libs/actions/User'; -import compose from '@libs/compose'; import DateUtils from '@libs/DateUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import INPUT_IDS from '@src/types/form/SettingsStatusClearDateForm'; +import type * as OnyxTypes from '@src/types/onyx'; -const propTypes = { - ...withLocalizePropTypes, +type SetDatePageOnyxProps = { + customStatus: OnyxEntry; }; -function SetDatePage({translate, customStatus}) { +type SetDatePageProps = SetDatePageOnyxProps; + +function SetDatePage({customStatus}: SetDatePageProps) { const styles = useThemeStyles(); - const customClearAfter = lodashGet(customStatus, 'clearAfter', ''); + const {translate} = useLocalize(); + const customClearAfter = customStatus?.clearAfter ?? ''; - const onSubmit = (v) => { + const onSubmit = (v: {dateTime: string}) => { User.updateDraftCustomStatus({clearAfter: DateUtils.combineDateAndTime(customClearAfter, v.dateTime)}); Navigation.goBack(ROUTES.SETTINGS_STATUS_CLEAR_AFTER); }; - const validate = useCallback((values) => { - const requiredFields = ['dateTime']; - const errors = ValidationUtils.getFieldRequiredErrors(values, requiredFields); + const validate = useCallback((values: FormOnyxValues) => { + const errors = ValidationUtils.getFieldRequiredErrors(values, [INPUT_IDS.DATE_TIME]); const dateError = ValidationUtils.getDatePassedError(values.dateTime); if (values.dateTime && dateError) { @@ -58,7 +61,6 @@ function SetDatePage({translate, customStatus}) { submitButtonText={translate('common.save')} validate={validate} enabledWhenOffline - shouldUseDefaultValue > ({ + customStatus: { + key: ONYXKEYS.CUSTOM_STATUS_DRAFT, + }, +})(SetDatePage); From ba9cdd155e80b9c66f743e88e9178e80df3b6ae5 Mon Sep 17 00:00:00 2001 From: war-in Date: Fri, 22 Mar 2024 12:04:32 +0100 Subject: [PATCH 2/9] migrate `SetTimePage` --- .../{SetTimePage.js => SetTimePage.tsx} | 33 +++++++++---------- 1 file changed, 16 insertions(+), 17 deletions(-) rename src/pages/settings/Profile/CustomStatus/{SetTimePage.js => SetTimePage.tsx} (70%) diff --git a/src/pages/settings/Profile/CustomStatus/SetTimePage.js b/src/pages/settings/Profile/CustomStatus/SetTimePage.tsx similarity index 70% rename from src/pages/settings/Profile/CustomStatus/SetTimePage.js rename to src/pages/settings/Profile/CustomStatus/SetTimePage.tsx index 1165e708f500..6f655d27f785 100644 --- a/src/pages/settings/Profile/CustomStatus/SetTimePage.js +++ b/src/pages/settings/Profile/CustomStatus/SetTimePage.tsx @@ -1,28 +1,31 @@ -import lodashGet from 'lodash/get'; import React from 'react'; import {View} from 'react-native'; +import type {OnyxEntry} from 'react-native-onyx'; import {withOnyx} from 'react-native-onyx'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import TimePicker from '@components/TimePicker/TimePicker'; -import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; import * as User from '@libs/actions/User'; -import compose from '@libs/compose'; import DateUtils from '@libs/DateUtils'; import Navigation from '@libs/Navigation/Navigation'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; +import type * as OnyxTypes from '@src/types/onyx'; -const propTypes = { - ...withLocalizePropTypes, +type SetTimePageOnyxProps = { + customStatus: OnyxEntry; }; -function SetTimePage({translate, customStatus}) { +type SetTimePageProps = SetTimePageOnyxProps; + +function SetTimePage({customStatus}: SetTimePageProps) { const styles = useThemeStyles(); - const clearAfter = lodashGet(customStatus, 'clearAfter', ''); + const {translate} = useLocalize(); + const clearAfter = customStatus?.clearAfter ?? ''; - const onSubmit = (time) => { + const onSubmit = (time: string) => { const timeToUse = DateUtils.combineDateAndTime(time, clearAfter); User.updateDraftCustomStatus({clearAfter: timeToUse}); @@ -50,14 +53,10 @@ function SetTimePage({translate, customStatus}) { ); } -SetTimePage.propTypes = propTypes; SetTimePage.displayName = 'SetTimePage'; -export default compose( - withLocalize, - withOnyx({ - customStatus: { - key: ONYXKEYS.CUSTOM_STATUS_DRAFT, - }, - }), -)(SetTimePage); +export default withOnyx({ + customStatus: { + key: ONYXKEYS.CUSTOM_STATUS_DRAFT, + }, +})(SetTimePage); From 000840d679dff29950db415fc2c22258159c5369 Mon Sep 17 00:00:00 2001 From: war-in Date: Fri, 22 Mar 2024 12:04:46 +0100 Subject: [PATCH 3/9] migrate `StatusClearAfterPage` --- ...rAfterPage.js => StatusClearAfterPage.tsx} | 88 +++++++------------ 1 file changed, 34 insertions(+), 54 deletions(-) rename src/pages/settings/Profile/CustomStatus/{StatusClearAfterPage.js => StatusClearAfterPage.tsx} (76%) diff --git a/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.js b/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx similarity index 76% rename from src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.js rename to src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx index 290d6431492d..3492af91c580 100644 --- a/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.js +++ b/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx @@ -1,45 +1,38 @@ -import _ from 'lodash'; -import lodashGet from 'lodash/get'; -import PropTypes from 'prop-types'; import React, {useCallback, useEffect, useMemo, useState} from 'react'; import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; +import type {OnyxEntry} from 'react-native-onyx'; import FormProvider from '@components/Form/FormProvider'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription'; import ScreenWrapper from '@components/ScreenWrapper'; import RadioListItem from '@components/SelectionList/RadioListItem'; import Text from '@components/Text'; -import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps} from '@components/withCurrentUserPersonalDetails'; -import withLocalize from '@components/withLocalize'; +import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails'; import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; import * as User from '@libs/actions/User'; -import compose from '@libs/compose'; import DateUtils from '@libs/DateUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; -import personalDetailsPropType from '@pages/personalDetailsPropType'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; +import type * as OnyxTypes from '@src/types/onyx'; -const defaultProps = { - ...withCurrentUserPersonalDetailsDefaultProps, -}; +type CustomStatusTypes = (typeof CONST.CUSTOM_STATUS_TYPES)[keyof typeof CONST.CUSTOM_STATUS_TYPES]; -const propTypes = { - currentUserPersonalDetails: personalDetailsPropType, - customStatus: PropTypes.shape({ - clearAfter: PropTypes.string, - }), +type StatusClearAfterPageOnyxProps = { + customStatus: OnyxEntry; }; +type StatusClearAfterPageProps = StatusClearAfterPageOnyxProps; + /** - * @param {string} data - either a value from CONST.CUSTOM_STATUS_TYPES or a dateTime string in the format YYYY-MM-DD HH:mm - * @returns {string} + * @param data - either a value from CONST.CUSTOM_STATUS_TYPES or a dateTime string in the format YYYY-MM-DD HH:mm + * @returns */ -function getSelectedStatusType(data) { +function getSelectedStatusType(data: string | boolean) { switch (data) { case DateUtils.getEndOfToday(): return CONST.CUSTOM_STATUS_TYPES.AFTER_TODAY; @@ -53,7 +46,7 @@ function getSelectedStatusType(data) { } } -const useValidateCustomDate = (data) => { +const useValidateCustomDate = (data: string) => { const [customDateError, setCustomDateError] = useState(''); const [customTimeError, setCustomTimeError] = useState(''); const validate = () => { @@ -81,15 +74,17 @@ const useValidateCustomDate = (data) => { return {customDateError, customTimeError, validateCustomDate}; }; -function StatusClearAfterPage({currentUserPersonalDetails, customStatus}) { +function StatusClearAfterPage({customStatus}: StatusClearAfterPageProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); - const clearAfter = lodashGet(currentUserPersonalDetails, 'status.clearAfter', ''); - const draftClearAfter = lodashGet(customStatus, 'clearAfter', ''); + const currentUserPersonalDetails = useCurrentUserPersonalDetails(); + const clearAfter = currentUserPersonalDetails.status?.clearAfter ?? ''; + + const draftClearAfter = customStatus?.clearAfter ?? ''; const [draftPeriod, setDraftPeriod] = useState(getSelectedStatusType(draftClearAfter || clearAfter)); const statusType = useMemo( () => - _.map(CONST.CUSTOM_STATUS_TYPES, (value, key) => ({ + Object.entries(CONST.CUSTOM_STATUS_TYPES).map(([key, value]) => ({ value, text: translate(`statusPage.timePeriods.${value}`), keyForList: key, @@ -102,30 +97,30 @@ function StatusClearAfterPage({currentUserPersonalDetails, customStatus}) { const {redBrickDateIndicator, redBrickTimeIndicator} = useMemo( () => ({ - redBrickDateIndicator: customDateError ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : null, - redBrickTimeIndicator: customTimeError ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : null, + redBrickDateIndicator: customDateError ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined, + redBrickTimeIndicator: customTimeError ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined, }), [customTimeError, customDateError], ); const onSubmit = () => { - const {dateError, timeError} = validateCustomDate(); + const {dateValidationErrorKey: dateError, timeValidationErrorKey: timeError} = validateCustomDate(); if (dateError || timeError) { return; } - let calculatedDraftDate = ''; + let calculatedDraftDate; if (draftPeriod === CONST.CUSTOM_STATUS_TYPES.CUSTOM) { calculatedDraftDate = draftClearAfter; } else { - const selectedRange = _.find(statusType, (item) => item.isSelected); - calculatedDraftDate = DateUtils.getDateFromStatusType(selectedRange.value); + const selectedRange = statusType.find((item) => item.isSelected); + calculatedDraftDate = DateUtils.getDateFromStatusType(selectedRange?.value ?? 'never'); } User.updateDraftCustomStatus({clearAfter: calculatedDraftDate}); Navigation.goBack(ROUTES.SETTINGS_STATUS); }; const updateMode = useCallback( - (mode) => { + (mode: {value: CustomStatusTypes}) => { if (mode.value === draftPeriod) { return; } @@ -134,8 +129,8 @@ function StatusClearAfterPage({currentUserPersonalDetails, customStatus}) { if (mode.value === CONST.CUSTOM_STATUS_TYPES.CUSTOM) { User.updateDraftCustomStatus({clearAfter: DateUtils.getOneHourFromNow()}); } else { - const selectedRange = _.find(statusType, (item) => item.value === mode.value); - const calculatedDraftDate = DateUtils.getDateFromStatusType(selectedRange.value); + const selectedRange = statusType.find((item) => item.value === mode.value); + const calculatedDraftDate = DateUtils.getDateFromStatusType(selectedRange?.value ?? 'never'); User.updateDraftCustomStatus({clearAfter: calculatedDraftDate}); Navigation.goBack(ROUTES.SETTINGS_STATUS); } @@ -156,7 +151,7 @@ function StatusClearAfterPage({currentUserPersonalDetails, customStatus}) { const timePeriodOptions = useCallback( () => - _.map(statusType, (item) => ( + Object.entries(statusType).map(([, item]) => ( updateMode(item)} @@ -220,24 +215,9 @@ function StatusClearAfterPage({currentUserPersonalDetails, customStatus}) { } StatusClearAfterPage.displayName = 'StatusClearAfterPage'; -StatusClearAfterPage.propTypes = propTypes; -StatusClearAfterPage.defaultProps = defaultProps; - -export default compose( - withCurrentUserPersonalDetails, - withLocalize, - withOnyx({ - timePeriodType: { - key: `${ONYXKEYS.FORMS.SETTINGS_STATUS_SET_CLEAR_AFTER_FORM}Draft`, - }, - clearDateForm: { - key: `${ONYXKEYS.FORMS.SETTINGS_STATUS_CLEAR_DATE_FORM}Draft`, - }, - customStatus: { - key: ONYXKEYS.CUSTOM_STATUS_DRAFT, - }, - preferredLocale: { - key: ONYXKEYS.NVP_PREFERRED_LOCALE, - }, - }), -)(StatusClearAfterPage); + +export default withOnyx({ + customStatus: { + key: ONYXKEYS.CUSTOM_STATUS_DRAFT, + }, +})(StatusClearAfterPage); From 2b5c13b16e3625acb080ff325a9a067e371c0c9c Mon Sep 17 00:00:00 2001 From: war-in Date: Fri, 22 Mar 2024 12:57:41 +0100 Subject: [PATCH 4/9] fix `getSelectedStatusType` function definition --- src/pages/settings/Profile/CustomStatus/SetTimePage.tsx | 1 + .../settings/Profile/CustomStatus/StatusClearAfterPage.tsx | 4 +--- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/src/pages/settings/Profile/CustomStatus/SetTimePage.tsx b/src/pages/settings/Profile/CustomStatus/SetTimePage.tsx index 6f655d27f785..b05a21967ee1 100644 --- a/src/pages/settings/Profile/CustomStatus/SetTimePage.tsx +++ b/src/pages/settings/Profile/CustomStatus/SetTimePage.tsx @@ -43,6 +43,7 @@ function SetTimePage({customStatus}: SetTimePageProps) { /> Date: Fri, 22 Mar 2024 12:59:52 +0100 Subject: [PATCH 5/9] fix jsdoc --- src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx b/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx index 00b630789e7b..744dca464a72 100644 --- a/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx +++ b/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx @@ -30,7 +30,6 @@ type StatusClearAfterPageProps = StatusClearAfterPageOnyxProps; /** * @param data - either a value from CONST.CUSTOM_STATUS_TYPES or a dateTime string in the format YYYY-MM-DD HH:mm - * @returns */ function getSelectedStatusType(data: string): CustomStatusTypes { switch (data) { From 00061dceb30a08190b6880b3c07954461945ba93 Mon Sep 17 00:00:00 2001 From: war-in Date: Tue, 26 Mar 2024 09:16:41 +0100 Subject: [PATCH 6/9] suggestions --- .../Profile/CustomStatus/SetDatePage.tsx | 9 +++++++-- .../CustomStatus/StatusClearAfterPage.tsx | 18 +++++++++++++----- 2 files changed, 20 insertions(+), 7 deletions(-) diff --git a/src/pages/settings/Profile/CustomStatus/SetDatePage.tsx b/src/pages/settings/Profile/CustomStatus/SetDatePage.tsx index 75d73a9da65b..5e165de3cc85 100644 --- a/src/pages/settings/Profile/CustomStatus/SetDatePage.tsx +++ b/src/pages/settings/Profile/CustomStatus/SetDatePage.tsx @@ -18,6 +18,10 @@ import ROUTES from '@src/ROUTES'; import INPUT_IDS from '@src/types/form/SettingsStatusClearDateForm'; import type * as OnyxTypes from '@src/types/onyx'; +type Date = { + dateTime: string; +}; + type SetDatePageOnyxProps = { customStatus: OnyxEntry; }; @@ -29,8 +33,8 @@ function SetDatePage({customStatus}: SetDatePageProps) { const {translate} = useLocalize(); const customClearAfter = customStatus?.clearAfter ?? ''; - const onSubmit = (v: {dateTime: string}) => { - User.updateDraftCustomStatus({clearAfter: DateUtils.combineDateAndTime(customClearAfter, v.dateTime)}); + const onSubmit = (value: Date) => { + User.updateDraftCustomStatus({clearAfter: DateUtils.combineDateAndTime(customClearAfter, value.dateTime)}); Navigation.goBack(ROUTES.SETTINGS_STATUS_CLEAR_AFTER); }; @@ -68,6 +72,7 @@ function SetDatePage({customStatus}: SetDatePageProps) { label={translate('statusPage.date')} defaultValue={DateUtils.extractDate(customClearAfter)} minDate={new Date()} + shouldUseDefaultValue /> diff --git a/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx b/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx index 744dca464a72..8c6d382ffa01 100644 --- a/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx +++ b/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx @@ -2,6 +2,7 @@ import React, {useCallback, useEffect, useMemo, useState} from 'react'; import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import type {OnyxEntry} from 'react-native-onyx'; +import type {ValueOf} from 'type-fest'; import FormProvider from '@components/Form/FormProvider'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription'; @@ -20,7 +21,14 @@ import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import type * as OnyxTypes from '@src/types/onyx'; -type CustomStatusTypes = (typeof CONST.CUSTOM_STATUS_TYPES)[keyof typeof CONST.CUSTOM_STATUS_TYPES]; +type CustomStatusTypes = ValueOf; + +type StatusType = { + value: CustomStatusTypes; + text: string; + keyForList: string; + isSelected: boolean; +}; type StatusClearAfterPageOnyxProps = { customStatus: OnyxEntry; @@ -79,7 +87,7 @@ function StatusClearAfterPage({customStatus}: StatusClearAfterPageProps) { const draftClearAfter = customStatus?.clearAfter ?? ''; const [draftPeriod, setDraftPeriod] = useState(getSelectedStatusType(draftClearAfter || clearAfter)); - const statusType = useMemo( + const statusType = useMemo( () => Object.entries(CONST.CUSTOM_STATUS_TYPES).map(([key, value]) => ({ value, @@ -105,7 +113,7 @@ function StatusClearAfterPage({customStatus}: StatusClearAfterPageProps) { if (dateError || timeError) { return; } - let calculatedDraftDate; + let calculatedDraftDate: string; if (draftPeriod === CONST.CUSTOM_STATUS_TYPES.CUSTOM) { calculatedDraftDate = draftClearAfter; } else { @@ -117,7 +125,7 @@ function StatusClearAfterPage({customStatus}: StatusClearAfterPageProps) { }; const updateMode = useCallback( - (mode: {value: CustomStatusTypes}) => { + (mode: StatusType) => { if (mode.value === draftPeriod) { return; } @@ -148,7 +156,7 @@ function StatusClearAfterPage({customStatus}: StatusClearAfterPageProps) { const timePeriodOptions = useCallback( () => - Object.entries(statusType).map(([, item]) => ( + Object.values(statusType).map((item) => ( updateMode(item)} From 0f67e1038a99a1650869c1ce5006ed4edb0e854d Mon Sep 17 00:00:00 2001 From: war-in Date: Tue, 26 Mar 2024 10:56:07 +0100 Subject: [PATCH 7/9] suggestions --- .../settings/Profile/CustomStatus/SetDatePage.tsx | 4 ++-- .../settings/Profile/CustomStatus/SetTimePage.tsx | 3 --- .../Profile/CustomStatus/StatusClearAfterPage.tsx | 11 ++++++----- 3 files changed, 8 insertions(+), 10 deletions(-) diff --git a/src/pages/settings/Profile/CustomStatus/SetDatePage.tsx b/src/pages/settings/Profile/CustomStatus/SetDatePage.tsx index 5e165de3cc85..ae0b910dc01f 100644 --- a/src/pages/settings/Profile/CustomStatus/SetDatePage.tsx +++ b/src/pages/settings/Profile/CustomStatus/SetDatePage.tsx @@ -18,7 +18,7 @@ import ROUTES from '@src/ROUTES'; import INPUT_IDS from '@src/types/form/SettingsStatusClearDateForm'; import type * as OnyxTypes from '@src/types/onyx'; -type Date = { +type DateTime = { dateTime: string; }; @@ -33,7 +33,7 @@ function SetDatePage({customStatus}: SetDatePageProps) { const {translate} = useLocalize(); const customClearAfter = customStatus?.clearAfter ?? ''; - const onSubmit = (value: Date) => { + const onSubmit = (value: DateTime) => { User.updateDraftCustomStatus({clearAfter: DateUtils.combineDateAndTime(customClearAfter, value.dateTime)}); Navigation.goBack(ROUTES.SETTINGS_STATUS_CLEAR_AFTER); }; diff --git a/src/pages/settings/Profile/CustomStatus/SetTimePage.tsx b/src/pages/settings/Profile/CustomStatus/SetTimePage.tsx index b05a21967ee1..101f7269616d 100644 --- a/src/pages/settings/Profile/CustomStatus/SetTimePage.tsx +++ b/src/pages/settings/Profile/CustomStatus/SetTimePage.tsx @@ -43,10 +43,7 @@ function SetTimePage({customStatus}: SetTimePageProps) { /> diff --git a/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx b/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx index 8c6d382ffa01..598050686825 100644 --- a/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx +++ b/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx @@ -31,6 +31,7 @@ type StatusType = { }; type StatusClearAfterPageOnyxProps = { + /** User's custom status */ customStatus: OnyxEntry; }; @@ -61,8 +62,8 @@ const useValidateCustomDate = (data: string) => { setCustomTimeError(timeValidationErrorKey); return { - dateValidationErrorKey, - timeValidationErrorKey, + dateError: dateValidationErrorKey, + timeError: timeValidationErrorKey, }; }; @@ -109,7 +110,7 @@ function StatusClearAfterPage({customStatus}: StatusClearAfterPageProps) { ); const onSubmit = () => { - const {dateValidationErrorKey: dateError, timeValidationErrorKey: timeError} = validateCustomDate(); + const {dateError, timeError} = validateCustomDate(); if (dateError || timeError) { return; } @@ -118,7 +119,7 @@ function StatusClearAfterPage({customStatus}: StatusClearAfterPageProps) { calculatedDraftDate = draftClearAfter; } else { const selectedRange = statusType.find((item) => item.isSelected); - calculatedDraftDate = DateUtils.getDateFromStatusType(selectedRange?.value ?? 'never'); + calculatedDraftDate = DateUtils.getDateFromStatusType(selectedRange?.value ?? CONST.CUSTOM_STATUS_TYPES.NEVER); } User.updateDraftCustomStatus({clearAfter: calculatedDraftDate}); Navigation.goBack(ROUTES.SETTINGS_STATUS); @@ -135,7 +136,7 @@ function StatusClearAfterPage({customStatus}: StatusClearAfterPageProps) { User.updateDraftCustomStatus({clearAfter: DateUtils.getOneHourFromNow()}); } else { const selectedRange = statusType.find((item) => item.value === mode.value); - const calculatedDraftDate = DateUtils.getDateFromStatusType(selectedRange?.value ?? 'never'); + const calculatedDraftDate = DateUtils.getDateFromStatusType(selectedRange?.value ?? CONST.CUSTOM_STATUS_TYPES.NEVER); User.updateDraftCustomStatus({clearAfter: calculatedDraftDate}); Navigation.goBack(ROUTES.SETTINGS_STATUS); } From 8156b513e5154b53faa109fd251fcd9f84fa1022 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marcin=20Warcho=C5=82?= <61014013+war-in@users.noreply.github.com> Date: Wed, 27 Mar 2024 08:57:53 +0100 Subject: [PATCH 8/9] Update src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Fábio Henriques --- .../settings/Profile/CustomStatus/StatusClearAfterPage.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx b/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx index 598050686825..a1ef5568bd5c 100644 --- a/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx +++ b/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx @@ -38,7 +38,7 @@ type StatusClearAfterPageOnyxProps = { type StatusClearAfterPageProps = StatusClearAfterPageOnyxProps; /** - * @param data - either a value from CONST.CUSTOM_STATUS_TYPES or a dateTime string in the format YYYY-MM-DD HH:mm + * @param data - either a value from CONST.CUSTOM_STATUS_TYPES or a dateTime string in the format YYYY-MM-DD HH:mm */ function getSelectedStatusType(data: string): CustomStatusTypes { switch (data) { From 56e14fa480ec839365acca295b9bea307d503b79 Mon Sep 17 00:00:00 2001 From: war-in Date: Thu, 28 Mar 2024 16:17:21 +0100 Subject: [PATCH 9/9] use map directly on `statusType` --- .../settings/Profile/CustomStatus/StatusClearAfterPage.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx b/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx index a1ef5568bd5c..40fbf097cdd9 100644 --- a/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx +++ b/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.tsx @@ -157,7 +157,7 @@ function StatusClearAfterPage({customStatus}: StatusClearAfterPageProps) { const timePeriodOptions = useCallback( () => - Object.values(statusType).map((item) => ( + statusType.map((item) => ( updateMode(item)}