create-crm-tmp 1.1.2 → 2.0.0

package/template/src/app/api/workflows/route.ts

@@ -1,6 +1,7 @@
 import { NextRequest, NextResponse } from 'next/server';
 import { auth } from '@/lib/auth';
 import { prisma } from '@/lib/prisma';
+import { checkPermission } from '@/lib/check-permission';
 
 // GET /api/workflows - Récupérer tous les workflows de l'utilisateur
 export async function GET(request: NextRequest) {
@@ -13,6 +14,11 @@ export async function GET(request: NextRequest) {
       return NextResponse.json({ error: 'Non authentifié' }, { status: 401 });
     }
 
+    const canView = await checkPermission('workflows.view');
+    if (!canView) {
+      return NextResponse.json({ error: 'Accès refusé' }, { status: 403 });
+    }
+
     const workflows = await prisma.workflow.findMany({
       where: {
         userId: session.user.id,
@@ -37,7 +43,15 @@ export async function GET(request: NextRequest) {
     return NextResponse.json(workflows);
   } catch (error: any) {
     console.error('Erreur lors de la récupération des workflows:', error);
-    return NextResponse.json({ error: error.message || 'Erreur serveur' }, { status: 500 });
+    return NextResponse.json(
+      {
+        error:
+          process.env.NODE_ENV === 'development'
+            ? error.message || 'Erreur serveur'
+            : 'Erreur serveur',
+      },
+      { status: 500 },
+    );
   }
 }
 
@@ -52,6 +66,11 @@ export async function POST(request: NextRequest) {
       return NextResponse.json({ error: 'Non authentifié' }, { status: 401 });
     }
 
+    const canCreate = await checkPermission('workflows.create');
+    if (!canCreate) {
+      return NextResponse.json({ error: 'Accès refusé' }, { status: 403 });
+    }
+
     const body = await request.json();
     const {
       name,
@@ -62,10 +81,13 @@ export async function POST(request: NextRequest) {
       triggerToStatusId,
       triggerTimeDays,
       triggerTimeHours,
+      triggerTimeReference,
+      triggerTaskType,
+      triggerTransactionFromStatus,
+      triggerTransactionToStatus,
       actions = [],
     } = body;
 
-    // Validation
     if (!name || !triggerType) {
       return NextResponse.json(
         { error: 'Le nom et le type de déclencheur sont requis' },
@@ -73,7 +95,6 @@ export async function POST(request: NextRequest) {
       );
     }
 
-    // Créer le workflow
     const workflow = await prisma.workflow.create({
       data: {
         name,
@@ -85,6 +106,10 @@ export async function POST(request: NextRequest) {
         triggerToStatusId: triggerToStatusId || null,
         triggerTimeDays: triggerTimeDays || null,
         triggerTimeHours: triggerTimeHours || null,
+        triggerTimeReference: triggerTimeReference || null,
+        triggerTaskType: triggerTaskType || null,
+        triggerTransactionFromStatus: triggerTransactionFromStatus || null,
+        triggerTransactionToStatus: triggerTransactionToStatus || null,
         actions: {
           create: actions.map((action: any, index: number) => ({
             actionType: action.actionType,
@@ -96,8 +121,17 @@ export async function POST(request: NextRequest) {
             newStatusId: action.newStatusId || null,
             taskTitle: action.taskTitle || null,
             taskDescription: action.taskDescription || null,
+            taskType: action.taskType || null,
+            taskPriority: action.taskPriority || null,
+            taskAssignedUserId: action.taskAssignedUserId || null,
+            assignCommercialId: action.assignCommercialId || null,
+            assignTeleproId: action.assignTeleproId || null,
+            noteContent: action.noteContent || null,
+            notifyUserId: action.notifyUserId || null,
             conditionOperator: action.conditionOperator || null,
             conditionStatusId: action.conditionStatusId || null,
+            conditionOrigin: action.conditionOrigin || null,
+            conditionHasCompany: action.conditionHasCompany ?? null,
           })),
         },
       },
@@ -118,6 +152,14 @@ export async function POST(request: NextRequest) {
     return NextResponse.json(workflow, { status: 201 });
   } catch (error: any) {
     console.error('Erreur lors de la création du workflow:', error);
-    return NextResponse.json({ error: error.message || 'Erreur serveur' }, { status: 500 });
+    return NextResponse.json(
+      {
+        error:
+          process.env.NODE_ENV === 'development'
+            ? error.message || 'Erreur serveur'
+            : 'Erreur serveur',
+      },
+      { status: 500 },
+    );
   }
 }

package/template/src/app/globals.css

@@ -1,22 +1,61 @@
 @import 'tailwindcss';
-@import 'react-grid-layout/css/styles.css';
 
-:root {
-  --background: #ffffff;
-  --foreground: #171717;
-}
+@custom-variant dark (&:is(.dark *));
 
 @theme inline {
   --color-background: var(--background);
   --color-foreground: var(--foreground);
-  --font-sans: var(--font-geist-sans);
-  --font-mono: var(--font-geist-mono);
-}
-
-body {
-  background: var(--background);
-  color: var(--foreground);
-  font-family: Arial, Helvetica, sans-serif;
+  --color-surface-page: var(--surface-page);
+  --color-brand: var(--brand);
+  --color-brand-foreground: var(--brand-foreground);
+  --font-sans: var(--font-body);
+  --font-mono: var(--font-mono);
+  --color-sidebar-ring: var(--sidebar-ring);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar: var(--sidebar);
+  --color-chart-5: var(--chart-5);
+  --color-chart-4: var(--chart-4);
+  --color-chart-3: var(--chart-3);
+  --color-chart-2: var(--chart-2);
+  --color-chart-1: var(--chart-1);
+  --color-ring: var(--ring);
+  --color-input: var(--input);
+  --color-border: var(--border);
+  --color-destructive: var(--destructive);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-accent: var(--accent);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-muted: var(--muted);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-secondary: var(--secondary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-primary: var(--primary);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-popover: var(--popover);
+  --color-card-foreground: var(--card-foreground);
+  --color-card: var(--card);
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+  --radius-2xl: calc(var(--radius) + 8px);
+  --radius-3xl: calc(var(--radius) + 12px);
+  --radius-4xl: calc(var(--radius) + 16px);
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-family: var(--font-display), serif;
+  letter-spacing: -0.02em;
 }
 
 /* LexKit Editor - Clean Framework-Agnostic Styles */
@@ -968,6 +1007,36 @@ body {
   }
 }
 
+@keyframes toast-slide-in {
+  from {
+    opacity: 0;
+    transform: translateX(100%);
+  }
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+
+@keyframes toast-slide-out {
+  from {
+    opacity: 1;
+    transform: translateX(0);
+  }
+  to {
+    opacity: 0;
+    transform: translateX(100%);
+  }
+}
+
+.animate-toast-in {
+  animation: toast-slide-in 0.35s cubic-bezier(0.21, 1.02, 0.73, 1) forwards;
+}
+
+.animate-toast-out {
+  animation: toast-slide-out 0.3s cubic-bezier(0.06, 0.71, 0.55, 1) forwards;
+}
+
 @keyframes subtle-area-glow {
   0%,
   100% {
@@ -1416,97 +1485,137 @@ table td[data-lexical-table-cell-selection] {
   }
 }
 
-/* ===== DASHBOARD THEME UTILITIES ===== */
-/* Classes utilitaires qui utilisent les CSS variables --dash-50 à --dash-700 */
-
-.dash-link { color: var(--dash-600); transition: color 150ms; }
-.dash-link:hover { color: var(--dash-700); }
-
-.dash-btn { background-color: var(--dash-500); color: white; transition: background-color 150ms; }
-.dash-btn:hover { background-color: var(--dash-600); }
-
-.dash-accent-bar { background-color: var(--dash-500); }
-
-.dash-icon-box { background-color: var(--dash-100); transition: background-color 150ms; }
-.group:hover .dash-icon-box-gh { background-color: var(--dash-200); }
-
-.dash-icon-color { color: var(--dash-600); }
-
-.dash-avatar { background-color: var(--dash-100); color: var(--dash-700); }
-
-.dash-pill-active { background-color: var(--dash-500); color: white; }
-
-.dash-hover-bg:hover { background-color: color-mix(in srgb, var(--dash-50) 30%, transparent); }
-.dash-hover-border:hover { border-color: var(--dash-200); }
-.dash-hover-border-left:hover { border-left-color: var(--dash-400); background-color: color-mix(in srgb, var(--dash-50) 30%, transparent); }
-.dash-hover-border-light:hover { border-color: var(--dash-100); }
-.dash-hover-text:hover { color: var(--dash-600); }
-.group:hover .dash-hover-text-gh { color: var(--dash-500); }
-
-.dash-legend-bg { background-color: color-mix(in srgb, var(--dash-50) 80%, transparent); }
-.dash-legend-dot { background-color: var(--dash-500); }
-
-/* ===== REACT GRID LAYOUT OVERRIDES ===== */
-
-.react-grid-layout {
-  position: relative;
-  transition: height 200ms ease;
-}
-
-.react-grid-item {
-  transition: all 200ms ease;
-  transition-property: left, top, width, height;
-}
-
-.react-grid-item.cssTransforms {
-  transition-property: transform, width, height;
-}
-
-.react-grid-item.resizing {
-  z-index: 1;
-  will-change: width, height;
-  opacity: 0.9;
-}
-
-.react-grid-item.react-draggable-dragging {
-  transition: none;
-  z-index: 3;
-  will-change: transform;
-  opacity: 0.9;
-  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);
-  border-radius: 16px;
+:root {
+  --radius: 0.625rem;
+  --duration-fast: 150ms;
+  --duration-normal: 250ms;
+  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
+  --shadow-card: 0 10px 30px -18px rgb(15 23 42 / 0.22);
+  --shadow-dropdown: 0 18px 45px -24px rgb(15 23 42 / 0.3);
+  --background: oklch(1 0 0);
+  --surface-page: oklch(0.98 0.004 67);
+  --foreground: oklch(0.145 0 0);
+  --card: oklch(1 0 0);
+  --card-foreground: oklch(0.145 0 0);
+  --popover: oklch(1 0 0);
+  --popover-foreground: oklch(0.145 0 0);
+  --primary: oklch(0.62 0.17 259);
+  --primary-foreground: oklch(0.98 0.01 255);
+  --brand: oklch(0.62 0.17 259);
+  --brand-foreground: oklch(0.98 0.01 255);
+  --secondary: oklch(0.97 0 0);
+  --secondary-foreground: oklch(0.205 0 0);
+  --muted: oklch(0.97 0 0);
+  --muted-foreground: oklch(0.556 0 0);
+  --accent: oklch(0.97 0 0);
+  --accent-foreground: oklch(0.205 0 0);
+  --destructive: oklch(0.577 0.245 27.325);
+  --border: oklch(0.922 0 0);
+  --input: oklch(0.922 0 0);
+  --ring: oklch(0.708 0 0);
+  --chart-1: oklch(0.646 0.222 41.116);
+  --chart-2: oklch(0.6 0.118 184.704);
+  --chart-3: oklch(0.398 0.07 227.392);
+  --chart-4: oklch(0.828 0.189 84.429);
+  --chart-5: oklch(0.769 0.188 70.08);
+  --sidebar: oklch(0.985 0 0);
+  --sidebar-foreground: oklch(0.145 0 0);
+  --sidebar-primary: oklch(0.62 0.17 259);
+  --sidebar-primary-foreground: oklch(0.98 0.01 255);
+  --sidebar-accent: oklch(0.97 0.02 255);
+  --sidebar-accent-foreground: oklch(0.38 0.08 259);
+  --sidebar-border: oklch(0.922 0 0);
+  --sidebar-ring: oklch(0.708 0 0);
+}
+
+.dark {
+  --shadow-card: 0 16px 34px -22px rgb(2 6 23 / 0.9);
+  --shadow-dropdown: 0 22px 40px -20px rgb(2 6 23 / 0.95);
+  --background: oklch(0.145 0 0);
+  --surface-page: oklch(0.19 0 0);
+  --foreground: oklch(0.985 0 0);
+  --card: oklch(0.205 0 0);
+  --card-foreground: oklch(0.985 0 0);
+  --popover: oklch(0.205 0 0);
+  --popover-foreground: oklch(0.985 0 0);
+  --primary: oklch(0.72 0.15 259);
+  --primary-foreground: oklch(0.16 0.04 259);
+  --brand: oklch(0.72 0.15 259);
+  --brand-foreground: oklch(0.16 0.04 259);
+  --secondary: oklch(0.269 0 0);
+  --secondary-foreground: oklch(0.985 0 0);
+  --muted: oklch(0.269 0 0);
+  --muted-foreground: oklch(0.708 0 0);
+  --accent: oklch(0.269 0 0);
+  --accent-foreground: oklch(0.985 0 0);
+  --destructive: oklch(0.704 0.191 22.216);
+  --border: oklch(1 0 0 / 10%);
+  --input: oklch(1 0 0 / 15%);
+  --ring: oklch(0.556 0 0);
+  --chart-1: oklch(0.488 0.243 264.376);
+  --chart-2: oklch(0.696 0.17 162.48);
+  --chart-3: oklch(0.769 0.188 70.08);
+  --chart-4: oklch(0.627 0.265 303.9);
+  --chart-5: oklch(0.645 0.246 16.439);
+  --sidebar: oklch(0.205 0 0);
+  --sidebar-foreground: oklch(0.985 0 0);
+  --sidebar-primary: oklch(0.72 0.15 259);
+  --sidebar-primary-foreground: oklch(0.16 0.04 259);
+  --sidebar-accent: oklch(0.269 0 0);
+  --sidebar-accent-foreground: oklch(0.985 0 0);
+  --sidebar-border: oklch(1 0 0 / 10%);
+  --sidebar-ring: oklch(0.556 0 0);
+}
+
+@layer base {
+  * {
+    @apply border-border outline-ring/50;
+  }
+  body {
+    @apply bg-background text-foreground;
+  }
 }
 
-.react-grid-item > .react-resizable-handle {
-  position: absolute;
-  width: 20px;
-  height: 20px;
-  bottom: 0;
-  right: 0;
-  cursor: se-resize;
-  opacity: 0;
-  transition: opacity 150ms ease;
-}
+@layer utilities {
+  /* Global guardrail for native buttons: pointer + fallback hover feedback */
+  button:not(:disabled) {
+    cursor: pointer;
+  }
 
-.react-grid-item:hover > .react-resizable-handle {
-  opacity: 1;
-}
+  button:not(:disabled):not([class*='hover:']):hover {
+    opacity: 0.92;
+  }
 
-.react-grid-item > .react-resizable-handle::after {
-  content: '';
-  position: absolute;
-  right: 4px;
-  bottom: 4px;
-  width: 8px;
-  height: 8px;
-  border-right: 2px solid color-mix(in srgb, var(--dash-500, #f97316) 50%, transparent);
-  border-bottom: 2px solid color-mix(in srgb, var(--dash-500, #f97316) 50%, transparent);
-  border-radius: 0 0 2px 0;
-}
+  /* Uniform keyboard focus for key dashboard screens */
+  .kb-tab-scope
+    :where(
+      button,
+      a[href],
+      input,
+      select,
+      textarea,
+      [role='button'],
+      [role='tab'],
+      [role='menuitem'],
+      [tabindex]:not([tabindex='-1'])
+    ):focus-visible:not([class*='focus-visible:']) {
+    outline: 2px solid color-mix(in oklch, var(--primary) 80%, white 20%);
+    outline-offset: 2px;
+    box-shadow: 0 0 0 4px color-mix(in oklch, var(--primary) 24%, transparent);
+  }
 
-.react-grid-placeholder {
-  background: color-mix(in srgb, var(--dash-500, #f97316) 10%, transparent) !important;
-  border: 2px dashed color-mix(in srgb, var(--dash-500, #f97316) 30%, transparent) !important;
-  border-radius: 16px !important;
-  opacity: 1 !important;
+  .kb-tab-scope
+    :where(
+      button,
+      a[href],
+      input,
+      select,
+      textarea,
+      [role='button'],
+      [role='tab'],
+      [role='menuitem'],
+      [tabindex]:not([tabindex='-1'])
+    ) {
+    scroll-margin-top: 6rem;
+  }
 }

package/template/src/app/layout.tsx

@@ -1,21 +1,28 @@
 import type { Metadata } from 'next';
-import { Geist, Geist_Mono } from 'next/font/google';
+import { DM_Sans, Playfair_Display, JetBrains_Mono } from 'next/font/google';
 import './globals.css';
 import { cn } from '@/lib/utils';
+import { AppToastProvider } from '@/contexts/app-toast-context';
 
-const geistSans = Geist({
-  variable: '--font-geist-sans',
+const bodyFont = DM_Sans({
+  variable: '--font-body',
   subsets: ['latin'],
 });
 
-const geistMono = Geist_Mono({
-  variable: '--font-geist-mono',
+const displayFont = Playfair_Display({
+  variable: '--font-display',
+  subsets: ['latin'],
+});
+
+const monoFont = JetBrains_Mono({
+  variable: '--font-mono',
   subsets: ['latin'],
 });
 
 export const metadata: Metadata = {
-  title: 'Create Next App',
-  description: 'Generated by create next app',
+  title: 'Gold Blessing',
+  description:
+    'Le CRM Gold Blessing : gérez vos campagnes, paiements et relations clients de manière efficace et intuitive.',
 };
 
 export default function RootLayout({
@@ -25,7 +32,11 @@ export default function RootLayout({
 }>) {
   return (
     <html lang="fr">
-      <body className={cn(geistSans.variable, geistMono.variable, 'antialiased')}>{children}</body>
+      <body
+        className={cn(bodyFont.variable, displayFont.variable, monoFont.variable, 'antialiased')}
+      >
+        <AppToastProvider>{children}</AppToastProvider>
+      </body>
     </html>
   );
 }

package/template/src/app/page.tsx

@@ -2,25 +2,55 @@
 
 import { useSession } from '@/lib/auth-client';
 import { useRouter } from 'next/navigation';
-import { useEffect } from 'react';
+import { useEffect, useState } from 'react';
 
 export default function HomePage() {
   const { data: session, isPending } = useSession();
   const router = useRouter();
+  const [permissionsLoaded, setPermissionsLoaded] = useState(false);
+  const [permissions, setPermissions] = useState<string[]>([]);
 
   useEffect(() => {
     if (isPending) return;
 
-    if (session) {
-      // Utilisateur connecté -> rediriger vers le dashboard
-      router.push('/dashboard');
-    } else {
-      // Utilisateur non connecté -> rediriger vers la page de connexion
+    if (!session) {
       router.push('/signin');
+      return;
     }
+
+    const fetchPermissions = async () => {
+      try {
+        const response = await fetch('/api/users/me');
+        if (response.ok) {
+          const userData = await response.json();
+          setPermissions((userData.customRole?.permissions as string[]) || []);
+        }
+      } catch {
+        // Fallback to default redirect
+      } finally {
+        setPermissionsLoaded(true);
+      }
+    };
+
+    fetchPermissions();
   }, [session, isPending, router]);
 
-  // Afficher un loader pendant la redirection
+  useEffect(() => {
+    if (!permissionsLoaded) return;
+
+    const has = (p: string) => permissions.includes(p);
+
+    if (has('dashboard.view')) {
+      router.push('/dashboard');
+    } else if (has('contacts.view_own') || has('contacts.view_all')) {
+      router.push('/contacts');
+    } else if (has('tasks.view_all') || has('tasks.view_own')) {
+      router.push('/agenda');
+    } else {
+      router.push('/contacts');
+    }
+  }, [permissionsLoaded, permissions, router]);
+
   return (
     <div className="flex min-h-screen items-center justify-center bg-gray-50">
       <div className="flex flex-col items-center gap-4">