diff --git a/src/ROUTES.ts b/src/ROUTES.ts
index 937e74c6231dd..53974d4f3dadc 100644
--- a/src/ROUTES.ts
+++ b/src/ROUTES.ts
@@ -4,6 +4,7 @@
  * Refer to ./contributingGuides/philosophies/ROUTING.md for information on how to construct routes.
  */
 import type {TupleToUnion, ValueOf} from 'type-fest';
+import type {UpperCaseCharacters} from 'type-fest/source/internal';
 import type {SearchQueryString} from './components/Search/types';
 import type CONST from './CONST';
 import type {IOUAction, IOUType} from './CONST';
@@ -1261,7 +1262,7 @@ const ROUTES = {
     },
     WORKSPACE_AVATAR: {
         route: 'workspaces/:policyID/avatar',
-        getRoute: (policyID: string) => `workspaces/${policyID}/avatar` as const,
+        getRoute: (policyID: string, fallbackLetter?: UpperCaseCharacters) => `workspaces/${policyID}/avatar${fallbackLetter ? `?letter=${fallbackLetter}` : ''}` as const,
     },
     WORKSPACE_JOIN_USER: {
         route: 'workspaces/:policyID/join',
diff --git a/src/components/ReportActionAvatars/ReportActionAvatar.tsx b/src/components/ReportActionAvatars/ReportActionAvatar.tsx
index b7369d806e67a..f24c35f753cb5 100644
--- a/src/components/ReportActionAvatars/ReportActionAvatar.tsx
+++ b/src/components/ReportActionAvatars/ReportActionAvatar.tsx
@@ -3,6 +3,7 @@ import React, {useMemo} from 'react';
 import type {ColorValue, ImageStyle, StyleProp, ViewStyle} from 'react-native';
 import {View} from 'react-native';
 import type {ValueOf} from 'type-fest';
+import type {UpperCaseCharacters} from 'type-fest/source/internal';
 import Avatar from '@components/Avatar';
 import Icon from '@components/Icon';
 import {WorkspaceBuilding} from '@components/Icon/WorkspaceDefaultAvatars';
@@ -67,7 +68,7 @@ type AvatarSizeToStylesMap = Record<AvatarSizeToStyles, AvatarStyles>;
 
 function ProfileAvatar(props: Parameters<typeof Avatar>[0] & {useProfileNavigationWrapper?: boolean}) {
     const {translate} = useLocalize();
-    const {avatarID, useProfileNavigationWrapper, type} = props;
+    const {avatarID, useProfileNavigationWrapper, type, name} = props;
 
     if (!useProfileNavigationWrapper) {
         return (
@@ -77,10 +78,11 @@ function ProfileAvatar(props: Parameters<typeof Avatar>[0] & {useProfileNavigati
     }
 
     const isWorkspace = type === CONST.ICON_TYPE_WORKSPACE;
+    const firstLetter = (name?.at(0) ?? 'A').toUpperCase() as UpperCaseCharacters;
 
     const onPress = () => {
         if (isWorkspace) {
-            return Navigation.navigate(ROUTES.WORKSPACE_AVATAR.getRoute(String(avatarID)));
+            return Navigation.navigate(ROUTES.WORKSPACE_AVATAR.getRoute(String(avatarID), firstLetter));
         }
         return Navigation.navigate(ROUTES.PROFILE_AVATAR.getRoute(Number(avatarID), Navigation.getActiveRoute()));
     };
diff --git a/src/components/ReportActionAvatars/index.tsx b/src/components/ReportActionAvatars/index.tsx
index f3ec5b24563b5..fca0fc6a45456 100644
--- a/src/components/ReportActionAvatars/index.tsx
+++ b/src/components/ReportActionAvatars/index.tsx
@@ -92,7 +92,9 @@ function ReportActionAvatars({
         potentialReportID ??
         ([CONST.REPORT.ACTIONS.TYPE.REPORT_PREVIEW, CONST.REPORT.ACTIONS.TYPE.TRIP_PREVIEW].find((act) => act === action?.actionName) ? action?.childReportID : undefined);
 
-    const [report] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${reportID}`, {canBeMissing: true});
+    // reportID can be an empty string causing Onyx to fetch the whole collection
+    // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+    const [report] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${reportID || undefined}`, {canBeMissing: true});
 
     const shouldStackHorizontally = !!horizontalStacking;
     const isHorizontalStackingAnObject = shouldStackHorizontally && typeof horizontalStacking !== 'boolean';
@@ -110,6 +112,7 @@ function ReportActionAvatars({
         shouldUseCardFeed: !!subscriptCardFeed,
         accountIDs,
         policyID,
+        fallbackDisplayName,
     });
 
     let avatarType: ValueOf<typeof CONST.REPORT_ACTION_AVATARS.TYPE> = notPreciseAvatarType;
@@ -124,7 +127,7 @@ function ReportActionAvatars({
 
     const [primaryAvatar, secondaryAvatar] = icons;
 
-    if (avatarType === CONST.REPORT_ACTION_AVATARS.TYPE.SUBSCRIPT) {
+    if (avatarType === CONST.REPORT_ACTION_AVATARS.TYPE.SUBSCRIPT && !!secondaryAvatar?.name) {
         return (
             <ReportActionAvatar.Subscript
                 primaryAvatar={primaryAvatar}
@@ -155,7 +158,7 @@ function ReportActionAvatars({
         );
     }
 
-    if (avatarType === CONST.REPORT_ACTION_AVATARS.TYPE.MULTIPLE_DIAGONAL && icons.length !== 1) {
+    if (avatarType === CONST.REPORT_ACTION_AVATARS.TYPE.MULTIPLE_DIAGONAL && !!secondaryAvatar?.name) {
         return (
             <ReportActionAvatar.Multiple.Diagonal
                 shouldShowTooltip={shouldShowTooltip}
diff --git a/src/components/ReportActionAvatars/useReportActionAvatars.ts b/src/components/ReportActionAvatars/useReportActionAvatars.ts
index 590bb9480e876..5a9cec6d8bacb 100644
--- a/src/components/ReportActionAvatars/useReportActionAvatars.ts
+++ b/src/components/ReportActionAvatars/useReportActionAvatars.ts
@@ -2,9 +2,11 @@ import type {OnyxEntry} from 'react-native-onyx';
 import type {ValueOf} from 'type-fest';
 import {FallbackAvatar} from '@components/Icon/Expensicons';
 import useOnyx from '@hooks/useOnyx';
+import usePolicy from '@hooks/usePolicy';
 import useReportIsArchived from '@hooks/useReportIsArchived';
 import {getOriginalMessage, getReportAction, isMoneyRequestAction} from '@libs/ReportActionsUtils';
 import {
+    getDefaultWorkspaceAvatar,
     getDisplayNameForParticipant,
     getIcons,
     getReportActionActorAccountID,
@@ -28,6 +30,7 @@ function useReportActionAvatars({
     shouldUseCardFeed = false,
     accountIDs = [],
     policyID: passedPolicyID,
+    fallbackDisplayName = '',
 }: {
     report: OnyxEntry<Report>;
     action: OnyxEntry<ReportAction>;
@@ -35,12 +38,12 @@ function useReportActionAvatars({
     shouldUseCardFeed?: boolean;
     accountIDs?: number[];
     policyID?: string;
+    fallbackDisplayName?: string;
 }) {
     /* Get avatar type */
     const [personalDetails] = useOnyx(ONYXKEYS.PERSONAL_DETAILS_LIST, {
         canBeMissing: true,
     });
-    const [policies] = useOnyx(ONYXKEYS.COLLECTION.POLICY, {canBeMissing: true});
 
     const isReportAChatReport = report?.type === CONST.REPORT.TYPE.CHAT && report?.chatType !== CONST.REPORT.CHAT_TYPE.TRIP_ROOM;
 
@@ -68,17 +71,46 @@ function useReportActionAvatars({
     });
 
     const policyID = passedPolicyID ?? (chatReport?.policyID === CONST.POLICY.ID_FAKE || !chatReport?.policyID ? (iouReport?.policyID ?? chatReport?.policyID) : chatReport?.policyID);
-    const policy = policies?.[`${ONYXKEYS.COLLECTION.POLICY}${policyID}`];
+    const policy = usePolicy(policyID);
+
+    const invoiceReceiverPolicyID = chatReport?.invoiceReceiver && 'policyID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.policyID : undefined;
+    const invoiceReceiverPolicy = usePolicy(invoiceReceiverPolicyID);
 
     const {chatReportIDAdmins, chatReportIDAnnounce, workspaceAccountID} = policy ?? {};
     const [policyChatReport] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${chatReportIDAnnounce ?? chatReportIDAdmins}`, {canBeMissing: true});
 
+    const delegatePersonalDetails = action?.delegateAccountID ? personalDetails?.[action?.delegateAccountID] : undefined;
+    const actorAccountID = getReportActionActorAccountID(action, iouReport, chatReport, delegatePersonalDetails);
+
+    const isAReportPreviewAction = action?.actionName === CONST.REPORT.ACTIONS.TYPE.REPORT_PREVIEW;
+    const isAInvoiceReport = isInvoiceReport(iouReport ?? null);
+
+    const shouldUseActorAccountID = isAInvoiceReport && !isAReportPreviewAction;
+    const accountIDsToMap = shouldUseActorAccountID && actorAccountID ? [actorAccountID] : accountIDs;
+
+    const avatarsForAccountIDs: IconType[] = accountIDsToMap.map((id) => ({
+        id,
+        type: CONST.ICON_TYPE_AVATAR,
+        source: personalDetails?.[id]?.avatar ?? FallbackAvatar,
+        name: personalDetails?.[id]?.[shouldUseActorAccountID ? 'displayName' : 'login'] ?? '',
+    }));
+
+    const fallbackWorkspaceAvatar: IconType = {
+        id: policyID,
+        type: CONST.ICON_TYPE_WORKSPACE,
+        name: fallbackDisplayName,
+        source: getDefaultWorkspaceAvatar(fallbackDisplayName),
+    };
+
     if (passedPolicyID) {
-        const policyChatReportAvatar = {...getWorkspaceIcon(policyChatReport, policy), id: policyID, name: policy?.name};
+        // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+        const workspaceAvatar = policyChatReport ? getWorkspaceIcon(policyChatReport, policy) : {source: policy?.avatarURL || getDefaultWorkspaceAvatar(policy?.name)};
+        const policyChatReportAvatar = policy ? {...workspaceAvatar, id: policyID, name: policy.name, type: CONST.ICON_TYPE_WORKSPACE} : fallbackWorkspaceAvatar;
+        const firstAccountAvatar = avatarsForAccountIDs.at(0);
 
         return {
-            avatars: [policyChatReportAvatar],
-            avatarType: CONST.REPORT_ACTION_AVATARS.TYPE.SINGLE,
+            avatars: firstAccountAvatar ? [policyChatReportAvatar, firstAccountAvatar] : [policyChatReportAvatar],
+            avatarType: firstAccountAvatar ? CONST.REPORT_ACTION_AVATARS.TYPE.SUBSCRIPT : CONST.REPORT_ACTION_AVATARS.TYPE.SINGLE,
             details: {
                 ...(personalDetails?.[workspaceAccountID ?? CONST.DEFAULT_NUMBER_ID] ?? {}),
                 shouldDisplayAllActors: false,
@@ -99,7 +131,6 @@ function useReportActionAvatars({
     const isWorkspaceWithoutChatReportProp = !chatReport && isWorkspacePolicy;
     const isAWorkspaceChat = isPolicyExpenseChat(chatReport) || isWorkspaceWithoutChatReportProp;
     const isATripPreview = action?.actionName === CONST.REPORT.ACTIONS.TYPE.TRIP_PREVIEW;
-    const isAReportPreviewAction = action?.actionName === CONST.REPORT.ACTIONS.TYPE.REPORT_PREVIEW;
     const isReportPreviewOrNoAction = !action || isAReportPreviewAction;
     const isReportPreviewInTripRoom = isAReportPreviewAction && isATripRoom;
 
@@ -134,17 +165,12 @@ function useReportActionAvatars({
 
     /* Get correct primary & secondary icon */
 
-    const delegatePersonalDetails = action?.delegateAccountID ? personalDetails?.[action?.delegateAccountID] : undefined;
-    const actorAccountID = getReportActionActorAccountID(action, iouReport, chatReport, delegatePersonalDetails);
     // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
     const accountID = reportPreviewSenderID || (actorAccountID ?? CONST.DEFAULT_NUMBER_ID);
-    const invoiceReceiverPolicy =
-        chatReport?.invoiceReceiver && 'policyID' in chatReport.invoiceReceiver ? policies?.[`${ONYXKEYS.COLLECTION.POLICY}${chatReport.invoiceReceiver.policyID}`] : undefined;
-    const {avatar, fallbackIcon, login} = personalDetails?.[accountID] ?? {};
+    const {avatar, fallbackIcon, login} = personalDetails?.[delegatePersonalDetails ? delegatePersonalDetails.accountID : accountID] ?? {};
 
     const defaultDisplayName = getDisplayNameForParticipant({accountID, personalDetailsData: personalDetails}) ?? '';
-    const isAInvoiceReport = isInvoiceReport(iouReport ?? null);
-    const invoiceReport = [iouReport, chatReport, reportChatReport].find(isInvoiceReport);
+    const invoiceReport = [iouReport, chatReport, reportChatReport].find((susReport) => isInvoiceReport(susReport) || susReport?.chatType === CONST.REPORT.TYPE.INVOICE);
     const isNestedInInvoiceReport = !!invoiceReport;
     const isWorkspaceActor = isAInvoiceReport || (isAWorkspaceChat && (!actorAccountID || displayAllActors));
     const isChatReportOnlyProp = !iouReport && chatReport;
@@ -158,26 +184,60 @@ function useReportActionAvatars({
 
     const reportIcons = getIconsWithDefaults(chatReport ?? iouReport);
 
+    const delegateAvatar: IconType | undefined = delegatePersonalDetails
+        ? {
+              source: delegatePersonalDetails.avatar ?? '',
+              name: delegatePersonalDetails.displayName,
+              id: delegatePersonalDetails.accountID,
+              type: CONST.ICON_TYPE_AVATAR,
+              fill: undefined,
+              fallbackIcon,
+          }
+        : undefined;
+
+    const invoiceFallbackAvatar: IconType = {
+        // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+        source: policy?.avatarURL || getDefaultWorkspaceAvatar(policy?.name),
+        id: policy?.id,
+        name: policy?.name,
+        type: CONST.ICON_TYPE_WORKSPACE,
+        fill: undefined,
+        fallbackIcon,
+    };
+
+    const userFallbackAvatar: IconType = {
+        source: avatar ?? FallbackAvatar,
+        id: accountID,
+        name: defaultDisplayName ?? fallbackDisplayName,
+        type: CONST.ICON_TYPE_AVATAR,
+        fill: undefined,
+        fallbackIcon,
+    };
+
+    const secondUserFallbackAvatar: IconType = {
+        name: '',
+        source: '',
+        type: CONST.ICON_TYPE_AVATAR,
+        id: 0,
+        fill: undefined,
+        fallbackIcon,
+    };
+
     let primaryAvatar;
 
     if (useNearestReportAvatars) {
         primaryAvatar = getIconsWithDefaults(iouReport ?? chatReport).at(0);
     } else if (isWorkspaceActor || usePersonalDetailsAvatars) {
         primaryAvatar = reportIcons.at(0);
-    } else if (delegatePersonalDetails) {
-        primaryAvatar = getIconsWithDefaults(iouReport).at(0);
+    } else if (delegateAvatar) {
+        primaryAvatar = delegateAvatar;
     } else if (isAReportPreviewAction && isATripRoom) {
         primaryAvatar = reportIcons.at(0);
     }
 
-    primaryAvatar ??= {
-        source: avatar ?? FallbackAvatar,
-        id: accountID,
-        name: defaultDisplayName,
-        type: CONST.ICON_TYPE_AVATAR,
-        fill: undefined,
-        fallbackIcon,
-    };
+    if (!primaryAvatar?.id) {
+        primaryAvatar = isNestedInInvoiceReport ? invoiceFallbackAvatar : userFallbackAvatar;
+    }
 
     let secondaryAvatar;
 
@@ -197,24 +257,9 @@ function useReportActionAvatars({
         secondaryAvatar = reportIcons.at(1);
     }
 
-    secondaryAvatar ??= {
-        name: '',
-        source: '',
-        type: CONST.ICON_TYPE_AVATAR,
-        id: 0,
-        fill: undefined,
-        fallbackIcon,
-    };
-
-    const shouldUseActorAccountID = isAInvoiceReport && !isAReportPreviewAction;
-    const accountIDsToMap = shouldUseActorAccountID && actorAccountID ? [actorAccountID] : accountIDs;
-
-    const avatarsForAccountIDs: IconType[] = accountIDsToMap.map((id) => ({
-        id,
-        type: CONST.ICON_TYPE_AVATAR,
-        source: personalDetails?.[id]?.avatar ?? FallbackAvatar,
-        name: personalDetails?.[id]?.[shouldUseActorAccountID ? 'displayName' : 'login'] ?? '',
-    }));
+    if (!secondaryAvatar?.id) {
+        secondaryAvatar = secondUserFallbackAvatar;
+    }
 
     const shouldUseMappedAccountIDs = avatarsForAccountIDs.length > 0 && (avatarType === CONST.REPORT_ACTION_AVATARS.TYPE.MULTIPLE || shouldUseActorAccountID);
     const shouldUsePrimaryAvatarID = isWorkspaceActor && !!primaryAvatar.id;
@@ -228,6 +273,21 @@ function useReportActionAvatars({
         avatars = avatarsForAccountIDs;
     }
 
+    if (isNestedInInvoiceReport && !!avatars.at(1)?.id) {
+        // If we have B2B Invoice between two workspaces we only should show subscript if it is not a report preview
+        if (avatars.every(({type}) => type === CONST.ICON_TYPE_WORKSPACE)) {
+            avatarType = isAReportPreviewAction ? CONST.REPORT_ACTION_AVATARS.TYPE.MULTIPLE : CONST.REPORT_ACTION_AVATARS.TYPE.SUBSCRIPT;
+            // But if it is a report preview between workspace and another user it should never be displayed as a multiple avatar
+        } else if (
+            avatars.at(0)?.type === CONST.ICON_TYPE_WORKSPACE &&
+            avatars.at(1)?.type === CONST.ICON_TYPE_AVATAR &&
+            avatarType === CONST.REPORT_ACTION_AVATARS.TYPE.MULTIPLE &&
+            isAReportPreviewAction
+        ) {
+            avatarType = CONST.REPORT_ACTION_AVATARS.TYPE.SUBSCRIPT;
+        }
+    }
+
     return {
         avatars,
         avatarType,
@@ -236,7 +296,7 @@ function useReportActionAvatars({
             shouldDisplayAllActors: displayAllActors,
             isWorkspaceActor,
             // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
-            actorHint: String(shouldUsePrimaryAvatarID ? primaryAvatar.id : login || defaultDisplayName || 'Unknown user').replace(CONST.REGEX.MERGED_ACCOUNT_PREFIX, ''),
+            actorHint: String(shouldUsePrimaryAvatarID ? primaryAvatar.id : login || defaultDisplayName || fallbackDisplayName).replace(CONST.REGEX.MERGED_ACCOUNT_PREFIX, ''),
             accountID,
             delegateAccountID: !isWorkspaceActor && delegatePersonalDetails ? actorAccountID : undefined,
         },
diff --git a/src/components/ReportActionAvatars/useReportPreviewSenderID.ts b/src/components/ReportActionAvatars/useReportPreviewSenderID.ts
index f173948f09e28..4a670b39829ee 100644
--- a/src/components/ReportActionAvatars/useReportPreviewSenderID.ts
+++ b/src/components/ReportActionAvatars/useReportPreviewSenderID.ts
@@ -4,7 +4,7 @@ import useOnyx from '@hooks/useOnyx';
 import useTransactionsAndViolationsForReport from '@hooks/useTransactionsAndViolationsForReport';
 import {getAllNonDeletedTransactions} from '@libs/MoneyRequestReportUtils';
 import {getPersonalDetailByEmail} from '@libs/PersonalDetailsUtils';
-import {getOriginalMessage, isMoneyRequestAction} from '@libs/ReportActionsUtils';
+import {getOriginalMessage, isMoneyRequestAction, isSentMoneyReportAction} from '@libs/ReportActionsUtils';
 import {isDM} from '@libs/ReportUtils';
 import {getCurrentUserAccountID} from '@userActions/Report';
 import CONST from '@src/CONST';
@@ -71,8 +71,15 @@ function useReportPreviewSenderID({iouReport, action, chatReport}: {action: Onyx
     const isThereOnlyOneAttendee = new Set(attendeesIDs).size <= 1;
 
     // If the action is a 'Send Money' flow, it will only have one transaction, but the person who sent the money is the child manager account, not the child owner account.
-    const isSendMoneyFlow = action?.childMoneyRequestCount === 0 && transactions?.length === 1 && (chatReport ? isDM(chatReport) : policy?.type === CONST.POLICY.TYPE.PERSONAL);
-    const singleAvatarAccountID = isSendMoneyFlow ? action.childManagerAccountID : action?.childOwnerAccountID;
+    const isSendMoneyFlowBasedOnActions = !!iouActions && iouActions.every(isSentMoneyReportAction);
+    // This is used only if there are no IOU actions in the Onyx
+    // eslint-disable-next-line rulesdir/no-negated-variables
+    const isSendMoneyFlowBasedOnTransactions =
+        !!action && action.childMoneyRequestCount === 0 && transactions?.length === 1 && (chatReport ? isDM(chatReport) : policy?.type === CONST.POLICY.TYPE.PERSONAL);
+
+    const isSendMoneyFlow = !!iouActions && iouActions?.length > 0 ? isSendMoneyFlowBasedOnActions : isSendMoneyFlowBasedOnTransactions;
+
+    const singleAvatarAccountID = isSendMoneyFlow ? action?.childManagerAccountID : action?.childOwnerAccountID;
 
     return areAmountsSignsTheSame && isThereOnlyOneAttendee ? singleAvatarAccountID : undefined;
 }
diff --git a/src/components/SelectionList/InviteMemberListItem.tsx b/src/components/SelectionList/InviteMemberListItem.tsx
index bd9ae8ea5c985..002d0bb28fa2f 100644
--- a/src/components/SelectionList/InviteMemberListItem.tsx
+++ b/src/components/SelectionList/InviteMemberListItem.tsx
@@ -115,6 +115,7 @@ function InviteMemberListItem<TItem extends ListItem>({
                                     isFocused ? StyleUtils.getBackgroundAndBorderStyle(focusedBackgroundColor) : undefined,
                                     hovered && !isFocused ? StyleUtils.getBackgroundAndBorderStyle(hoveredBackgroundColor) : undefined,
                                 ]}
+                                fallbackDisplayName={item.text ?? item.alternateText ?? undefined}
                                 singleAvatarContainerStyle={[styles.actionAvatar, styles.mr3]}
                                 reportID={item.reportID}
                                 accountIDs={accountID ? [accountID] : undefined}
diff --git a/src/components/SelectionList/TableListItem.tsx b/src/components/SelectionList/TableListItem.tsx
index 12a9f3d774591..3f1d6f46913be 100644
--- a/src/components/SelectionList/TableListItem.tsx
+++ b/src/components/SelectionList/TableListItem.tsx
@@ -110,6 +110,7 @@ function TableListItem<TItem extends ListItem>({
                     {!!item.accountID && (
                         <ReportActionAvatars
                             accountIDs={[item.accountID]}
+                            fallbackDisplayName={item.text ?? item.alternateText ?? undefined}
                             shouldShowTooltip={showTooltip}
                             secondaryAvatarContainerStyle={[
                                 StyleUtils.getBackgroundAndBorderStyle(theme.sidebar),
diff --git a/src/components/SelectionList/UserListItem.tsx b/src/components/SelectionList/UserListItem.tsx
index a26b55286f02b..bd3b8c56bfaa3 100644
--- a/src/components/SelectionList/UserListItem.tsx
+++ b/src/components/SelectionList/UserListItem.tsx
@@ -8,11 +8,13 @@ import ReportActionAvatars from '@components/ReportActionAvatars';
 import Text from '@components/Text';
 import TextWithTooltip from '@components/TextWithTooltip';
 import useLocalize from '@hooks/useLocalize';
+import useOnyx from '@hooks/useOnyx';
 import useStyleUtils from '@hooks/useStyleUtils';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import getButtonState from '@libs/getButtonState';
 import CONST from '@src/CONST';
+import ONYXKEYS from '@src/ONYXKEYS';
 import BaseListItem from './BaseListItem';
 import type {ListItem, UserListItemProps} from './types';
 
@@ -50,6 +52,16 @@ function UserListItem<TItem extends ListItem>({
         }
     }, [item, onCheckboxPress, onSelectRow]);
 
+    // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+    const [isReportInOnyx] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${item.reportID}`, {
+        canBeMissing: true,
+        selector: (report) => !!report,
+    });
+
+    const reportExists = isReportInOnyx && !!item.reportID;
+    // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+    const itemAccountID = Number(item.accountID || item.icons?.at(1)?.id) || 0;
+
     return (
         <BaseListItem
             item={item}
@@ -99,7 +111,7 @@ function UserListItem<TItem extends ListItem>({
                             </View>
                         </PressableWithFeedback>
                     )}
-                    {(!!item.reportID || !!item.accountID || !!item.policyID) && (
+                    {(!!reportExists || !!itemAccountID || !!item.policyID) && (
                         <ReportActionAvatars
                             subscriptAvatarBorderColor={hovered && !isFocused ? hoveredBackgroundColor : subscriptAvatarBorderColor}
                             shouldShowTooltip={showTooltip}
@@ -108,9 +120,10 @@ function UserListItem<TItem extends ListItem>({
                                 isFocused ? StyleUtils.getBackgroundAndBorderStyle(focusedBackgroundColor) : undefined,
                                 hovered && !isFocused ? StyleUtils.getBackgroundAndBorderStyle(hoveredBackgroundColor) : undefined,
                             ]}
-                            reportID={item.reportID}
-                            accountIDs={[Number(item.accountID)]}
-                            policyID={!item.reportID && !item.accountID ? item.policyID : undefined}
+                            reportID={reportExists ? item.reportID : undefined}
+                            /* eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing */
+                            accountIDs={!reportExists && !!itemAccountID ? [itemAccountID] : []}
+                            policyID={!reportExists && !itemAccountID ? item.policyID : undefined}
                             singleAvatarContainerStyle={[styles.actionAvatar, styles.mr3]}
                             fallbackDisplayName={item.text ?? item.alternateText ?? undefined}
                         />
diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts
index 2ccaf046cdc4c..81dfb9e4890d0 100644
--- a/src/libs/Navigation/types.ts
+++ b/src/libs/Navigation/types.ts
@@ -11,6 +11,7 @@ import type {
     Route,
 } from '@react-navigation/native';
 import type {TupleToUnion, ValueOf} from 'type-fest';
+import type {UpperCaseCharacters} from 'type-fest/source/internal';
 import type {SearchQueryString} from '@components/Search/types';
 import type {IOURequestType} from '@libs/actions/IOU';
 import type {SaveSearchParams} from '@libs/API/parameters';
@@ -2082,6 +2083,7 @@ type AuthScreensParamList = SharedScreensParamList & {
     };
     [SCREENS.WORKSPACE_AVATAR]: {
         policyID: string;
+        letter?: UpperCaseCharacters;
     };
     [SCREENS.WORKSPACE_JOIN_USER]: {
         policyID: string;
diff --git a/src/pages/workspace/WorkspaceAvatar.tsx b/src/pages/workspace/WorkspaceAvatar.tsx
index 5247d13e9f481..0ee3a3a872bf3 100644
--- a/src/pages/workspace/WorkspaceAvatar.tsx
+++ b/src/pages/workspace/WorkspaceAvatar.tsx
@@ -13,9 +13,14 @@ import type SCREENS from '@src/SCREENS';
 type WorkspaceAvatarProps = PlatformStackScreenProps<AuthScreensParamList, typeof SCREENS.WORKSPACE_AVATAR>;
 
 function WorkspaceAvatar({route}: WorkspaceAvatarProps) {
-    const policy = usePolicy(route?.params?.policyID);
+    const {policyID, letter: fallbackLetter} = route?.params ?? {};
+    const policy = usePolicy(policyID);
     const [isLoadingApp = false] = useOnyx(ONYXKEYS.IS_LOADING_APP, {canBeMissing: true, initWithStoredValues: false});
-    const avatarURL = (policy?.avatarURL ?? '') ? (policy?.avatarURL ?? '') : getDefaultWorkspaceAvatar(policy?.name ?? '');
+    const policyAvatarURL = policy?.avatarURL;
+    // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+    const avatarURL = policyAvatarURL || getDefaultWorkspaceAvatar(policy?.name ?? fallbackLetter);
+    // eslint-disable-next-line rulesdir/no-negated-variables
+    const shouldShowNotFoundPage = !Object.keys(policy ?? {}).length && !isLoadingApp && (!policyID || !fallbackLetter);
 
     return (
         <AttachmentModal
@@ -24,8 +29,8 @@ function WorkspaceAvatar({route}: WorkspaceAvatarProps) {
             source={getFullSizeAvatar(avatarURL, 0)}
             onModalClose={Navigation.goBack}
             isWorkspaceAvatar
-            originalFileName={policy?.originalFileName ?? policy?.id}
-            shouldShowNotFoundPage={!Object.keys(policy ?? {}).length && !isLoadingApp}
+            originalFileName={policy?.originalFileName ?? policy?.id ?? policyID}
+            shouldShowNotFoundPage={shouldShowNotFoundPage}
             isLoading={!Object.keys(policy ?? {}).length && !!isLoadingApp}
             maybeIcon
         />
diff --git a/tests/ui/ReportActionAvatarsTest.tsx b/tests/ui/ReportActionAvatarsTest.tsx
index 3df59c0e629c6..0389c455e049c 100644
--- a/tests/ui/ReportActionAvatarsTest.tsx
+++ b/tests/ui/ReportActionAvatarsTest.tsx
@@ -445,7 +445,7 @@ describe('ReportActionAvatars', () => {
 
         it('renders workspace avatar if policyID is passed as a prop', async () => {
             const retrievedData = await retrieveDataFromAvatarView({policyID: policy.id});
-            isSingleAvatarRendered({...retrievedData, userAvatar: getDefaultWorkspaceAvatar().name});
+            isSingleAvatarRendered({...retrievedData, userAvatar: getDefaultWorkspaceAvatar(policy.name).name});
         });
     });
 });