chore: Sentry labels for the Create Expense flow

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',
         },

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) {

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}
         />
     );
 }

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<RNScrollView>(null);
@@ -183,6 +185,7 @@ function FormWrapper({
             shouldRenderFooterAboveSubmit={shouldRenderFooterAboveSubmit}
             shouldBlendOpacity={shouldSubmitButtonBlendOpacity}
             shouldPreventDefaultFocusOnPress={shouldPreventDefaultFocusOnPressSubmit}
+            sentryLabel={sentryLabel}
         />
     );
 

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<TValue extends ValueTypeKey = ValueTypeKey> = Input
 type FormOnyxValues<TFormID extends OnyxFormKey = OnyxFormKey> = Omit<OnyxValues[TFormID], keyof BaseForm>;
 type FormOnyxKeys<TFormID extends OnyxFormKey = OnyxFormKey> = keyof FormOnyxValues<TFormID>;
 
-type FormProps<TFormID extends OnyxFormKey = OnyxFormKey> = ForwardedFSClassProps & {
-    /** A unique Onyx key identifying the form */
-    formID: TFormID;
+type FormProps<TFormID extends OnyxFormKey = OnyxFormKey> = 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<ViewStyle>;
+        /** Submit button styles */
+        submitButtonStyles?: StyleProp<ViewStyle>;
 
-    /** Controls the submit button's visibility */
-    isSubmitButtonVisible?: boolean;
+        /** Controls the submit button's visibility */
+        isSubmitButtonVisible?: boolean;
 
-    /** Callback to submit the form */
-    onSubmit: (values: FormOnyxValues<TFormID>) => void;
+        /** Callback to submit the form */
+        onSubmit: (values: FormOnyxValues<TFormID>) => 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<ViewStyle>;
+        /** Container styles */
+        style?: StyleProp<ViewStyle>;
 
-    /** 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<TFormID extends OnyxFormKey = OnyxFormKey> = {
     resetForm: (optionalValue: FormOnyxValues<TFormID>) => void;

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}
                         />
                     ) : (
                         <Button
@@ -152,6 +155,7 @@ function FormAlertWithSubmitButton({
                             medium={useSmallerSubmitButtonSize}
                             large={!useSmallerSubmitButtonSize}
                             onMouseDown={shouldPreventDefaultFocusOnPress ? (e) => e.preventDefault() : undefined}
+                            sentryLabel={sentryLabel}
                         />
                     )}
                     {!shouldRenderFooterAboveSubmit && footerContent}

src/components/MoneyRequestConfirmationList.tsx

@@ -1161,6 +1161,7 @@ function MoneyRequestConfirmationList({
                 useKeyboardShortcuts
                 // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
                 isLoading={isConfirmed || isConfirming}
+                sentryLabel={CONST.SENTRY_LABEL.MONEY_REQUEST.CONFIRMATION_PAY_BUTTON}
             />
         ) : (
             <>
@@ -1170,6 +1171,7 @@ function MoneyRequestConfirmationList({
                         text={translate('iou.removeThisExpense')}
                         onPress={showRemoveExpenseConfirmModal}
                         style={styles.mb3}
+                        sentryLabel={CONST.SENTRY_LABEL.MONEY_REQUEST.CONFIRMATION_REMOVE_EXPENSE_BUTTON}
                     />
                 )}
                 <EducationalTooltip
@@ -1193,6 +1195,7 @@ function MoneyRequestConfirmationList({
                             useKeyboardShortcuts
                             // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
                             isLoading={isConfirmed || isConfirming}
+                            sentryLabel={CONST.SENTRY_LABEL.MONEY_REQUEST.CONFIRMATION_SUBMIT_BUTTON}
                         />
                     </View>
                 </EducationalTooltip>