From 349256336e25cb71e246d087e1cf1fe09bbf4654 Mon Sep 17 00:00:00 2001
From: jayeshmangwani <jayeshmangwani@gmail.com>
Date: Sat, 11 Jan 2025 13:57:13 +0530
Subject: [PATCH 1/4] fixed showing the collect upgrade policy view for
 categorizing

---
 src/pages/workspace/upgrade/UpgradeIntro.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/workspace/upgrade/UpgradeIntro.tsx b/src/pages/workspace/upgrade/UpgradeIntro.tsx
index 9d6ae871826c..fbcaa29546b9 100644
--- a/src/pages/workspace/upgrade/UpgradeIntro.tsx
+++ b/src/pages/workspace/upgrade/UpgradeIntro.tsx
@@ -46,7 +46,7 @@ function UpgradeIntro({feature, onUpgrade, buttonDisabled, loading, isCategorizi
         return `${convertToShortDisplayString(upgradePrice, upgradeCurrency)} `;
     }, [preferredCurrency, isCategorizing]);
 
-    if (!feature || !policyID) {
+    if (!feature || (!isCategorizing && !policyID)) {
         return (
             <GenericFeaturesView
                 onUpgrade={onUpgrade}

From 1d869ea2fcb7ce511099610fe41c96ccc10414d5 Mon Sep 17 00:00:00 2001
From: jayeshmangwani <jayeshmangwani@gmail.com>
Date: Sat, 11 Jan 2025 16:39:21 +0530
Subject: [PATCH 2/4] removed pressable parent View from Subscription Plans
 Card

---
 .../SubscriptionPlan/SubscriptionPlanCard.tsx | 69 ++++++++++---------
 1 file changed, 35 insertions(+), 34 deletions(-)

diff --git a/src/pages/settings/Subscription/SubscriptionPlan/SubscriptionPlanCard.tsx b/src/pages/settings/Subscription/SubscriptionPlan/SubscriptionPlanCard.tsx
index 33d3f40a0b36..f6f1b2e7e636 100644
--- a/src/pages/settings/Subscription/SubscriptionPlan/SubscriptionPlanCard.tsx
+++ b/src/pages/settings/Subscription/SubscriptionPlan/SubscriptionPlanCard.tsx
@@ -7,6 +7,7 @@ import * as Expensicons from '@components/Icon/Expensicons';
 import {PressableWithFeedback} from '@components/Pressable';
 import SelectCircle from '@components/SelectCircle';
 import Text from '@components/Text';
+import useResponsiveLayout from '@hooks/useResponsiveLayout';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import variables from '@styles/variables';
@@ -30,45 +31,45 @@ type SubscriptionPlanCardProps = {
 function SubscriptionPlanCard({plan, index, onPress}: SubscriptionPlanCardProps) {
     const styles = useThemeStyles();
     const theme = useTheme();
+    const {shouldUseNarrowLayout} = useResponsiveLayout();
 
     return (
-        <View style={[styles.borderedContentCard, styles.flex1, styles.mt5, styles.p5, index === 0 && styles.mr3, plan.isSelected && styles.borderColorFocus]}>
-            <PressableWithFeedback
-                accessibilityLabel={plan.title}
-                wrapperStyle={[styles.flex1]}
-                onPress={() => onPress(plan.type)}
-            >
-                <View style={[styles.flexRow, styles.justifyContentBetween]}>
+        <PressableWithFeedback
+            accessibilityLabel={plan.title}
+            wrapperStyle={[styles.flexShrink1]}
+            style={[styles.borderedContentCard, styles.mt5, styles.flex1, !shouldUseNarrowLayout && index === 0 && styles.mr3, plan.isSelected && styles.borderColorFocus, styles.p5]}
+            onPress={() => onPress(plan.type)}
+        >
+            <View style={[styles.flexRow, styles.justifyContentBetween]}>
+                <Icon
+                    src={plan.src}
+                    width={variables.iconHeader}
+                    height={variables.iconHeader}
+                />
+                <View>
+                    <SelectCircle
+                        isChecked={plan.isSelected}
+                        selectCircleStyles={styles.sectionSelectCircle}
+                    />
+                </View>
+            </View>
+            <Text style={[styles.headerText, styles.mv2]}>{plan.title}</Text>
+            <Text style={[styles.textLabelSupporting, styles.mb2]}>{plan.description}</Text>
+            {plan.benefits.map((benefit) => (
+                <View
+                    style={[styles.flexRow, styles.alignItemsCenter, styles.mt2]}
+                    key={benefit}
+                >
                     <Icon
-                        src={plan.src}
-                        width={variables.iconHeader}
-                        height={variables.iconHeader}
+                        src={Expensicons.Checkmark}
+                        fill={theme.iconSuccessFill}
+                        width={variables.iconSizeSmall}
+                        height={variables.iconSizeSmall}
                     />
-                    <View>
-                        <SelectCircle
-                            isChecked={plan.isSelected}
-                            selectCircleStyles={styles.sectionSelectCircle}
-                        />
-                    </View>
+                    <Text style={[styles.textMicroSupporting, styles.ml2]}>{benefit}</Text>
                 </View>
-                <Text style={[styles.headerText, styles.mv2]}>{plan.title}</Text>
-                <Text style={[styles.textLabelSupporting, styles.mb2]}>{plan.description}</Text>
-                {plan.benefits.map((benefit) => (
-                    <View
-                        style={[styles.flexRow, styles.alignItemsCenter, styles.mt2]}
-                        key={benefit}
-                    >
-                        <Icon
-                            src={Expensicons.Checkmark}
-                            fill={theme.iconSuccessFill}
-                            width={variables.iconSizeSmall}
-                            height={variables.iconSizeSmall}
-                        />
-                        <Text style={[styles.textMicroSupporting, styles.ml2]}>{benefit}</Text>
-                    </View>
-                ))}
-            </PressableWithFeedback>
-        </View>
+            ))}
+        </PressableWithFeedback>
     );
 }
 

From 84bc92cd712e6b9ba2760dce4ea50a7661e2110d Mon Sep 17 00:00:00 2001
From: jayeshmangwani <jayeshmangwani@gmail.com>
Date: Mon, 13 Jan 2025 14:14:00 +0530
Subject: [PATCH 3/4] added a comment for GenericFeaturesView,when to display

---
 src/pages/workspace/upgrade/UpgradeIntro.tsx | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/src/pages/workspace/upgrade/UpgradeIntro.tsx b/src/pages/workspace/upgrade/UpgradeIntro.tsx
index fbcaa29546b9..aa5601bad022 100644
--- a/src/pages/workspace/upgrade/UpgradeIntro.tsx
+++ b/src/pages/workspace/upgrade/UpgradeIntro.tsx
@@ -46,6 +46,15 @@ function UpgradeIntro({feature, onUpgrade, buttonDisabled, loading, isCategorizi
         return `${convertToShortDisplayString(upgradePrice, upgradeCurrency)} `;
     }, [preferredCurrency, isCategorizing]);
 
+    /**
+     *
+     * If the feature is null or there is no policyID, it indicates the user is not associated with any specific workspace.
+     * In this case, the generic upgrade view should be shown.
+     * However, the policyID check is only necessary when the user is not coming from the "Categorize" option.
+     * The "isCategorizing" flag is set to true when the user accesses the "Categorize" option in the Self-DM whisper.
+     * In such scenarios, a separate Categories upgrade UI is displayed.
+     *
+     */
     if (!feature || (!isCategorizing && !policyID)) {
         return (
             <GenericFeaturesView

From c52c52013b8f1bc024c87b9a273dc8daa09e01d0 Mon Sep 17 00:00:00 2001
From: jayeshmangwani <jayeshmangwani@gmail.com>
Date: Mon, 13 Jan 2025 14:21:56 +0530
Subject: [PATCH 4/4] removed unnecessary empty lines from comment

---
 src/pages/workspace/upgrade/UpgradeIntro.tsx | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/pages/workspace/upgrade/UpgradeIntro.tsx b/src/pages/workspace/upgrade/UpgradeIntro.tsx
index aa5601bad022..e3d5b055c1a7 100644
--- a/src/pages/workspace/upgrade/UpgradeIntro.tsx
+++ b/src/pages/workspace/upgrade/UpgradeIntro.tsx
@@ -47,13 +47,11 @@ function UpgradeIntro({feature, onUpgrade, buttonDisabled, loading, isCategorizi
     }, [preferredCurrency, isCategorizing]);
 
     /**
-     *
      * If the feature is null or there is no policyID, it indicates the user is not associated with any specific workspace.
      * In this case, the generic upgrade view should be shown.
      * However, the policyID check is only necessary when the user is not coming from the "Categorize" option.
      * The "isCategorizing" flag is set to true when the user accesses the "Categorize" option in the Self-DM whisper.
      * In such scenarios, a separate Categories upgrade UI is displayed.
-     *
      */
     if (!feature || (!isCategorizing && !policyID)) {
         return (