[CP Staging] Revert "Add support for viewing full screen Group Chat custom avatars"

src/ROUTES.ts

@@ -254,12 +254,7 @@ const ROUTES = {
     },
     REPORT_AVATAR: {
         route: 'r/:reportID/avatar',
-        getRoute: (reportID: string, isNewGroupChat?: boolean) => {
-            if (isNewGroupChat) {
-                return `r/${reportID}/avatar?isNewGroupChat=${isNewGroupChat}` as const;
-            }
-            return `r/${reportID}/avatar` as const;
-        },
+        getRoute: (reportID: string) => `r/${reportID}/avatar` as const,
     },
     EDIT_CURRENCY_REQUEST: {
         route: 'r/:threadReportID/edit/currency',

src/components/AvatarWithImagePicker.tsx

@@ -121,6 +121,9 @@ type AvatarWithImagePickerProps = {
     /** Allows to open an image without Attachment Picker. */
     enablePreview?: boolean;
 
+    /** Hard disables the "View photo" option */
+    shouldDisableViewPhoto?: boolean;
+
     /** Optionally override the default "Edit" icon */
     editIcon?: IconAsset;
 
@@ -154,6 +157,7 @@ function AvatarWithImagePicker({
     disabled = false,
     onViewPhotoPress,
     enablePreview = false,
+    shouldDisableViewPhoto = false,
     editIcon = Expensicons.Pencil,
     shouldUseStyleUtilityForAnchorPosition = false,
 }: AvatarWithImagePickerProps) {
@@ -334,7 +338,7 @@ function AvatarWithImagePicker({
                                 const menuItems = createMenuItems(openPicker);
 
                                 // If the current avatar isn't a default avatar and we are not overriding this behavior allow the "View Photo" option
-                                if (!isUsingDefaultAvatar) {
+                                if (!shouldDisableViewPhoto && !isUsingDefaultAvatar) {
                                     menuItems.push({
                                         icon: Expensicons.Eye,
                                         text: translate('avatarWithImagePicker.viewPhoto'),

src/libs/Navigation/linkingConfig/config.ts

@@ -24,12 +24,7 @@ const config: LinkingOptions<RootStackParamList>['config'] = {
         [SCREENS.ATTACHMENTS]: ROUTES.ATTACHMENTS.route,
         [SCREENS.PROFILE_AVATAR]: ROUTES.PROFILE_AVATAR.route,
         [SCREENS.WORKSPACE_AVATAR]: ROUTES.WORKSPACE_AVATAR.route,
-        [SCREENS.REPORT_AVATAR]: {
-            path: ROUTES.REPORT_AVATAR.route,
-            parse: {
-                isNewGroupChat: (isNewGroupChat: string) => isNewGroupChat === 'true',
-            },
-        },
+        [SCREENS.REPORT_AVATAR]: ROUTES.REPORT_AVATAR.route,
         [SCREENS.TRANSACTION_RECEIPT]: ROUTES.TRANSACTION_RECEIPT.route,
         [SCREENS.WORKSPACE_JOIN_USER]: ROUTES.WORKSPACE_JOIN_USER.route,
         [SCREENS.REPORT]: ROUTES.REPORT_WITH_ID.route,

src/libs/Navigation/types.ts

@@ -1236,7 +1236,6 @@ type AuthScreensParamList = CentralPaneScreensParamList &
         };
         [SCREENS.REPORT_AVATAR]: {
             reportID: string;
-            isNewGroupChat: boolean;
         };
         [SCREENS.NOT_FOUND]: undefined;
         [NAVIGATORS.LEFT_MODAL_NAVIGATOR]: NavigatorScreenParams<LeftModalNavigatorParamList>;

src/libs/ReportUtils.ts

@@ -278,7 +278,6 @@ type OptimisticChatReport = Pick<
     | 'description'
     | 'writeCapability'
     | 'avatarUrl'
-    | 'avatarFileName'
     | 'invoiceReceiver'
     | 'isHidden'
 > & {
@@ -4613,7 +4612,6 @@ function buildOptimisticChatReport(
     parentReportID = '',
     description = '',
     avatarUrl = '',
-    avatarFileName = '',
     optimisticReportID = '',
     shouldShowParticipants = true,
 ): OptimisticChatReport {
@@ -4655,7 +4653,6 @@ function buildOptimisticChatReport(
         description,
         writeCapability,
         avatarUrl,
-        avatarFileName,
     };
 
     if (chatType === CONST.REPORT.CHAT_TYPE.INVOICE) {
@@ -4673,7 +4670,6 @@ function buildOptimisticGroupChatReport(
     participantAccountIDs: number[],
     reportName: string,
     avatarUri: string,
-    avatarFileName: string,
     optimisticReportID?: string,
     notificationPreference?: NotificationPreference,
 ) {
@@ -4692,7 +4688,6 @@ function buildOptimisticGroupChatReport(
         undefined,
         undefined,
         avatarUri,
-        avatarFileName,
         optimisticReportID,
     );
 }
@@ -5072,7 +5067,6 @@ function buildOptimisticWorkspaceChats(policyID: string, policyName: string, exp
         undefined,
         undefined,
         undefined,
-        undefined,
         expenseReportId,
     );
     const expenseChatReportID = expenseChatData.reportID;
@@ -5186,7 +5180,6 @@ function buildTransactionThread(
         '',
         '',
         '',
-        '',
         false,
     );
 }

src/libs/actions/Report.ts

@@ -680,7 +680,6 @@ function updateGroupChatAvatar(reportID: string, file?: File | CustomRNImageMani
             key: `${ONYXKEYS.COLLECTION.REPORT}${reportID}`,
             value: {
                 avatarUrl: file?.uri ?? '',
-                avatarFileName: file?.name ?? '',
                 pendingFields: {
                     avatar: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                 },
@@ -691,15 +690,12 @@ function updateGroupChatAvatar(reportID: string, file?: File | CustomRNImageMani
         },
     ];
 
-    const fetchedReport = ReportConnection.getAllReports()?.[`${ONYXKEYS.COLLECTION.REPORT}${reportID}`];
-
     const failureData: OnyxUpdate[] = [
         {
             onyxMethod: Onyx.METHOD.MERGE,
             key: `${ONYXKEYS.COLLECTION.REPORT}${reportID}`,
             value: {
-                avatarFileName: fetchedReport?.avatarFileName ?? null,
-                avatarUrl: fetchedReport?.avatarUrl ?? null,
+                avatarUrl: ReportConnection.getAllReports()?.[`${ONYXKEYS.COLLECTION.REPORT}${reportID}`]?.avatarUrl ?? null,
                 pendingFields: {
                     avatar: null,
                 },
@@ -997,14 +993,7 @@ function navigateToAndOpenReport(
     if (isEmptyObject(chat)) {
         if (isGroupChat) {
             // If we are creating a group chat then participantAccountIDs is expected to contain currentUserAccountID
-            newChat = ReportUtils.buildOptimisticGroupChatReport(
-                participantAccountIDs,
-                reportName ?? '',
-                avatarUri ?? '',
-                avatarFile?.name ?? '',
-                optimisticReportID,
-                CONST.REPORT.NOTIFICATION_PREFERENCE.HIDDEN,
-            );
+            newChat = ReportUtils.buildOptimisticGroupChatReport(participantAccountIDs, reportName ?? '', avatarUri ?? '', optimisticReportID, CONST.REPORT.NOTIFICATION_PREFERENCE.HIDDEN);
         } else {
             newChat = ReportUtils.buildOptimisticChatReport(
                 [...participantAccountIDs, currentUserAccountID],

src/pages/NewChatConfirmPage.tsx

@@ -152,9 +152,9 @@ function NewChatConfirmPage({newGroupDraft, allPersonalDetails}: NewChatConfirmP
                     }}
                     size={CONST.AVATAR_SIZE.XLARGE}
                     avatarStyle={styles.avatarXLarge}
+                    shouldDisableViewPhoto
                     editIcon={Expensicons.Camera}
                     editIconStyle={styles.smallEditIconAccount}
-                    onViewPhotoPress={() => Navigation.navigate(ROUTES.REPORT_AVATAR.getRoute(optimisticReportID.current, true))}
                     shouldUseStyleUtilityForAnchorPosition
                     style={styles.w100}
                 />

src/pages/ReportAvatar.tsx

@@ -1,7 +1,7 @@
 import type {StackScreenProps} from '@react-navigation/stack';
 import React from 'react';
 import type {OnyxCollection, OnyxEntry} from 'react-native-onyx';
-import {useOnyx, withOnyx} from 'react-native-onyx';
+import {withOnyx} from 'react-native-onyx';
 import AttachmentModal from '@components/AttachmentModal';
 import Navigation from '@libs/Navigation/Navigation';
 import type {AuthScreensParamList} from '@libs/Navigation/types';
@@ -20,46 +20,24 @@ type ReportAvatarOnyxProps = {
 
 type ReportAvatarProps = ReportAvatarOnyxProps & StackScreenProps<AuthScreensParamList, typeof SCREENS.REPORT_AVATAR>;
 
-function ReportAvatar({report = {} as Report, policies, isLoadingApp = true, route}: ReportAvatarProps) {
+function ReportAvatar({report = {} as Report, policies, isLoadingApp = true}: ReportAvatarProps) {
     const policy = policies?.[`${ONYXKEYS.COLLECTION.POLICY}${report?.policyID ?? '-1'}`];
-    let title;
-    let avatarURL;
-    let fileName;
-    // eslint-disable-next-line rulesdir/no-negated-variables
-    let shouldShowNotFoundPage;
-
-    const shouldUseGroupChatDraft = !!route.params.isNewGroupChat;
-
-    const [groupChatDraft] = useOnyx(ONYXKEYS.NEW_GROUP_CHAT_DRAFT, {initWithStoredValues: shouldUseGroupChatDraft});
-
-    if (shouldUseGroupChatDraft) {
-        avatarURL = groupChatDraft?.avatarUri ?? undefined;
-        fileName = groupChatDraft?.avatarFileName ?? undefined;
-        // When user enters custom group name, it typically stored in groupChatDraft.reportName
-        // If that is null then we will use ReportUtils.getGroupChatName to get the name
-        /* eslint-disable @typescript-eslint/prefer-nullish-coalescing */
-        title = groupChatDraft?.reportName || ReportUtils.getGroupChatName(groupChatDraft?.participants.map((participant) => participant.accountID) ?? [], true);
-        shouldShowNotFoundPage = !isLoadingApp && !groupChatDraft;
-    } else {
-        avatarURL = policy ? ReportUtils.getWorkspaceAvatar(report) : report?.avatarUrl;
-        // In the case of default workspace avatar, originalFileName prop takes policyID as value to get the color of the avatar
-        fileName = policy ? policy?.originalFileName ?? policy?.id ?? report?.policyID : report?.avatarFileName;
-        title = policy ? ReportUtils.getPolicyName(report, false, policy) : ReportUtils.getReportName(report);
-        shouldShowNotFoundPage = !isLoadingApp && !report?.reportID;
-    }
+    const policyName = ReportUtils.getPolicyName(report, false, policy);
+    const avatarURL = ReportUtils.getWorkspaceAvatar(report);
 
     return (
         <AttachmentModal
-            headerTitle={title}
+            headerTitle={policyName}
             defaultOpen
             source={UserUtils.getFullSizeAvatar(avatarURL, 0)}
             onModalClose={() => {
                 Navigation.goBack(ROUTES.REPORT_WITH_ID_DETAILS.getRoute(report?.reportID ?? '-1'));
             }}
             isWorkspaceAvatar
             maybeIcon
-            originalFileName={fileName}
-            shouldShowNotFoundPage={shouldShowNotFoundPage}
+            // In the case of default workspace avatar, originalFileName prop takes policyID as value to get the color of the avatar
+            originalFileName={policy?.originalFileName ?? policy?.id ?? report?.policyID}
+            shouldShowNotFoundPage={!report?.reportID && !isLoadingApp}
             isLoading={(!report?.reportID || !policy?.id) && !!isLoadingApp}
         />
     );

src/pages/ReportDetailsPage.tsx

@@ -488,6 +488,7 @@ function ReportDetailsPage({policies, report, session, personalDetails}: ReportD
                     isUsingDefaultAvatar={!report.avatarUrl}
                     size={CONST.AVATAR_SIZE.XLARGE}
                     avatarStyle={styles.avatarXLarge}
+                    shouldDisableViewPhoto
                     onImageRemoved={() => {
                         // Calling this without a file will remove the avatar
                         Report.updateGroupChatAvatar(report.reportID ?? '');
@@ -501,7 +502,6 @@ function ReportDetailsPage({policies, report, session, personalDetails}: ReportD
                     onErrorClose={() => Report.clearAvatarErrors(report.reportID ?? '-1')}
                     shouldUseStyleUtilityForAnchorPosition
                     style={[styles.w100, styles.mb3]}
-                    onViewPhotoPress={() => Navigation.navigate(ROUTES.REPORT_AVATAR.getRoute(report.reportID))}
                 />
             );
         }

src/types/onyx/Report.ts

@@ -71,11 +71,6 @@ type Report = OnyxCommon.OnyxValueWithOfflineFeedback<
         /** The URL of the Group Chat report custom avatar */
         avatarUrl?: string;
 
-        /** The file name of the Group Chat report custom avatar
-         *  This field is not coming from backend, so it's for client side only
-         */
-        avatarFileName?: string;
-
         /** The specific type of chat */
         chatType?: ValueOf<typeof CONST.REPORT.CHAT_TYPE>;