@consilioweb/payload-support 0.6.1 → 0.6.2

package/dist/views/BillingView/client.cjs

@@ -0,0 +1,209 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var useTranslation = require('../../components/TicketConversation/hooks/useTranslation');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+function formatDuration(minutes) {
+  const h = Math.floor(minutes / 60);
+  const m = minutes % 60;
+  if (h === 0) return `${m}min`;
+  if (m === 0) return `${h}h`;
+  return `${h}h ${m}min`;
+}
+function formatAmount(minutes, rate) {
+  return (minutes / 60 * rate).toFixed(2);
+}
+function getMonthRange(offset) {
+  const now = /* @__PURE__ */ new Date();
+  const start = new Date(now.getFullYear(), now.getMonth() + offset, 1);
+  const end = new Date(now.getFullYear(), now.getMonth() + offset + 1, 0);
+  return { from: start.toISOString().split("T")[0], to: end.toISOString().split("T")[0] };
+}
+function getQuarterRange(offset) {
+  const now = /* @__PURE__ */ new Date();
+  const q = Math.floor(now.getMonth() / 3) + offset;
+  const start = new Date(now.getFullYear(), q * 3, 1);
+  const end = new Date(now.getFullYear(), q * 3 + 3, 0);
+  return { from: start.toISOString().split("T")[0], to: end.toISOString().split("T")[0] };
+}
+const BillingClient = () => {
+  const { t } = useTranslation.useTranslation();
+  const [from, setFrom] = React.useState(() => getMonthRange(0).from);
+  const [to, setTo] = React.useState(() => getMonthRange(0).to);
+  const [projectId, setProjectId] = React.useState("");
+  const [rate, setRate] = React.useState(60);
+  const [data, setData] = React.useState(null);
+  const [loading, setLoading] = React.useState(false);
+  const [projects, setProjects] = React.useState([]);
+  const [projectsLoaded, setProjectsLoaded] = React.useState(false);
+  const [copied, setCopied] = React.useState(false);
+  const loadProjects = React.useCallback(async () => {
+    if (projectsLoaded) return;
+    try {
+      const res = await fetch("/api/projects?limit=100&depth=0&sort=name");
+      if (res.ok) {
+        const json = await res.json();
+        setProjects(json.docs?.map((p) => ({ id: p.id, name: p.name })) || []);
+      }
+    } catch (err) {
+      console.warn("[support] loadProjects error:", err);
+    }
+    setProjectsLoaded(true);
+  }, [projectsLoaded]);
+  React__default.default.useEffect(() => {
+    loadProjects();
+  }, [loadProjects]);
+  const fetchBilling = React.useCallback(async () => {
+    setLoading(true);
+    try {
+      const params = new URLSearchParams({ from, to });
+      if (projectId) params.set("projectId", projectId);
+      const res = await fetch(`/api/support/billing?${params}`);
+      if (res.ok) setData(await res.json());
+    } catch (err) {
+      console.warn("[support] fetchBilling error:", err);
+    }
+    setLoading(false);
+  }, [from, to, projectId]);
+  const setPeriod = (range) => {
+    setFrom(range.from);
+    setTo(range.to);
+  };
+  const copyRecap = React.useCallback(() => {
+    if (!data) return;
+    const lines = [`PRE-FACTURATION -- Du ${from} au ${to}`, `Taux horaire : ${rate} EUR/h`, "=".repeat(50)];
+    for (const group of data.groups) {
+      lines.push("", `PROJET : ${group.project?.name || "Sans projet"}`);
+      if (group.client?.company) lines.push(`Client : ${group.client.company}`);
+      for (const ticket of group.tickets) {
+        lines.push(`  ${ticket.ticketNumber} -- ${ticket.subject}`);
+        for (const entry of ticket.entries) lines.push(`    ${entry.date} | ${formatDuration(entry.duration)} | ${entry.description || "-"}`);
+        lines.push(`    Sous-total : ${formatDuration(ticket.totalMinutes)} = ${formatAmount(ticket.totalMinutes, rate)} EUR`);
+      }
+    }
+    lines.push("", "=".repeat(50), `TOTAL : ${formatDuration(data.grandTotalMinutes)} = ${formatAmount(data.grandTotalMinutes, rate)} EUR`);
+    navigator.clipboard.writeText(lines.join("\n"));
+    setCopied(true);
+    setTimeout(() => setCopied(false), 2e3);
+  }, [data, from, to, rate]);
+  const S = {
+    page: { padding: "20px 30px", maxWidth: 1100, margin: "0 auto" },
+    filters: { marginBottom: 20 },
+    quickPeriod: { display: "flex", gap: 6, marginBottom: 8 },
+    btn: { padding: "6px 12px", borderRadius: 6, border: "1px solid var(--theme-elevation-200)", fontSize: 12, cursor: "pointer", background: "var(--theme-elevation-0)", color: "var(--theme-text)" },
+    btnPrimary: { padding: "6px 12px", borderRadius: 6, border: "none", fontSize: 12, cursor: "pointer", background: "#2563eb", color: "#fff", fontWeight: 600 },
+    filterRow: { display: "flex", gap: 12, alignItems: "flex-end", flexWrap: "wrap" },
+    fieldGroup: { display: "flex", flexDirection: "column", gap: 4 },
+    label: { fontSize: 11, fontWeight: 600, color: "var(--theme-elevation-500)" },
+    input: { padding: "6px 10px", borderRadius: 6, border: "1px solid var(--theme-elevation-200)", fontSize: 12, color: "var(--theme-text)", background: "var(--theme-elevation-0)" },
+    select: { padding: "6px 10px", borderRadius: 6, border: "1px solid var(--theme-elevation-200)", fontSize: 12, color: "var(--theme-text)", background: "var(--theme-elevation-0)" },
+    groupCard: { marginBottom: 16, borderRadius: 10, border: "1px solid var(--theme-elevation-150)", overflow: "hidden" },
+    groupHeader: { display: "flex", justifyContent: "space-between", padding: "12px 16px", background: "var(--theme-elevation-50)", borderBottom: "1px solid var(--theme-elevation-150)" },
+    table: { width: "100%", borderCollapse: "collapse", fontSize: 12 },
+    th: { textAlign: "left", padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-200)", fontSize: 11, color: "var(--theme-elevation-500)" },
+    td: { padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-100)" },
+    grandTotal: { padding: 16, borderRadius: 10, border: "2px solid #2563eb", display: "flex", justifyContent: "space-between", alignItems: "center", marginTop: 16 }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.page, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: 16 }, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h1", { style: { fontSize: 22, fontWeight: 700, margin: 0 }, children: t("billing.title") }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { style: { fontSize: 13, color: "var(--theme-elevation-500)", margin: "4px 0 0" }, children: t("billing.subtitle") })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.filters, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.quickPeriod, children: [
+        /* @__PURE__ */ jsxRuntime.jsx("button", { style: S.btnPrimary, onClick: () => setPeriod(getMonthRange(0)), children: t("billing.filters.thisMonth") }),
+        /* @__PURE__ */ jsxRuntime.jsx("button", { style: S.btn, onClick: () => setPeriod(getMonthRange(-1)), children: t("billing.filters.lastMonth") }),
+        /* @__PURE__ */ jsxRuntime.jsx("button", { style: S.btn, onClick: () => setPeriod(getQuarterRange(0)), children: t("billing.filters.thisQuarter") })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.filterRow, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.fieldGroup, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("label", { style: S.label, children: t("billing.filters.from") }),
+          /* @__PURE__ */ jsxRuntime.jsx("input", { type: "date", value: from, onChange: (e) => setFrom(e.target.value), style: S.input })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.fieldGroup, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("label", { style: S.label, children: t("billing.filters.to") }),
+          /* @__PURE__ */ jsxRuntime.jsx("input", { type: "date", value: to, onChange: (e) => setTo(e.target.value), style: S.input })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.fieldGroup, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("label", { style: S.label, children: t("billing.filters.project") }),
+          /* @__PURE__ */ jsxRuntime.jsxs("select", { value: projectId, onChange: (e) => setProjectId(e.target.value), style: S.select, children: [
+            /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", children: t("common.all") }),
+            projects.map((p) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: p.id, children: p.name }, p.id))
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.fieldGroup, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("label", { style: S.label, children: t("billing.filters.hourlyRate") }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", gap: 4, alignItems: "center" }, children: [
+            /* @__PURE__ */ jsxRuntime.jsx("input", { type: "number", value: rate, onChange: (e) => setRate(Number(e.target.value)), style: { ...S.input, width: 70 }, min: 0 }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: 11 }, children: t("billing.filters.rateUnit") })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("button", { style: S.btnPrimary, onClick: fetchBilling, disabled: loading, children: loading ? t("billing.filters.loading") : t("billing.filters.load") })
+      ] })
+    ] }),
+    data && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: data.groups.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: 40, textAlign: "center", color: "#94a3b8" }, children: t("billing.empty") }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      data.groups.map((group, gi) => /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.groupCard, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.groupHeader, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontWeight: 700 }, children: group.project?.name || "Sans projet" }),
+            group.client?.company && /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { color: "var(--theme-elevation-500)" }, children: [
+              " -- ",
+              group.client.company
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { textAlign: "right" }, children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontWeight: 700 }, children: formatDuration(group.totalMinutes) }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { fontSize: 12, color: "#2563eb", fontWeight: 600 }, children: [
+              formatAmount(group.totalMinutes, rate),
+              " EUR"
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("table", { style: S.table, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
+            /* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("billing.table.ticketNumber") }),
+            /* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("billing.table.subject") }),
+            /* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("billing.table.date") }),
+            /* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("billing.table.duration") }),
+            /* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("billing.table.description") }),
+            /* @__PURE__ */ jsxRuntime.jsx("th", { style: { ...S.th, textAlign: "right" }, children: t("billing.table.amount") })
+          ] }) }),
+          /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: group.tickets.map((ticket) => ticket.entries.map((entry, ei) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
+            ei === 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx("td", { style: { ...S.td, fontWeight: 600 }, rowSpan: ticket.entries.length, children: /* @__PURE__ */ jsxRuntime.jsx("a", { href: `/admin/support/ticket?id=${ticket.id}`, style: { color: "#2563eb", textDecoration: "none" }, children: ticket.ticketNumber }) }),
+              /* @__PURE__ */ jsxRuntime.jsx("td", { style: S.td, rowSpan: ticket.entries.length, children: ticket.subject })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("td", { style: S.td, children: entry.date }),
+            /* @__PURE__ */ jsxRuntime.jsx("td", { style: S.td, children: formatDuration(entry.duration) }),
+            /* @__PURE__ */ jsxRuntime.jsx("td", { style: S.td, children: entry.description || "-" }),
+            /* @__PURE__ */ jsxRuntime.jsxs("td", { style: { ...S.td, textAlign: "right", fontWeight: 600 }, children: [
+              formatAmount(entry.duration, rate),
+              " EUR"
+            ] })
+          ] }, `${ticket.id}-${ei}`))) })
+        ] })
+      ] }, gi)),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.grandTotal, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 12, color: "var(--theme-elevation-500)" }, children: t("billing.totals.billableTicketsPlural", { count: String(data.groups.reduce((s2, g) => s2 + g.tickets.length, 0)) }) }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { fontSize: 18, fontWeight: 700 }, children: [
+            t("billing.totals.total"),
+            " : ",
+            formatDuration(data.grandTotalMinutes),
+            " = ",
+            formatAmount(data.grandTotalMinutes, rate),
+            " EUR"
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("button", { style: S.btnPrimary, onClick: copyRecap, children: copied ? t("billing.totals.copiedRecap") : t("billing.totals.copyRecap") })
+      ] })
+    ] }) })
+  ] });
+};
+
+exports.BillingClient = BillingClient;

