From 2b46f139e05c1b6094d8f11bea656982e70dc61f Mon Sep 17 00:00:00 2001
From: daledah <daleda261@outlook.com>
Date: Fri, 7 Nov 2025 00:53:25 +0700
Subject: [PATCH 1/4] updates to workspace Overview page

---
 src/pages/workspace/WorkspaceOverviewPage.tsx | 63 +++++++++++--------
 1 file changed, 37 insertions(+), 26 deletions(-)

diff --git a/src/pages/workspace/WorkspaceOverviewPage.tsx b/src/pages/workspace/WorkspaceOverviewPage.tsx
index d1f28efa64962..2e7a029265d0a 100644
--- a/src/pages/workspace/WorkspaceOverviewPage.tsx
+++ b/src/pages/workspace/WorkspaceOverviewPage.tsx
@@ -1,11 +1,11 @@
 import {useFocusEffect, useIsFocused} from '@react-navigation/native';
 import {accountIDSelector} from '@selectors/Session';
 import React, {useCallback, useContext, useEffect, useRef, useState} from 'react';
-import type {ImageStyle, StyleProp} from 'react-native';
-import {Image, StyleSheet, View} from 'react-native';
+import {View} from 'react-native';
 import type {ValueOf} from 'type-fest';
 import Avatar from '@components/Avatar';
 import AvatarWithImagePicker from '@components/AvatarWithImagePicker';
+import Button from '@components/Button';
 import ButtonWithDropdownMenu from '@components/ButtonWithDropdownMenu';
 import type {DropdownOption} from '@components/ButtonWithDropdownMenu/types';
 import ConfirmModal from '@components/ConfirmModal';
