Revert "[TS migration] Migrate 'AttachmentModal.js' component to TypeScript"

src/components/ReportActionItem/ReportActionItemImage.tsx

@@ -1,8 +1,8 @@
 import Str from 'expensify-common/lib/str';
 import React from 'react';
 import type {ReactElement} from 'react';
-import type {ImageSourcePropType, ViewStyle} from 'react-native';
 import {View} from 'react-native';
+import type {ImageSourcePropType} from 'react-native';
 import AttachmentModal from '@components/AttachmentModal';
 import EReceiptThumbnail from '@components/EReceiptThumbnail';
 import Image from '@components/Image';
@@ -79,25 +79,30 @@ function ReportActionItemImage({thumbnail, image, enablePreviewModal = false, tr
         return (
             <ShowContextMenuContext.Consumer>
                 {({report}) => (
+                    // @ts-expect-error TODO: Remove this once AttachmentModal (https://github.com/Expensify/App/issues/25130) is migrated to TypeScript.
                     <AttachmentModal
                         source={imageSource}
                         isAuthTokenRequired={!isLocalFile}
                         report={report}
                         isReceiptAttachment
                         canEditReceipt={canEditReceipt}
-                        allowDownload
+                        allowToDownload
                         originalFileName={transaction?.filename}
                     >
-                        {({show}) => (
-                            <PressableWithoutFocus
-                                style={[styles.w100, styles.h100, styles.noOutline as ViewStyle]}
-                                onPress={show}
-                                accessibilityRole={CONST.ROLE.BUTTON}
-                                accessibilityLabel={translate('accessibilityHints.viewAttachment')}
-                            >
-                                {receiptImageComponent}
-                            </PressableWithoutFocus>
-                        )}
+                        {
+                            // @ts-expect-error TODO: Remove this once AttachmentModal (https://github.com/Expensify/App/issues/25130) is migrated to TypeScript.
+                            ({show}) => (
+                                <PressableWithoutFocus
+                                    // @ts-expect-error TODO: Remove this once AttachmentModal (https://github.com/Expensify/App/issues/25130) is migrated to TypeScript.
+                                    style={[styles.noOutline, styles.w100, styles.h100]}
+                                    onPress={show}
+                                    accessibilityRole={CONST.ACCESSIBILITY_ROLE.IMAGEBUTTON}
+                                    accessibilityLabel={translate('accessibilityHints.viewAttachment')}
+                                >
+                                    {receiptImageComponent}
+                                </PressableWithoutFocus>
+                            )
+                        }
                     </AttachmentModal>
                 )}
             </ShowContextMenuContext.Consumer>

src/libs/TransactionUtils.ts

@@ -36,10 +36,10 @@ Onyx.connect({
     callback: (value) => (allReports = value),
 });
 
-function isDistanceRequest(transaction: OnyxEntry<Transaction>): boolean {
+function isDistanceRequest(transaction: Transaction): boolean {
     // This is used during the request creation flow before the transaction has been saved to the server
     if (lodashHas(transaction, 'iouRequestType')) {
-        return transaction?.iouRequestType === CONST.IOU.REQUEST_TYPE.DISTANCE;
+        return transaction.iouRequestType === CONST.IOU.REQUEST_TYPE.DISTANCE;
     }
 
     // This is the case for transaction objects once they have been saved to the server

src/pages/ReportAvatar.tsx

@@ -28,6 +28,7 @@ function ReportAvatar({report = {} as Report, policies, isLoadingApp = true}: Re
 
     return (
         <AttachmentModal
+            // @ts-expect-error TODO: Remove this once AttachmentModal (https://github.com/Expensify/App/issues/25130) is migrated to TypeScript.
             headerTitle={policyName}
             defaultOpen
             source={UserUtils.getFullSizeAvatar(avatarURL, 0)}
@@ -37,7 +38,7 @@ function ReportAvatar({report = {} as Report, policies, isLoadingApp = true}: Re
             isWorkspaceAvatar
             originalFileName={policy?.originalFileName ?? policyName}
             shouldShowNotFoundPage={!report?.reportID && !isLoadingApp}
-            isLoading={(!report?.reportID || !policy?.id) && !!isLoadingApp}
+            isLoading={(!report?.reportID || !policy?.id) && isLoadingApp}
         />
     );
 }

src/pages/home/report/ReportAttachments.tsx

@@ -1,6 +1,5 @@
 import type {StackScreenProps} from '@react-navigation/stack';
 import React, {useCallback} from 'react';
-import type {Attachment} from '@components/AttachmentModal';
 import AttachmentModal from '@components/AttachmentModal';
 import ComposerFocusManager from '@libs/ComposerFocusManager';
 import Navigation from '@libs/Navigation/Navigation';
@@ -9,6 +8,19 @@ import * as ReportUtils from '@libs/ReportUtils';
 import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
 
+type File = {
+    name: string;
+};
+
+type Attachment = {
+    file: File;
+    hasBeenFlagged: boolean;
+    isAuthTokenRequired: boolean;
+    isReceipt: boolean;
+    reportActionID: string;
+    source: string;
+};
+
 type ReportAttachmentsProps = StackScreenProps<AuthScreensParamList, typeof SCREENS.REPORT_ATTACHMENTS>;
 
 function ReportAttachments({route}: ReportAttachmentsProps) {
@@ -21,14 +33,15 @@ function ReportAttachments({route}: ReportAttachmentsProps) {
 
     const onCarouselAttachmentChange = useCallback(
         (attachment: Attachment) => {
-            const routeToNavigate = ROUTES.REPORT_ATTACHMENTS.getRoute(reportID, String(attachment.source));
+            const routeToNavigate = ROUTES.REPORT_ATTACHMENTS.getRoute(reportID, attachment.source);
             Navigation.navigate(routeToNavigate);
         },
         [reportID],
     );
 
     return (
         <AttachmentModal
+            // @ts-expect-error TODO: Remove this once AttachmentModal (https://github.com/Expensify/App/issues/25130) is migrated to TypeScript.
             allowDownload
             defaultOpen
             report={report}

src/pages/settings/Profile/ProfileAvatar.tsx

@@ -34,14 +34,15 @@ function ProfileAvatar({route, personalDetails, isLoadingApp = true}: ProfileAva
 
     return (
         <AttachmentModal
+            // @ts-expect-error TODO: Remove this once AttachmentModal (https://github.com/Expensify/App/issues/25130) is migrated to TypeScript.
             headerTitle={personalDetail?.displayName ?? ''}
             defaultOpen
             source={UserUtils.getFullSizeAvatar(avatarURL, accountID)}
             onModalClose={() => {
                 Navigation.goBack();
             }}
             originalFileName={personalDetail?.originalFileName ?? ''}
-            isLoading={!!isLoading}
+            isLoading={isLoading}
             shouldShowNotFoundPage={!avatarURL}
         />
     );

src/pages/workspace/WorkspaceAvatar.tsx

@@ -24,6 +24,7 @@ function WorkspaceAvatar({route, policy, isLoadingApp = true}: WorkspaceAvatarPr
 
     return (
         <AttachmentModal
+            // @ts-expect-error TODO: Remove this once AttachmentModal (https://github.com/Expensify/App/issues/25130) is migrated to TypeScript.
             headerTitle={policy?.name ?? ''}
             defaultOpen
             source={UserUtils.getFullSizeAvatar(avatarURL, 0)}
@@ -33,7 +34,7 @@ function WorkspaceAvatar({route, policy, isLoadingApp = true}: WorkspaceAvatarPr
             isWorkspaceAvatar
             originalFileName={policy?.originalFileName ?? policy?.name ?? ''}
             shouldShowNotFoundPage={!Object.keys(policy ?? {}).length && !isLoadingApp}
-            isLoading={!Object.keys(policy ?? {}).length && !!isLoadingApp}
+            isLoading={!Object.keys(policy ?? {}).length && isLoadingApp}
         />
     );
 }

src/styles/utils/generators/ModalStyleUtils.ts

@@ -1,9 +1,9 @@
 import type {ViewStyle} from 'react-native';
 import type {ModalProps} from 'react-native-modal';
+import type {ValueOf} from 'type-fest';
 import type {ThemeStyles} from '@styles/index';
 import variables from '@styles/variables';
 import CONST from '@src/CONST';
-import type ModalType from '@src/types/utils/ModalType';
 import type StyleUtilGenerator from './types';
 
 function getCenteredModalStyles(styles: ThemeStyles, windowWidth: number, isSmallScreenWidth: boolean, isFullScreenWhenSmall = false): ViewStyle {
@@ -15,6 +15,8 @@ function getCenteredModalStyles(styles: ThemeStyles, windowWidth: number, isSmal
     };
 }
 
+type ModalType = ValueOf<typeof CONST.MODAL.MODAL_TYPE>;
+
 type WindowDimensions = {
     windowWidth: number;
     windowHeight: number;