package/dist/views/BillingView/client.js

@@ -0,0 +1,204 @@
+"use client";
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import React, { useState, useCallback } from 'react';
+import { useTranslation } from '../../components/TicketConversation/hooks/useTranslation';
+
+function formatDuration(minutes) {
+  const h = Math.floor(minutes / 60);
+  const m = minutes % 60;
+  if (h === 0) return `${m}min`;
+  if (m === 0) return `${h}h`;
+  return `${h}h ${m}min`;
+}
+function formatAmount(minutes, rate) {
+  return (minutes / 60 * rate).toFixed(2);
+}
+function getMonthRange(offset) {
+  const now = /* @__PURE__ */ new Date();
+  const start = new Date(now.getFullYear(), now.getMonth() + offset, 1);
+  const end = new Date(now.getFullYear(), now.getMonth() + offset + 1, 0);
+  return { from: start.toISOString().split("T")[0], to: end.toISOString().split("T")[0] };
+}
+function getQuarterRange(offset) {
+  const now = /* @__PURE__ */ new Date();
+  const q = Math.floor(now.getMonth() / 3) + offset;
+  const start = new Date(now.getFullYear(), q * 3, 1);
+  const end = new Date(now.getFullYear(), q * 3 + 3, 0);
+  return { from: start.toISOString().split("T")[0], to: end.toISOString().split("T")[0] };
+}
+const BillingClient = () => {
+  const { t } = useTranslation();
+  const [from, setFrom] = useState(() => getMonthRange(0).from);
+  const [to, setTo] = useState(() => getMonthRange(0).to);
+  const [projectId, setProjectId] = useState("");
+  const [rate, setRate] = useState(60);
+  const [data, setData] = useState(null);
+  const [loading, setLoading] = useState(false);
+  const [projects, setProjects] = useState([]);
+  const [projectsLoaded, setProjectsLoaded] = useState(false);
+  const [copied, setCopied] = useState(false);
+  const loadProjects = useCallback(async () => {
+    if (projectsLoaded) return;
+    try {
+      const res = await fetch("/api/projects?limit=100&depth=0&sort=name");
+      if (res.ok) {
+        const json = await res.json();
+        setProjects(json.docs?.map((p) => ({ id: p.id, name: p.name })) || []);
+      }
+    } catch (err) {
+      console.warn("[support] loadProjects error:", err);
+    }
+    setProjectsLoaded(true);
+  }, [projectsLoaded]);
+  React.useEffect(() => {
+    loadProjects();
+  }, [loadProjects]);
+  const fetchBilling = useCallback(async () => {
+    setLoading(true);
+    try {
+      const params = new URLSearchParams({ from, to });
+      if (projectId) params.set("projectId", projectId);
+      const res = await fetch(`/api/support/billing?${params}`);
+      if (res.ok) setData(await res.json());
+    } catch (err) {
+      console.warn("[support] fetchBilling error:", err);
+    }
+    setLoading(false);
+  }, [from, to, projectId]);
+  const setPeriod = (range) => {
+    setFrom(range.from);
+    setTo(range.to);
+  };
+  const copyRecap = useCallback(() => {
+    if (!data) return;
+    const lines = [`PRE-FACTURATION -- Du ${from} au ${to}`, `Taux horaire : ${rate} EUR/h`, "=".repeat(50)];
+    for (const group of data.groups) {
+      lines.push("", `PROJET : ${group.project?.name || "Sans projet"}`);
+      if (group.client?.company) lines.push(`Client : ${group.client.company}`);
+      for (const ticket of group.tickets) {
+        lines.push(`  ${ticket.ticketNumber} -- ${ticket.subject}`);
+        for (const entry of ticket.entries) lines.push(`    ${entry.date} | ${formatDuration(entry.duration)} | ${entry.description || "-"}`);
+        lines.push(`    Sous-total : ${formatDuration(ticket.totalMinutes)} = ${formatAmount(ticket.totalMinutes, rate)} EUR`);
+      }
+    }
+    lines.push("", "=".repeat(50), `TOTAL : ${formatDuration(data.grandTotalMinutes)} = ${formatAmount(data.grandTotalMinutes, rate)} EUR`);
+    navigator.clipboard.writeText(lines.join("\n"));
+    setCopied(true);
+    setTimeout(() => setCopied(false), 2e3);
+  }, [data, from, to, rate]);
+  const S = {
+    page: { padding: "20px 30px", maxWidth: 1100, margin: "0 auto" },
+    filters: { marginBottom: 20 },
+    quickPeriod: { display: "flex", gap: 6, marginBottom: 8 },
+    btn: { padding: "6px 12px", borderRadius: 6, border: "1px solid var(--theme-elevation-200)", fontSize: 12, cursor: "pointer", background: "var(--theme-elevation-0)", color: "var(--theme-text)" },
+    btnPrimary: { padding: "6px 12px", borderRadius: 6, border: "none", fontSize: 12, cursor: "pointer", background: "#2563eb", color: "#fff", fontWeight: 600 },
+    filterRow: { display: "flex", gap: 12, alignItems: "flex-end", flexWrap: "wrap" },
+    fieldGroup: { display: "flex", flexDirection: "column", gap: 4 },
+    label: { fontSize: 11, fontWeight: 600, color: "var(--theme-elevation-500)" },
+    input: { padding: "6px 10px", borderRadius: 6, border: "1px solid var(--theme-elevation-200)", fontSize: 12, color: "var(--theme-text)", background: "var(--theme-elevation-0)" },
+    select: { padding: "6px 10px", borderRadius: 6, border: "1px solid var(--theme-elevation-200)", fontSize: 12, color: "var(--theme-text)", background: "var(--theme-elevation-0)" },
+    groupCard: { marginBottom: 16, borderRadius: 10, border: "1px solid var(--theme-elevation-150)", overflow: "hidden" },
+    groupHeader: { display: "flex", justifyContent: "space-between", padding: "12px 16px", background: "var(--theme-elevation-50)", borderBottom: "1px solid var(--theme-elevation-150)" },
+    table: { width: "100%", borderCollapse: "collapse", fontSize: 12 },
+    th: { textAlign: "left", padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-200)", fontSize: 11, color: "var(--theme-elevation-500)" },
+    td: { padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-100)" },
+    grandTotal: { padding: 16, borderRadius: 10, border: "2px solid #2563eb", display: "flex", justifyContent: "space-between", alignItems: "center", marginTop: 16 }
+  };
+  return /* @__PURE__ */ jsxs("div", { style: S.page, children: [
+    /* @__PURE__ */ jsxs("div", { style: { marginBottom: 16 }, children: [
+      /* @__PURE__ */ jsx("h1", { style: { fontSize: 22, fontWeight: 700, margin: 0 }, children: t("billing.title") }),
+      /* @__PURE__ */ jsx("p", { style: { fontSize: 13, color: "var(--theme-elevation-500)", margin: "4px 0 0" }, children: t("billing.subtitle") })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { style: S.filters, children: [
+      /* @__PURE__ */ jsxs("div", { style: S.quickPeriod, children: [
+        /* @__PURE__ */ jsx("button", { style: S.btnPrimary, onClick: () => setPeriod(getMonthRange(0)), children: t("billing.filters.thisMonth") }),
+        /* @__PURE__ */ jsx("button", { style: S.btn, onClick: () => setPeriod(getMonthRange(-1)), children: t("billing.filters.lastMonth") }),
+        /* @__PURE__ */ jsx("button", { style: S.btn, onClick: () => setPeriod(getQuarterRange(0)), children: t("billing.filters.thisQuarter") })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { style: S.filterRow, children: [
+        /* @__PURE__ */ jsxs("div", { style: S.fieldGroup, children: [
+          /* @__PURE__ */ jsx("label", { style: S.label, children: t("billing.filters.from") }),
+          /* @__PURE__ */ jsx("input", { type: "date", value: from, onChange: (e) => setFrom(e.target.value), style: S.input })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { style: S.fieldGroup, children: [
+          /* @__PURE__ */ jsx("label", { style: S.label, children: t("billing.filters.to") }),
+          /* @__PURE__ */ jsx("input", { type: "date", value: to, onChange: (e) => setTo(e.target.value), style: S.input })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { style: S.fieldGroup, children: [
+          /* @__PURE__ */ jsx("label", { style: S.label, children: t("billing.filters.project") }),
+          /* @__PURE__ */ jsxs("select", { value: projectId, onChange: (e) => setProjectId(e.target.value), style: S.select, children: [
+            /* @__PURE__ */ jsx("option", { value: "", children: t("common.all") }),
+            projects.map((p) => /* @__PURE__ */ jsx("option", { value: p.id, children: p.name }, p.id))
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { style: S.fieldGroup, children: [
+          /* @__PURE__ */ jsx("label", { style: S.label, children: t("billing.filters.hourlyRate") }),
+          /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 4, alignItems: "center" }, children: [
+            /* @__PURE__ */ jsx("input", { type: "number", value: rate, onChange: (e) => setRate(Number(e.target.value)), style: { ...S.input, width: 70 }, min: 0 }),
+            /* @__PURE__ */ jsx("span", { style: { fontSize: 11 }, children: t("billing.filters.rateUnit") })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx("button", { style: S.btnPrimary, onClick: fetchBilling, disabled: loading, children: loading ? t("billing.filters.loading") : t("billing.filters.load") })
+      ] })
+    ] }),
+    data && /* @__PURE__ */ jsx(Fragment, { children: data.groups.length === 0 ? /* @__PURE__ */ jsx("div", { style: { padding: 40, textAlign: "center", color: "#94a3b8" }, children: t("billing.empty") }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      data.groups.map((group, gi) => /* @__PURE__ */ jsxs("div", { style: S.groupCard, children: [
+        /* @__PURE__ */ jsxs("div", { style: S.groupHeader, children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("span", { style: { fontWeight: 700 }, children: group.project?.name || "Sans projet" }),
+            group.client?.company && /* @__PURE__ */ jsxs("span", { style: { color: "var(--theme-elevation-500)" }, children: [
+              " -- ",
+              group.client.company
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { style: { textAlign: "right" }, children: [
+            /* @__PURE__ */ jsx("div", { style: { fontWeight: 700 }, children: formatDuration(group.totalMinutes) }),
+            /* @__PURE__ */ jsxs("div", { style: { fontSize: 12, color: "#2563eb", fontWeight: 600 }, children: [
+              formatAmount(group.totalMinutes, rate),
+              " EUR"
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("table", { style: S.table, children: [
+          /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
+            /* @__PURE__ */ jsx("th", { style: S.th, children: t("billing.table.ticketNumber") }),
+            /* @__PURE__ */ jsx("th", { style: S.th, children: t("billing.table.subject") }),
+            /* @__PURE__ */ jsx("th", { style: S.th, children: t("billing.table.date") }),
+            /* @__PURE__ */ jsx("th", { style: S.th, children: t("billing.table.duration") }),
+            /* @__PURE__ */ jsx("th", { style: S.th, children: t("billing.table.description") }),
+            /* @__PURE__ */ jsx("th", { style: { ...S.th, textAlign: "right" }, children: t("billing.table.amount") })
+          ] }) }),
+          /* @__PURE__ */ jsx("tbody", { children: group.tickets.map((ticket) => ticket.entries.map((entry, ei) => /* @__PURE__ */ jsxs("tr", { children: [
+            ei === 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx("td", { style: { ...S.td, fontWeight: 600 }, rowSpan: ticket.entries.length, children: /* @__PURE__ */ jsx("a", { href: `/admin/support/ticket?id=${ticket.id}`, style: { color: "#2563eb", textDecoration: "none" }, children: ticket.ticketNumber }) }),
+              /* @__PURE__ */ jsx("td", { style: S.td, rowSpan: ticket.entries.length, children: ticket.subject })
+            ] }),
+            /* @__PURE__ */ jsx("td", { style: S.td, children: entry.date }),
+            /* @__PURE__ */ jsx("td", { style: S.td, children: formatDuration(entry.duration) }),
+            /* @__PURE__ */ jsx("td", { style: S.td, children: entry.description || "-" }),
+            /* @__PURE__ */ jsxs("td", { style: { ...S.td, textAlign: "right", fontWeight: 600 }, children: [
+              formatAmount(entry.duration, rate),
+              " EUR"
+            ] })
+          ] }, `${ticket.id}-${ei}`))) })
+        ] })
+      ] }, gi)),
+      /* @__PURE__ */ jsxs("div", { style: S.grandTotal, children: [
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("div", { style: { fontSize: 12, color: "var(--theme-elevation-500)" }, children: t("billing.totals.billableTicketsPlural", { count: String(data.groups.reduce((s2, g) => s2 + g.tickets.length, 0)) }) }),
+          /* @__PURE__ */ jsxs("div", { style: { fontSize: 18, fontWeight: 700 }, children: [
+            t("billing.totals.total"),
+            " : ",
+            formatDuration(data.grandTotalMinutes),
+            " = ",
+            formatAmount(data.grandTotalMinutes, rate),
+            " EUR"
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx("button", { style: S.btnPrimary, onClick: copyRecap, children: copied ? t("billing.totals.copiedRecap") : t("billing.totals.copyRecap") })
+      ] })
+    ] }) })
+  ] });
+};
+
+export { BillingClient };

package/dist/views/BillingView/index.cjs

@@ -0,0 +1,34 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var templates = require('@payloadcms/next/templates');
+var navigation = require('next/navigation');
+var ErrorBoundary = require('../shared/ErrorBoundary');
+var client = require('./client');
+
+const BillingView = ({ initPageResult }) => {
+  const { req, visibleEntities } = initPageResult;
+  if (!req.user) {
+    navigation.redirect("/admin/login");
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    templates.DefaultTemplate,
+    {
+      i18n: req.i18n,
+      locale: initPageResult.locale,
+      params: {},
+      payload: req.payload,
+      permissions: initPageResult.permissions,
+      searchParams: {},
+      user: req.user,
+      visibleEntities,
+      children: /* @__PURE__ */ jsxRuntime.jsx(ErrorBoundary.AdminErrorBoundary, { viewName: "BillingView", children: /* @__PURE__ */ jsxRuntime.jsx(client.BillingClient, {}) })
+    }
+  );
+};
+var BillingView_default = BillingView;
+
+exports.BillingView = BillingView;
+exports.default = BillingView_default;

package/dist/views/BillingView/index.js

@@ -0,0 +1,29 @@
+import { jsx } from 'react/jsx-runtime';
+import { DefaultTemplate } from '@payloadcms/next/templates';
+import { redirect } from 'next/navigation';
+import { AdminErrorBoundary } from '../shared/ErrorBoundary';
+import { BillingClient } from './client';
+
+const BillingView = ({ initPageResult }) => {
+  const { req, visibleEntities } = initPageResult;
+  if (!req.user) {
+    redirect("/admin/login");
+  }
+  return /* @__PURE__ */ jsx(
+    DefaultTemplate,
+    {
+      i18n: req.i18n,
+      locale: initPageResult.locale,
+      params: {},
+      payload: req.payload,
+      permissions: initPageResult.permissions,
+      searchParams: {},
+      user: req.user,
+      visibleEntities,
+      children: /* @__PURE__ */ jsx(AdminErrorBoundary, { viewName: "BillingView", children: /* @__PURE__ */ jsx(BillingClient, {}) })
+    }
+  );
+};
+var BillingView_default = BillingView;
+
+export { BillingView, BillingView_default as default };