refactor(upgrade): surface billing errors via toast instead of native alert()

The upgrade flow used native alert() for upgrade / switch-plan / switch-interval
failures. Route them through the unified toast (toast.error) like the rest of
the app — it's inside the ToastProvider tree.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/upgrade/hooks/use-upgrade-state.ts

@@ -1,6 +1,7 @@
 'use client'
 import { useCallback, useEffect, useRef, useState } from 'react'
 import { getErrorMessage } from '@sim/utils/errors'
+import { toast } from '@/components/emcn'
 import { requestJson } from '@/lib/api/client/request'
 import { billingSwitchPlanContract } from '@/lib/api/contracts/subscription'
 import { useSubscriptionUpgrade } from '@/lib/billing/client/upgrade'
@@ -129,7 +130,7 @@ export function useUpgradeState(): UpgradeState {
           ...(seats ? { seats } : {}),
         })
       } catch (error) {
-        alert(getErrorMessage(error, 'Unknown error occurred'))
+        toast.error(getErrorMessage(error, 'Unknown error occurred'))
       }
     },
     [handleUpgrade, isAnnual]
@@ -180,7 +181,7 @@ export function useUpgradeState(): UpgradeState {
       })
       await refetchSubscription()
     } catch (e) {
-      alert(getErrorMessage(e, 'Failed to upgrade'))
+      toast.error(getErrorMessage(e, 'Failed to upgrade'))
     }
   }, [subscription.isTeam, isAnnual, refetchSubscription])
 
@@ -196,7 +197,7 @@ export function useUpgradeState(): UpgradeState {
       })
       await refetchSubscription()
     } catch (e) {
-      alert(getErrorMessage(e, 'Failed to switch plan'))
+      toast.error(getErrorMessage(e, 'Failed to switch plan'))
     }
   }, [subscription.plan, subscription.isTeam, refetchSubscription])
 

apps/sim/app/workspace/[workspaceId]/upgrade/upgrade.tsx

@@ -3,7 +3,7 @@
 import { useCallback, useEffect, useState } from 'react'
 import { getErrorMessage } from '@sim/utils/errors'
 import { useRouter } from 'next/navigation'
-import { ArrowLeft, Chip } from '@/components/emcn'
+import { ArrowLeft, Chip, toast } from '@/components/emcn'
 import {
   getUpgradeCardCta,
   type PlanCardCta,
@@ -91,7 +91,7 @@ export function Upgrade({ workspaceId }: UpgradeProps) {
           onClick: () =>
             state
               .handleSwitchInterval(state.isAnnual ? 'year' : 'month')
-              .catch((e) => alert(getErrorMessage(e, 'Failed to switch interval'))),
+              .catch((e) => toast.error(getErrorMessage(e, 'Failed to switch interval'))),
         }
       }
       return { ...cta, onClick: () => {}, disabled: true }