create-crm-tmp 1.1.3 → 2.1.0

package/template/src/lib/dashboard-stats.ts

@@ -0,0 +1,282 @@
+import { prisma } from '@/lib/prisma';
+import { getCachedStatuses } from '@/lib/cache';
+
+export interface DashboardStats {
+  overview: {
+    totalContacts: number;
+    contactsThisMonth: number;
+    contactsGrowth: number;
+    monthsData: Array<{ month: string; count: number }>;
+  };
+  statusDistribution: Array<{ name: string; value: number }>;
+  tasks: {
+    total: number;
+    completed: number;
+    pending: number;
+    upcoming: Array<{
+      id: string;
+      title: string;
+      type: string;
+      scheduledAt: string;
+      contact: { id: string; name: string } | null;
+      priority: string;
+    }>;
+    byType: Array<{ type: string; count: number }>;
+  };
+  interactions: {
+    recent: Array<{
+      id: string;
+      type: string;
+      title: string | null;
+      content: string;
+      date: string;
+      contact: { id: string; name: string };
+    }>;
+    byType: Array<{ type: string; count: number }>;
+  };
+  activity: {
+    last7Days: Array<{ date: string; interactions: number; tasks: number }>;
+  };
+  topContacts: Array<{
+    id: string;
+    name: string;
+    phone: string;
+    email: string | null;
+    status: string;
+    interactionsCount: number;
+    assignedCommercial?: string;
+    assignedTelepro?: string;
+  }>;
+}
+
+export async function getDashboardStats(
+  userId: string,
+  permissions: string[],
+): Promise<DashboardStats> {
+  const canViewAllContacts = permissions.includes('contacts.view_all');
+  const canViewOwnContacts = permissions.includes('contacts.view_own');
+  const canViewUnassigned = permissions.includes('contacts.view_unassigned');
+
+  let contactFilter: any = {};
+  if (!canViewAllContacts && canViewOwnContacts) {
+    const conditions: any[] = [
+      { assignedCommercialId: userId },
+      { assignedTeleproId: userId },
+      { createdById: userId },
+    ];
+    if (canViewUnassigned) {
+      conditions.push({ AND: [{ assignedCommercialId: null }, { assignedTeleproId: null }] });
+    }
+    contactFilter = { OR: conditions };
+  } else if (!canViewAllContacts && !canViewOwnContacts) {
+    contactFilter = { id: '__none__' };
+  }
+
+  const now = new Date();
+  const startOfMonth = new Date(now.getFullYear(), now.getMonth(), 1);
+  const lastMonthStart = new Date(startOfMonth);
+  lastMonthStart.setMonth(lastMonthStart.getMonth() - 1);
+
+  const twelveMonthsAgo = new Date(now.getFullYear(), now.getMonth() - 11, 1);
+  const sevenDaysAgo = new Date(now);
+  sevenDaysAgo.setDate(sevenDaysAgo.getDate() - 6);
+  sevenDaysAgo.setHours(0, 0, 0, 0);
+
+  const [
+    totalContacts,
+    contactsThisMonth,
+    contactsLastMonth,
+    statusDistribution,
+    statuses,
+    upcomingTasks,
+    recentInteractions,
+    totalTasks,
+    completedTasks,
+    tasksThisMonthByType,
+    interactionsThisMonth,
+    contactsLast12Months,
+    interactionsLast7Days,
+    tasksLast7Days,
+    recentContacts,
+  ] = await Promise.all([
+    prisma.contact.count({ where: contactFilter }),
+    prisma.contact.count({
+      where: { ...contactFilter, createdAt: { gte: startOfMonth } },
+    }),
+    prisma.contact.count({
+      where: { ...contactFilter, createdAt: { gte: lastMonthStart, lt: startOfMonth } },
+    }),
+    prisma.contact.groupBy({ by: ['statusId'], where: contactFilter, _count: true }),
+    getCachedStatuses(),
+    prisma.task.findMany({
+      where: { assignedUserId: userId, completed: false, scheduledAt: { gte: now } },
+      select: {
+        id: true,
+        title: true,
+        type: true,
+        scheduledAt: true,
+        priority: true,
+        contact: { select: { id: true, firstName: true, lastName: true, phone: true } },
+      },
+      orderBy: { scheduledAt: 'asc' },
+      take: 6,
+    }),
+    prisma.interaction.findMany({
+      where: { userId },
+      select: {
+        id: true,
+        type: true,
+        content: true,
+        createdAt: true,
+        contact: { select: { id: true, firstName: true, lastName: true, phone: true } },
+        user: { select: { id: true, name: true } },
+      },
+      orderBy: { createdAt: 'desc' },
+      take: 10,
+    }),
+    prisma.task.count({ where: { assignedUserId: userId } }),
+    prisma.task.count({ where: { assignedUserId: userId, completed: true } }),
+    prisma.task.groupBy({
+      by: ['type'],
+      where: { assignedUserId: userId, createdAt: { gte: startOfMonth } },
+      _count: true,
+    }),
+    prisma.interaction.groupBy({
+      by: ['type'],
+      where: { userId, createdAt: { gte: startOfMonth } },
+      _count: true,
+    }),
+    prisma.contact.findMany({
+      where: { ...contactFilter, createdAt: { gte: twelveMonthsAgo } },
+      select: { createdAt: true },
+    }),
+    prisma.interaction.findMany({
+      where: { userId, createdAt: { gte: sevenDaysAgo } },
+      select: { createdAt: true },
+    }),
+    prisma.task.findMany({
+      where: { assignedUserId: userId, createdAt: { gte: sevenDaysAgo } },
+      select: { createdAt: true },
+    }),
+    prisma.contact.findMany({
+      where: contactFilter,
+      select: {
+        id: true,
+        firstName: true,
+        lastName: true,
+        phone: true,
+        email: true,
+        status: { select: { name: true } },
+        assignedCommercial: { select: { name: true } },
+        assignedTelepro: { select: { name: true } },
+        _count: { select: { interactions: true } },
+      },
+      orderBy: { createdAt: 'desc' },
+      take: 8,
+    }),
+  ]);
+
+  const contactsGrowth =
+    contactsLastMonth > 0 ? ((contactsThisMonth - contactsLastMonth) / contactsLastMonth) * 100 : 0;
+
+  const monthsData = [];
+  for (let i = 11; i >= 0; i--) {
+    const monthStart = new Date(now.getFullYear(), now.getMonth() - i, 1);
+    const monthEnd = new Date(monthStart.getFullYear(), monthStart.getMonth() + 1, 1);
+    const count = contactsLast12Months.filter(
+      (c) => c.createdAt >= monthStart && c.createdAt < monthEnd,
+    ).length;
+    monthsData.push({
+      month: monthStart.toLocaleString('fr-FR', { month: 'short' }),
+      count,
+    });
+  }
+
+  const statusData = statuses.map((status) => ({
+    name: status.name,
+    value: statusDistribution.find((s) => s.statusId === status.id)?._count || 0,
+  }));
+
+  const pendingTasks = totalTasks - completedTasks;
+  const tasksByType = tasksThisMonthByType.map((t) => ({ type: t.type, count: t._count }));
+  const interactionsByType = interactionsThisMonth.map((i) => ({ type: i.type, count: i._count }));
+
+  const last7Days = [];
+  for (let i = 6; i >= 0; i--) {
+    const dayStart = new Date(now);
+    dayStart.setDate(dayStart.getDate() - i);
+    dayStart.setHours(0, 0, 0, 0);
+    const dayEnd = new Date(dayStart);
+    dayEnd.setDate(dayEnd.getDate() + 1);
+
+    last7Days.push({
+      date: dayStart.toLocaleDateString('fr-FR', { day: 'numeric', month: 'short' }),
+      interactions: interactionsLast7Days.filter(
+        (x) => x.createdAt >= dayStart && x.createdAt < dayEnd,
+      ).length,
+      tasks: tasksLast7Days.filter((x) => x.createdAt >= dayStart && x.createdAt < dayEnd).length,
+    });
+  }
+
+  const formattedRecentInteractions = recentInteractions.map((i) => ({
+    id: i.id,
+    type: i.type,
+    title: null,
+    content: i.content,
+    date: i.createdAt.toISOString(),
+    contact: {
+      id: i.contact.id,
+      name: `${i.contact.firstName || ''} ${i.contact.lastName || ''}`.trim() || i.contact.phone,
+    },
+  }));
+
+  const topContacts = recentContacts.map((c) => ({
+    id: c.id,
+    name: `${c.firstName || ''} ${c.lastName || ''}`.trim() || c.phone,
+    phone: c.phone,
+    email: c.email,
+    status: c.status?.name || 'N/A',
+    interactionsCount: c._count.interactions,
+    assignedCommercial: c.assignedCommercial?.name,
+    assignedTelepro: c.assignedTelepro?.name,
+  }));
+
+  return {
+    overview: {
+      totalContacts,
+      contactsThisMonth,
+      contactsGrowth: Math.round(contactsGrowth * 10) / 10,
+      monthsData,
+    },
+    statusDistribution: statusData,
+    tasks: {
+      total: totalTasks,
+      completed: completedTasks,
+      pending: pendingTasks,
+      upcoming: upcomingTasks.map((task) => ({
+        id: task.id,
+        title: task.title || 'Sans titre',
+        type: task.type,
+        scheduledAt: task.scheduledAt?.toISOString() ?? new Date().toISOString(),
+        contact: task.contact
+          ? {
+              id: task.contact.id,
+              name:
+                `${task.contact.firstName || ''} ${task.contact.lastName || ''}`.trim() ||
+                task.contact.phone,
+            }
+          : null,
+        priority: task.priority || 'MEDIUM',
+      })),
+      byType: tasksByType,
+    },
+    interactions: {
+      recent: formattedRecentInteractions,
+      byType: interactionsByType,
+    },
+    activity: {
+      last7Days,
+    },
+    topContacts,
+  };
+}

