refactor: clean up unused imports and comment out upgrade logic in multiple components

apps/mail/components/connection/add.tsx

@@ -36,17 +36,17 @@ export const AddConnectionDialog = ({
   }, [connections]);
 
   const handleUpgrade = async () => {
-    if (attach) {
-      return attach({
-        productId: 'pro-example',
-      })
-        .catch((error: Error) => {
-          console.error('Failed to upgrade:', error);
-        })
-        .then(() => {
-          console.log('Upgraded successfully');
-        });
-    }
+    // if (attach) {
+    //   return attach({
+    //     productId: 'pro-example',
+    //   })
+    //     .catch((error: Error) => {
+    //       console.error('Failed to upgrade:', error);
+    //     })
+    //     .then(() => {
+    //       console.log('Upgraded successfully');
+    //     });
+    // }
   };
 
   return (

apps/mail/components/create/ai-chat.tsx

@@ -16,13 +16,13 @@ import { useStats } from '@/hooks/use-stats';
 import { useParams } from 'next/navigation';
 import { CheckCircle2 } from 'lucide-react';
 import { useChat } from '@ai-sdk/react';
+import { Button } from '../ui/button';
 import { format } from 'date-fns-tz';
 import { useQueryState } from 'nuqs';
 import { Input } from '../ui/input';
 import { useState } from 'react';
 import VoiceChat from './voice';
 import Image from 'next/image';
-import { Button } from '../ui/button';
 
 const renderThread = (thread: { id: string; title: string; snippet: string }) => {
   const [, setThreadId] = useQueryState('threadId');
@@ -177,17 +177,17 @@ export function AIChat() {
   }, [messages, scrollToBottom]);
 
   const handleUpgrade = async () => {
-    if (attach) {
-      return attach({
-        productId: 'pro-example',
-      })
-        .catch((error: Error) => {
-          console.error('Failed to upgrade:', error);
-        })
-        .then(() => {
-          console.log('Upgraded successfully');
-        });
-    }
+    // if (attach) {
+    //   return attach({
+    //     productId: 'pro-example',
+    //   })
+    //     .catch((error: Error) => {
+    //       console.error('Failed to upgrade:', error);
+    //     })
+    //     .then(() => {
+    //       console.log('Upgraded successfully');
+    //     });
+    // }
   };
 
   return (
@@ -196,8 +196,12 @@ export function AIChat() {
         <div className="min-h-full space-y-4 px-4 py-4">
           {chatMessages && !chatMessages.enabled ? (
             <div className="absolute inset-0 flex flex-col items-center justify-center">
-              <TextShimmer className="text-center text-xl font-medium ">Upgrade to Zero Pro for unlimited AI chats</TextShimmer>
-              <Button onClick={handleUpgrade} className="mt-2 w-52 h-8">Upgrade</Button>
+              <TextShimmer className="text-center text-xl font-medium">
+                Upgrade to Zero Pro for unlimited AI chats
+              </TextShimmer>
+              <Button onClick={handleUpgrade} className="mt-2 h-8 w-52">
+                Upgrade
+              </Button>
             </div>
           ) : !messages.length ? (
             <div className="absolute inset-0 flex flex-col items-center justify-center">

apps/mail/components/ui/ai-sidebar.tsx

@@ -9,23 +9,23 @@ import {
   DialogTrigger,
 } from './dialog';
 import { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider } from '@/components/ui/tooltip';
+import { ResizablePanelGroup, ResizablePanel, ResizableHandle } from '@/components/ui/resizable';
 import { useState, useEffect, useContext, createContext, useCallback } from 'react';
 import { AI_SIDEBAR_COOKIE_NAME, SIDEBAR_COOKIE_MAX_AGE } from '@/lib/constants';
-import { ResizablePanelGroup, ResizablePanel, ResizableHandle } from '@/components/ui/resizable';
 import { StyledEmailAssistantSystemPrompt, AiChatPrompt } from '@/lib/prompts';
 import { useEditor } from '@/components/providers/editor-provider';
 import { AIChat } from '@/components/create/ai-chat';
 import { X, Paper } from '@/components/icons/icons';
 import { GitBranchPlus, Plus } from 'lucide-react';
+import { useBilling } from '@/hooks/use-billing';
 import { Button } from '@/components/ui/button';
 import { useHotkeys } from 'react-hotkeys-hook';
+import { Gauge } from '@/components/ui/gauge';
 import { usePathname } from 'next/navigation';
 import { getCookie } from '@/lib/utils';
 import { Textarea } from './textarea';
 import { cn } from '@/lib/utils';
 import Link from 'next/link';
-import { useBilling } from '@/hooks/use-billing';
-import { Gauge } from '@/components/ui/gauge';
 
 interface AISidebarProps {
   className?: string;
@@ -80,17 +80,17 @@ export function AISidebar({ children, className }: AISidebarProps & { children:
   const { chatMessages, attach } = useBilling();
 
   const handleUpgrade = async () => {
-    if (attach) {
-      return attach({
-        productId: 'pro-example',
-      })
-        .catch((error: Error) => {
-          console.error('Failed to upgrade:', error);
-        })
-        .then(() => {
-          console.log('Upgraded successfully');
-        });
-    }
+    // if (attach) {
+    //   return attach({
+    //     productId: 'pro-example',
+    //   })
+    //     .catch((error: Error) => {
+    //       console.error('Failed to upgrade:', error);
+    //     })
+    //     .then(() => {
+    //       console.log('Upgraded successfully');
+    //     });
+    // }
   };
 
   useHotkeys('Meta+0', () => {
@@ -113,14 +113,12 @@ export function AISidebar({ children, className }: AISidebarProps & { children:
 
   return (
     <TooltipProvider delayDuration={0}>
-      
       <ResizablePanelGroup
         direction="horizontal"
         className={cn('bg-lightBackground dark:bg-darkBackground p-0')}
       >
-       
         <ResizablePanel>{children}</ResizablePanel>
-        <ResizableHandle className='opacity-0'/>
+        <ResizableHandle className="opacity-0" />
         {open && (
           <>
             <ResizablePanel
@@ -148,18 +146,26 @@ export function AISidebar({ children, className }: AISidebarProps & { children:
                       </Tooltip>
                     </TooltipProvider>
 
-                    <div className="flex items-center gap-2"> 
+                    <div className="flex items-center gap-2">
                       <TooltipProvider delayDuration={0}>
                         <Tooltip>
-                          <TooltipTrigger asChild className='md:h-fit md:px-2'>
+                          <TooltipTrigger asChild className="md:h-fit md:px-2">
                             <div>
-                              <Gauge value={50 - chatMessages.remaining!} size="small" showValue={true} />
+                              <Gauge
+                                value={50 - chatMessages.remaining!}
+                                size="small"
+                                showValue={true}
+                              />
                             </div>
                           </TooltipTrigger>
                           <TooltipContent>
-                            <p>You've used {50 - chatMessages.remaining!} out of 50 chat messages.</p>
-                            <p className='mb-2'>Upgrade for unlimited messages!</p>
-                            <Button onClick={handleUpgrade} className="w-full h-8">Upgrade</Button>
+                            <p>
+                              You've used {50 - chatMessages.remaining!} out of 50 chat messages.
+                            </p>
+                            <p className="mb-2">Upgrade for unlimited messages!</p>
+                            <Button onClick={handleUpgrade} className="h-8 w-full">
+                              Upgrade
+                            </Button>
                           </TooltipContent>
                         </Tooltip>
                       </TooltipProvider>

apps/mail/hooks/use-billing.ts

@@ -1,4 +1,3 @@
-import { useAutumn, useCustomer } from 'autumn-js/next';
 import { useMemo } from 'react';
 
 type Feature = {
@@ -34,49 +33,33 @@ const FEATURE_IDS = {
 } as const;
 
 export const useBilling = () => {
-  const { customer, refetch } = useCustomer();
-  const { attach, track } = useAutumn();
-
   const customerFeatures = useMemo(() => {
-    if (!customer) return DEFAULT_FEATURES;
-
-    const features = customer.features.reduce(
-      (acc: Features, feature: Feature) => {
-        const id = feature.feature_id;
-        if (id === FEATURE_IDS.CHAT) {
-          acc.chatMessages = {
-            total: feature.included_usage || 0,
-            remaining: feature.balance || 0,
-            unlimited: feature.unlimited,
-            enabled: feature.unlimited || Number(feature.balance) > 0,
-          };
-        } else if (id === FEATURE_IDS.CONNECTIONS) {
-          acc.connections = {
-            total: feature.included_usage || 0,
-            remaining: feature.balance || 0,
-            unlimited: feature.unlimited,
-            enabled: feature.unlimited || Number(feature.balance) > 0,
-          };
-        } else if (id === FEATURE_IDS.BRAIN) {
-          acc.brainActivity = {
-            total: feature.included_usage || 0,
-            remaining: feature.balance || 0,
-            unlimited: feature.unlimited,
-            enabled: feature.unlimited || Number(feature.balance) > 0,
-          };
-        }
-        return acc;
+    return {
+      chatMessages: {
+        total: 100,
+        remaining: 75,
+        unlimited: false,
+        enabled: true,
       },
-      { ...DEFAULT_FEATURES },
-    );
-
-    return features;
-  }, [customer]);
+      connections: {
+        total: 5,
+        remaining: 3,
+        unlimited: false,
+        enabled: true,
+      },
+      brainActivity: {
+        total: 1000,
+        remaining: 850,
+        unlimited: false,
+        enabled: true,
+      },
+    };
+  }, []);
 
   return {
-    refetch,
-    attach,
-    track,
+    refetch: () => {},
+    attach: () => {},
+    track: () => {},
     ...customerFeatures,
   };
 };

apps/mail/providers/server-providers.tsx

@@ -8,10 +8,8 @@ import { authProxy } from '@/lib/auth-proxy';
 export async function ServerProviders({ children }: PropsWithChildren) {
   const messages = await getMessages();
   return (
-    <AutumnProvider authPlugin={{ provider: 'better-auth', instance: authProxy }}>
-      <NextIntlClientProvider messages={messages}>
-        <QueryProvider>{children}</QueryProvider>
-      </NextIntlClientProvider>
-    </AutumnProvider>
+    <NextIntlClientProvider messages={messages}>
+      <QueryProvider>{children}</QueryProvider>
+    </NextIntlClientProvider>
   );
 }