feat: Refactor Newsletter with horizontal tabs (Subscribers | Campaigns)

- Created Newsletter/index.tsx as tabs container
- Extracted Newsletter/Subscribers.tsx (from old Newsletter.tsx)
- Moved Campaigns to Newsletter/Campaigns.tsx
- Updated App.tsx routes (campaigns now under newsletter)
- Removed separate Campaigns card from Marketing index
- Follows Customer Notifications tab pattern for consistency

admin-spa/src/routes/Marketing/Newsletter/index.tsx

@@ -0,0 +1,74 @@
+import React, { useState, useEffect } from 'react';
+import { useSearchParams, useNavigate } from 'react-router-dom';
+import { SettingsLayout } from '@/routes/Settings/components/SettingsLayout';
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
+import { Button } from '@/components/ui/button';
+import { Mail } from 'lucide-react';
+import { __ } from '@/lib/i18n';
+import { useModules } from '@/hooks/useModules';
+import Subscribers from './Subscribers';
+import Campaigns from './Campaigns';
+
+export default function Newsletter() {
+    const [searchParams, setSearchParams] = useSearchParams();
+    const [activeTab, setActiveTab] = useState('subscribers');
+    const navigate = useNavigate();
+    const { isEnabled } = useModules();
+
+    // Check for tab query param
+    useEffect(() => {
+        const tabParam = searchParams.get('tab');
+        if (tabParam && ['subscribers', 'campaigns'].includes(tabParam)) {
+            setActiveTab(tabParam);
+        }
+    }, [searchParams]);
+
+    // Update URL when tab changes
+    const handleTabChange = (value: string) => {
+        setActiveTab(value);
+        setSearchParams({ tab: value });
+    };
+
+    // Show disabled state if newsletter module is off
+    if (!isEnabled('newsletter')) {
+        return (
+            <SettingsLayout
+                title={__('Newsletter')}
+                description={__('Newsletter module is disabled')}
+            >
+                <div className="bg-yellow-50 dark:bg-yellow-950/20 border border-yellow-200 dark:border-yellow-900 rounded-lg p-6 text-center">
+                    <Mail className="h-12 w-12 text-yellow-600 mx-auto mb-3" />
+                    <h3 className="font-semibold text-lg mb-2">{__('Newsletter Module Disabled')}</h3>
+                    <p className="text-sm text-muted-foreground mb-4">
+                        {__('The newsletter module is currently disabled. Enable it in Settings > Modules to use this feature.')}
+                    </p>
+                    <Button onClick={() => navigate('/settings/modules')}>
+                        {__('Go to Module Settings')}
+                    </Button>
+                </div>
+            </SettingsLayout>
+        );
+    }
+
+    return (
+        <SettingsLayout
+            title={__('Newsletter')}
+            description={__('Manage subscribers and send email campaigns')}
+        >
+            <Tabs value={activeTab} onValueChange={handleTabChange} className="space-y-6">
+                <TabsList className="grid w-full grid-cols-2 max-w-md">
+                    <TabsTrigger value="subscribers">{__('Subscribers')}</TabsTrigger>
+                    <TabsTrigger value="campaigns">{__('Campaigns')}</TabsTrigger>
+                </TabsList>
+
+                <TabsContent value="subscribers" className="space-y-4 mt-6">
+                    <Subscribers />
+                </TabsContent>
+
+                <TabsContent value="campaigns" className="space-y-4 mt-6">
+                    <Campaigns />
+                </TabsContent>
+            </Tabs>
+        </SettingsLayout>
+    );
+}