@abyss-project/commons-front-core 6.0.0 → 7.0.0

package/catalog/fixtures.tsx

@@ -0,0 +1,845 @@
+import AccountBalanceOutlined from '@mui/icons-material/AccountBalanceOutlined';
+import ApprovalOutlined from '@mui/icons-material/ApprovalOutlined';
+import AutorenewOutlined from '@mui/icons-material/AutorenewOutlined';
+import BarChartOutlined from '@mui/icons-material/BarChartOutlined';
+import DescriptionOutlined from '@mui/icons-material/DescriptionOutlined';
+import DonutSmallOutlined from '@mui/icons-material/DonutSmallOutlined';
+import FolderOutlined from '@mui/icons-material/FolderOutlined';
+import HelpOutlineOutlined from '@mui/icons-material/HelpOutlineOutlined';
+import JoinInnerOutlined from '@mui/icons-material/JoinInnerOutlined';
+import LocalShippingOutlined from '@mui/icons-material/LocalShippingOutlined';
+import NotificationsActiveOutlined from '@mui/icons-material/NotificationsActiveOutlined';
+import PercentOutlined from '@mui/icons-material/PercentOutlined';
+import ReceiptLongOutlined from '@mui/icons-material/ReceiptLongOutlined';
+import RequestQuoteOutlined from '@mui/icons-material/RequestQuoteOutlined';
+import SavingsOutlined from '@mui/icons-material/SavingsOutlined';
+import SellOutlined from '@mui/icons-material/SellOutlined';
+import ShieldOutlined from '@mui/icons-material/ShieldOutlined';
+import SpaceDashboardOutlined from '@mui/icons-material/SpaceDashboardOutlined';
+import StorefrontOutlined from '@mui/icons-material/StorefrontOutlined';
+import UpcomingOutlined from '@mui/icons-material/UpcomingOutlined';
+import VerifiedOutlined from '@mui/icons-material/VerifiedOutlined';
+import WaterfallChartOutlined from '@mui/icons-material/WaterfallChartOutlined';
+import WorkOutlineOutlined from '@mui/icons-material/WorkOutlineOutlined';
+import type {
+  NavSection,
+  Space,
+} from '../src/components/structure/AppShell/app-shell.types';
+import { StatusTone } from '../src/components/meaning/StatusBadge/StatusBadge';
+import {
+  HttpMethod,
+  LogSeverity,
+  ScanVerdict,
+} from '../src/theme/tokens/domain';
+import { SpaceKind } from '../src/components/structure/AppShell/app-shell.types';
+
+// Realistic content for the catalog, taken from the validated mock-ups (Satellites.dc.html,
+// Mobile.dc.html): Banking accounts and transactions, Monitor logs, Cloud files with their scan
+// verdict, Memories moderation. Amounts and dates go through `Intl`, as a host would do.
+
+// ---------------------------------------------------------------------------------------------
+// Long content: at least 200 characters without a space, the worst case for wrapping.
+
+const MIN_UNBROKEN_LENGTH = 200;
+
+const unbroken = (text: string): string => {
+  if (/\s/.test(text) || text.length < MIN_UNBROKEN_LENGTH) {
+    throw new Error(
+      `A long fixture must hold ${MIN_UNBROKEN_LENGTH} characters without a space: "${text}".`,
+    );
+  }
+  return text;
+};
+
+/** A page title made of one unbroken word (an imported file name used as a title). */
+export const LONG_PAGE_TITLE = unbroken(
+  `Releve-Qonto-Pro-${'export-comptable-troisieme-trimestre-2026-regularisation-TVA-'.repeat(
+    3,
+  )}version-finale-signee.pdf`,
+);
+
+/** A navigation label made of one unbroken word (a saved filter named after a reference). */
+export const LONG_NAV_LABEL = unbroken(
+  `Rapprochement-${'factures-fournisseurs-OVHcloud-SNCF-Connect-URSSAF-'.repeat(
+    4,
+  )}octobre-2026`,
+);
+
+/** A table cell made of one unbroken word (a pagination cursor in a logged route). */
+export const LONG_ROUTE = unbroken(
+  `/v1/exports/transactions?cursor=${'eyJhY2NvdW50IjoicW9udG8tcHJvIiwiYWZ0ZXIiOiIyMDI2LTEwLTA2In0'.repeat(
+    3,
+  )}&limit=500`,
+);
+
+// ---------------------------------------------------------------------------------------------
+// Formatting, as a host does it.
+
+const euroFormat = new Intl.NumberFormat('fr-FR', {
+  style: 'currency',
+  currency: 'EUR',
+});
+const signedEuroFormat = new Intl.NumberFormat('fr-FR', {
+  style: 'currency',
+  currency: 'EUR',
+  signDisplay: 'exceptZero',
+});
+const integerFormat = new Intl.NumberFormat('fr-FR');
+const percentFormat = new Intl.NumberFormat('fr-FR', {
+  style: 'percent',
+  maximumFractionDigits: 1,
+  signDisplay: 'exceptZero',
+});
+const shortDateFormat = new Intl.DateTimeFormat('fr-FR', {
+  day: '2-digit',
+  month: '2-digit',
+});
+
+export const formatEuro = (amount: number): string => euroFormat.format(amount);
+export const formatSignedEuro = (amount: number): string =>
+  signedEuroFormat.format(amount);
+export const formatInteger = (value: number): string =>
+  integerFormat.format(value);
+export const formatPercentDelta = (ratio: number): string =>
+  percentFormat.format(ratio);
+export const formatShortDate = (date: Date): string =>
+  shortDateFormat.format(date);
+
+// ---------------------------------------------------------------------------------------------
+// Banking
+
+export const SPACES: Space[] = [
+  { id: 'personal', name: 'Mehdi A.', kind: SpaceKind.Personal },
+  { id: 'acme', name: 'Acme Industries', kind: SpaceKind.Organization },
+  { id: 'morel', name: 'Atelier Morel SARL', kind: SpaceKind.Organization },
+];
+
+export const BANKING_NAV: NavSection[] = [
+  {
+    id: 'money',
+    title: 'Mon argent',
+    items: [
+      {
+        id: 'home',
+        label: 'Accueil',
+        icon: <SpaceDashboardOutlined />,
+        href: '/accueil',
+      },
+      {
+        id: 'transactions',
+        label: 'Transactions',
+        icon: <ReceiptLongOutlined />,
+        href: '/transactions',
+        count: 1284,
+      },
+      {
+        id: 'accounts',
+        label: 'Comptes',
+        icon: <AccountBalanceOutlined />,
+        href: '/comptes',
+        count: 4,
+      },
+      {
+        id: 'categories',
+        label: 'Catégories',
+        icon: <SellOutlined />,
+        href: '/categories',
+      },
+      {
+        id: 'reports',
+        label: 'Rapports',
+        icon: <BarChartOutlined />,
+        href: '/rapports',
+      },
+    ],
+  },
+  {
+    id: 'receivables',
+    title: 'Encaissements',
+    items: [
+      {
+        id: 'clients',
+        label: 'Clients',
+        icon: <StorefrontOutlined />,
+        href: '/clients',
+      },
+      {
+        id: 'invoices',
+        label: 'Factures',
+        icon: <RequestQuoteOutlined />,
+        href: '/factures',
+        count: 3,
+      },
+    ],
+  },
+  {
+    id: 'payables',
+    title: 'Achats et paiements',
+    items: [
+      {
+        id: 'suppliers',
+        label: 'Fournisseurs',
+        icon: <LocalShippingOutlined />,
+        href: '/fournisseurs',
+      },
+      {
+        id: 'recurring',
+        label: 'Charges récurrentes',
+        icon: <AutorenewOutlined />,
+        href: '/charges',
+      },
+      {
+        id: 'reconciliation',
+        label: 'Rapprochement',
+        icon: <JoinInnerOutlined />,
+        href: '/rapprochement',
+        count: 9,
+      },
+      {
+        id: 'approvals',
+        label: 'Approbations',
+        icon: <ApprovalOutlined />,
+        href: '/approbations',
+      },
+    ],
+  },
+  {
+    id: 'tax',
+    title: 'Impôts et conformité',
+    items: [
+      { id: 'vat', label: 'TVA', icon: <PercentOutlined />, href: '/tva' },
+      {
+        id: 'urssaf',
+        label: 'URSSAF',
+        icon: <ShieldOutlined />,
+        href: '/urssaf',
+      },
+      {
+        id: 'bnc',
+        label: 'Déclaration BNC',
+        icon: <DescriptionOutlined />,
+        href: '/bnc',
+      },
+      {
+        id: 'deadlines',
+        label: 'Échéances',
+        icon: <UpcomingOutlined />,
+        href: '/echeances',
+        count: 2,
+        urgent: true,
+      },
+    ],
+  },
+  {
+    id: 'steering',
+    title: 'Pilotage',
+    items: [
+      {
+        id: 'cash',
+        label: 'Trésorerie',
+        icon: <WaterfallChartOutlined />,
+        href: '/tresorerie',
+      },
+      {
+        id: 'budgets',
+        label: 'Budgets',
+        icon: <DonutSmallOutlined />,
+        href: '/budgets',
+      },
+      {
+        id: 'envelopes',
+        label: 'Enveloppes',
+        icon: <SavingsOutlined />,
+        href: '/enveloppes',
+      },
+      {
+        id: 'alerts',
+        label: 'Alertes',
+        icon: <NotificationsActiveOutlined />,
+        href: '/alertes',
+      },
+      {
+        id: 'documents',
+        label: 'Documents',
+        icon: <FolderOutlined />,
+        href: '/documents',
+      },
+      {
+        id: 'to-identify',
+        label: 'À identifier',
+        icon: <HelpOutlineOutlined />,
+        href: '/a-identifier',
+        count: 7,
+      },
+    ],
+  },
+  {
+    id: 'scoring',
+    title: 'Scoring',
+    items: [
+      {
+        id: 'profiles',
+        label: 'Profils',
+        icon: <VerifiedOutlined />,
+        href: '/profils',
+        count: 3,
+      },
+      {
+        id: 'portfolios',
+        label: 'Portefeuilles',
+        icon: <WorkOutlineOutlined />,
+        href: '/portefeuilles',
+      },
+    ],
+  },
+];
+
+/** The Banking navigation plus a saved filter whose name is one unbroken word. */
+export const BANKING_NAV_WITH_LONG_LABEL: NavSection[] = [
+  ...BANKING_NAV.slice(0, 1),
+  {
+    id: 'saved',
+    title: 'Filtres enregistrés',
+    items: [
+      {
+        id: 'long-filter',
+        label: LONG_NAV_LABEL,
+        icon: <JoinInnerOutlined />,
+        href: '/filtres/rapprochement',
+        count: 12,
+      },
+    ],
+  },
+  ...BANKING_NAV.slice(1),
+];
+
+export interface BankAccount {
+  id: string;
+  bank: string;
+  name: string;
+  iban: string;
+  balance: number;
+  type: string;
+  status: { tone: StatusTone; label: string };
+  trend: number[];
+}
+
+export const ACCOUNTS: BankAccount[] = [
+  {
+    id: 'bnp',
+    bank: 'BNP',
+    name: 'Compte courant',
+    iban: 'FR76 •••• 0412',
+    balance: 5482.1,
+    type: 'Compte courant',
+    status: { tone: StatusTone.Success, label: 'Actif' },
+    trend: [40, 52, 48, 61, 55, 70, 64, 58, 72, 66, 80, 76],
+  },
+  {
+    id: 'qonto',
+    bank: 'Qonto',
+    name: 'Qonto · Pro',
+    iban: 'FR76 •••• 2187',
+    balance: 6214.95,
+    type: 'Compte courant',
+    status: { tone: StatusTone.Warning, label: 'Expire dans 6 j' },
+    trend: [30, 45, 50, 42, 60, 58, 62, 70, 68, 74, 72, 85],
+  },
+  {
+    id: 'livret',
+    bank: 'BoursoBank',
+    name: 'Livret A',
+    iban: 'FR76 •••• 7730',
+    balance: 3260,
+    type: 'Épargne · 2,4 %',
+    status: { tone: StatusTone.Success, label: 'Actif' },
+    trend: [60, 60, 62, 62, 64, 64, 66, 66, 68, 68, 70, 70],
+  },
+  {
+    id: 'amex',
+    bank: 'Amex',
+    name: 'Carte Amex',
+    iban: '•••• 1009',
+    balance: -742.43,
+    type: 'Carte · prélevée le 10',
+    status: { tone: StatusTone.Info, label: 'Synchronisation' },
+    trend: [-20, -35, -28, -50, -44, -62, -30, -48, -55, -40, -66, -58],
+  },
+];
+
+export interface TransactionFlag {
+  tone: StatusTone;
+  label: string;
+}
+
+export interface Transaction {
+  id: string;
+  date: Date;
+  label: string;
+  raw: string;
+  category: string;
+  account: string;
+  flags: TransactionFlag[];
+  amount: number;
+}
+
+const day = (dayOfMonth: number): Date => new Date(2026, 9, dayOfMonth);
+
+export const TRANSACTIONS: Transaction[] = [
+  {
+    id: 'tx-01',
+    date: day(6),
+    label: 'OVHcloud',
+    raw: 'PRLV SEPA OVH SAS',
+    category: 'Logiciels & hébergement',
+    account: 'Qonto · Pro',
+    flags: [{ tone: StatusTone.Warning, label: 'Pièce manquante' }],
+    amount: -64.79,
+  },
+  {
+    id: 'tx-02',
+    date: day(6),
+    label: 'Acme Industries',
+    raw: 'VIR SEPA ACME IND FACT 2026-041',
+    category: "Chiffre d'affaires",
+    account: 'Qonto · Pro',
+    flags: [{ tone: StatusTone.Success, label: 'Facture liée' }],
+    amount: 4800,
+  },
+  {
+    id: 'tx-03',
+    date: day(6),
+    label: 'Spotify',
+    raw: 'CB SPOTIFY P2B4',
+    category: 'Abonnements',
+    account: 'BNP · Courant',
+    flags: [{ tone: StatusTone.Info, label: 'Récurrente' }],
+    amount: -10.99,
+  },
+  {
+    id: 'tx-04',
+    date: day(6),
+    label: 'Virement reçu',
+    raw: 'VIR M DUPONT REF 88123',
+    category: 'Non catégorisée',
+    account: 'BNP · Courant',
+    flags: [{ tone: StatusTone.Warning, label: 'À identifier' }],
+    amount: 78.68,
+  },
+  {
+    id: 'tx-05',
+    date: day(5),
+    label: 'Monoprix',
+    raw: 'CB MONOPRIX PARIS 11',
+    category: 'Courses',
+    account: 'BNP · Courant',
+    flags: [],
+    amount: -87.42,
+  },
+  {
+    id: 'tx-06',
+    date: day(5),
+    label: 'SNCF Connect',
+    raw: 'CB SNCF CONNECT 0510',
+    category: 'Transports',
+    account: 'Carte Amex',
+    flags: [{ tone: StatusTone.Danger, label: 'Doublon possible' }],
+    amount: -118,
+  },
+  {
+    id: 'tx-07',
+    date: day(5),
+    label: 'SNCF Connect',
+    raw: 'CB SNCF CONNECT 0510',
+    category: 'Transports',
+    account: 'Carte Amex',
+    flags: [{ tone: StatusTone.Danger, label: 'Doublon possible' }],
+    amount: -118,
+  },
+  {
+    id: 'tx-08',
+    date: day(5),
+    label: 'Boulanger',
+    raw: 'CB BOULANGER 3 X',
+    category: 'Équipement',
+    account: 'Carte Amex',
+    flags: [{ tone: StatusTone.Neutral, label: '1/3' }],
+    amount: -249.6,
+  },
+  {
+    id: 'tx-09',
+    date: day(5),
+    label: 'Loyer octobre',
+    raw: 'PRLV SCI LES TILLEULS',
+    category: 'Logement',
+    account: 'BNP · Courant',
+    flags: [{ tone: StatusTone.Info, label: 'Récurrente' }],
+    amount: -968,
+  },
+  {
+    id: 'tx-10',
+    date: day(4),
+    label: 'URSSAF',
+    raw: 'PRLV URSSAF IDF',
+    category: 'Cotisations sociales',
+    account: 'Qonto · Pro',
+    flags: [{ tone: StatusTone.Success, label: 'Déclaré' }],
+    amount: -1212,
+  },
+  {
+    id: 'tx-11',
+    date: day(4),
+    label: 'Livret A',
+    raw: 'VIR INTERNE EPARGNE',
+    category: 'Virement interne',
+    account: 'BNP · Courant',
+    flags: [{ tone: StatusTone.Neutral, label: 'Virement' }],
+    amount: -200,
+  },
+  {
+    id: 'tx-12',
+    date: day(4),
+    label: 'Franprix',
+    raw: 'CB FRANPRIX 0410',
+    category: 'Courses',
+    account: 'BNP · Courant',
+    flags: [],
+    amount: -54.9,
+  },
+];
+
+export const BANKING_TOTALS = {
+  income: 8412.5,
+  outcome: -3905.17,
+  net: 4507.33,
+  missingReceipts: 9,
+  transactionCount: 1284,
+};
+
+export const ACCOUNT_OPTIONS = ACCOUNTS.map((account) => ({
+  value: account.id,
+  label: account.name,
+  description: `${account.bank} · ${account.iban}`,
+}));
+
+export const CATEGORY_OPTIONS = [
+  { value: 'software', label: 'Logiciels & hébergement' },
+  { value: 'revenue', label: "Chiffre d'affaires" },
+  { value: 'groceries', label: 'Courses' },
+  { value: 'transport', label: 'Transports' },
+  { value: 'housing', label: 'Logement' },
+];
+
+// ---------------------------------------------------------------------------------------------
+// Monitor
+
+export interface LogLine {
+  id: string;
+  time: string;
+  severity: LogSeverity;
+  method: HttpMethod;
+  route: string;
+  status: number;
+  message: string;
+  service: string;
+}
+
+export const LOGS: LogLine[] = [
+  {
+    id: 'log-01',
+    time: '14:02:41',
+    severity: LogSeverity.Error,
+    method: HttpMethod.Post,
+    route: '/v1/invoices/inv_8KJ2/pay',
+    status: 504,
+    message: 'Stripe API timeout after 3 retries',
+    service: 'billing-api',
+  },
+  {
+    id: 'log-02',
+    time: '14:02:38',
+    severity: LogSeverity.Warn,
+    method: HttpMethod.Get,
+    route: '/v1/customers/cus_19A/invoices',
+    status: 200,
+    message: 'Slow query on invoices.findByCustomer (1 212 ms)',
+    service: 'billing-api',
+  },
+  {
+    id: 'log-03',
+    time: '14:02:35',
+    severity: LogSeverity.Fatal,
+    method: HttpMethod.Post,
+    route: '/v1/invoices/inv_8KJ1/pay',
+    status: 503,
+    message: 'Database connection pool exhausted (20/20)',
+    service: 'billing-api',
+  },
+  {
+    id: 'log-04',
+    time: '14:02:31',
+    severity: LogSeverity.Warn,
+    method: HttpMethod.Get,
+    route: '/v1/invoices',
+    status: 200,
+    message: 'Rate limit at 82 % for key pk_live_•••3f9',
+    service: 'gateway',
+  },
+  {
+    id: 'log-05',
+    time: '14:02:26',
+    severity: LogSeverity.Warn,
+    method: HttpMethod.Put,
+    route: '/v1/customers/cus_19A',
+    status: 422,
+    message: 'Invalid VAT number format, manual review',
+    service: 'billing-api',
+  },
+  {
+    id: 'log-06',
+    time: '14:02:12',
+    severity: LogSeverity.Info,
+    method: HttpMethod.Get,
+    route: LONG_ROUTE,
+    status: 200,
+    message: 'Export streamed (12 480 rows)',
+    service: 'exports',
+  },
+  {
+    id: 'log-07',
+    time: '14:01:58',
+    severity: LogSeverity.Error,
+    method: HttpMethod.Post,
+    route: '/hooks/stripe/events',
+    status: 400,
+    message: 'Webhook signature mismatch',
+    service: 'gateway',
+  },
+  {
+    id: 'log-08',
+    time: '14:01:44',
+    severity: LogSeverity.Debug,
+    method: HttpMethod.Delete,
+    route: '/v1/sessions/ses_7Q1',
+    status: 204,
+    message: 'Session revoked by user',
+    service: 'auth',
+  },
+  {
+    id: 'log-09',
+    time: '14:01:40',
+    severity: LogSeverity.Info,
+    method: HttpMethod.Patch,
+    route: '/v1/projects/prj_42/settings',
+    status: 200,
+    message: 'Retention set to 30 days',
+    service: 'monitor-api',
+  },
+];
+
+// ---------------------------------------------------------------------------------------------
+// Cloud
+
+export type FileKind =
+  | 'folder'
+  | 'pdf'
+  | 'sheet'
+  | 'image'
+  | 'doc'
+  | 'archive'
+  | 'video';
+
+export interface CloudFile {
+  id: string;
+  kind: FileKind;
+  name: string;
+  detail: string;
+  size: string;
+  modified: string;
+  share: string | null;
+  scan: { verdict: ScanVerdict; detail?: string } | null;
+  threats?: string[];
+}
+
+export const FILES: CloudFile[] = [
+  {
+    id: 'f-01',
+    kind: 'folder',
+    name: 'Justificatifs',
+    detail: '9 fichiers',
+    size: '4,1 Mo',
+    modified: 'hier',
+    share: 'Comptable',
+    scan: null,
+  },
+  {
+    id: 'f-02',
+    kind: 'folder',
+    name: 'Déclarations',
+    detail: '3 fichiers',
+    size: '2,6 Mo',
+    modified: '12 sept.',
+    share: null,
+    scan: null,
+  },
+  {
+    id: 'f-03',
+    kind: 'pdf',
+    name: 'avis-imposition-2026.pdf',
+    detail: 'Chiffré · v3',
+    size: '1,8 Mo',
+    modified: '3 oct.',
+    share: 'Lien public',
+    scan: {
+      verdict: ScanVerdict.Clean,
+      detail: 'Probe · analysé le 3 oct. à 09:41',
+    },
+  },
+  {
+    id: 'f-04',
+    kind: 'pdf',
+    name: 'declaration-2042-signee.pdf',
+    detail: 'Chiffré',
+    size: '640 Ko',
+    modified: '28 mai',
+    share: null,
+    scan: { verdict: ScanVerdict.Clean },
+  },
+  {
+    id: 'f-05',
+    kind: 'sheet',
+    name: 'frais-reels-2025.xlsx',
+    detail: 'v5',
+    size: '88 Ko',
+    modified: '22 mai',
+    share: 'Sophie B.',
+    scan: { verdict: ScanVerdict.Clean },
+  },
+  {
+    id: 'f-06',
+    kind: 'archive',
+    name: 'facture-fournisseur-octobre.zip',
+    detail: 'Reçu par e-mail',
+    size: '412 Ko',
+    modified: '5 oct.',
+    share: null,
+    scan: { verdict: ScanVerdict.Infected, detail: 'Html.Phishing.Bank-187' },
+    threats: ['Html.Phishing.Bank-187', 'Win.Trojan.Agent-1094213'],
+  },
+  {
+    id: 'f-07',
+    kind: 'image',
+    name: 'recu-dons-restos-coeur.jpg',
+    detail: '3024 × 4032',
+    size: '2,3 Mo',
+    modified: '18 mai',
+    share: null,
+    scan: { verdict: ScanVerdict.Clean },
+  },
+  {
+    id: 'f-08',
+    kind: 'doc',
+    name: 'courrier-reclamation-sip.docx',
+    detail: 'v2',
+    size: '34 Ko',
+    modified: '2 mai',
+    share: null,
+    scan: {
+      verdict: ScanVerdict.Error,
+      detail: 'Archive protégée par mot de passe',
+    },
+  },
+  {
+    id: 'f-09',
+    kind: 'pdf',
+    name: 'taxe-fonciere-2026.pdf',
+    detail: 'Analyse en cours',
+    size: '1,1 Mo',
+    modified: '2 avr.',
+    share: 'Famille',
+    scan: { verdict: ScanVerdict.Pending },
+  },
+  {
+    id: 'f-10',
+    kind: 'video',
+    name: 'video-anniv-ines.mov',
+    detail: '4K · 3 min 12',
+    size: '2,4 Go',
+    modified: '14 mars',
+    share: null,
+    scan: {
+      verdict: ScanVerdict.Skipped,
+      detail: 'Au-delà de 2 Go, non analysé',
+    },
+  },
+];
+
+// ---------------------------------------------------------------------------------------------
+// Memories
+
+export interface Submission {
+  id: string;
+  author: string;
+  origin: string;
+  sentAgo: string;
+  device: string;
+  takenAt: string;
+  size: string;
+}
+
+export const SUBMISSIONS: Submission[] = [
+  {
+    id: 'sub-1',
+    author: 'Julien',
+    origin: 'sans compte · via le QR code',
+    sentAgo: 'il y a 4 min',
+    device: 'iPhone 15 · 3024 × 4032',
+    takenAt: 'prise à 15:42',
+    size: '2,8 Mo',
+  },
+  {
+    id: 'sub-2',
+    author: 'Camille Petit',
+    origin: 'membre · Acme Industries',
+    sentAgo: 'il y a 6 min',
+    device: 'Pixel 8 · 4080 × 3072',
+    takenAt: 'prise à 15:38',
+    size: '3,4 Mo',
+  },
+  {
+    id: 'sub-3',
+    author: 'Léa',
+    origin: 'organisatrice',
+    sentAgo: 'il y a 9 min',
+    device: 'iPhone 13 · vidéo 0:42',
+    takenAt: 'prise à 15:31',
+    size: '38 Mo',
+  },
+  {
+    id: 'sub-4',
+    author: 'Invité 31',
+    origin: 'sans compte · via le lien',
+    sentAgo: 'il y a 12 min',
+    device: 'Galaxy S23 · 4000 × 3000',
+    takenAt: 'prise à 15:20',
+    size: '2,1 Mo',
+  },
+  {
+    id: 'sub-5',
+    author: 'Thomas R.',
+    origin: 'organisateur',
+    sentAgo: 'il y a 15 min',
+    device: 'iPhone 15 Pro · 4032 × 3024',
+    takenAt: 'prise à 15:12',
+    size: '3,0 Mo',
+  },
+  {
+    id: 'sub-6',
+    author: 'Sophie B.',
+    origin: 'membre · famille',
+    sentAgo: 'il y a 21 min',
+    device: 'iPhone 12 · 3024 × 4032',
+    takenAt: 'prise à 14:58',
+    size: '2,6 Mo',
+  },
+];