@@ -72,7 +72,6 @@ function WorkspaceOverviewPage({policyDraft, policy: policyProp, route}: Workspa
     const {translate} = useLocalize();
     const {shouldUseNarrowLayout} = useResponsiveLayout();
     const currentUserPersonalDetails = useCurrentUserPersonalDetails();
-    const illustrations = useThemeIllustrations();
     const illustrationIcons = useMemoizedLazyIllustrations(['Building'] as const);
     const expensifyIcons = useMemoizedLazyExpensifyIcons(['FallbackWorkspaceAvatar', 'ImageCropSquareMask', 'QrCode', 'Transfer', 'Trashcan', 'UserPlus'] as const);
 
@@ -160,7 +159,6 @@ function WorkspaceOverviewPage({policyDraft, policy: policyProp, route}: Workspa
     const readOnly = !isPolicyAdminPolicyUtils(policy);
     const currencyReadOnly = readOnly || isBankAccountVerified;
     const isOwner = isPolicyOwner(policy, currentUserAccountID);
-    const imageStyle: StyleProp<ImageStyle> = shouldUseNarrowLayout ? [styles.mhv12, styles.mhn5, styles.mbn5] : [styles.mhv8, styles.mhn8, styles.mbn5];
     const shouldShowAddress = !readOnly || !!formattedAddress;
     const {isAccountLocked, showLockedAccountModal} = useContext(LockedAccountContext);
     const [lastPaymentMethod] = useOnyx(ONYXKEYS.NVP_LAST_PAYMENT_METHOD, {canBeMissing: true});
@@ -390,21 +388,16 @@ function WorkspaceOverviewPage({policyDraft, policy: policyProp, route}: Workspa
             return null;
         }
 
-        if (isPolicyAdmin) {
-            secondaryActions.push({
-                value: 'invite',
-                text: translate('common.invite'),
-                icon: expensifyIcons.UserPlus,
-                onSelected: () => {
-                    if (isAccountLocked) {
-                        showLockedAccountModal();
-                        return;
-                    }
-                    clearInviteDraft(route.params.policyID);
-                    Navigation.navigate(ROUTES.WORKSPACE_INVITE.getRoute(route.params.policyID, Navigation.getActiveRouteWithoutParams()));
-                },
-            });
-        }
+        // Prepare Invite button handler
+        const handleInvitePress = () => {
+            if (isAccountLocked) {
+                showLockedAccountModal();
+                return;
+            }
+            clearInviteDraft(route.params.policyID);
+            Navigation.navigate(ROUTES.WORKSPACE_INVITE.getRoute(route.params.policyID, Navigation.getActiveRouteWithoutParams()));
+        };
+
         secondaryActions.push({
             value: 'share',
             text: translate('common.share'),
@@ -441,7 +434,31 @@ function WorkspaceOverviewPage({policyDraft, policy: policyProp, route}: Workspa
             });
         }
 
-        return renderDropdownMenu(secondaryActions);
+        return (
+            <View style={[styles.flexRow, styles.gap2]}>
+                {isPolicyAdmin && (
+                    <Button
+                        success
+                        text={translate('common.invite')}
+                        icon={expensifyIcons.UserPlus}
+                        onPress={handleInvitePress}
+                        medium
+                        innerStyles={[shouldUseNarrowLayout && styles.alignItemsCenter]}
+                        style={[shouldUseNarrowLayout && styles.flexGrow1, shouldUseNarrowLayout && styles.mb3]}
+                    />
+                )}
+                <ButtonWithDropdownMenu
+                    ref={dropdownMenuRef}
+                    success={false}
+                    onPress={() => {}}
+                    shouldAlwaysShowDropdownMenu
+                    customText={translate('common.more')}
+                    options={secondaryActions}
+                    isSplitButton={false}
+                    wrapperStyle={isPolicyAdmin ? styles.flexGrow0 : styles.flexGrow1}
+                />
+            </View>
+        );
     };
 
     return (
@@ -470,11 +487,6 @@ function WorkspaceOverviewPage({policyDraft, policy: policyProp, route}: Workspa
                         isCentralPane
                         title=""
                     >
-                        <Image
-                            style={StyleSheet.flatten([styles.wAuto, styles.h68, imageStyle])}
-                            source={illustrations.WorkspaceProfile}
-                            resizeMode="cover"
-                        />
                         <AvatarWithImagePicker
                             onViewPhotoPress={() => {
                                 if (!policy?.id) {
@@ -493,7 +505,6 @@ function WorkspaceOverviewPage({policyDraft, policy: policyProp, route}: Workspa
                             fallbackIcon={expensifyIcons.FallbackWorkspaceAvatar}
                             style={[
                                 (policy?.errorFields?.avatarURL ?? shouldUseNarrowLayout) ? styles.mb1 : styles.mb3,
-                                shouldUseNarrowLayout ? styles.mtn17 : styles.mtn20,
                                 styles.alignItemsStart,
                                 styles.sectionMenuItemTopDescription,
                             ]}

From de42b2d98ae992755713c692e0533c1b68c200fe Mon Sep 17 00:00:00 2001
From: daledah <daleda261@outlook.com>
Date: Mon, 10 Nov 2025 15:51:02 +0700
Subject: [PATCH 2/4] fix prettier

---
 src/pages/workspace/WorkspaceOverviewPage.tsx | 7 +------
 1 file changed, 1 insertion(+), 6 deletions(-)

diff --git a/src/pages/workspace/WorkspaceOverviewPage.tsx b/src/pages/workspace/WorkspaceOverviewPage.tsx
index 2e7a029265d0a..4e5aa4ff43e15 100644
--- a/src/pages/workspace/WorkspaceOverviewPage.tsx
+++ b/src/pages/workspace/WorkspaceOverviewPage.tsx
@@ -26,7 +26,6 @@ import usePayAndDowngrade from '@hooks/usePayAndDowngrade';
 import usePermissions from '@hooks/usePermissions';
 import usePrevious from '@hooks/usePrevious';
 import useResponsiveLayout from '@hooks/useResponsiveLayout';
-import useThemeIllustrations from '@hooks/useThemeIllustrations';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useTransactionViolationOfWorkspace from '@hooks/useTransactionViolationOfWorkspace';
 import {close} from '@libs/actions/Modal';
@@ -503,11 +502,7 @@ function WorkspaceOverviewPage({policyDraft, policy: policyProp, route}: Workspa
                             DefaultAvatar={DefaultAvatar}
                             type={CONST.ICON_TYPE_WORKSPACE}
                             fallbackIcon={expensifyIcons.FallbackWorkspaceAvatar}
-                            style={[
-                                (policy?.errorFields?.avatarURL ?? shouldUseNarrowLayout) ? styles.mb1 : styles.mb3,
-                                styles.alignItemsStart,
-                                styles.sectionMenuItemTopDescription,
-                            ]}
+                            style={[(policy?.errorFields?.avatarURL ?? shouldUseNarrowLayout) ? styles.mb1 : styles.mb3, styles.alignItemsStart, styles.sectionMenuItemTopDescription]}
                             editIconStyle={styles.smallEditIconWorkspace}
                             isUsingDefaultAvatar={!policy?.avatarURL}
                             onImageSelected={(file) => {

From 98922f601f30f84c737c93be7a0acdb882d86cac Mon Sep 17 00:00:00 2001
From: daledah <daleda261@outlook.com>
Date: Thu, 13 Nov 2025 13:56:43 +0700
Subject: [PATCH 3/4] fix comments

---
 src/pages/workspace/WorkspaceOverviewPage.tsx | 34 ++++++-------------
 1 file changed, 11 insertions(+), 23 deletions(-)

diff --git a/src/pages/workspace/WorkspaceOverviewPage.tsx b/src/pages/workspace/WorkspaceOverviewPage.tsx
index 357f2eb091dfe..489cd4e425776 100644
--- a/src/pages/workspace/WorkspaceOverviewPage.tsx
+++ b/src/pages/workspace/WorkspaceOverviewPage.tsx
@@ -378,7 +378,6 @@ function WorkspaceOverviewPage({policyDraft, policy: policyProp, route}: Workspa
     };
 
     const renderDropdownMenu = (options: Array<DropdownOption<string>>) => (
-        <View style={[!shouldUseNarrowLayout && styles.flexRow, !shouldUseNarrowLayout && styles.gap2]}>
             <ButtonWithDropdownMenu
                 ref={dropdownMenuRef}
                 success={false}
@@ -387,11 +386,19 @@ function WorkspaceOverviewPage({policyDraft, policy: policyProp, route}: Workspa
                 customText={translate('common.more')}
                 options={options}
                 isSplitButton={false}
-                wrapperStyle={styles.flexGrow1}
+                wrapperStyle={isPolicyAdmin ? styles.flexGrow0 : styles.flexGrow1}
             />
-        </View>
     );
 
+    const handleInvitePress = useCallback(() => {
+        if (isAccountLocked) {
+            showLockedAccountModal();
+            return;
+        }
+        clearInviteDraft(route.params.policyID);
+        Navigation.navigate(ROUTES.WORKSPACE_INVITE.getRoute(route.params.policyID, Navigation.getActiveRouteWithoutParams()));
+    }, [isAccountLocked, showLockedAccountModal, route.params.policyID]);
+
     const getHeaderButtons = () => {
         const secondaryActions: Array<DropdownOption<string>> = [];
         const canLeave = !isOwner;
@@ -409,16 +416,6 @@ function WorkspaceOverviewPage({policyDraft, policy: policyProp, route}: Workspa
             return null;
         }
 
-        // Prepare Invite button handler
-        const handleInvitePress = () => {
-            if (isAccountLocked) {
-                showLockedAccountModal();
-                return;
-            }
-            clearInviteDraft(route.params.policyID);
-            Navigation.navigate(ROUTES.WORKSPACE_INVITE.getRoute(route.params.policyID, Navigation.getActiveRouteWithoutParams()));
-        };
-
         secondaryActions.push({
             value: 'share',
             text: translate('common.share'),
@@ -468,16 +465,7 @@ function WorkspaceOverviewPage({policyDraft, policy: policyProp, route}: Workspa
                         style={[shouldUseNarrowLayout && styles.flexGrow1, shouldUseNarrowLayout && styles.mb3]}
                     />
                 )}
-                <ButtonWithDropdownMenu
-                    ref={dropdownMenuRef}
-                    success={false}
-                    onPress={() => {}}
-                    shouldAlwaysShowDropdownMenu
-                    customText={translate('common.more')}
-                    options={secondaryActions}
-                    isSplitButton={false}
-                    wrapperStyle={isPolicyAdmin ? styles.flexGrow0 : styles.flexGrow1}
-                />
+            {renderDropdownMenu(secondaryActions)}
             </View>
         );
     };

From ce160e173369adc615890c3a451fe7a5fd412fa6 Mon Sep 17 00:00:00 2001
From: daledah <daleda261@outlook.com>
Date: Thu, 13 Nov 2025 14:27:16 +0700
Subject: [PATCH 4/4] fix extra space

---
 src/components/Section/index.tsx              |  2 +-
 src/pages/workspace/WorkspaceOverviewPage.tsx | 22 +++++++++----------
 2 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/components/Section/index.tsx b/src/components/Section/index.tsx
index de80d4deb02d5..74606d025faaa 100644
--- a/src/components/Section/index.tsx
+++ b/src/components/Section/index.tsx
@@ -186,7 +186,7 @@ function Section({
                         />
                     )}
                     <View style={[styles.flexShrink1, styles.w100]}>
-                        {renderTitle ? renderTitle() : <Text style={[styles.textHeadline, styles.cardSectionTitle, titleStyles]}>{title}</Text>}
+                        {renderTitle ? renderTitle() : !!title && <Text style={[styles.textHeadline, styles.cardSectionTitle, titleStyles]}>{title}</Text>}
                     </View>
                     {cardLayout === CARD_LAYOUT.ICON_ON_RIGHT && (
                         <IconSection
diff --git a/src/pages/workspace/WorkspaceOverviewPage.tsx b/src/pages/workspace/WorkspaceOverviewPage.tsx
index 489cd4e425776..69cf5b7dea88c 100644
--- a/src/pages/workspace/WorkspaceOverviewPage.tsx
+++ b/src/pages/workspace/WorkspaceOverviewPage.tsx
@@ -378,16 +378,16 @@ function WorkspaceOverviewPage({policyDraft, policy: policyProp, route}: Workspa
     };
 
     const renderDropdownMenu = (options: Array<DropdownOption<string>>) => (
-            <ButtonWithDropdownMenu
-                ref={dropdownMenuRef}
-                success={false}
-                onPress={() => {}}
-                shouldAlwaysShowDropdownMenu
-                customText={translate('common.more')}
-                options={options}
-                isSplitButton={false}
-                wrapperStyle={isPolicyAdmin ? styles.flexGrow0 : styles.flexGrow1}
-            />
+        <ButtonWithDropdownMenu
+            ref={dropdownMenuRef}
+            success={false}
+            onPress={() => {}}
+            shouldAlwaysShowDropdownMenu
+            customText={translate('common.more')}
+            options={options}
+            isSplitButton={false}
+            wrapperStyle={isPolicyAdmin ? styles.flexGrow0 : styles.flexGrow1}
+        />
     );
 
     const handleInvitePress = useCallback(() => {
@@ -465,7 +465,7 @@ function WorkspaceOverviewPage({policyDraft, policy: policyProp, route}: Workspa
                         style={[shouldUseNarrowLayout && styles.flexGrow1, shouldUseNarrowLayout && styles.mb3]}
                     />
                 )}
-            {renderDropdownMenu(secondaryActions)}
+                {renderDropdownMenu(secondaryActions)}
             </View>
         );
     };