diff --git a/client/index.html b/client/index.html index 8c3ef08..3775657 100644 --- a/client/index.html +++ b/client/index.html @@ -4,11 +4,23 @@ Social Flow - Automatisation des réseaux sociaux - + + + - +
diff --git a/client/public/favicon.svg b/client/public/favicon.svg index ff1ab3e..a9d39eb 100644 --- a/client/public/favicon.svg +++ b/client/public/favicon.svg @@ -1,21 +1,13 @@ - + - - - + + + + - - - - - - - - - - - - - + + + + diff --git a/client/src/App.tsx b/client/src/App.tsx index e2c1323..0319f13 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -1,99 +1,58 @@ -import { Switch, Route, Redirect, useLocation } from "wouter"; -import { useEffect } from "react"; +import { Switch, Route, useLocation, Link } from "wouter"; +import { lazy, Suspense, useEffect, type ComponentType } from "react"; import { queryClient } from "./lib/queryClient"; -import { QueryClientProvider, useQuery } from "@tanstack/react-query"; +import { QueryClientProvider } from "@tanstack/react-query"; +import { ShieldAlert } from "lucide-react"; import { Toaster } from "@/components/ui/toaster"; import { TooltipProvider } from "@/components/ui/tooltip"; -import { createResponsiveRoute } from "@/components/responsive-route"; +import { Button } from "@/components/ui/button"; +import { ThemeProvider } from "@/components/theme-provider"; +import { AppShell, Page } from "@/components/layout/app-shell"; +import { EmptyState } from "@/components/empty-state"; +import { LogoMark } from "@/components/brand/logo"; +import { useSession } from "@/hooks/use-session"; import NotFound from "@/pages/not-found"; import Login from "@/pages/login"; -import TestCamera from "@/pages/test-camera"; +// Pages chargées à la demande : une seule version responsive par écran. +const Dashboard = lazy(() => import("@/pages/dashboard")); +const NewPost = lazy(() => import("@/pages/new-post")); +const NewReel = lazy(() => import("@/pages/new-reel")); +const ScheduleReel = lazy(() => import("@/pages/schedule-reel")); +const Calendar = lazy(() => import("@/pages/calendar")); +const Media = lazy(() => import("@/pages/media")); +const ImageEditor = lazy(() => import("@/pages/image-editor")); +const PagesManagement = lazy(() => import("@/pages/pages")); +const AI = lazy(() => import("@/pages/ai")); +const History = lazy(() => import("@/pages/history")); +const Settings = lazy(() => import("@/pages/settings")); +const SqlAdmin = lazy(() => import("@/pages/sql")); +const AudioAdmin = lazy(() => import("@/pages/audio-admin")); +const UsersAdmin = lazy(() => import("@/pages/users-admin")); +const Analytics = lazy(() => import("@/pages/analytics")); -// Create responsive routes with lazy loading for optimal performance -const History = createResponsiveRoute( - () => import("@/pages/history"), - () => import("@/pages/mobile/history") -); -const Dashboard = createResponsiveRoute( - () => import("@/pages/dashboard"), - () => import("@/pages/mobile/dashboard") -); +function FullScreenLoader() { + return ( +
+
+ +

Chargement…

