update

frontend/src/pages/EmailSequenceGenerator.jsx

@@ -1,27 +1,31 @@
 import React, { useState } from 'react';
+import { Link } from 'react-router-dom';
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
 import AppShell from '@/components/layout/AppShell';
-import EmailGeneratorTab from '@/components/campaigns/EmailGeneratorTab';
 import LinkedinCampaignsTab from '@/components/campaigns/LinkedinCampaignsTab';
 import CampaignsDashboardTab from '@/components/campaigns/CampaignsDashboardTab';
+import { Button } from '@/components/ui/button';
 
 export default function EmailSequenceGenerator() {
-    const [activeTab, setActiveTab] = useState('generator');
+    const [activeTab, setActiveTab] = useState('campaigns');
 
     return (
         <AppShell
             title="Campaigns"
             subtitle="Create and run email + LinkedIn campaigns from one workspace."
         >
+            <p className="mb-4 text-sm text-slate-600">
+                Upload contacts, configure prompts, and export sequences from{' '}
+                <Button variant="link" className="h-auto p-0 text-violet-700" asChild>
+                    <Link to="/settings">Settings → Email / AI generator</Link>
+                </Button>
+                .
+            </p>
             <Tabs value={activeTab} onValueChange={setActiveTab}>
                 <TabsList className="mb-6 flex-wrap gap-1">
-                    <TabsTrigger value="generator">Email/AI Generator</TabsTrigger>
-                    <TabsTrigger value="linkedin">LinkedIn Campaigns</TabsTrigger>
                     <TabsTrigger value="campaigns">Campaigns</TabsTrigger>
+                    <TabsTrigger value="linkedin">LinkedIn Campaigns</TabsTrigger>
                 </TabsList>
-                <TabsContent value="generator">
-                    <EmailGeneratorTab />
-                </TabsContent>
                 <TabsContent value="linkedin">
                     <LinkedinCampaignsTab />
                 </TabsContent>

frontend/src/pages/Settings.jsx

@@ -1,14 +1,17 @@
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import {
+    ArrowLeft,
     ClipboardCopy,
     Loader2,
     ShieldAlert,
     Link2,
+    Sparkles,
     UserPlus,
     Users,
     Trash2,
 } from 'lucide-react';
 import AppShell from '@/components/layout/AppShell';
+import EmailGeneratorTab from '@/components/campaigns/EmailGeneratorTab';
 import LinkedInConnectSettings from '@/components/settings/LinkedInConnectSettings';
 import ConnectMailboxSettings from '@/components/settings/ConnectMailboxSettings';
 import { Button } from '@/components/ui/button';
@@ -24,6 +27,8 @@ import { apiFetch } from '@/lib/api';
 import { cn } from '@/lib/utils';
 
 export default function Settings() {
+    /** 'main' | 'email_generator' — full-page generator inside Settings */
+    const [settingsPanel, setSettingsPanel] = useState('main');
     const [me, setMe] = useState(null);
     const [meLoading, setMeLoading] = useState(true);
     const [members, setMembers] = useState([]);
@@ -186,13 +191,37 @@ export default function Settings() {
         );
     }
 
+    if (settingsPanel === 'email_generator') {
+        return (
+            <AppShell
+                title="Settings"
+                subtitle="Email / AI generator — upload contacts, prompts, and export."
+            >
+                <div className="w-full max-w-6xl">
+                    <div className="mb-6 flex flex-wrap items-center gap-3">
+                        <Button
+                            type="button"
+                            variant="outline"
+                            className="gap-2"
+                            onClick={() => setSettingsPanel('main')}
+                        >
+                            <ArrowLeft className="h-4 w-4" aria-hidden />
+                            Back to settings
+                        </Button>
+                    </div>
+                    <EmailGeneratorTab />
+                </div>
+            </AppShell>
+        );
+    }
+
     return (
         <AppShell
             title="Settings"
             subtitle={
                 isAdmin
-                    ? 'Invitations, members, LinkedIn, mailbox, and Smartlead webhook.'
-                    : 'LinkedIn, mailbox, and Smartlead webhook. Invites and member management require admin.'
+                    ? 'Invitations, members, LinkedIn, mailbox, Smartlead webhook, and email generator.'
+                    : 'LinkedIn, mailbox, Smartlead webhook, and email generator. Invites and member management require admin.'
             }
         >
             <div className="space-y-8 max-w-3xl">
@@ -359,6 +388,20 @@ export default function Settings() {
                 <LinkedInConnectSettings />
                 <ConnectMailboxSettings />
 
+                <section className="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm">
+                    <div className="flex items-center gap-2 text-slate-800 font-semibold mb-2">
+                        <Sparkles className="h-5 w-5 text-violet-600" />
+                        Email / AI generator
+                    </div>
+                    <p className="text-sm text-slate-600 mb-4">
+                        Import an Apollo CSV, choose products, edit prompts, and generate email sequences in
+                        a guided flow. Opens full width here so you can focus on the tool.
+                    </p>
+                    <Button type="button" onClick={() => setSettingsPanel('email_generator')}>
+                        Open Email / AI generator
+                    </Button>
+                </section>
+
                 <section className="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm">
                     <div className="flex items-center gap-2 text-slate-800 font-semibold mb-4">
                         <Link2 className="h-5 w-5 text-violet-600" />