create-crm-tmp 1.1.3 → 2.1.0

package/template/src/app/(dashboard)/users/roles/page.tsx

@@ -4,6 +4,11 @@ import { useState, useEffect } from 'react';
 import Link from 'next/link';
 import { ArrowLeft, Shield, Users as UsersIcon, Key, Plus, Edit, Trash2, X } from 'lucide-react';
 import { PERMISSIONS, PERMISSIONS_BY_CATEGORY } from '@/lib/permissions';
+import { useMobileMenuContext } from '@/contexts/mobile-menu-context';
+import { useConfirm } from '@/hooks/use-confirm';
+import { ProtectedPage } from '@/components/protected-page';
+import { useAppToast } from '@/contexts/app-toast-context';
+import { devToast } from '@/lib/utils';
 
 interface Role {
   id: string;
@@ -24,6 +29,7 @@ interface RoleModalProps {
 }
 
 function RoleModal({ isOpen, onClose, onSave, role }: RoleModalProps) {
+  const toast = useAppToast();
   const [formData, setFormData] = useState({
     name: role?.name || '',
     description: role?.description || '',
@@ -50,6 +56,12 @@ function RoleModal({ isOpen, onClose, onSave, role }: RoleModalProps) {
     setError('');
   }, [role, isOpen]);
 
+  useEffect(() => {
+    if (!error) return;
+    toast.error(error);
+    setError('');
+  }, [error, toast]);
+
   const togglePermission = (permissionCode: string) => {
     setFormData((prev) => ({
       ...prev,
@@ -83,7 +95,7 @@ function RoleModal({ isOpen, onClose, onSave, role }: RoleModalProps) {
       onSave();
       onClose();
     } catch (err: any) {
-      setError(err.message);
+      setError(devToast('Erreur lors de la sauvegarde du profil', err));
     } finally {
       setIsSubmitting(false);
     }
@@ -112,9 +124,6 @@ function RoleModal({ isOpen, onClose, onSave, role }: RoleModalProps) {
 
           {/* Content */}
           <div className="max-h-[70vh] overflow-y-auto p-6">
-            {error && (
-              <div className="mb-4 rounded-lg bg-red-50 p-4 text-sm text-red-600">{error}</div>
-            )}
             <div className="space-y-6">
               {/* Nom et description */}
               <div className="grid gap-4 sm:grid-cols-2">
@@ -127,7 +136,7 @@ function RoleModal({ isOpen, onClose, onSave, role }: RoleModalProps) {
                     id="name"
                     value={formData.name}
                     onChange={(e) => setFormData((prev) => ({ ...prev, name: e.target.value }))}
-                    className="mt-1 w-full rounded-lg border border-gray-300 px-3 py-2 text-sm focus:border-indigo-500 focus:ring-1 focus:ring-indigo-500 focus:outline-none"
+                    className="mt-1 w-full rounded-lg border border-gray-300 px-3 py-2 text-sm focus:ring-2 focus:ring-gray-400/30 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/50"
                     required
                   />
                 </div>
@@ -145,7 +154,7 @@ function RoleModal({ isOpen, onClose, onSave, role }: RoleModalProps) {
                       }))
                     }
                     rows={2}
-                    className="mt-1 w-full rounded-lg border border-gray-300 px-3 py-2 text-sm focus:border-indigo-500 focus:ring-1 focus:ring-indigo-500 focus:outline-none"
+                    className="mt-1 w-full rounded-lg border border-gray-300 px-3 py-2 text-sm focus:ring-2 focus:ring-gray-400/30 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/50"
                   />
                 </div>
               </div>
@@ -170,7 +179,7 @@ function RoleModal({ isOpen, onClose, onSave, role }: RoleModalProps) {
                               type="checkbox"
                               checked={formData.permissions.includes(permission.code)}
                               onChange={() => togglePermission(permission.code)}
-                              className="mt-1 h-4 w-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+                              className="mt-1 h-4 w-4 rounded border-gray-300 text-blue-600 focus:ring-gray-400/30"
                             />
                             <div className="flex-1">
                               <div className="font-medium text-gray-900">{permission.name}</div>
@@ -211,6 +220,9 @@ function RoleModal({ isOpen, onClose, onSave, role }: RoleModalProps) {
 }
 
 export default function RolesPage() {
+  const { toggle: toggleMobileMenu, isOpen: isMobileMenuOpen } = useMobileMenuContext();
+  const { confirm, ConfirmDialog } = useConfirm();
+  const toast = useAppToast();
   const [showModal, setShowModal] = useState(false);
   const [selectedRole, setSelectedRole] = useState<Role | null>(null);
   const [roles, setRoles] = useState<Role[]>([]);
@@ -227,7 +239,7 @@ export default function RolesPage() {
       const data = await response.json();
       setRoles(data);
     } catch (err: any) {
-      setError(err.message);
+      setError(devToast('Erreur lors du chargement des profils', err));
     } finally {
       setLoading(false);
     }
@@ -237,6 +249,12 @@ export default function RolesPage() {
     fetchRoles();
   }, []);
 
+  useEffect(() => {
+    if (!error) return;
+    toast.error(error);
+    setError('');
+  }, [error, toast]);
+
   const handleEditRole = (roleId: string) => {
     const role = roles.find((r) => r.id === roleId);
     if (role) {
@@ -249,11 +267,20 @@ export default function RolesPage() {
     const role = roles.find((r) => r.id === roleId);
     if (!role) return;
 
+    const confirmTitle = role.isSystem ? '⚠️ Supprimer un profil système' : 'Supprimer le profil';
     const confirmMessage = role.isSystem
-      ? `⚠️ Attention : "${role.name}" est un profil système.\n\nÊtes-vous sûr de vouloir le supprimer ?`
+      ? `Attention : "${role.name}" est un profil système. Êtes-vous sûr de vouloir le supprimer ?`
       : `Êtes-vous sûr de vouloir supprimer le profil "${role.name}" ?`;
 
-    if (!confirm(confirmMessage)) {
+    const confirmed = await confirm({
+      title: confirmTitle,
+      description: confirmMessage,
+      confirmText: 'Supprimer',
+      cancelText: 'Annuler',
+      variant: 'destructive',
+    });
+
+    if (!confirmed) {
       return;
     }
 
@@ -268,9 +295,10 @@ export default function RolesPage() {
         throw new Error(data.error || 'Erreur lors de la suppression');
       }
 
+      toast.success('Profil supprimé');
       await fetchRoles();
     } catch (err: any) {
-      setError(err.message);
+      setError(devToast('Erreur lors de la suppression du profil', err));
       setTimeout(() => setError(''), 5000);
     }
   };
@@ -285,148 +313,149 @@ export default function RolesPage() {
   };
 
   return (
-    <div className="h-full">
-      <div className="border-b border-gray-200 bg-white">
-        <div className="p-4 sm:p-6">
-          <div className="mb-4">
-            <Link
-              href="/users"
-              className="inline-flex items-center gap-2 text-sm text-gray-600 hover:text-gray-900"
-            >
-              <ArrowLeft className="h-4 w-4" />
-              Retour
-            </Link>
-          </div>
-          <div className="flex items-center justify-between">
-            <div>
-              <h1 className="text-2xl font-bold text-gray-900">Gestion des profils</h1>
-              <p className="mt-1 text-sm text-gray-500">
-                Créer et configurer les profils avec leurs permissions
-              </p>
+    <ProtectedPage requiredPermission="users.manage_roles">
+      <div className="h-full">
+        <div className="border-b border-gray-200 bg-white">
+          <div className="p-4 sm:p-6">
+            <div className="mb-4">
+              <Link
+                href="/users"
+                className="inline-flex items-center gap-2 text-sm text-gray-600 hover:text-gray-900"
+              >
+                <ArrowLeft className="h-4 w-4" />
+                Retour
+              </Link>
+            </div>
+            <div className="flex items-center justify-between">
+              <div>
+                <h1 className="text-2xl font-bold text-gray-900">Gestion des profils</h1>
+                <p className="mt-1 text-sm text-gray-500">
+                  Créer et configurer les profils avec leurs permissions
+                </p>
+              </div>
+              <button
+                onClick={() => {
+                  setSelectedRole(null);
+                  setShowModal(true);
+                }}
+                className="flex cursor-pointer items-center gap-2 rounded-lg bg-green-600 px-4 py-2 text-sm font-medium text-white hover:bg-green-700"
+              >
+                <Plus className="h-4 w-4" />
+                Nouveau profil
+              </button>
             </div>
-            <button
-              onClick={() => {
-                setSelectedRole(null);
-                setShowModal(true);
-              }}
-              className="flex cursor-pointer items-center gap-2 rounded-lg bg-green-600 px-4 py-2 text-sm font-medium text-white hover:bg-green-700"
-            >
-              <Plus className="h-4 w-4" />
-              Nouveau profil
-            </button>
           </div>
         </div>
-      </div>
-
-      <div className="p-4 sm:p-6">
-        {error && <div className="mb-4 rounded-lg bg-red-50 p-4 text-sm text-red-600">{error}</div>}
 
-        {loading ? (
-          <div className="grid gap-6 lg:grid-cols-2">
-            {[1, 2, 3, 4].map((i) => (
-              <div key={i} className="h-64 animate-pulse rounded-lg bg-gray-200" />
-            ))}
-          </div>
-        ) : (
-          <div className="grid gap-6 lg:grid-cols-2">
-            {roles
-              .sort((a, b) => b.permissions.length - a.permissions.length) // Trier par nombre de permissions (DESC)
-              .map((role) => {
-                const visiblePermissions = role.permissions.slice(0, 4);
-                const remainingCount = role.permissions.length - 4;
-
-                return (
-                  <div
-                    key={role.id}
-                    className="rounded-lg border border-gray-200 bg-white p-6 shadow-sm"
-                  >
-                    <div className="flex items-start justify-between">
-                      <div className="flex items-start gap-3">
-                        <div className="rounded-lg bg-green-100 p-2">
-                          <Shield className="h-5 w-5 text-green-600" />
+        <div className="p-4 sm:p-6">
+          {loading ? (
+            <div className="grid gap-6 lg:grid-cols-2">
+              {[1, 2, 3, 4].map((i) => (
+                <div key={i} className="h-64 animate-pulse rounded-lg bg-gray-200" />
+              ))}
+            </div>
+          ) : (
+            <div className="grid gap-6 lg:grid-cols-2">
+              {roles
+                .sort((a, b) => b.permissions.length - a.permissions.length) // Trier par nombre de permissions (DESC)
+                .map((role) => {
+                  const visiblePermissions = role.permissions.slice(0, 4);
+                  const remainingCount = role.permissions.length - 4;
+
+                  return (
+                    <div
+                      key={role.id}
+                      className="rounded-lg border border-gray-200 bg-white p-6 shadow-sm"
+                    >
+                      <div className="flex items-start justify-between">
+                        <div className="flex items-start gap-3">
+                          <div className="rounded-lg bg-green-100 p-2">
+                            <Shield className="h-5 w-5 text-green-600" />
+                          </div>
+                          <div>
+                            <h3 className="font-semibold text-gray-900">
+                              {role.name}
+                              {role.isSystem && (
+                                <span className="ml-2 inline-block rounded bg-blue-100 px-2 py-0.5 text-xs text-blue-800">
+                                  Système
+                                </span>
+                              )}
+                            </h3>
+                            <p className="mt-1 text-sm text-gray-600">{role.description}</p>
+                          </div>
                         </div>
-                        <div>
-                          <h3 className="font-semibold text-gray-900">
-                            {role.name}
-                            {role.isSystem && (
-                              <span className="ml-2 inline-block rounded bg-indigo-100 px-2 py-0.5 text-xs text-indigo-600">
-                                Système
-                              </span>
-                            )}
-                          </h3>
-                          <p className="mt-1 text-sm text-gray-600">{role.description}</p>
+                        <div className="flex items-center gap-2">
+                          <button
+                            onClick={() => handleEditRole(role.id)}
+                            className="cursor-pointer rounded-lg p-2 text-orange-600 hover:bg-orange-50"
+                            title="Modifier"
+                          >
+                            <Edit className="h-4 w-4" />
+                          </button>
+                          <button
+                            onClick={() => handleDeleteRole(role.id)}
+                            className="cursor-pointer rounded-lg p-2 text-red-600 hover:bg-red-50"
+                            title="Supprimer"
+                          >
+                            <Trash2 className="h-4 w-4" />
+                          </button>
                         </div>
                       </div>
-                      <div className="flex items-center gap-2">
-                        <button
-                          onClick={() => handleEditRole(role.id)}
-                          className="cursor-pointer rounded-lg p-2 text-orange-600 hover:bg-orange-50"
-                          title="Modifier"
-                        >
-                          <Edit className="h-4 w-4" />
-                        </button>
-                        <button
-                          onClick={() => handleDeleteRole(role.id)}
-                          className="cursor-pointer rounded-lg p-2 text-red-600 hover:bg-red-50"
-                          title="Supprimer"
-                        >
-                          <Trash2 className="h-4 w-4" />
-                        </button>
-                      </div>
-                    </div>
 
-                    <div className="mt-4 flex items-center gap-4 text-sm text-gray-600">
-                      <div className="flex items-center gap-1">
-                        <UsersIcon className="h-4 w-4" />
-                        <span>
-                          {role.usersCount} utilisateur{role.usersCount > 1 ? 's' : ''}
-                        </span>
-                      </div>
-                      <div className="flex items-center gap-1">
-                        <Key className="h-4 w-4" />
-                        <span>
-                          {role.permissions.length} permission
-                          {role.permissions.length > 1 ? 's' : ''}
-                        </span>
+                      <div className="mt-4 flex items-center gap-4 text-sm text-gray-600">
+                        <div className="flex items-center gap-1">
+                          <UsersIcon className="h-4 w-4" />
+                          <span>
+                            {role.usersCount} utilisateur{role.usersCount > 1 ? 's' : ''}
+                          </span>
+                        </div>
+                        <div className="flex items-center gap-1">
+                          <Key className="h-4 w-4" />
+                          <span>
+                            {role.permissions.length} permission
+                            {role.permissions.length > 1 ? 's' : ''}
+                          </span>
+                        </div>
                       </div>
-                    </div>
 
-                    <div className="mt-4">
-                      <h4 className="mb-2 text-xs font-medium tracking-wide text-gray-500 uppercase">
-                        Permissions
-                      </h4>
-                      <div className="flex flex-wrap gap-2">
-                        {visiblePermissions.map((permCode) => {
-                          const perm = PERMISSIONS.find((p) => p.code === permCode);
-                          return (
-                            <span
-                              key={permCode}
-                              className="rounded-full bg-green-100 px-3 py-1 text-xs font-medium text-green-700"
-                            >
-                              {perm?.name || permCode}
+                      <div className="mt-4">
+                        <h4 className="mb-2 text-xs font-medium tracking-wide text-gray-500 uppercase">
+                          Permissions
+                        </h4>
+                        <div className="flex flex-wrap gap-2">
+                          {visiblePermissions.map((permCode) => {
+                            const perm = PERMISSIONS.find((p) => p.code === permCode);
+                            return (
+                              <span
+                                key={permCode}
+                                className="rounded-full bg-green-100 px-3 py-1 text-xs font-medium text-green-700"
+                              >
+                                {perm?.name || permCode}
+                              </span>
+                            );
+                          })}
+                          {remainingCount > 0 && (
+                            <span className="rounded-full bg-gray-100 px-3 py-1 text-xs font-medium text-gray-700">
+                              +{remainingCount} autres
                             </span>
-                          );
-                        })}
-                        {remainingCount > 0 && (
-                          <span className="rounded-full bg-gray-100 px-3 py-1 text-xs font-medium text-gray-700">
-                            +{remainingCount} autres
-                          </span>
-                        )}
+                          )}
+                        </div>
                       </div>
                     </div>
-                  </div>
-                );
-              })}
-          </div>
-        )}
-      </div>
+                  );
+                })}
+            </div>
+          )}
+        </div>
 
-      <RoleModal
-        isOpen={showModal}
-        onClose={handleCloseModal}
-        onSave={handleSaveRole}
-        role={selectedRole || undefined}
-      />
-    </div>
+        <RoleModal
+          isOpen={showModal}
+          onClose={handleCloseModal}
+          onSave={handleSaveRole}
+          role={selectedRole || undefined}
+        />
+        <ConfirmDialog />
+      </div>
+    </ProtectedPage>
   );
 }

package/template/src/app/api/agenda/google-events/route.ts

@@ -0,0 +1,92 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { auth } from '@/lib/auth';
+import { prisma } from '@/lib/prisma';
+import { encrypt } from '@/lib/encryption';
+import {
+  getValidAccessToken,
+  getUserGoogleAccount,
+  listGoogleCalendarEvents,
+} from '@/lib/google-calendar';
+
+/**
+ * GET /api/agenda/google-events?startDate=&endDate= (ISO)
+ * Événements Google des calendriers cochés dans les préférences utilisateur.
+ */
+export async function GET(request: NextRequest) {
+  try {
+    const session = await auth.api.getSession({
+      headers: request.headers,
+    });
+
+    if (!session) {
+      return NextResponse.json({ error: 'Non authentifié' }, { status: 401 });
+    }
+
+    const { searchParams } = new URL(request.url);
+    const startRaw = searchParams.get('startDate');
+    const endRaw = searchParams.get('endDate');
+    if (!startRaw || !endRaw) {
+      return NextResponse.json(
+        { error: 'Paramètres startDate et endDate (ISO) requis' },
+        { status: 400 },
+      );
+    }
+
+    const timeMin = new Date(startRaw);
+    const timeMax = new Date(endRaw);
+    if (Number.isNaN(timeMin.getTime()) || Number.isNaN(timeMax.getTime())) {
+      return NextResponse.json({ error: 'Dates invalides' }, { status: 400 });
+    }
+
+    let googleAccount;
+    try {
+      googleAccount = await getUserGoogleAccount(session.user.id);
+    } catch {
+      return NextResponse.json({ events: [] });
+    }
+
+    const visible = normalizeAgendaIds(googleAccount.agendaVisibleGoogleCalendarIds);
+    if (visible.length === 0) {
+      return NextResponse.json({ events: [] });
+    }
+
+    const accessToken = await getValidAccessToken(
+      googleAccount.accessToken,
+      googleAccount.refreshToken,
+      googleAccount.tokenExpiresAt,
+    );
+
+    if (accessToken !== googleAccount.accessToken) {
+      const tokenExpiresAt = new Date();
+      tokenExpiresAt.setSeconds(tokenExpiresAt.getSeconds() + 3600);
+      await prisma.userGoogleAccount.update({
+        where: { userId: session.user.id },
+        data: {
+          accessToken: encrypt(accessToken),
+          tokenExpiresAt,
+        },
+      });
+    }
+
+    const results = await Promise.all(
+      visible.map((calendarId) =>
+        listGoogleCalendarEvents(accessToken, calendarId, timeMin, timeMax).catch((err) => {
+          console.error(`google-events ${calendarId}:`, err);
+          return [] as Awaited<ReturnType<typeof listGoogleCalendarEvents>>;
+        }),
+      ),
+    );
+
+    const events = results.flat();
+
+    return NextResponse.json({ events });
+  } catch (error: any) {
+    console.error('GET agenda google-events:', error);
+    return NextResponse.json({ error: error.message || 'Erreur serveur' }, { status: 500 });
+  }
+}
+
+function normalizeAgendaIds(raw: unknown): string[] {
+  if (!raw || !Array.isArray(raw)) return [];
+  return raw.filter((x): x is string => typeof x === 'string' && x.trim() !== '');
+}

package/template/src/app/api/audit-logs/route.ts

@@ -15,7 +15,7 @@ export async function GET(request: NextRequest) {
     }
 
     // On réutilise la permission de vue utilisateurs pour l’instant
-    const hasPermission = await checkPermission('users.view');
+    const hasPermission = await checkPermission('audit.view_all');
     if (!hasPermission) {
       return NextResponse.json({ error: 'Accès refusé' }, { status: 403 });
     }

package/template/src/app/api/auth/check-active/route.ts

@@ -23,9 +23,10 @@ export async function GET(request: NextRequest) {
     return NextResponse.json({ active: isActive }, { status: 200 });
   } catch (error: any) {
     console.error('Erreur lors de la vérification du statut utilisateur:', error);
+    // 500 : ne pas renvoyer active: false pour éviter une déconnexion client sur erreur transitoire
     return NextResponse.json(
-      { active: false, error: error.message || 'Erreur serveur' },
-      { status: 200 },
+      { error: error.message || 'Erreur serveur' },
+      { status: 500 },
     );
   }
 }

package/template/src/app/api/auth/google/callback/route.ts

@@ -2,6 +2,7 @@ import { NextRequest, NextResponse } from 'next/server';
 import { auth } from '@/lib/auth';
 import { prisma } from '@/lib/prisma';
 import { exchangeGoogleCodeForTokens } from '@/lib/google-calendar';
+import { encrypt } from '@/lib/encryption';
 
 /**
  * GET /api/auth/google/callback
@@ -17,6 +18,8 @@ export async function GET(request: NextRequest) {
       return NextResponse.redirect(new URL('/signin', request.url));
     }
 
+    // Tous les utilisateurs peuvent maintenant connecter leur compte Google pour Calendar
+
     const { searchParams } = new URL(request.url);
     const code = searchParams.get('code');
     const error = searchParams.get('error');
@@ -63,19 +66,19 @@ export async function GET(request: NextRequest) {
       console.error("Erreur lors de la récupération de l'email Google:", err);
     }
 
-    // Sauvegarder ou mettre à jour les tokens
+    // Sauvegarder ou mettre à jour les tokens (chiffrés si ENCRYPTION_KEY est définie)
     await prisma.userGoogleAccount.upsert({
       where: { userId: session.user.id },
       create: {
         userId: session.user.id,
-        accessToken: tokens.access_token,
-        refreshToken: tokens.refresh_token || '',
+        accessToken: encrypt(tokens.access_token),
+        refreshToken: tokens.refresh_token ? encrypt(tokens.refresh_token) : '',
         tokenExpiresAt,
         email: googleEmail,
       },
       update: {
-        accessToken: tokens.access_token,
-        refreshToken: tokens.refresh_token || undefined,
+        accessToken: encrypt(tokens.access_token),
+        refreshToken: tokens.refresh_token ? encrypt(tokens.refresh_token) : undefined,
         tokenExpiresAt,
         email: googleEmail,
       },

package/template/src/app/api/auth/google/disconnect/route.ts

@@ -4,7 +4,7 @@ import { prisma } from '@/lib/prisma';
 
 /**
  * POST /api/auth/google/disconnect
- * Déconnecte le compte Google de l'utilisateur
+ * Déconnecte le compte Google de l'administrateur (seuls les admins peuvent déconnecter)
  */
 export async function POST(request: NextRequest) {
   try {
@@ -16,7 +16,7 @@ export async function POST(request: NextRequest) {
       return NextResponse.json({ error: 'Non authentifié' }, { status: 401 });
     }
 
-    // Supprimer le compte Google
+    // Tous les utilisateurs peuvent déconnecter leur compte Google
     await prisma.userGoogleAccount.deleteMany({
       where: { userId: session.user.id },
     });

package/template/src/app/api/auth/google/route.ts

@@ -15,8 +15,9 @@ export async function GET(request: NextRequest) {
 
   const scopes = [
     'https://www.googleapis.com/auth/calendar.events',
+    // Liste des calendriers (partagés, etc.) — les comptes déjà connectés doivent se reconnecter pour obtenir ce scope.
+    'https://www.googleapis.com/auth/calendar.calendarlist.readonly',
     'https://www.googleapis.com/auth/spreadsheets.readonly',
-    'https://www.googleapis.com/auth/drive.file', // Accès aux fichiers créés par l'application
   ];
 
   const params = new URLSearchParams({