feat(studio): adding log drains mention to plan features (supabase#40136)

* feat: add mention of log drains to team plan in plan selection

Adds an additional feature row to the Team Plan to mention log drains can be added for another 60 dollars

* feat: experiment with highlighing team plan

* style: minor ring adjustment

Author: kemaldotearth

apps/studio/components/interfaces/Organization/BillingSettings/Subscription/PlanUpdateSidePanel.tsx

@@ -183,6 +183,11 @@ export const PlanUpdateSidePanel = () => {
               const features = plan.features
               const footer = plan.footer
 
+              const source = Array.isArray(router.query.source)
+                ? router.query.source[0]
+                : router.query.source
+              const shouldHighlight = source === 'log-drains-empty-state' && plan.id === 'tier_team'
+
               if (plan.id === 'tier_enterprise') {
                 return <EnterpriseCard key={plan.id} plan={plan} isCurrentPlan={isCurrentPlan} />
               }
@@ -192,7 +197,9 @@ export const PlanUpdateSidePanel = () => {
                   key={plan.id}
                   className={cn(
                     'px-4 py-4 flex flex-col items-start justify-between',
-                    'border rounded-md col-span-12 md:col-span-4 bg-surface-200'
+                    'border rounded-md col-span-12 md:col-span-4 bg-surface-200',
+                    shouldHighlight &&
+                      'ring-4 ring-brand animate-[pulse_1.5s_ease-in-out_1] shadow-md shadow-brand/40'
                   )}
                 >
                   <div className="w-full">

packages/shared-data/plans.ts

@@ -85,6 +85,7 @@ export const plans: PricingInformation[] = [
       'Priority email support & SLAs',
       'Daily backups stored for 14 days',
       '28-day log retention',
+      ['Add Log Drains', 'additional $60 per drain, per project'],
     ],
     preface: 'Everything in the Pro Plan, plus:',
     cta: 'Get Started',