package/template/src/lib/dashboard-themes.ts

@@ -1,8 +1,3 @@
-/**
- * Thèmes de couleur pour le tableau de bord
- * Chaque thème fournit des valeurs hex pour toutes les nuances nécessaires
- */
-
 export interface DashboardTheme {
   key: string;
   label: string;

package/template/src/lib/date-utils.ts

@@ -0,0 +1,176 @@
+/**
+ * Calcule la semaine ISO 8601 pour une date donnée
+ * @param date - La date pour laquelle calculer la semaine ISO
+ * @returns Le numéro de la semaine ISO (1-53)
+ */
+export function getISOWeek(date: Date): number {
+  const target = new Date(date.valueOf());
+  const dayNr = (date.getDay() + 6) % 7;
+  target.setDate(target.getDate() - dayNr + 3);
+  const firstThursday = target.valueOf();
+  target.setMonth(0, 1);
+  if (target.getDay() !== 4) {
+    target.setMonth(0, 1 + ((4 - target.getDay() + 7) % 7));
+  }
+  return 1 + Math.ceil((firstThursday - target.valueOf()) / 604800000);
+}
+
+/**
+ * Formate une durée en heures et minutes
+ * @param hours - Nombre d'heures (peut être décimal)
+ * @returns Une chaîne formatée (ex: "2h 30min")
+ */
+export function formatDuration(hours: number): string {
+  const h = Math.floor(hours);
+  const m = Math.round((hours - h) * 60);
+  if (m === 0) return `${h}h`;
+  return `${h}h ${m}min`;
+}
+
+/**
+ * Calcule le mercredi de N semaines avant la semaine ISO d'une date donnée
+ * @param date - La date de référence
+ * @param weeksBefore - Nombre de semaines avant (par défaut 4)
+ * @returns Le mercredi de la semaine cible
+ */
+export function getWednesdayBeforeISOWeek(date: Date, weeksBefore: number = 4): Date {
+  // Obtenir le lundi de la semaine ISO de la date donnée
+  const target = new Date(date.valueOf());
+  const dayNr = (date.getDay() + 6) % 7; // 0 = lundi, 6 = dimanche
+  target.setDate(target.getDate() - dayNr); // Aller au lundi de cette semaine
+
+  // Reculer de N semaines
+  target.setDate(target.getDate() - weeksBefore * 7);
+
+  // Aller au mercredi de cette semaine (lundi + 2 jours)
+  target.setDate(target.getDate() + 2);
+
+  return target;
+}
+
+/** Motif pour une valeur issue de `<input type="datetime-local">` : `YYYY-MM-DDTHH:mm` ou avec secondes. */
+const DATETIME_LOCAL_PAYLOAD_RE =
+  /^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2})(?::(\d{2}))?$/;
+
+/**
+ * Date du calendrier local (sans fuseau explicite dans la chaîne).
+ */
+export function toLocalDateInput(value: Date | string): string {
+  const date = typeof value === 'string' ? new Date(value) : value;
+  const year = date.getFullYear();
+  const month = String(date.getMonth() + 1).padStart(2, '0');
+  const day = String(date.getDate()).padStart(2, '0');
+  return `${year}-${month}-${day}`;
+}
+
+/**
+ * Valeur pour `<input type="datetime-local">` à partir d’une Date ou d’une ISO renvoyée par l’API.
+ */
+export function toLocalDateTimeInput(value: Date | string): string {
+  const date = typeof value === 'string' ? new Date(value) : value;
+  const localDate = toLocalDateInput(date);
+  const hours = String(date.getHours()).padStart(2, '0');
+  const minutes = String(date.getMinutes()).padStart(2, '0');
+  return `${localDate}T${hours}:${minutes}`;
+}
+
+/**
+ * Convertit une date/heure saisie en local (`YYYY-MM-DDTHH:mm`) en chaîne ISO UTC pour les APIs.
+ * Si la chaîne contient déjà un fuseau (`Z` ou `±hh:mm`), utilise le parseur natif.
+ */
+export function scheduledAtPayloadToIso(value: string): string {
+  const trimmed = value.trim();
+  const m = DATETIME_LOCAL_PAYLOAD_RE.exec(trimmed);
+  if (m) {
+    const year = Number(m[1]);
+    const month = Number(m[2]) - 1;
+    const day = Number(m[3]);
+    const hour = Number(m[4]);
+    const minute = Number(m[5]);
+    const second = m[6] === undefined ? 0 : Number(m[6]);
+    const local = new Date(year, month, day, hour, minute, second, 0);
+    if (Number.isNaN(local.getTime())) {
+      throw new TypeError('Date/heure invalide');
+    }
+    return local.toISOString();
+  }
+  const parsed = new Date(trimmed);
+  if (Number.isNaN(parsed.getTime())) {
+    throw new TypeError('Date/heure invalide');
+  }
+  return parsed.toISOString();
+}
+
+/** Fuseau pour formater les textes d’activité côté serveur (Vercel = UTC par défaut). Dom Tom : surcharger APP_DISPLAY_TIMEZONE. */
+const DEFAULT_APP_DISPLAY_TIMEZONE = 'Europe/Paris';
+
+/**
+ * Date/heure d’un RDV pour les chaînes enregistrées en base (serveur).
+ * Utilise APP_DISPLAY_TIMEZONE ou Europe/Paris par défaut.
+ */
+export function formatFrenchAppointmentDateTime(
+  date: Date,
+  timeZone: string = process.env.APP_DISPLAY_TIMEZONE ?? DEFAULT_APP_DISPLAY_TIMEZONE,
+): string {
+  return new Intl.DateTimeFormat('fr-FR', {
+    day: 'numeric',
+    month: 'long',
+    year: 'numeric',
+    hour: '2-digit',
+    minute: '2-digit',
+    timeZone,
+  }).format(date);
+}
+
+/**
+ * Même rendu que l’agenda / navigateur : fuseau local du client.
+ */
+export function formatFrenchAppointmentDateTimeLocal(date: Date | string): string {
+  const d = typeof date === 'string' ? new Date(date) : date;
+  return new Intl.DateTimeFormat('fr-FR', {
+    day: 'numeric',
+    month: 'long',
+    year: 'numeric',
+    hour: '2-digit',
+    minute: '2-digit',
+  }).format(d);
+}
+
+const APPOINTMENT_INTERACTION_TYPES = new Set([
+  'APPOINTMENT_CREATED',
+  'APPOINTMENT_CHANGED',
+  'APPOINTMENT_DELETED',
+]);
+
+/**
+ * Corps d’affichage pour cartes activités RDV : heure locale navigateur, corrige l’historique UTC en base.
+ */
+export function formatAppointmentInteractionBodyForDisplay(interaction: {
+  type: string;
+  content: string;
+  date: string | null;
+  metadata?: unknown;
+}): string {
+  if (!APPOINTMENT_INTERACTION_TYPES.has(interaction.type) || !interaction.date) {
+    return interaction.content;
+  }
+  const at = formatFrenchAppointmentDateTimeLocal(interaction.date);
+  const meta =
+    interaction.metadata &&
+    typeof interaction.metadata === 'object' &&
+    interaction.metadata !== null &&
+    'isGoogleMeet' in interaction.metadata
+      ? Boolean((interaction.metadata as { isGoogleMeet?: boolean }).isGoogleMeet)
+      : false;
+  const label = meta ? 'Google Meet' : 'Rendez-vous';
+  switch (interaction.type) {
+    case 'APPOINTMENT_CREATED':
+      return `Rendez-vous programmé le ${at}`;
+    case 'APPOINTMENT_CHANGED':
+      return `${label} programmé le ${at} a été modifié.`;
+    case 'APPOINTMENT_DELETED':
+      return `${label} prévu le ${at} a été annulé.`;
+    default:
+      return interaction.content;
+  }
+}