+
+
+ ); +} -const NewPost = createResponsiveRoute( - () => import("@/pages/new-post"), - () => import("@/pages/mobile/new-post") -); +function PageLoader() { + return ( +
+
+
+ ); +} -const Calendar = createResponsiveRoute( - () => import("@/pages/calendar"), - () => import("@/pages/mobile/calendar") -); - -const Media = createResponsiveRoute( - () => import("@/pages/media"), - () => import("@/pages/mobile/media") -); - -const ImageEditor = createResponsiveRoute( - () => import("@/pages/image-editor"), - () => import("@/pages/mobile/image-editor") -); - -const PagesManagement = createResponsiveRoute( - () => import("@/pages/pages"), - () => import("@/pages/mobile/pages") -); - -const AI = createResponsiveRoute( - () => import("@/pages/ai"), - () => import("@/pages/mobile/ai") -); - -const Settings = createResponsiveRoute( - () => import("@/pages/settings"), - () => import("@/pages/mobile/settings") -); - -const SqlAdmin = createResponsiveRoute( - () => import("@/pages/sql"), - () => import("@/pages/mobile/sql") -); - -const AudioAdmin = createResponsiveRoute( - () => import("@/pages/audio-admin"), - () => import("@/pages/mobile/audio-admin") -); - -const UsersAdmin = createResponsiveRoute( - () => import("@/pages/users-admin"), - () => import("@/pages/mobile/users-admin") -); - -const Analytics = createResponsiveRoute( - () => import("@/pages/AnalyticsPage"), - () => import("@/pages/mobile/analytics") -); - -// NewReel uses desktop version for now (mobile can be added later) -const NewReel = createResponsiveRoute( - () => import("@/pages/new-reel"), - () => import("@/pages/mobile/new-reel") // Uses same component for now -); - -// Reel déjà monté : même page responsive sur mobile et desktop -const ScheduleReel = createResponsiveRoute( - () => import("@/pages/schedule-reel"), - () => import("@/pages/schedule-reel") -); - -function ProtectedRoute({ component: Component, adminOnly = false }: { component: React.ComponentType; adminOnly?: boolean }) { +function ProtectedRoute({ component: Component, adminOnly = false }: { component: ComponentType; adminOnly?: boolean }) { const [, setLocation] = useLocation(); - - const { data: session, isLoading } = useQuery({ - queryKey: ["/api/auth/session"], - retry: false, - }); + const { session, isAdmin, isLoading } = useSession(); useEffect(() => { if (!isLoading && !session) { @@ -101,33 +60,31 @@ function ProtectedRoute({ component: Component, adminOnly = false }: { component } }, [isLoading, session, setLocation]); - if (isLoading) { - return ( -
-
-
-

Chargement...

-
-
- ); - } + if (isLoading) return ; + if (!session) return null; - if (!session) { - return null; - } - - if (adminOnly && (session as any).role !== "admin") { - return ( -
-
-

Accès refusé

-

Cette page est réservée aux administrateurs.

-
-
- ); - } - - return ; + return ( + + {adminOnly && !isAdmin ? ( + + + Retour au tableau de bord + + } + /> + + ) : ( + }> + + + )} + + ); } function Router() { @@ -149,7 +106,6 @@ function Router() { {() => } {() => } {() => } - ); @@ -157,14 +113,14 @@ function Router() { function App() { return ( - - -
+ + + -
- - + + + ); } diff --git a/client/src/components/ai-chat.tsx b/client/src/components/ai-chat.tsx index 33aec8e..5355722 100644 --- a/client/src/components/ai-chat.tsx +++ b/client/src/components/ai-chat.tsx @@ -4,7 +4,8 @@ import { Input } from "@/components/ui/input"; import { Textarea } from "@/components/ui/textarea"; import { useMutation, useQuery } from "@tanstack/react-query"; import { apiRequest, queryClient } from "@/lib/queryClient"; -import { Bot, User, Lightbulb, History, Zap, Sparkles, Loader2 } from "lucide-react"; +import { Bot, User, Sparkles, Loader2, Copy, RotateCcw } from "lucide-react"; +import { Badge } from "@/components/ui/badge"; import { useToast } from "@/hooks/use-toast"; import { ModelCombobox } from "@/components/model-combobox"; @@ -90,33 +91,20 @@ export default function AiChat() { setInput(""); }; + const copyVariant = async (text: string) => { + try { + await navigator.clipboard.writeText(text); + toast({ title: "Texte copié", description: "Collez-le dans votre publication." }); + } catch { + toast({ title: "Copie impossible", description: "Sélectionnez le texte manuellement.", variant: "destructive" }); + } + }; + return ( -
-
-
-
-
- -
-
-

Assistant IA

-

Génération de contenu intelligent

-
-
- -
- -
- +
+
+
+ Modèle
+
-
+
{messages.map((message, index) => ( -
+
{message.role === "assistant" && ( -
- +
+
)} - -
-
+
-

{message.content}

- + > +

{message.content}

+ {message.variants && ( -
+
{message.variants.map((variant, vIndex) => ( -
copyVariant(variant.text)} + className="group block w-full rounded-lg border bg-muted/40 p-4 text-left transition-colors hover:border-primary/40 hover:bg-accent" data-testid={`variant-${vIndex}`} > -
- - {variant.variant} +
+ {variant.variant} + + {variant.characterCount} caractères + - {variant.characterCount} caractères
-

{variant.text}

-
+

{variant.text}

+ ))} +

Cliquez sur une proposition pour la copier.

)}
- - {message.role === "user" ? "Maintenant" : "Il y a quelques secondes"} -
{message.role === "user" && ( -
- +
+
)}
))} + {generateMutation.isPending && ( +
+
+ +
+ L'IA rédige vos propositions… +
+ )}
-
-
+
+