Support read only messages

src/CONST.ts

@@ -841,6 +841,12 @@ const CONST = {
         OWNER_EMAIL_FAKE: '__FAKE__',
         OWNER_ACCOUNT_ID_FAKE: 0,
         DEFAULT_REPORT_NAME: 'Chat Report',
+        PERMISSIONS: {
+            READ: 'read',
+            WRITE: 'write',
+            SHARE: 'share',
+            OWN: 'own',
+        }
     },
     NEXT_STEP: {
         FINISHED: 'Finished!',

src/components/TaskHeaderActionButton.tsx

@@ -25,6 +25,10 @@ function TaskHeaderActionButton({report, session}: TaskHeaderActionButtonProps)
     const {translate} = useLocalize();
     const styles = useThemeStyles();
 
+    if (ReportUtils.isReadOnly(report)) {
+        return null;
+    }
+
     return (
         <View style={[styles.flexRow, styles.alignItemsCenter, styles.justifyContentEnd]}>
             <Button

src/languages/en.ts

@@ -2741,6 +2741,16 @@ export default {
         },
         copyReferralLink: 'Copy invite link',
     },
+    onboardingBottomMessage: {
+        [CONST.INTRO_CHOICES.MANAGE_TEAM]: {
+            phrase1: 'Chat with your setup specialist in ',
+            phrase2: ' for help',
+        },
+        default: {
+            phrase1: 'Message ',
+            phrase2: ' for help with setup',
+        },
+    },
     violations: {
         allTagLevelsRequired: 'All tags required',
         autoReportedRejectedExpense: ({rejectReason, rejectedBy}: ViolationsAutoReportedRejectedExpenseParams) => `${rejectedBy} rejected this expense with the comment "${rejectReason}"`,

src/languages/es.ts

@@ -3234,6 +3234,16 @@ export default {
         },
         copyReferralLink: 'Copiar enlace de invitación',
     },
+    onboardingBottomMessage: {
+        [CONST.INTRO_CHOICES.MANAGE_TEAM]: {
+            phrase1: 'Chatea con tu especialista asignado en ',
+            phrase2: ' para obtener ayuda',
+        },
+        default: {
+            phrase1: 'Envía un email a ',
+            phrase2: ' para obtener ayuda con la configuración',
+        },
+    },
     violations: {
         allTagLevelsRequired: 'Todas las etiquetas son obligatorias',
         autoReportedRejectedExpense: ({rejectedBy, rejectReason}: ViolationsAutoReportedRejectedExpenseParams) => `${rejectedBy} rechazó la solicitud y comentó "${rejectReason}"`,

src/libs/ReportUtils.ts

@@ -1172,10 +1172,25 @@ function isJoinRequestInAdminRoom(report: OnyxEntry<Report>): boolean {
     return ReportActionsUtils.isActionableJoinRequestPending(report.reportID);
 }
 
+/**
+ * Checks if report is in read-only mode.
+ */
+function isReadOnly(report: OnyxEntry<Report>): boolean {
+    if (Array.isArray(report?.permissions)) {
+        return !report?.permissions?.includes(CONST.REPORT.PERMISSIONS.WRITE);
+    }
+
+    return false;
+}
+
 /**
  * Checks if the current user is allowed to comment on the given report.
  */
 function isAllowedToComment(report: OnyxEntry<Report>): boolean {
+    if (isReadOnly(report)) {
+        return false;
+    }
+
     // Default to allowing all users to post
     const capability = report?.writeCapability ?? CONST.REPORT.WRITE_CAPABILITIES.ALL;
 
@@ -5374,7 +5389,7 @@ function canUserPerformWriteAction(report: OnyxEntry<Report>) {
         return false;
     }
 
-    return !isArchivedRoom(report) && isEmptyObject(reportErrors) && report && isAllowedToComment(report) && !isAnonymousUser;
+    return !isArchivedRoom(report) && isEmptyObject(reportErrors) && report && isAllowedToComment(report) && !isAnonymousUser && !isReadOnly(report);
 }
 
 /**
@@ -6254,7 +6269,6 @@ export {
     getParsedComment,
     getParticipantAccountIDs,
     getParticipants,
-    getPayeeName,
     getPendingChatMembers,
     getPersonalDetailsForAccountID,
     getPolicyDescriptionText,
@@ -6289,6 +6303,7 @@ export {
     getWorkspaceChats,
     getWorkspaceIcon,
     goBackToDetailsPage,
+    getPayeeName,
     hasActionsWithErrors,
     hasAutomatedExpensifyAccountIDs,
     hasExpensifyGuidesEmails,
@@ -6376,6 +6391,7 @@ export {
     isValidReport,
     isValidReportIDFromPath,
     isWaitingForAssigneeToCompleteTask,
+    isReadOnly,
     navigateToDetailsPage,
     navigateToPrivateNotes,
     parseReportRouteParams,

src/libs/actions/Task.ts

@@ -1003,6 +1003,10 @@ function canModifyTask(taskReport: OnyxEntry<OnyxTypes.Report>, sessionAccountID
         return true;
     }
 
+    if (ReportUtils.isReadOnly(ReportUtils.getReport(taskReport?.reportID))) {
+        return false;
+    }
+
     return !isEmptyObject(taskReport) && ReportUtils.isAllowedToComment(taskReport);
 }
 

src/pages/home/HeaderView.tsx

@@ -130,7 +130,7 @@ function HeaderView({report, personalDetails, parentReport, parentReportAction,
         }
 
         // Task is not closed
-        if (report.stateNum !== CONST.REPORT.STATE_NUM.APPROVED && report.statusNum !== CONST.REPORT.STATUS_NUM.CLOSED && canModifyTask) {
+        if (!ReportUtils.isReadOnly(report) && report.stateNum !== CONST.REPORT.STATE_NUM.APPROVED && report.statusNum !== CONST.REPORT.STATUS_NUM.CLOSED && canModifyTask) {
             threeDotMenuItems.push({
                 icon: Expensicons.Trashcan,
                 text: translate('common.delete'),

src/pages/home/ReportScreen.tsx

@@ -207,6 +207,7 @@ function ReportScreen({
             isOptimisticReport: reportProp?.isOptimisticReport,
             lastMentionedTime: reportProp?.lastMentionedTime,
             avatarUrl: reportProp?.avatarUrl,
+            permissions: reportProp?.permissions,
         }),
         [
             reportProp?.lastReadTime,
@@ -246,6 +247,7 @@ function ReportScreen({
             reportProp?.isOptimisticReport,
             reportProp?.lastMentionedTime,
             reportProp?.avatarUrl,
+            reportProp?.permissions,
         ],
     );
 

src/pages/home/report/ContextMenu/ContextMenuActions.tsx

@@ -517,5 +517,18 @@ const ContextMenuActions: ContextMenuAction[] = [
     },
 ];
 
+const restrictedReadOnlyActions = [
+    'common.download',
+    'reportActionContextMenu.replyInThread',
+    'reportActionContextMenu.editAction',
+    'reportActionContextMenu.joinThread',
+    'reportActionContextMenu.deleteAction',
+];
+
+const RestrictedReadOnlyContextMenuActions: ContextMenuAction[] = ContextMenuActions.filter(
+    (action) => 'textTranslateKey' in action && restrictedReadOnlyActions.includes(action.textTranslateKey),
+);
+
+export {RestrictedReadOnlyContextMenuActions};
 export default ContextMenuActions;
 export type {ContextMenuActionPayload, ContextMenuAction};

src/pages/home/report/OnboardingReportFooterMessage.tsx

@@ -0,0 +1,107 @@
+import React, {useMemo} from 'react';
+import {View} from 'react-native';
+import {withOnyx} from 'react-native-onyx';
+import type {OnyxCollection, OnyxEntry} from 'react-native-onyx';
+import Text from '@components/Text';
+import TextLink from '@components/TextLink';
+import useLocalize from '@hooks/useLocalize';
+import useThemeStyles from '@hooks/useThemeStyles';
+import useWindowDimensions from '@hooks/useWindowDimensions';
+import * as PolicyUtils from '@libs/PolicyUtils';
+import Navigation from '@navigation/Navigation';
+import * as ReportInstance from '@userActions/Report';
+import type {OnboardingPurposeType} from '@src/CONST';
+import CONST from '@src/CONST';
+import ONYXKEYS from '@src/ONYXKEYS';
+import ROUTES from '@src/ROUTES';
+import type {Policy as PolicyType, Report} from '@src/types/onyx';
+
+type OnboardingReportFooterMessageOnyxProps = {
+    /** Saved onboarding purpose selected by the user */
+    choice: OnyxEntry<OnboardingPurposeType>;
+
+    /** Collection of reports */
+    reports: OnyxCollection<Report>;
+
+    /** The list of this user's policies */
+    policies: OnyxCollection<PolicyType>;
+};
+type OnboardingReportFooterMessageProps = OnboardingReportFooterMessageOnyxProps;
+
+function OnboardingReportFooterMessage({choice, reports, policies}: OnboardingReportFooterMessageProps) {
+    const {translate} = useLocalize();
+    const styles = useThemeStyles();
+    const {isSmallScreenWidth} = useWindowDimensions();
+
+    const adminChatReport = useMemo(() => {
+        const adminsReports = Object.values(reports ?? {}).filter((report) => report?.chatType === CONST.REPORT.CHAT_TYPE.POLICY_ADMINS);
+        const activePolicies = Object.values(policies ?? {}).filter((policy) => PolicyUtils.shouldShowPolicy(policy, false));
+
+        return adminsReports.find((report) => activePolicies.find((policy) => policy?.id === report?.policyID));
+    }, [policies, reports]);
+
+    const content = useMemo(() => {
+        switch (choice) {
+            case CONST.ONBOARDING_CHOICES.MANAGE_TEAM:
+                return (
+                    <>
+                        {translate('onboardingBottomMessage.newDotManageTeam.phrase1')}
+                        <TextLink
+                            style={styles.label}
+                            onPress={() => Navigation.navigate(ROUTES.REPORT_WITH_ID.getRoute(adminChatReport?.reportID ?? ''))}
+                        >
+                            {adminChatReport?.reportName ?? CONST.REPORT.WORKSPACE_CHAT_ROOMS.ADMINS}
+                        </TextLink>
+                        {translate('onboardingBottomMessage.newDotManageTeam.phrase2')}
+                    </>
+                );
+            default:
+                return (
+                    <>
+                        {translate('onboardingBottomMessage.default.phrase1')}
+                        <TextLink
+                            style={styles.label}
+                            onPress={() => ReportInstance.navigateToConciergeChat()}
+                        >
+                            {`${CONST?.CONCIERGE_CHAT_NAME}`}
+                        </TextLink>
+                        {translate('onboardingBottomMessage.default.phrase2')}
+                    </>
+                );
+        }
+    }, [adminChatReport?.reportName, adminChatReport?.reportID, choice, styles.label, translate]);
+
+    return (
+        <View
+            style={[
+                styles.chatFooter,
+                isSmallScreenWidth ? styles.mb5 : styles.mb4,
+                styles.mh5,
+                styles.mt4,
+                styles.flexRow,
+                styles.alignItemsCenter,
+                styles.p4,
+                styles.borderRadiusComponentLarge,
+                styles.hoveredComponentBG,
+                styles.breakWord,
+                styles.justifyContentCenter,
+            ]}
+        >
+            <Text style={[styles.textSupporting, styles.label]}>{content}</Text>
+        </View>
+    );
+}
+
+OnboardingReportFooterMessage.displayName = 'OnboardingReportFooterMessage';
+
+export default withOnyx<OnboardingReportFooterMessageProps, OnboardingReportFooterMessageOnyxProps>({
+    choice: {
+        key: ONYXKEYS.ONBOARDING_PURPOSE_SELECTED,
+    },
+    reports: {
+        key: ONYXKEYS.COLLECTION.REPORT,
+    },
+    policies: {
+        key: ONYXKEYS.COLLECTION.POLICY,
+    },
+})(OnboardingReportFooterMessage);

src/pages/home/report/ReportActionItem.tsx

@@ -66,6 +66,7 @@ import type * as OnyxTypes from '@src/types/onyx';
 import type {OriginalMessageActionableMentionWhisper, OriginalMessageActionableTrackedExpenseWhisper, OriginalMessageJoinPolicyChangeLog} from '@src/types/onyx/OriginalMessage';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
 import AnimatedEmptyStateBackground from './AnimatedEmptyStateBackground';
+import {RestrictedReadOnlyContextMenuActions} from './ContextMenu/ContextMenuActions';
 import MiniReportActionContextMenu from './ContextMenu/MiniReportActionContextMenu';
 import * as ReportActionContextMenu from './ContextMenu/ReportActionContextMenu';
 import {hideContextMenu} from './ContextMenu/ReportActionContextMenu';
@@ -914,6 +915,7 @@ function ReportActionItem({
                             originalReportID={originalReportID ?? ''}
                             isArchivedRoom={ReportUtils.isArchivedRoom(report)}
                             displayAsGroup={displayAsGroup}
+                            disabledActions={ReportUtils.isReadOnly(report) ? RestrictedReadOnlyContextMenuActions : []}
                             isVisible={hovered && draftMessage === undefined && !hasErrors}
                             draftMessage={draftMessage}
                             isChronosReport={ReportUtils.chatIncludesChronos(originalReport)}

src/pages/home/report/ReportFooter.tsx

@@ -20,6 +20,7 @@ import ONYXKEYS from '@src/ONYXKEYS';
 import type * as OnyxTypes from '@src/types/onyx';
 import type {PendingAction} from '@src/types/onyx/OnyxCommon';
 import type {EmptyObject} from '@src/types/utils/EmptyObject';
+import OnboardingReportFooterMessage from './OnboardingReportFooterMessage';
 import ReportActionCompose from './ReportActionCompose/ReportActionCompose';
 
 type ReportFooterOnyxProps = {
@@ -81,6 +82,7 @@ function ReportFooter({
 
     const isSmallSizeLayout = windowWidth - (isSmallScreenWidth ? 0 : variables.sideBarWidth) < variables.anonymousReportFooterBreakpoint;
     const hideComposer = !ReportUtils.canUserPerformWriteAction(report);
+    const isReadOnlyReport = ReportUtils.isReadOnly(report);
 
     const allPersonalDetails = usePersonalDetails();
 
@@ -128,6 +130,10 @@ function ReportFooter({
         [report.reportID, handleCreateTask],
     );
 
+    if (isReadOnlyReport) {
+        return <OnboardingReportFooterMessage />;
+    }
+
     return (
         <>
             {hideComposer && (

src/styles/index.ts

@@ -531,6 +531,10 @@ const styles = (theme: ThemeColors) =>
             borderRadius: variables.buttonBorderRadius,
         },
 
+        borderRadiusComponentLarge: {
+            borderRadius: variables.componentBorderRadiusLarge,
+        },
+
         bottomTabBarContainer: {
             flexDirection: 'row',
             height: variables.bottomTabHeight,

src/types/onyx/Report.ts

@@ -186,6 +186,8 @@ type Report = OnyxCommon.OnyxValueWithOfflineFeedback<
         transactionThreadReportID?: string;
 
         fieldList?: Record<string, PolicyReportField>;
+
+        permissions?: Array<ValueOf<typeof CONST.REPORT.PERMISSIONS>>;
     },
     PolicyReportField['fieldID']
 >;