feat(billing): remove feature flag for one time addons TASK-1479 (#5449)

### 📣 Summary Removes feature flag for one time addons. ### 💭 Notes I have also set the "addons" link to always appear on the account sidebar for users with the necessary org role. Previously, the only addons that were available were restricted to users without existing subscriptions. Now anyone, regardless of subscription status, can purchase one-time addons. ### 👀 Preview steps On a stripe-enabled instance, visit `/account/settings` as an org owner. You should see "addons" in the account sidenav and be able to navigate to the addons page.
kobotoolbox · Jan 24, 2025 · aa3bd43 · aa3bd43
1 parent 0fc340b
commit aa3bd43
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 29 deletions.
diff --git a/jsapp/js/account/accountSidebar.tsx b/jsapp/js/account/accountSidebar.tsx
@@ -47,7 +47,6 @@ function AccountNavLink(props: AccountNavLinkProps) {
 // by the org being single-user.
 function renderSingleUserOrgSidebar(
   isStripeEnabled: boolean,
-  showAddOnsLink: boolean,
   isOwner: boolean
 ) {
   return (
@@ -77,14 +76,12 @@ function renderSingleUserOrgSidebar(
                   name={t('Plans')}
                   to={ACCOUNT_ROUTES.PLAN}
                 />
-                {showAddOnsLink && (
-                  <AccountNavLink
-                    iconName='plus'
-                    name={t('Add-ons')}
-                    to={ACCOUNT_ROUTES.ADD_ONS}
-                    isNew
-                  />
-                )}
+                <AccountNavLink
+                  iconName='plus'
+                  name={t('Add-ons')}
+                  to={ACCOUNT_ROUTES.ADD_ONS}
+                  isNew
+                />
               </>
             )}
           </>
@@ -97,7 +94,6 @@ function renderSingleUserOrgSidebar(
 function renderMmoSidebar(
   userRole: OrganizationUserRole,
   isStripeEnabled: boolean,
-  showAddOnsLink: boolean,
   mmoLabel: string
 ) {
   const showBillingRoutes =
@@ -143,14 +139,12 @@ function renderMmoSidebar(
               name={t('Plans')}
               to={ACCOUNT_ROUTES.PLAN}
             />
-            {showAddOnsLink && (
-              <AccountNavLink
-                iconName='plus'
-                name={t('Add-ons')}
-                to={ACCOUNT_ROUTES.ADD_ONS}
-                isNew
-              />
-            )}
+            <AccountNavLink
+              iconName='plus'
+              name={t('Add-ons')}
+              to={ACCOUNT_ROUTES.ADD_ONS}
+              isNew
+            />
           </>
         )}
         {hasAdminPrivileges && (
@@ -176,10 +170,6 @@ function AccountSidebar() {
     setIsStripeEnabled(true);
   }, [subscriptionStore.isInitialised]);
 
-  const showAddOnsLink = useMemo(() => {
-    return !subscriptionStore.planResponse.length;
-  }, [subscriptionStore.isInitialised]);
-
   const mmoLabel = getSimpleMMOLabel(
     envStore.data,
     subscriptionStore.activeSubscriptions[0]
@@ -193,14 +183,12 @@ function AccountSidebar() {
     return renderMmoSidebar(
       orgQuery.data?.request_user_role,
       isStripeEnabled,
-      showAddOnsLink,
       mmoLabel
     );
   }
 
   return renderSingleUserOrgSidebar(
     isStripeEnabled,
-    showAddOnsLink,
     orgQuery.data.is_owner
   );
 }

diff --git a/jsapp/js/account/addOns/addOnList.component.tsx b/jsapp/js/account/addOns/addOnList.component.tsx
@@ -14,7 +14,6 @@ import type {BadgeColor} from 'jsapp/js/components/common/badge';
 import Badge from 'jsapp/js/components/common/badge';
 import {formatDate} from 'js/utils';
 import {OneTimeAddOnsContext} from 'jsapp/js/account/useOneTimeAddonList.hook';
-import {FeatureFlag, useFeatureFlag} from 'jsapp/js/featureFlags';
 import type {Organization} from 'js/account/organization/organizationQuery';
 
 /**
@@ -38,7 +37,6 @@ const AddOnList = (props: {
   >([]);
   const [addOnProducts, setAddOnProducts] = useState<Product[]>([]);
   const oneTimeAddOnsContext = useContext(OneTimeAddOnsContext);
-  const areOneTimeAddonsEnabled = useFeatureFlag(FeatureFlag.oneTimeAddonsEnabled);
   const oneTimeAddOnSubscriptions = oneTimeAddOnsContext.oneTimeAddOns;
   const oneTimeAddOnProducts = addOnProducts.filter(
     (product) => product.metadata.product_type === 'addon_onetime'
@@ -47,7 +45,6 @@ const AddOnList = (props: {
     (product) => product.metadata.product_type === 'addon'
   );
   const showRecurringAddons = !subscribedPlans.length && !!recurringAddOnProducts.length;
-  const showOneTimeAddons = areOneTimeAddonsEnabled && !!oneTimeAddOnProducts.length;
 
   /**
    * Extract the add-on products and prices from the list of all products
@@ -194,7 +191,7 @@ const AddOnList = (props: {
               organization={props.organization}
             />
           )}
-          {showOneTimeAddons && (
+          {!!oneTimeAddOnProducts.length && (
             <OneTimeAddOnRow
               key={oneTimeAddOnProducts.map((product) => product.id).join('-')}
               products={oneTimeAddOnProducts}

diff --git a/jsapp/js/featureFlags.ts b/jsapp/js/featureFlags.ts
@@ -3,7 +3,7 @@
  * For our sanity, use camel case and match key with value.
  */
 export enum FeatureFlag {
-  oneTimeAddonsEnabled = 'oneTimeAddonsEnabled',
+  exampleFeatureEnabled = 'exampleFeatureEnabled', //Comment out when we have active FFs
 }
 
 /**