diff --git a/src/CONST/index.ts b/src/CONST/index.ts index 9784ec38f18a9..4270aff8f32e4 100755 --- a/src/CONST/index.ts +++ b/src/CONST/index.ts @@ -8236,6 +8236,24 @@ const CONST = { RESET_SPLIT_SHARES: 'RequestConfirmationList-ResetSplitShares', RECEIPT_THUMBNAIL: 'RequestConfirmationList-ReceiptThumbnail', PDF_RECEIPT_THUMBNAIL: 'RequestConfirmationList-PDFReceiptThumbnail', + AMOUNT_FIELD: 'RequestConfirmationList-AmountField', + DESCRIPTION_FIELD: 'RequestConfirmationList-DescriptionField', + DISTANCE_FIELD: 'RequestConfirmationList-DistanceField', + RATE_FIELD: 'RequestConfirmationList-RateField', + MERCHANT_FIELD: 'RequestConfirmationList-MerchantField', + HOURS_FIELD: 'RequestConfirmationList-HoursField', + TIME_RATE_FIELD: 'RequestConfirmationList-TimeRateField', + CATEGORY_FIELD: 'RequestConfirmationList-CategoryField', + DATE_FIELD: 'RequestConfirmationList-DateField', + TAG_FIELD: 'RequestConfirmationList-TagField', + TAX_RATE_FIELD: 'RequestConfirmationList-TaxRateField', + TAX_AMOUNT_FIELD: 'RequestConfirmationList-TaxAmountField', + ATTENDEES_FIELD: 'RequestConfirmationList-AttendeesField', + REPORT_FIELD: 'RequestConfirmationList-ReportField', + DESTINATION_FIELD: 'RequestConfirmationList-DestinationField', + TIME_FIELD: 'RequestConfirmationList-TimeField', + SUBRATE_FIELD: 'RequestConfirmationList-SubrateField', + SEND_FROM_FIELD: 'RequestConfirmationList-SendFromField', }, TRANSACTION_PREVIEW: { CARD: 'TransactionPreview-Card', @@ -8290,6 +8308,64 @@ const CONST = { SHARE_DETAIL: { DISMISS_KEYBOARD_BUTTON: 'ShareDetail-DismissKeyboardButton', }, + MONEY_REQUEST: { + AMOUNT_NEXT_BUTTON: 'MoneyRequest-AmountNextButton', + AMOUNT_PAY_BUTTON: 'MoneyRequest-AmountPayButton', + PARTICIPANTS_NEXT_BUTTON: 'MoneyRequest-ParticipantsNextButton', + PARTICIPANTS_NEW_WORKSPACE_BUTTON: 'MoneyRequest-ParticipantsNewWorkspaceButton', + PARTICIPANTS_IMPORT_CONTACTS_ITEM: 'MoneyRequest-ParticipantsImportContacts', + ATTENDEES_SAVE_BUTTON: 'MoneyRequest-AttendeesSaveButton', + CONFIRMATION_SUBMIT_BUTTON: 'MoneyRequest-ConfirmationSubmitButton', + CONFIRMATION_REMOVE_EXPENSE_BUTTON: 'MoneyRequest-ConfirmationRemoveExpenseButton', + CONFIRMATION_PAY_BUTTON: 'MoneyRequest-ConfirmationPayButton', + }, + SPLIT_EXPENSE: { + ADD_SPLIT_BUTTON: 'SplitExpense-AddSplitButton', + MAKE_SPLITS_EVEN_BUTTON: 'SplitExpense-MakeSplitsEvenButton', + SAVE_BUTTON: 'SplitExpense-SaveButton', + REMOVE_SPLIT_BUTTON: 'SplitExpense-RemoveSplitButton', + EDIT_SAVE_BUTTON: 'SplitExpense-EditSaveButton', + }, + IOU_REQUEST_STEP: { + DISTANCE_NEXT_BUTTON: 'IOURequestStep-DistanceNextButton', + DISTANCE_MAP_NEXT_BUTTON: 'IOURequestStep-DistanceMapNextButton', + DISTANCE_MANUAL_NEXT_BUTTON: 'IOURequestStep-DistanceManualNextButton', + DISTANCE_ODOMETER_NEXT_BUTTON: 'IOURequestStep-DistanceOdometerNextButton', + ODOMETER_CHOOSE_FILE_BUTTON: 'IOURequestStep-OdometerChooseFileButton', + GPS_START_STOP_BUTTON: 'IOURequestStep-GPSStartStopButton', + GPS_DISCARD_BUTTON: 'IOURequestStep-GPSDiscardButton', + GPS_NEXT_BUTTON: 'IOURequestStep-GPSNextButton', + GPS_OPEN_MOBILE_BUTTON: 'IOURequestStep-GPSOpenMobileButton', + WAYPOINT_REMOVE_BUTTON: 'IOURequestStep-WaypointRemoveButton', + WAYPOINT_START_MENU_ITEM: 'IOURequestStep-WaypointStartMenuItem', + WAYPOINT_STOP_MENU_ITEM: 'IOURequestStep-WaypointStopMenuItem', + EDIT_CATEGORIES_BUTTON: 'IOURequestStep-CategoryEditButton', + EDIT_TAGS_BUTTON: 'IOURequestStep-TagEditButton', + EDIT_PER_DIEM_RATES_BUTTON: 'IOURequestStep-EditPerDiemRatesButton', + HOURS_NEXT_BUTTON: 'IOURequestStep-HoursNextButton', + SCAN_SUBMIT_BUTTON: 'IOURequestStep-ScanSubmitButton', + RECEIPT_DELETE_BUTTON: 'IOURequestStep-ReceiptDeleteButton', + RECEIPT_PREVIEW_ITEM: 'IOURequestStep-ReceiptPreviewItem', + RECEIPT_PREVIEW_SUBMIT_BUTTON: 'IOURequestStep-ReceiptPreviewSubmitButton', + }, + TAB_SELECTOR: { + MANUAL_TAB: 'TabSelector-ManualTab', + SCAN_TAB: 'TabSelector-ScanTab', + DISTANCE_TAB: 'TabSelector-DistanceTab', + PER_DIEM_TAB: 'TabSelector-PerDiemTab', + TIME_TAB: 'TabSelector-TimeTab', + DISTANCE_MAP_TAB: 'TabSelector-DistanceMapTab', + DISTANCE_MANUAL_TAB: 'TabSelector-DistanceManualTab', + DISTANCE_GPS_TAB: 'TabSelector-DistanceGPSTab', + DISTANCE_ODOMETER_TAB: 'TabSelector-DistanceOdometerTab', + CHAT_TAB: 'TabSelector-ChatTab', + ROOM_TAB: 'TabSelector-RoomTab', + SHARE_TAB: 'TabSelector-ShareTab', + SUBMIT_TAB: 'TabSelector-SubmitTab', + SPLIT_AMOUNT_TAB: 'TabSelector-SplitAmountTab', + SPLIT_PERCENTAGE_TAB: 'TabSelector-SplitPercentageTab', + SPLIT_DATE_TAB: 'TabSelector-SplitDateTab', + }, REQUEST_STEP: { SCAN: { MULTI_SCAN: 'Scan-MultiScan', @@ -8318,6 +8394,9 @@ const CONST = { PRODUCT_TRAINING: { TOOLTIP: 'ProductTraining-Tooltip', }, + FORM: { + SUBMIT_BUTTON: 'Form-SubmitButton', + }, ONBOARDING: { INTERESTED_FEATURES_ITEM: 'Onboarding-InterestedFeaturesItem', }, diff --git a/src/components/AnimatedSubmitButton/index.tsx b/src/components/AnimatedSubmitButton/index.tsx index 02b3de4555e31..20ed46cf19894 100644 --- a/src/components/AnimatedSubmitButton/index.tsx +++ b/src/components/AnimatedSubmitButton/index.tsx @@ -8,8 +8,9 @@ import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; +import type WithSentryLabel from '@src/types/utils/SentryLabel'; -type AnimatedSubmitButtonProps = { +type AnimatedSubmitButtonProps = WithSentryLabel & { // Whether to show the success state success: boolean | undefined; @@ -27,9 +28,6 @@ type AnimatedSubmitButtonProps = { // Whether the button should be disabled isDisabled?: boolean; - - // Label for Sentry tracking - sentryLabel?: string; }; function AnimatedSubmitButton({success, text, onPress, isSubmittingAnimationRunning, onAnimationFinish, isDisabled, sentryLabel}: AnimatedSubmitButtonProps) { diff --git a/src/components/DistanceRequest/DistanceRequestRenderItem.tsx b/src/components/DistanceRequest/DistanceRequestRenderItem.tsx index 98870d7d928ae..04277c7b89e11 100644 --- a/src/components/DistanceRequest/DistanceRequestRenderItem.tsx +++ b/src/components/DistanceRequest/DistanceRequestRenderItem.tsx @@ -7,8 +7,9 @@ import {isWaypointNullIsland} from '@libs/TransactionUtils'; import CONST from '@src/CONST'; import type {TranslationPaths} from '@src/languages/types'; import type {WaypointCollection} from '@src/types/onyx/Transaction'; +import type WithSentryLabel from '@src/types/utils/SentryLabel'; -type DistanceRequestProps = { +type DistanceRequestProps = WithSentryLabel & { /** The waypoints for the distance expense */ waypoints?: WaypointCollection; @@ -31,7 +32,7 @@ type DistanceRequestProps = { disabled?: boolean; }; -function DistanceRequestRenderItem({waypoints, item = '', onSecondaryInteraction, getIndex, isActive = false, onPress = () => {}, disabled = false}: DistanceRequestProps) { +function DistanceRequestRenderItem({waypoints, item = '', onSecondaryInteraction, getIndex, isActive = false, onPress = () => {}, disabled = false, sentryLabel}: DistanceRequestProps) { const theme = useTheme(); const expensifyIcons = useMemoizedLazyExpensifyIcons(['Location', 'DotIndicatorUnfilled', 'DotIndicator', 'DragHandles']); const {translate} = useLocalize(); @@ -73,6 +74,7 @@ function DistanceRequestRenderItem({waypoints, item = '', onSecondaryInteraction disabled={disabled} errorText={errorText} brickRoadIndicator={errorText ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined} + sentryLabel={sentryLabel} /> ); } diff --git a/src/components/Form/FormWrapper.tsx b/src/components/Form/FormWrapper.tsx index 178a8cddaf872..1ab4b5bfc48bc 100644 --- a/src/components/Form/FormWrapper.tsx +++ b/src/components/Form/FormWrapper.tsx @@ -12,6 +12,7 @@ import useOnyx from '@hooks/useOnyx'; import useSafeAreaPaddings from '@hooks/useSafeAreaPaddings'; import useThemeStyles from '@hooks/useThemeStyles'; import {getLatestErrorMessage} from '@libs/ErrorUtils'; +import CONST from '@src/CONST'; import type {OnyxFormKey} from '@src/ONYXKEYS'; import type {Form} from '@src/types/form'; import type ChildrenProps from '@src/types/utils/ChildrenProps'; @@ -96,6 +97,7 @@ function FormWrapper({ shouldPreventDefaultFocusOnPressSubmit = false, onScroll = () => {}, forwardedFSClass, + sentryLabel = CONST.SENTRY_LABEL.FORM.SUBMIT_BUTTON, }: FormWrapperProps) { const styles = useThemeStyles(); const formRef = useRef(null); @@ -183,6 +185,7 @@ function FormWrapper({ shouldRenderFooterAboveSubmit={shouldRenderFooterAboveSubmit} shouldBlendOpacity={shouldSubmitButtonBlendOpacity} shouldPreventDefaultFocusOnPress={shouldPreventDefaultFocusOnPressSubmit} + sentryLabel={sentryLabel} /> ); diff --git a/src/components/Form/types.ts b/src/components/Form/types.ts index 386c05254ad80..4d99e0056ab5e 100644 --- a/src/components/Form/types.ts +++ b/src/components/Form/types.ts @@ -39,6 +39,7 @@ import type {OnyxFormKey, OnyxValues} from '@src/ONYXKEYS'; import type {Form} from '@src/types/form'; import type {BaseForm} from '@src/types/form/Form'; import type {FileObject} from '@src/types/utils/Attachment'; +import type WithSentryLabel from '@src/types/utils/SentryLabel'; /** * This type specifies all the inputs that can be used with `InputWrapper` component. Make sure to update it @@ -129,58 +130,59 @@ type InputComponentBaseProps = Input type FormOnyxValues = Omit; type FormOnyxKeys = keyof FormOnyxValues; -type FormProps = ForwardedFSClassProps & { - /** A unique Onyx key identifying the form */ - formID: TFormID; +type FormProps = ForwardedFSClassProps & + WithSentryLabel & { + /** A unique Onyx key identifying the form */ + formID: TFormID; - /** Text to be displayed in the submit button */ - submitButtonText: string; + /** Text to be displayed in the submit button */ + submitButtonText: string; - /** Submit button styles */ - submitButtonStyles?: StyleProp; + /** Submit button styles */ + submitButtonStyles?: StyleProp; - /** Controls the submit button's visibility */ - isSubmitButtonVisible?: boolean; + /** Controls the submit button's visibility */ + isSubmitButtonVisible?: boolean; - /** Callback to submit the form */ - onSubmit: (values: FormOnyxValues) => void; + /** Callback to submit the form */ + onSubmit: (values: FormOnyxValues) => void; - /** Should the button be enabled when offline */ - enabledWhenOffline?: boolean; + /** Should the button be enabled when offline */ + enabledWhenOffline?: boolean; - /** Whether the form submit action is dangerous */ - isSubmitActionDangerous?: boolean; + /** Whether the form submit action is dangerous */ + isSubmitActionDangerous?: boolean; - /** Should fix the errors alert be displayed when there is an error in the form */ - shouldHideFixErrorsAlert?: boolean; + /** Should fix the errors alert be displayed when there is an error in the form */ + shouldHideFixErrorsAlert?: boolean; - /** Whether ScrollWithContext should be used instead of regular ScrollView. Set to true when there's a nested Picker component in Form. */ - scrollContextEnabled?: boolean; + /** Whether ScrollWithContext should be used instead of regular ScrollView. Set to true when there's a nested Picker component in Form. */ + scrollContextEnabled?: boolean; - /** Whether to use ScrollView */ - shouldUseScrollView?: boolean; + /** Whether to use ScrollView */ + shouldUseScrollView?: boolean; - /** Container styles */ - style?: StyleProp; + /** Container styles */ + style?: StyleProp; - /** Custom content to display in the footer after submit button */ - footerContent?: ReactNode; + /** Custom content to display in the footer after submit button */ + footerContent?: ReactNode; - /** Disable press on enter for submit button */ - disablePressOnEnter?: boolean; + /** Disable press on enter for submit button */ + disablePressOnEnter?: boolean; - /** The priority to assign the enter key event listener to buttons. 0 is the highest priority. */ - enterKeyEventListenerPriority?: number; + /** The priority to assign the enter key event listener to buttons. 0 is the highest priority. */ + enterKeyEventListenerPriority?: number; - /** Render extra button above submit button */ - shouldRenderFooterAboveSubmit?: boolean; + /** Render extra button above submit button */ + shouldRenderFooterAboveSubmit?: boolean; - /** - * Determines whether the form should automatically scroll to the end upon rendering or when the value changes. - * If `true`, the form will smoothly scroll to the bottom after interactions have completed. - */ - shouldScrollToEnd?: boolean; -}; + /** + * Determines whether the form should automatically scroll to the end upon rendering or when the value changes. + * If `true`, the form will smoothly scroll to the bottom after interactions have completed. + */ + shouldScrollToEnd?: boolean; + }; type FormRef = { resetForm: (optionalValue: FormOnyxValues) => void; diff --git a/src/components/FormAlertWithSubmitButton.tsx b/src/components/FormAlertWithSubmitButton.tsx index db9f38122eb6b..174e16677b15e 100644 --- a/src/components/FormAlertWithSubmitButton.tsx +++ b/src/components/FormAlertWithSubmitButton.tsx @@ -5,10 +5,11 @@ import {View} from 'react-native'; import useThemeStyles from '@hooks/useThemeStyles'; import getPlatform from '@libs/getPlatform'; import CONST from '@src/CONST'; +import type WithSentryLabel from '@src/types/utils/SentryLabel'; import Button from './Button'; import FormAlertWrapper from './FormAlertWrapper'; -type FormAlertWithSubmitButtonProps = { +type FormAlertWithSubmitButtonProps = WithSentryLabel & { /** Error message to display above button */ message?: string; @@ -102,6 +103,7 @@ function FormAlertWithSubmitButton({ shouldBlendOpacity = false, addButtonBottomPadding = true, shouldPreventDefaultFocusOnPress = false, + sentryLabel, }: FormAlertWithSubmitButtonProps) { const styles = useThemeStyles(); const style = [!shouldRenderFooterAboveSubmit && footerContent && addButtonBottomPadding ? styles.mb3 : {}, buttonStyles]; @@ -135,6 +137,7 @@ function FormAlertWithSubmitButton({ medium={useSmallerSubmitButtonSize} large={!useSmallerSubmitButtonSize} onMouseDown={shouldPreventDefaultFocusOnPress ? (e) => e.preventDefault() : undefined} + sentryLabel={sentryLabel} /> ) : (