package/template/src/lib/default-widgets.ts

@@ -1,5 +1,3 @@
-// Layout par défaut pour les nouveaux utilisateurs
-// Ce fichier est séparé du widget-registry pour être importable côté serveur
 export const DEFAULT_WIDGETS = [
   { type: 'stat_total_contacts', x: 0, y: 0, w: 3, h: 2 },
   { type: 'stat_new_contacts', x: 3, y: 0, w: 3, h: 2 },

package/template/src/lib/editor-html-image-dimensions.ts

@@ -0,0 +1,172 @@
+/**
+ * LexKit : export HTML correct (figure.align-left, width/height…), mais importFromHTML
+ * - ne remet pas __width/__height sur le nœud image ;
+ * - pour <figure>, force __alignment à "center" (bug / choix amont), d’où un logo visuellement centré
+ *   dans l’éditeur alors que le HTML sauvegardé reste à gauche.
+ * Ces helpers réappliquent taille + alignement après import, d’après le HTML réel.
+ */
+
+import type { LexicalEditor, LexicalNode } from 'lexical';
+import { $getRoot, $isElementNode } from 'lexical';
+
+function parsePositiveInt(value: string | null | undefined): number | null {
+  if (value == null || value === '') return null;
+  const n = Number.parseInt(String(value).trim(), 10);
+  return Number.isFinite(n) && n > 0 ? n : null;
+}
+
+function parsePxFromStyle(style: string, prop: 'width' | 'height'): number | null {
+  const re = new RegExp(`${prop}\\s*:\\s*(\\d+)\\s*px`, 'i');
+  const m = re.exec(style);
+  if (!m) return null;
+  const n = Number.parseInt(m[1], 10);
+  return Number.isFinite(n) && n > 0 ? n : null;
+}
+
+export type ImgDimensions = { w: number; h: number };
+export type ImgAlignment = 'left' | 'center' | 'right' | 'none';
+
+function extractImgAlignment(img: HTMLImageElement): ImgAlignment {
+  const fig = img.closest('figure');
+  const classBlob = [fig?.className, img.className].filter(Boolean).join(' ');
+  const styleBlob = [fig?.getAttribute('style'), img.getAttribute('style')]
+    .filter(Boolean)
+    .join(';');
+
+  if (/\balign-left\b/.test(classBlob)) return 'left';
+  if (/\balign-right\b/.test(classBlob)) return 'right';
+  if (/\balign-center\b/.test(classBlob)) return 'center';
+  if (/\balign-none\b/.test(classBlob)) return 'none';
+
+  if (/float\s*:\s*left/i.test(styleBlob)) return 'left';
+  if (/float\s*:\s*right/i.test(styleBlob)) return 'right';
+  if (/text-align\s*:\s*left/i.test(styleBlob)) return 'left';
+  if (/text-align\s*:\s*right/i.test(styleBlob)) return 'right';
+  if (/text-align\s*:\s*center/i.test(styleBlob)) return 'center';
+
+  return 'none';
+}
+
+function extractImgDimensions(img: HTMLImageElement): ImgDimensions | null {
+  let w = parsePositiveInt(img.getAttribute('width'));
+  let h = parsePositiveInt(img.getAttribute('height'));
+  const st = img.getAttribute('style') || '';
+  if (w == null) w = parsePxFromStyle(st, 'width');
+  if (h == null) h = parsePxFromStyle(st, 'height');
+  if (w != null && h != null) return { w, h };
+  return null;
+}
+
+export function extractOrderedImgLayout(html: string): {
+  dimensions: Array<ImgDimensions | null>;
+  alignments: ImgAlignment[];
+} {
+  if (!html.includes('<img')) {
+    return { dimensions: [], alignments: [] };
+  }
+  try {
+    const doc = new DOMParser().parseFromString(
+      `<div id="__editor_img_layout__">${html}</div>`,
+      'text/html',
+    );
+    const root = doc.getElementById('__editor_img_layout__');
+    if (!root) return { dimensions: [], alignments: [] };
+
+    const dimensions: Array<ImgDimensions | null> = [];
+    const alignments: ImgAlignment[] = [];
+    root.querySelectorAll('img').forEach((img) => {
+      dimensions.push(extractImgDimensions(img));
+      alignments.push(extractImgAlignment(img));
+    });
+    return { dimensions, alignments };
+  } catch {
+    return { dimensions: [], alignments: [] };
+  }
+}
+
+/** Copie width/height attributs → style inline (meilleure compat import LexKit + clients mail). */
+export function mergeImgDimensionAttrsIntoStyle(html: string): string {
+  if (!html.includes('<img')) return html;
+  try {
+    const doc = new DOMParser().parseFromString(
+      `<div id="__editor_sig_root__">${html}</div>`,
+      'text/html',
+    );
+    const root = doc.getElementById('__editor_sig_root__');
+    if (!root) return html;
+
+    root.querySelectorAll('img').forEach((img) => {
+      const wAttr = parsePositiveInt(img.getAttribute('width'));
+      const hAttr = parsePositiveInt(img.getAttribute('height'));
+      const style = (img.getAttribute('style') || '').trim();
+
+      const parts: string[] = [];
+      if (wAttr != null && !/\bwidth\s*:/i.test(style)) {
+        parts.push(`width:${wAttr}px`);
+      }
+      if (hAttr != null && !/\bheight\s*:/i.test(style)) {
+        parts.push(`height:${hAttr}px`);
+      }
+      if (parts.length === 0) return;
+
+      const merged = [style.replace(/;+\s*$/, ''), ...parts].filter(Boolean).join(';');
+      img.setAttribute('style', merged);
+    });
+
+    return root.innerHTML;
+  } catch {
+    return html;
+  }
+}
+
+type ImageNodeWithLayout = {
+  getType(): string;
+  setWidthAndHeight(width: number, height: number): void;
+  setAlignment(alignment: ImgAlignment): void;
+};
+
+function collectImageNodesInDocumentOrder(node: LexicalNode): ImageNodeWithLayout[] {
+  const list: ImageNodeWithLayout[] = [];
+
+  const visit = (n: LexicalNode) => {
+    if (n.getType() === 'image') {
+      list.push(n as unknown as ImageNodeWithLayout);
+    }
+    if ($isElementNode(n)) {
+      n.getChildren().forEach(visit);
+    }
+  };
+
+  visit(node);
+  return list;
+}
+
+/** Après importFromHTML : restaure __width/__height et __alignment (corrige le « center » forcé par LexKit sur <figure>). */
+export function applyOrderedImageLayoutAfterImport(editor: LexicalEditor, html: string): void {
+  if (!html.includes('<img')) return;
+
+  const { dimensions, alignments } = extractOrderedImgLayout(html);
+  if (dimensions.length === 0 || alignments.length === 0) return;
+
+  editor.update(() => {
+    const images = collectImageNodesInDocumentOrder($getRoot());
+    const count = Math.min(images.length, dimensions.length, alignments.length);
+    for (let i = 0; i < count; i++) {
+      const node = images[i];
+      const d = dimensions[i];
+      const a = alignments[i];
+      if (d) {
+        try {
+          node.setWidthAndHeight(d.w, d.h);
+        } catch {
+          /* ignore */
+        }
+      }
+      try {
+        node.setAlignment(a);
+      } catch {
+        /* ignore */
+      }
+    }
+  });
+}

package/template/src/lib/editor-image-limits.ts

@@ -0,0 +1,19 @@
+/**
+ * Taille max recommandée pour un logo en signature (HTML en data URL = base64,
+ * donc ~33 % plus lourd que le fichier binaire — mieux vaut rester léger).
+ */
+export const SIGNATURE_MAX_IMAGE_BYTES = 350 * 1024;
+
+export function formatImageFileSize(bytes: number): string {
+  if (bytes < 1024) return `${bytes} o`;
+  if (bytes < 1024 * 1024) return `${Math.round(bytes / 1024)} Ko`;
+  return `${(bytes / (1024 * 1024)).toFixed(1)} Mo`;
+}
+
+/** Lève une erreur avec un message utilisateur si le fichier dépasse la limite. */
+export function assertImageFileWithinLimit(file: File, maxBytes: number): void {
+  if (file.size <= maxBytes) return;
+  throw new Error(
+    `Image trop lourde (maximum ${formatImageFileSize(maxBytes)}, fichier : ${formatImageFileSize(file.size)}). Compressez ou réduisez le logo.`,
+  );
+}

package/template/src/lib/email-html-sanitize.ts

@@ -0,0 +1,19 @@
+import sanitize from 'sanitize-html';
+
+export function sanitizeEmailHtml(input: string): string {
+  if (!input) return '';
+  return sanitize(input, {
+    allowedTags: [
+      'p', 'br', 'strong', 'em', 'u', 'a', 'div', 'span',
+      'h1', 'h2', 'h3', 'h4', 'h5', 'h6',
+      'ul', 'ol', 'li', 'blockquote', 'pre', 'code',
+      'table', 'thead', 'tbody', 'tr', 'th', 'td',
+      'img', 'hr', 'sub', 'sup', 's',
+    ],
+    allowedAttributes: {
+      a: ['href', 'title', 'target', 'rel'],
+      img: ['src', 'alt', 'width', 'height'],
+      '*': ['style', 'class'],
+    },
+  });
+}