@greatapps/common 1.1.789 → 1.1.791

package/dist/components/account/sections/affiliates/reports/AffiliatesIndicatorsChart.mjs

@@ -0,0 +1,27 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Line } from "react-chartjs-2";
+import {
+  CategoryScale,
+  Chart as ChartJS,
+  Legend,
+  LinearScale,
+  LineElement,
+  PointElement,
+  Title,
+  Tooltip
+} from "chart.js";
+ChartJS.register(CategoryScale, LinearScale, PointElement, LineElement, Title, Tooltip, Legend);
+function AffiliatesIndicatorsChart({ data, options, plugins, legend }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { className: "h-[350px] w-full", children: /* @__PURE__ */ jsx(Line, { data, options, plugins }) }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center justify-center gap-3", children: legend.map(({ color, dataKey, label }) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+      /* @__PURE__ */ jsx("span", { className: "size-2 rounded-full", style: { backgroundColor: color } }),
+      /* @__PURE__ */ jsx("span", { className: "paragraph-small-medium text-zinc-950", children: label })
+    ] }, dataKey)) })
+  ] });
+}
+export {
+  AffiliatesIndicatorsChart as default
+};
+//# sourceMappingURL=AffiliatesIndicatorsChart.mjs.map

package/dist/components/account/sections/affiliates/reports/AffiliatesIndicatorsChart.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/account/sections/affiliates/reports/AffiliatesIndicatorsChart.tsx"],"sourcesContent":["'use client';\n\nimport { Line } from 'react-chartjs-2';\nimport {\n  CategoryScale,\n  Chart as ChartJS,\n  Legend,\n  LinearScale,\n  LineElement,\n  PointElement,\n  Title,\n  Tooltip,\n  type ChartData,\n  type ChartOptions,\n  type Plugin,\n} from 'chart.js';\nimport type { ChartLegendItem } from './useAffiliatesIndicatorsChart';\n\nChartJS.register(CategoryScale, LinearScale, PointElement, LineElement, Title, Tooltip, Legend);\n\ntype AffiliatesIndicatorsChartProps = {\n  data: ChartData<'line'>;\n  options: ChartOptions<'line'>;\n  plugins: Plugin<'line'>[];\n  legend: ChartLegendItem[];\n};\n\n/** Carregado sob demanda pela aba Relatórios, para o chart.js só entrar no bundle quando a aba abre. */\nexport default function AffiliatesIndicatorsChart({ data, options, plugins, legend }: AffiliatesIndicatorsChartProps) {\n  return (\n    <>\n      <div className=\"h-[350px] w-full\">\n        <Line data={data} options={options} plugins={plugins} />\n      </div>\n      <div className=\"flex flex-wrap items-center justify-center gap-3\">\n        {legend.map(({ color, dataKey, label }) => (\n          <div key={dataKey} className=\"flex items-center gap-1.5\">\n            <span className=\"size-2 rounded-full\" style={{ backgroundColor: color }} />\n            <span className=\"paragraph-small-medium text-zinc-950\">{label}</span>\n          </div>\n        ))}\n      </div>\n    </>\n  );\n}\n"],"mappings":";AA8BI,mBAEI,KAIE,YANN;AA5BJ,SAAS,YAAY;AACrB;AAAA,EACE;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AAGP,QAAQ,SAAS,eAAe,aAAa,cAAc,aAAa,OAAO,SAAS,MAAM;AAU/E,SAAR,0BAA2C,EAAE,MAAM,SAAS,SAAS,OAAO,GAAmC;AACpH,SACE,iCACE;AAAA,wBAAC,SAAI,WAAU,oBACb,8BAAC,QAAK,MAAY,SAAkB,SAAkB,GACxD;AAAA,IACA,oBAAC,SAAI,WAAU,oDACZ,iBAAO,IAAI,CAAC,EAAE,OAAO,SAAS,MAAM,MACnC,qBAAC,SAAkB,WAAU,6BAC3B;AAAA,0BAAC,UAAK,WAAU,uBAAsB,OAAO,EAAE,iBAAiB,MAAM,GAAG;AAAA,MACzE,oBAAC,UAAK,WAAU,wCAAwC,iBAAM;AAAA,SAFtD,OAGV,CACD,GACH;AAAA,KACF;AAEJ;","names":[]}

package/dist/components/account/sections/affiliates/reports/AffiliatesReportsTab.mjs

@@ -0,0 +1,30 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { lazy, Suspense, useEffect } from "react";
+import { useTranslations } from "next-intl";
+import { Skeleton } from "../../../../ui/feedback/Skeleton";
+import { hideChartTooltip } from "../../../../../utils/browser/chart-custom-tooltip";
+import { useAffiliatesIndicatorsChart } from "./useAffiliatesIndicatorsChart";
+const AffiliatesIndicatorsChart = lazy(() => import("./AffiliatesIndicatorsChart"));
+function AffiliatesReportsTab({ report, isLoading }) {
+  const translate = useTranslations();
+  const chart = useAffiliatesIndicatorsChart(report);
+  useEffect(() => hideChartTooltip, []);
+  const chartSkeleton = /* @__PURE__ */ jsx(Skeleton, { className: "h-[350px] w-full rounded-lg" });
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col w-full p-5 gap-8 rounded-lg border border-zinc-200 bg-white", children: [
+    /* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-zinc-600", children: translate("common.account.workspace.affiliates.chart.title") }),
+    isLoading ? chartSkeleton : /* @__PURE__ */ jsx(Suspense, { fallback: chartSkeleton, children: /* @__PURE__ */ jsx(
+      AffiliatesIndicatorsChart,
+      {
+        data: chart.data,
+        options: chart.options,
+        plugins: chart.plugins,
+        legend: chart.legend
+      }
+    ) })
+  ] });
+}
+export {
+  AffiliatesReportsTab
+};
+//# sourceMappingURL=AffiliatesReportsTab.mjs.map

package/dist/components/account/sections/affiliates/reports/AffiliatesReportsTab.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/account/sections/affiliates/reports/AffiliatesReportsTab.tsx"],"sourcesContent":["'use client';\n\nimport { lazy, Suspense, useEffect } from 'react';\nimport { useTranslations } from 'next-intl';\nimport { Skeleton } from '../../../../ui/feedback/Skeleton';\nimport { hideChartTooltip } from '../../../../../utils/browser/chart-custom-tooltip';\nimport type { ReportAnalyticsData } from '../../../../../modules/affiliates/types/affiliate.type';\nimport { useAffiliatesIndicatorsChart } from './useAffiliatesIndicatorsChart';\n\nconst AffiliatesIndicatorsChart = lazy(() => import('./AffiliatesIndicatorsChart'));\n\ntype AffiliatesReportsTabProps = {\n  report?: ReportAnalyticsData | null;\n  isLoading: boolean;\n};\n\nexport function AffiliatesReportsTab({ report, isLoading }: AffiliatesReportsTabProps) {\n  const translate = useTranslations();\n  const chart = useAffiliatesIndicatorsChart(report);\n\n  useEffect(() => hideChartTooltip, []);\n\n  const chartSkeleton = <Skeleton className=\"h-[350px] w-full rounded-lg\" />;\n\n  return (\n    <div className=\"flex flex-col w-full p-5 gap-8 rounded-lg border border-zinc-200 bg-white\">\n      <span className=\"paragraph-small-regular text-zinc-600\">\n        {translate('common.account.workspace.affiliates.chart.title')}\n      </span>\n      {isLoading ? (\n        chartSkeleton\n      ) : (\n        <Suspense fallback={chartSkeleton}>\n          <AffiliatesIndicatorsChart\n            data={chart.data}\n            options={chart.options}\n            plugins={chart.plugins}\n            legend={chart.legend}\n          />\n        </Suspense>\n      )}\n    </div>\n  );\n}\n"],"mappings":";AAsBwB,cAGpB,YAHoB;AApBxB,SAAS,MAAM,UAAU,iBAAiB;AAC1C,SAAS,uBAAuB;AAChC,SAAS,gBAAgB;AACzB,SAAS,wBAAwB;AAEjC,SAAS,oCAAoC;AAE7C,MAAM,4BAA4B,KAAK,MAAM,OAAO,6BAA6B,CAAC;AAO3E,SAAS,qBAAqB,EAAE,QAAQ,UAAU,GAA8B;AACrF,QAAM,YAAY,gBAAgB;AAClC,QAAM,QAAQ,6BAA6B,MAAM;AAEjD,YAAU,MAAM,kBAAkB,CAAC,CAAC;AAEpC,QAAM,gBAAgB,oBAAC,YAAS,WAAU,+BAA8B;AAExE,SACE,qBAAC,SAAI,WAAU,6EACb;AAAA,wBAAC,UAAK,WAAU,yCACb,oBAAU,iDAAiD,GAC9D;AAAA,IACC,YACC,gBAEA,oBAAC,YAAS,UAAU,eAClB;AAAA,MAAC;AAAA;AAAA,QACC,MAAM,MAAM;AAAA,QACZ,SAAS,MAAM;AAAA,QACf,SAAS,MAAM;AAAA,QACf,QAAQ,MAAM;AAAA;AAAA,IAChB,GACF;AAAA,KAEJ;AAEJ;","names":[]}

package/dist/components/account/sections/affiliates/reports/useAffiliatesIndicatorsChart.mjs

@@ -0,0 +1,120 @@
+"use client";
+import { useMemo } from "react";
+import { useTranslations } from "next-intl";
+import { getCSSVariable } from "../../../../../utils/browser/get-css-variable";
+import { chartCustomTooltip } from "../../../../../utils/browser/chart-custom-tooltip";
+function formatChartDate(isoDate) {
+  const [, month, day] = isoDate.split("-");
+  return `${day}/${month}`;
+}
+function createVerticalLinePlugin() {
+  return {
+    id: "verticalLine",
+    beforeDatasetsDraw(chart) {
+      if (!chart.tooltip?.opacity) return;
+      const { ctx } = chart;
+      const x = chart.tooltip.caretX;
+      ctx.save();
+      ctx.beginPath();
+      ctx.moveTo(x, chart.scales.y.top);
+      ctx.lineTo(x, chart.scales.y.bottom);
+      ctx.lineWidth = 1;
+      ctx.strokeStyle = getCSSVariable("--color-zinc-600", "#52525b");
+      ctx.setLineDash([]);
+      ctx.stroke();
+      ctx.restore();
+    }
+  };
+}
+function useAffiliatesIndicatorsChart(report) {
+  const translate = useTranslations();
+  return useMemo(() => {
+    const colors = {
+      clicks: getCSSVariable("--color-cyan-300", "#67e8f9"),
+      leads: getCSSVariable("--color-green-500", "#22c55e"),
+      customers: getCSSVariable("--color-zinc-300", "#d4d4d8")
+    };
+    const baseDataset = {
+      tension: 0.18,
+      pointRadius: 0,
+      pointHoverRadius: 3,
+      pointBorderWidth: 2,
+      pointHoverBorderWidth: 2,
+      pointHoverBackgroundColor: getCSSVariable("--color-white", "#ffffff"),
+      pointHoverBorderColor: getCSSVariable("--color-zinc-600", "#52525b")
+    };
+    const colored = (color) => ({
+      borderColor: color,
+      backgroundColor: color,
+      pointBackgroundColor: color,
+      pointBorderColor: color
+    });
+    const graphicData = report?.graphicData ?? [];
+    const maxValue = graphicData.length ? Math.max(...graphicData.flatMap((item) => [item.views, item.leads, item.customers ?? 0])) : 0;
+    const yMax = maxValue > 0 ? Math.ceil(maxValue * 1.2) : 2;
+    const legend = [
+      { label: translate("common.account.workspace.affiliates.chart.clicks"), color: colors.clicks, dataKey: "views" },
+      { label: translate("common.account.workspace.affiliates.chart.leads"), color: colors.leads, dataKey: "leads" },
+      {
+        label: translate("common.account.workspace.affiliates.chart.customers"),
+        color: colors.customers,
+        dataKey: "customers"
+      }
+    ];
+    const data = {
+      labels: graphicData.map((item) => formatChartDate(item.date)),
+      datasets: [
+        {
+          label: legend[0].label,
+          data: graphicData.map((item) => item.views),
+          ...baseDataset,
+          ...colored(colors.clicks)
+        },
+        {
+          label: legend[1].label,
+          data: graphicData.map((item) => item.leads),
+          ...baseDataset,
+          ...colored(colors.leads)
+        },
+        {
+          label: legend[2].label,
+          data: graphicData.map((item) => item.customers ?? 0),
+          ...baseDataset,
+          ...colored(colors.customers),
+          borderDash: [8, 8]
+        }
+      ]
+    };
+    const options = {
+      responsive: true,
+      maintainAspectRatio: false,
+      animation: false,
+      interaction: { mode: "index", intersect: false },
+      plugins: {
+        legend: { display: false },
+        tooltip: {
+          mode: "index",
+          enabled: false,
+          intersect: false,
+          axis: "x",
+          external: chartCustomTooltip()
+        }
+      },
+      scales: {
+        x: { grid: { display: false }, border: { display: false } },
+        y: {
+          beginAtZero: true,
+          min: 0,
+          max: yMax,
+          border: { display: false },
+          ticks: { stepSize: yMax <= 5 ? 1 : void 0 }
+        }
+      }
+    };
+    return { data, options, plugins: [createVerticalLinePlugin()], legend };
+  }, [report, translate]);
+}
+export {
+  useAffiliatesIndicatorsChart
+};
+//# sourceMappingURL=useAffiliatesIndicatorsChart.mjs.map

package/dist/components/account/sections/affiliates/reports/useAffiliatesIndicatorsChart.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/account/sections/affiliates/reports/useAffiliatesIndicatorsChart.ts"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\nimport { useTranslations } from 'next-intl';\nimport type { Chart, ChartData, ChartOptions, Plugin } from 'chart.js';\nimport { getCSSVariable } from '../../../../../utils/browser/get-css-variable';\nimport { chartCustomTooltip } from '../../../../../utils/browser/chart-custom-tooltip';\nimport type { ReportAnalyticsData } from '../../../../../modules/affiliates/types/affiliate.type';\n\nexport type ChartLegendItem = {\n  label: string;\n  color: string;\n  dataKey: string;\n};\n\nexport type AffiliatesIndicatorsChartConfig = {\n  data: ChartData<'line'>;\n  options: ChartOptions<'line'>;\n  plugins: Plugin<'line'>[];\n  legend: ChartLegendItem[];\n};\n\nfunction formatChartDate(isoDate: string): string {\n  const [, month, day] = isoDate.split('-');\n  return `${day}/${month}`;\n}\n\nfunction createVerticalLinePlugin(): Plugin<'line'> {\n  return {\n    id: 'verticalLine',\n    beforeDatasetsDraw(chart: Chart<'line'>) {\n      if (!chart.tooltip?.opacity) return;\n      const { ctx } = chart;\n      const x = chart.tooltip.caretX;\n      ctx.save();\n      ctx.beginPath();\n      ctx.moveTo(x, chart.scales.y.top);\n      ctx.lineTo(x, chart.scales.y.bottom);\n      ctx.lineWidth = 1;\n      ctx.strokeStyle = getCSSVariable('--color-zinc-600', '#52525b');\n      ctx.setLineDash([]);\n      ctx.stroke();\n      ctx.restore();\n    },\n  };\n}\n\n/** Dados, opções e legenda do gráfico de indicadores de afiliados (cliques, leads e clientes por dia). */\nexport function useAffiliatesIndicatorsChart(report?: ReportAnalyticsData | null): AffiliatesIndicatorsChartConfig {\n  const translate = useTranslations();\n\n  return useMemo(() => {\n    const colors = {\n      clicks: getCSSVariable('--color-cyan-300', '#67e8f9'),\n      leads: getCSSVariable('--color-green-500', '#22c55e'),\n      customers: getCSSVariable('--color-zinc-300', '#d4d4d8'),\n    };\n\n    const baseDataset = {\n      tension: 0.18,\n      pointRadius: 0,\n      pointHoverRadius: 3,\n      pointBorderWidth: 2,\n      pointHoverBorderWidth: 2,\n      pointHoverBackgroundColor: getCSSVariable('--color-white', '#ffffff'),\n      pointHoverBorderColor: getCSSVariable('--color-zinc-600', '#52525b'),\n    };\n\n    const colored = (color: string) => ({\n      borderColor: color,\n      backgroundColor: color,\n      pointBackgroundColor: color,\n      pointBorderColor: color,\n    });\n\n    const graphicData = report?.graphicData ?? [];\n    const maxValue = graphicData.length\n      ? Math.max(...graphicData.flatMap((item) => [item.views, item.leads, item.customers ?? 0]))\n      : 0;\n    const yMax = maxValue > 0 ? Math.ceil(maxValue * 1.2) : 2;\n\n    const legend: ChartLegendItem[] = [\n      { label: translate('common.account.workspace.affiliates.chart.clicks'), color: colors.clicks, dataKey: 'views' },\n      { label: translate('common.account.workspace.affiliates.chart.leads'), color: colors.leads, dataKey: 'leads' },\n      {\n        label: translate('common.account.workspace.affiliates.chart.customers'),\n        color: colors.customers,\n        dataKey: 'customers',\n      },\n    ];\n\n    const data: ChartData<'line'> = {\n      labels: graphicData.map((item) => formatChartDate(item.date)),\n      datasets: [\n        {\n          label: legend[0].label,\n          data: graphicData.map((item) => item.views),\n          ...baseDataset,\n          ...colored(colors.clicks),\n        },\n        {\n          label: legend[1].label,\n          data: graphicData.map((item) => item.leads),\n          ...baseDataset,\n          ...colored(colors.leads),\n        },\n        {\n          label: legend[2].label,\n          data: graphicData.map((item) => item.customers ?? 0),\n          ...baseDataset,\n          ...colored(colors.customers),\n          borderDash: [8, 8],\n        },\n      ],\n    };\n\n    const options: ChartOptions<'line'> = {\n      responsive: true,\n      maintainAspectRatio: false,\n      animation: false,\n      interaction: { mode: 'index', intersect: false },\n      plugins: {\n        legend: { display: false },\n        tooltip: {\n          mode: 'index',\n          enabled: false,\n          intersect: false,\n          axis: 'x',\n          external: chartCustomTooltip() as unknown as NonNullable<\n            NonNullable<ChartOptions<'line'>['plugins']>['tooltip']\n          >['external'],\n        },\n      },\n      scales: {\n        x: { grid: { display: false }, border: { display: false } },\n        y: {\n          beginAtZero: true,\n          min: 0,\n          max: yMax,\n          border: { display: false },\n          ticks: { stepSize: yMax <= 5 ? 1 : undefined },\n        },\n      },\n    };\n\n    return { data, options, plugins: [createVerticalLinePlugin()], legend };\n  }, [report, translate]);\n}\n"],"mappings":";AAEA,SAAS,eAAe;AACxB,SAAS,uBAAuB;AAEhC,SAAS,sBAAsB;AAC/B,SAAS,0BAA0B;AAgBnC,SAAS,gBAAgB,SAAyB;AAChD,QAAM,CAAC,EAAE,OAAO,GAAG,IAAI,QAAQ,MAAM,GAAG;AACxC,SAAO,GAAG,GAAG,IAAI,KAAK;AACxB;AAEA,SAAS,2BAA2C;AAClD,SAAO;AAAA,IACL,IAAI;AAAA,IACJ,mBAAmB,OAAsB;AACvC,UAAI,CAAC,MAAM,SAAS,QAAS;AAC7B,YAAM,EAAE,IAAI,IAAI;AAChB,YAAM,IAAI,MAAM,QAAQ;AACxB,UAAI,KAAK;AACT,UAAI,UAAU;AACd,UAAI,OAAO,GAAG,MAAM,OAAO,EAAE,GAAG;AAChC,UAAI,OAAO,GAAG,MAAM,OAAO,EAAE,MAAM;AACnC,UAAI,YAAY;AAChB,UAAI,cAAc,eAAe,oBAAoB,SAAS;AAC9D,UAAI,YAAY,CAAC,CAAC;AAClB,UAAI,OAAO;AACX,UAAI,QAAQ;AAAA,IACd;AAAA,EACF;AACF;AAGO,SAAS,6BAA6B,QAAsE;AACjH,QAAM,YAAY,gBAAgB;AAElC,SAAO,QAAQ,MAAM;AACnB,UAAM,SAAS;AAAA,MACb,QAAQ,eAAe,oBAAoB,SAAS;AAAA,MACpD,OAAO,eAAe,qBAAqB,SAAS;AAAA,MACpD,WAAW,eAAe,oBAAoB,SAAS;AAAA,IACzD;AAEA,UAAM,cAAc;AAAA,MAClB,SAAS;AAAA,MACT,aAAa;AAAA,MACb,kBAAkB;AAAA,MAClB,kBAAkB;AAAA,MAClB,uBAAuB;AAAA,MACvB,2BAA2B,eAAe,iBAAiB,SAAS;AAAA,MACpE,uBAAuB,eAAe,oBAAoB,SAAS;AAAA,IACrE;AAEA,UAAM,UAAU,CAAC,WAAmB;AAAA,MAClC,aAAa;AAAA,MACb,iBAAiB;AAAA,MACjB,sBAAsB;AAAA,MACtB,kBAAkB;AAAA,IACpB;AAEA,UAAM,cAAc,QAAQ,eAAe,CAAC;AAC5C,UAAM,WAAW,YAAY,SACzB,KAAK,IAAI,GAAG,YAAY,QAAQ,CAAC,SAAS,CAAC,KAAK,OAAO,KAAK,OAAO,KAAK,aAAa,CAAC,CAAC,CAAC,IACxF;AACJ,UAAM,OAAO,WAAW,IAAI,KAAK,KAAK,WAAW,GAAG,IAAI;AAExD,UAAM,SAA4B;AAAA,MAChC,EAAE,OAAO,UAAU,kDAAkD,GAAG,OAAO,OAAO,QAAQ,SAAS,QAAQ;AAAA,MAC/G,EAAE,OAAO,UAAU,iDAAiD,GAAG,OAAO,OAAO,OAAO,SAAS,QAAQ;AAAA,MAC7G;AAAA,QACE,OAAO,UAAU,qDAAqD;AAAA,QACtE,OAAO,OAAO;AAAA,QACd,SAAS;AAAA,MACX;AAAA,IACF;AAEA,UAAM,OAA0B;AAAA,MAC9B,QAAQ,YAAY,IAAI,CAAC,SAAS,gBAAgB,KAAK,IAAI,CAAC;AAAA,MAC5D,UAAU;AAAA,QACR;AAAA,UACE,OAAO,OAAO,CAAC,EAAE;AAAA,UACjB,MAAM,YAAY,IAAI,CAAC,SAAS,KAAK,KAAK;AAAA,UAC1C,GAAG;AAAA,UACH,GAAG,QAAQ,OAAO,MAAM;AAAA,QAC1B;AAAA,QACA;AAAA,UACE,OAAO,OAAO,CAAC,EAAE;AAAA,UACjB,MAAM,YAAY,IAAI,CAAC,SAAS,KAAK,KAAK;AAAA,UAC1C,GAAG;AAAA,UACH,GAAG,QAAQ,OAAO,KAAK;AAAA,QACzB;AAAA,QACA;AAAA,UACE,OAAO,OAAO,CAAC,EAAE;AAAA,UACjB,MAAM,YAAY,IAAI,CAAC,SAAS,KAAK,aAAa,CAAC;AAAA,UACnD,GAAG;AAAA,UACH,GAAG,QAAQ,OAAO,SAAS;AAAA,UAC3B,YAAY,CAAC,GAAG,CAAC;AAAA,QACnB;AAAA,MACF;AAAA,IACF;AAEA,UAAM,UAAgC;AAAA,MACpC,YAAY;AAAA,MACZ,qBAAqB;AAAA,MACrB,WAAW;AAAA,MACX,aAAa,EAAE,MAAM,SAAS,WAAW,MAAM;AAAA,MAC/C,SAAS;AAAA,QACP,QAAQ,EAAE,SAAS,MAAM;AAAA,QACzB,SAAS;AAAA,UACP,MAAM;AAAA,UACN,SAAS;AAAA,UACT,WAAW;AAAA,UACX,MAAM;AAAA,UACN,UAAU,mBAAmB;AAAA,QAG/B;AAAA,MACF;AAAA,MACA,QAAQ;AAAA,QACN,GAAG,EAAE,MAAM,EAAE,SAAS,MAAM,GAAG,QAAQ,EAAE,SAAS,MAAM,EAAE;AAAA,QAC1D,GAAG;AAAA,UACD,aAAa;AAAA,UACb,KAAK;AAAA,UACL,KAAK;AAAA,UACL,QAAQ,EAAE,SAAS,MAAM;AAAA,UACzB,OAAO,EAAE,UAAU,QAAQ,IAAI,IAAI,OAAU;AAAA,QAC/C;AAAA,MACF;AAAA,IACF;AAEA,WAAO,EAAE,MAAM,SAAS,SAAS,CAAC,yBAAyB,CAAC,GAAG,OAAO;AAAA,EACxE,GAAG,CAAC,QAAQ,SAAS,CAAC;AACxB;","names":[]}

package/dist/components/account/sections/projects/DeleteProjectModal.mjs

@@ -0,0 +1,205 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { IconCheck, IconSelector, IconTrash } from "@tabler/icons-react";
+import { useTranslations } from "next-intl";
+import { toast } from "sonner";
+import { Button } from "../../../ui/buttons/Button";
+import { Separator } from "../../../ui/data-display/Separator";
+import { Skeleton } from "../../../ui/feedback/Skeleton";
+import { Toast } from "../../../ui/feedback/Toast";
+import { FormField } from "../../../ui/form/FormField";
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList
+} from "../../../ui/overlay/Command";
+import { Dialog, DialogContent, DialogDescription, DialogTitle } from "../../../ui/overlay/Dialog";
+import { Popover, PopoverContent, PopoverTrigger } from "../../../ui/overlay/Popover";
+import { useDeleteConfirmation } from "../../../../modules/cards/hooks/delete-confirmation.hook";
+import { useProjects } from "../../../../modules/projects/hooks/list-projects.hook";
+import { useDeleteProject } from "../../../../modules/projects/hooks/delete-project.hook";
+import { useDebounce } from "../../../../hooks/useDebounce";
+import { cn } from "../../../../infra/utils/clsx";
+import { useProjectFlows } from "../../../../store/useProjectFlows";
+function DeleteProjectModal() {
+  const translate = useTranslations();
+  const projectToDelete = useProjectFlows((state) => state.projectToDelete);
+  const closeDeleteProject = useProjectFlows((state) => state.closeDeleteProject);
+  const deleteProject = useDeleteProject();
+  const projectId = projectToDelete?.id;
+  const projectName = projectToDelete?.title ?? "";
+  const { form, isValidConfirmation, resetConfirmation } = useDeleteConfirmation({
+    confirmWord: translate("common.account.workspace.projects.deleteModal.deleteWord")
+  });
+  const [selectedProjectId, setSelectedProjectId] = useState("");
+  const [comboboxOpen, setComboboxOpen] = useState(false);
+  const [searchQuery, setSearchQuery] = useState("");
+  const debouncedSearch = useDebounce(searchQuery, 400);
+  const {
+    data = { data: [], total: 0, page: 1 },
+    isLoading: isLoadingProjects,
+    isFetching: isFetchingProjects
+  } = useProjects({ sort: "title", search: debouncedSearch || void 0, limit: 100 });
+  const availableProjects = useMemo(
+    () => data.data.filter((project) => project.id !== projectId),
+    [data.data, projectId]
+  );
+  const hasLoadedOnce = !isLoadingProjects;
+  const isOnlyProject = hasLoadedOnce && debouncedSearch === "" && data.total <= 1;
+  const isListLoading = searchQuery !== debouncedSearch || isFetchingProjects;
+  const selectedProjectName = availableProjects.find(
+    (project) => String(project.id) === selectedProjectId
+  )?.title;
+  const resetState = () => {
+    resetConfirmation();
+    setSelectedProjectId("");
+    setComboboxOpen(false);
+    setSearchQuery("");
+  };
+  const handleClose = () => {
+    resetState();
+    closeDeleteProject();
+  };
+  const onSubmit = async () => {
+    if (isOnlyProject || !selectedProjectId || !projectId) return;
+    try {
+      await deleteProject.mutateAsync({
+        projectId,
+        moveToProjectId: Number.parseInt(selectedProjectId, 10)
+      });
+    } catch (error) {
+      toast.custom((toastId) => /* @__PURE__ */ jsx(
+        Toast,
+        {
+          variant: "error",
+          message: error instanceof Error ? error.message : translate("common.account.workspace.projects.deleteModal.deleteError"),
+          toastId
+        }
+      ));
+      return;
+    }
+    resetState();
+    closeDeleteProject();
+    toast.custom((toastId) => /* @__PURE__ */ jsx(
+      Toast,
+      {
+        variant: "success",
+        message: translate("common.account.workspace.projects.deleteModal.deleted", { projectName }),
+        toastId
+      }
+    ));
+  };
+  return /* @__PURE__ */ jsx(Dialog, { open: !!projectToDelete, onOpenChange: handleClose, children: /* @__PURE__ */ jsx(DialogContent, { className: "flex flex-col p-0 gap-0 w-[410px]", children: /* @__PURE__ */ jsxs("form", { onSubmit: form.handleSubmit(onSubmit), className: "flex flex-col", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-5 p-5", children: [
+      /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center w-fit bg-red-50 rounded-lg p-2", children: /* @__PURE__ */ jsx(IconTrash, { size: 20, className: "text-red-500" }) }),
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ jsx(DialogTitle, { className: "paragraph-medium-semibold text-zinc-950", children: translate("common.account.workspace.projects.deleteModal.title") }),
+        /* @__PURE__ */ jsx(DialogDescription, { className: "paragraph-small-regular text-zinc-600 wrap-break-word overflow-hidden", children: hasLoadedOnce && isOnlyProject ? translate.rich("common.account.workspace.projects.deleteModal.descriptionOnlyProject", {
+          projectName,
+          b: (chunks) => /* @__PURE__ */ jsx("span", { className: "font-medium text-zinc-950", children: chunks })
+        }) : translate.rich("common.account.workspace.projects.deleteModal.description", {
+          projectName,
+          b: (chunks) => /* @__PURE__ */ jsx("span", { className: "font-medium text-zinc-950", children: chunks })
+        }) })
+      ] }),
+      !isOnlyProject && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
+          /* @__PURE__ */ jsx("label", { className: "paragraph-xsmall-semibold text-zinc-600", children: translate("common.account.workspace.projects.deleteModal.moveContentTo") }),
+          /* @__PURE__ */ jsxs(Popover, { open: comboboxOpen, onOpenChange: setComboboxOpen, modal: true, children: [
+            /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+              Button,
+              {
+                variant: "secondary",
+                role: "combobox",
+                "aria-expanded": comboboxOpen,
+                disabled: form.formState.isSubmitting,
+                className: "w-full justify-between h-10 paragraph-small-medium text-zinc-950",
+                children: [
+                  selectedProjectName ?? (isLoadingProjects ? translate("common.actions.loading") : translate("common.account.workspace.projects.deleteModal.selectProject")),
+                  /* @__PURE__ */ jsx(IconSelector, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" })
+                ]
+              }
+            ) }),
+            /* @__PURE__ */ jsx(PopoverContent, { className: "w-[var(--radix-popover-trigger-width)] p-0", children: /* @__PURE__ */ jsxs(Command, { shouldFilter: false, children: [
+              /* @__PURE__ */ jsx(
+                CommandInput,
+                {
+                  placeholder: translate("common.account.workspace.projects.deleteModal.searchProject"),
+                  value: searchQuery,
+                  onValueChange: setSearchQuery
+                }
+              ),
+              /* @__PURE__ */ jsx(CommandList, { className: "overscroll-contain", onWheel: (event) => event.stopPropagation(), children: isListLoading ? /* @__PURE__ */ jsx("div", { className: "p-1 flex flex-col gap-1", children: Array.from({ length: 4 }).map((_, index) => /* @__PURE__ */ jsx(Skeleton, { className: "h-8 w-full rounded-sm" }, index)) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx(CommandEmpty, { children: translate("common.account.workspace.projects.deleteModal.noProjectFound") }),
+                /* @__PURE__ */ jsx(CommandGroup, { children: availableProjects.map((project) => /* @__PURE__ */ jsxs(
+                  CommandItem,
+                  {
+                    value: project.title,
+                    onSelect: () => {
+                      setSelectedProjectId(String(project.id));
+                      setComboboxOpen(false);
+                    },
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        IconCheck,
+                        {
+                          className: cn(
+                            "mr-2 h-4 w-4",
+                            selectedProjectId === String(project.id) ? "opacity-100" : "opacity-0"
+                          )
+                        }
+                      ),
+                      project.title
+                    ]
+                  },
+                  project.id
+                )) })
+              ] }) })
+            ] }) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx(
+          FormField,
+          {
+            label: translate("common.account.workspace.projects.deleteModal.typeDelete"),
+            required: true,
+            placeholder: translate("common.account.workspace.projects.deleteModal.deleteWord"),
+            ...form.register("confirmText")
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(Separator, {}),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 p-5", children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "submit",
+          disabled: isOnlyProject || !isValidConfirmation || !selectedProjectId || form.formState.isSubmitting,
+          className: "h-10!",
+          loading: form.formState.isSubmitting,
+          children: form.formState.isSubmitting ? translate("common.account.workspace.projects.deleteModal.deleting") : translate("common.actions.delete")
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          variant: "secondary",
+          className: "h-10!",
+          onClick: handleClose,
+          disabled: form.formState.isSubmitting,
+          children: isOnlyProject ? translate("common.actions.close") : translate("common.actions.cancel")
+        }
+      )
+    ] })
+  ] }) }) });
+}
+export {
+  DeleteProjectModal
+};
+//# sourceMappingURL=DeleteProjectModal.mjs.map

package/dist/components/account/sections/projects/DeleteProjectModal.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/account/sections/projects/DeleteProjectModal.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo, useState } from 'react';\nimport { IconCheck, IconSelector, IconTrash } from '@tabler/icons-react';\nimport { useTranslations } from 'next-intl';\nimport { toast } from 'sonner';\nimport { Button } from '../../../ui/buttons/Button';\nimport { Separator } from '../../../ui/data-display/Separator';\nimport { Skeleton } from '../../../ui/feedback/Skeleton';\nimport { Toast } from '../../../ui/feedback/Toast';\nimport { FormField } from '../../../ui/form/FormField';\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n} from '../../../ui/overlay/Command';\nimport { Dialog, DialogContent, DialogDescription, DialogTitle } from '../../../ui/overlay/Dialog';\nimport { Popover, PopoverContent, PopoverTrigger } from '../../../ui/overlay/Popover';\nimport { useDeleteConfirmation } from '../../../../modules/cards/hooks/delete-confirmation.hook';\nimport { useProjects } from '../../../../modules/projects/hooks/list-projects.hook';\nimport { useDeleteProject } from '../../../../modules/projects/hooks/delete-project.hook';\nimport { useDebounce } from '../../../../hooks/useDebounce';\nimport { cn } from '../../../../infra/utils/clsx';\nimport { useProjectFlows } from '../../../../store/useProjectFlows';\n\n/** Exclusão de projeto: escolhe para onde o conteúdo vai e confirma digitando EXCLUIR. */\nexport function DeleteProjectModal() {\n  const translate = useTranslations();\n  const projectToDelete = useProjectFlows((state) => state.projectToDelete);\n  const closeDeleteProject = useProjectFlows((state) => state.closeDeleteProject);\n  const deleteProject = useDeleteProject();\n\n  const projectId = projectToDelete?.id;\n  const projectName = projectToDelete?.title ?? '';\n\n  const { form, isValidConfirmation, resetConfirmation } = useDeleteConfirmation({\n    confirmWord: translate('common.account.workspace.projects.deleteModal.deleteWord'),\n  });\n  const [selectedProjectId, setSelectedProjectId] = useState('');\n  const [comboboxOpen, setComboboxOpen] = useState(false);\n  const [searchQuery, setSearchQuery] = useState('');\n  const debouncedSearch = useDebounce(searchQuery, 400);\n\n  const {\n    data = { data: [], total: 0, page: 1 },\n    isLoading: isLoadingProjects,\n    isFetching: isFetchingProjects,\n  } = useProjects({ sort: 'title', search: debouncedSearch || undefined, limit: 100 });\n\n  const availableProjects = useMemo(\n    () => data.data.filter((project) => project.id !== projectId),\n    [data.data, projectId]\n  );\n\n  // Só consideramos \"único projeto\" depois da primeira carga (sem busca), pra não piscar a UI.\n  const hasLoadedOnce = !isLoadingProjects;\n  const isOnlyProject = hasLoadedOnce && debouncedSearch === '' && data.total <= 1;\n\n  // Skeleton no popover enquanto o debounce está pendente ou o fetch está rolando.\n  const isListLoading = searchQuery !== debouncedSearch || isFetchingProjects;\n\n  const selectedProjectName = availableProjects.find(\n    (project) => String(project.id) === selectedProjectId\n  )?.title;\n\n  const resetState = () => {\n    resetConfirmation();\n    setSelectedProjectId('');\n    setComboboxOpen(false);\n    setSearchQuery('');\n  };\n\n  const handleClose = () => {\n    resetState();\n    closeDeleteProject();\n  };\n\n  const onSubmit = async () => {\n    if (isOnlyProject || !selectedProjectId || !projectId) return;\n\n    try {\n      await deleteProject.mutateAsync({\n        projectId,\n        moveToProjectId: Number.parseInt(selectedProjectId, 10),\n      });\n    } catch (error) {\n      toast.custom((toastId) => (\n        <Toast\n          variant=\"error\"\n          message={\n            error instanceof Error\n              ? error.message\n              : translate('common.account.workspace.projects.deleteModal.deleteError')\n          }\n          toastId={toastId}\n        />\n      ));\n      return;\n    }\n\n    resetState();\n    closeDeleteProject();\n\n    toast.custom((toastId) => (\n      <Toast\n        variant=\"success\"\n        message={translate('common.account.workspace.projects.deleteModal.deleted', { projectName })}\n        toastId={toastId}\n      />\n    ));\n  };\n\n  return (\n    <Dialog open={!!projectToDelete} onOpenChange={handleClose}>\n      <DialogContent className=\"flex flex-col p-0 gap-0 w-[410px]\">\n        <form onSubmit={form.handleSubmit(onSubmit)} className=\"flex flex-col\">\n          <div className=\"flex flex-col gap-5 p-5\">\n            <div className=\"flex items-center justify-center w-fit bg-red-50 rounded-lg p-2\">\n              <IconTrash size={20} className=\"text-red-500\" />\n            </div>\n            <div className=\"flex flex-col gap-2\">\n              <DialogTitle className=\"paragraph-medium-semibold text-zinc-950\">\n                {translate('common.account.workspace.projects.deleteModal.title')}\n              </DialogTitle>\n              <DialogDescription className=\"paragraph-small-regular text-zinc-600 wrap-break-word overflow-hidden\">\n                {hasLoadedOnce && isOnlyProject\n                  ? translate.rich('common.account.workspace.projects.deleteModal.descriptionOnlyProject', {\n                      projectName,\n                      b: (chunks) => <span className=\"font-medium text-zinc-950\">{chunks}</span>,\n                    })\n                  : translate.rich('common.account.workspace.projects.deleteModal.description', {\n                      projectName,\n                      b: (chunks) => <span className=\"font-medium text-zinc-950\">{chunks}</span>,\n                    })}\n              </DialogDescription>\n            </div>\n\n            {!isOnlyProject && (\n              <>\n                <div className=\"flex flex-col gap-1.5\">\n                  <label className=\"paragraph-xsmall-semibold text-zinc-600\">\n                    {translate('common.account.workspace.projects.deleteModal.moveContentTo')}\n                  </label>\n                  <Popover open={comboboxOpen} onOpenChange={setComboboxOpen} modal>\n                    <PopoverTrigger asChild>\n                      <Button\n                        variant=\"secondary\"\n                        role=\"combobox\"\n                        aria-expanded={comboboxOpen}\n                        disabled={form.formState.isSubmitting}\n                        className=\"w-full justify-between h-10 paragraph-small-medium text-zinc-950\"\n                      >\n                        {selectedProjectName ??\n                          (isLoadingProjects\n                            ? translate('common.actions.loading')\n                            : translate('common.account.workspace.projects.deleteModal.selectProject'))}\n                        <IconSelector className=\"ml-2 h-4 w-4 shrink-0 opacity-50\" />\n                      </Button>\n                    </PopoverTrigger>\n                    <PopoverContent className=\"w-[var(--radix-popover-trigger-width)] p-0\">\n                      <Command shouldFilter={false}>\n                        <CommandInput\n                          placeholder={translate('common.account.workspace.projects.deleteModal.searchProject')}\n                          value={searchQuery}\n                          onValueChange={setSearchQuery}\n                        />\n                        <CommandList className=\"overscroll-contain\" onWheel={(event) => event.stopPropagation()}>\n                          {isListLoading ? (\n                            <div className=\"p-1 flex flex-col gap-1\">\n                              {Array.from({ length: 4 }).map((_, index) => (\n                                <Skeleton key={index} className=\"h-8 w-full rounded-sm\" />\n                              ))}\n                            </div>\n                          ) : (\n                            <>\n                              <CommandEmpty>\n                                {translate('common.account.workspace.projects.deleteModal.noProjectFound')}\n                              </CommandEmpty>\n                              <CommandGroup>\n                                {availableProjects.map((project) => (\n                                  <CommandItem\n                                    key={project.id}\n                                    value={project.title}\n                                    onSelect={() => {\n                                      setSelectedProjectId(String(project.id));\n                                      setComboboxOpen(false);\n                                    }}\n                                  >\n                                    <IconCheck\n                                      className={cn(\n                                        'mr-2 h-4 w-4',\n                                        selectedProjectId === String(project.id) ? 'opacity-100' : 'opacity-0'\n                                      )}\n                                    />\n                                    {project.title}\n                                  </CommandItem>\n                                ))}\n                              </CommandGroup>\n                            </>\n                          )}\n                        </CommandList>\n                      </Command>\n                    </PopoverContent>\n                  </Popover>\n                </div>\n                <FormField\n                  label={translate('common.account.workspace.projects.deleteModal.typeDelete')}\n                  required\n                  placeholder={translate('common.account.workspace.projects.deleteModal.deleteWord')}\n                  {...form.register('confirmText')}\n                />\n              </>\n            )}\n          </div>\n          <Separator />\n          <div className=\"flex items-center gap-2 p-5\">\n            <Button\n              type=\"submit\"\n              disabled={\n                isOnlyProject || !isValidConfirmation || !selectedProjectId || form.formState.isSubmitting\n              }\n              className=\"h-10!\"\n              loading={form.formState.isSubmitting}\n            >\n              {form.formState.isSubmitting\n                ? translate('common.account.workspace.projects.deleteModal.deleting')\n                : translate('common.actions.delete')}\n            </Button>\n            <Button\n              type=\"button\"\n              variant=\"secondary\"\n              className=\"h-10!\"\n              onClick={handleClose}\n              disabled={form.formState.isSubmitting}\n            >\n              {isOnlyProject ? translate('common.actions.close') : translate('common.actions.cancel')}\n            </Button>\n          </div>\n        </form>\n      </DialogContent>\n    </Dialog>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/account/sections/projects/ProjectFlows.mjs

@@ -0,0 +1,16 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { DeleteProjectModal } from "./DeleteProjectModal";
+import { ProjectSheet } from "./ProjectSheet";
+import { ProjectsDisabledModal } from "./ProjectsDisabledModal";
+function ProjectFlows() {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(ProjectSheet, {}),
+    /* @__PURE__ */ jsx(DeleteProjectModal, {}),
+    /* @__PURE__ */ jsx(ProjectsDisabledModal, {})
+  ] });
+}
+export {
+  ProjectFlows
+};
+//# sourceMappingURL=ProjectFlows.mjs.map

package/dist/components/account/sections/projects/ProjectFlows.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/account/sections/projects/ProjectFlows.tsx"],"sourcesContent":["'use client';\n\nimport { DeleteProjectModal } from './DeleteProjectModal';\nimport { ProjectSheet } from './ProjectSheet';\nimport { ProjectsDisabledModal } from './ProjectsDisabledModal';\n\n/** Fluxos da aba Projetos, abertos por cima do modal Minha conta. */\nexport function ProjectFlows() {\n  return (\n    <>\n      <ProjectSheet />\n      <DeleteProjectModal />\n      <ProjectsDisabledModal />\n    </>\n  );\n}\n"],"mappings":";AASI,mBACE,KADF;AAPJ,SAAS,0BAA0B;AACnC,SAAS,oBAAoB;AAC7B,SAAS,6BAA6B;AAG/B,SAAS,eAAe;AAC7B,SACE,iCACE;AAAA,wBAAC,gBAAa;AAAA,IACd,oBAAC,sBAAmB;AAAA,IACpB,oBAAC,yBAAsB;AAAA,KACzB;AAEJ;","names":[]}

package/dist/components/account/sections/projects/ProjectMembersStack.mjs

@@ -0,0 +1,53 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslations } from "next-intl";
+import { Skeleton } from "../../../ui/feedback/Skeleton";
+import { Tooltip, TooltipContent, TooltipTrigger } from "../../../ui/overlay/Tooltip";
+import { useListProjectUsers } from "../../../../modules/projects/hooks/list-project-users.hook";
+import { cn } from "../../../../infra/utils/clsx";
+import { EntityAvatar } from "../shared/EntityAvatar";
+const VISIBLE_MEMBERS = 3;
+function ProjectMembersStack({ projectId, totalUsers, onSeeMore, className }) {
+  const translate = useTranslations();
+  const { data, isPending } = useListProjectUsers(projectId);
+  const firstPage = data?.pages[0];
+  const members = firstPage?.data.slice(0, VISIBLE_MEMBERS) ?? [];
+  const remainingCount = (firstPage?.total ?? totalUsers) - members.length;
+  if (isPending) {
+    return /* @__PURE__ */ jsx("div", { className: cn("flex items-center", className), children: Array.from({ length: Math.min(VISIBLE_MEMBERS, Math.max(totalUsers, 1)) }).map((_, index) => /* @__PURE__ */ jsx(Skeleton, { className: cn("size-8 rounded-full ring-2 ring-white", index > 0 && "-ml-2") }, index)) });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex items-center", className), children: [
+    members.map((member, index) => {
+      const name = member.name || translate("common.account.workspace.projects.userAlt");
+      return /* @__PURE__ */ jsxs(Tooltip, { children: [
+        /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: cn("rounded-full ring-2 ring-white cursor-default", index > 0 && "-ml-2"), children: /* @__PURE__ */ jsx(EntityAvatar, { name: member.name, photo: member.photo, tone: "brand" }) }) }),
+        /* @__PURE__ */ jsx(TooltipContent, { children: name })
+      ] }, member.id_user);
+    }),
+    remainingCount > 0 && /* @__PURE__ */ jsxs(Tooltip, { children: [
+      /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: cn(
+            "size-8 rounded-full bg-zinc-950 ring-2 ring-white flex items-center justify-center shrink-0 cursor-pointer hover:bg-zinc-800 transition-colors",
+            members.length > 0 && "-ml-2"
+          ),
+          onClick: (event) => {
+            event.stopPropagation();
+            onSeeMore();
+          },
+          children: /* @__PURE__ */ jsxs("span", { className: "text-white paragraph-xsmall-semibold", children: [
+            "+",
+            remainingCount
+          ] })
+        }
+      ) }),
+      /* @__PURE__ */ jsx(TooltipContent, { children: translate("common.account.workspace.projects.seeMoreUsers") })
+    ] })
+  ] });
+}
+export {
+  ProjectMembersStack
+};
+//# sourceMappingURL=ProjectMembersStack.mjs.map

package/dist/components/account/sections/projects/ProjectMembersStack.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/account/sections/projects/ProjectMembersStack.tsx"],"sourcesContent":["'use client';\n\nimport { useTranslations } from 'next-intl';\nimport { Skeleton } from '../../../ui/feedback/Skeleton';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '../../../ui/overlay/Tooltip';\nimport { useListProjectUsers } from '../../../../modules/projects/hooks/list-project-users.hook';\nimport { cn } from '../../../../infra/utils/clsx';\nimport { EntityAvatar } from '../shared/EntityAvatar';\n\nconst VISIBLE_MEMBERS = 3;\n\ntype ProjectMembersStackProps = {\n  projectId: number;\n  totalUsers: number;\n  onSeeMore: () => void;\n  className?: string;\n};\n\nexport function ProjectMembersStack({ projectId, totalUsers, onSeeMore, className }: ProjectMembersStackProps) {\n  const translate = useTranslations();\n  const { data, isPending } = useListProjectUsers(projectId);\n\n  const firstPage = data?.pages[0];\n  const members = firstPage?.data.slice(0, VISIBLE_MEMBERS) ?? [];\n  const remainingCount = (firstPage?.total ?? totalUsers) - members.length;\n\n  if (isPending) {\n    return (\n      <div className={cn('flex items-center', className)}>\n        {Array.from({ length: Math.min(VISIBLE_MEMBERS, Math.max(totalUsers, 1)) }).map((_, index) => (\n          <Skeleton key={index} className={cn('size-8 rounded-full ring-2 ring-white', index > 0 && '-ml-2')} />\n        ))}\n      </div>\n    );\n  }\n\n  return (\n    <div className={cn('flex items-center', className)}>\n      {members.map((member, index) => {\n        const name = member.name || translate('common.account.workspace.projects.userAlt');\n\n        return (\n          <Tooltip key={member.id_user}>\n            <TooltipTrigger asChild>\n              <span className={cn('rounded-full ring-2 ring-white cursor-default', index > 0 && '-ml-2')}>\n                <EntityAvatar name={member.name} photo={member.photo} tone=\"brand\" />\n              </span>\n            </TooltipTrigger>\n            <TooltipContent>{name}</TooltipContent>\n          </Tooltip>\n        );\n      })}\n      {remainingCount > 0 && (\n        <Tooltip>\n          <TooltipTrigger asChild>\n            <button\n              type=\"button\"\n              className={cn(\n                'size-8 rounded-full bg-zinc-950 ring-2 ring-white flex items-center justify-center shrink-0 cursor-pointer hover:bg-zinc-800 transition-colors',\n                members.length > 0 && '-ml-2'\n              )}\n              onClick={(event) => {\n                event.stopPropagation();\n                onSeeMore();\n              }}\n            >\n              <span className=\"text-white paragraph-xsmall-semibold\">+{remainingCount}</span>\n            </button>\n          </TooltipTrigger>\n          <TooltipContent>{translate('common.account.workspace.projects.seeMoreUsers')}</TooltipContent>\n        </Tooltip>\n      )}\n    </div>\n  );\n}\n"],"mappings":";AA8BU,cAYA,YAZA;AA5BV,SAAS,uBAAuB;AAChC,SAAS,gBAAgB;AACzB,SAAS,SAAS,gBAAgB,sBAAsB;AACxD,SAAS,2BAA2B;AACpC,SAAS,UAAU;AACnB,SAAS,oBAAoB;AAE7B,MAAM,kBAAkB;AASjB,SAAS,oBAAoB,EAAE,WAAW,YAAY,WAAW,UAAU,GAA6B;AAC7G,QAAM,YAAY,gBAAgB;AAClC,QAAM,EAAE,MAAM,UAAU,IAAI,oBAAoB,SAAS;AAEzD,QAAM,YAAY,MAAM,MAAM,CAAC;AAC/B,QAAM,UAAU,WAAW,KAAK,MAAM,GAAG,eAAe,KAAK,CAAC;AAC9D,QAAM,kBAAkB,WAAW,SAAS,cAAc,QAAQ;AAElE,MAAI,WAAW;AACb,WACE,oBAAC,SAAI,WAAW,GAAG,qBAAqB,SAAS,GAC9C,gBAAM,KAAK,EAAE,QAAQ,KAAK,IAAI,iBAAiB,KAAK,IAAI,YAAY,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,UAClF,oBAAC,YAAqB,WAAW,GAAG,yCAAyC,QAAQ,KAAK,OAAO,KAAlF,KAAqF,CACrG,GACH;AAAA,EAEJ;AAEA,SACE,qBAAC,SAAI,WAAW,GAAG,qBAAqB,SAAS,GAC9C;AAAA,YAAQ,IAAI,CAAC,QAAQ,UAAU;AAC9B,YAAM,OAAO,OAAO,QAAQ,UAAU,2CAA2C;AAEjF,aACE,qBAAC,WACC;AAAA,4BAAC,kBAAe,SAAO,MACrB,8BAAC,UAAK,WAAW,GAAG,iDAAiD,QAAQ,KAAK,OAAO,GACvF,8BAAC,gBAAa,MAAM,OAAO,MAAM,OAAO,OAAO,OAAO,MAAK,SAAQ,GACrE,GACF;AAAA,QACA,oBAAC,kBAAgB,gBAAK;AAAA,WANV,OAAO,OAOrB;AAAA,IAEJ,CAAC;AAAA,IACA,iBAAiB,KAChB,qBAAC,WACC;AAAA,0BAAC,kBAAe,SAAO,MACrB;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAW;AAAA,YACT;AAAA,YACA,QAAQ,SAAS,KAAK;AAAA,UACxB;AAAA,UACA,SAAS,CAAC,UAAU;AAClB,kBAAM,gBAAgB;AACtB,sBAAU;AAAA,UACZ;AAAA,UAEA,+BAAC,UAAK,WAAU,wCAAuC;AAAA;AAAA,YAAE;AAAA,aAAe;AAAA;AAAA,MAC1E,GACF;AAAA,MACA,oBAAC,kBAAgB,oBAAU,gDAAgD,GAAE;AAAA,OAC/E;AAAA,KAEJ;AAEJ;","names":[]}

package/dist/components/account/sections/projects/ProjectRow.mjs

@@ -0,0 +1,85 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { IconTrash } from "@tabler/icons-react";
+import { useTranslations } from "next-intl";
+import { Button } from "../../../ui/buttons/Button";
+import { EntityAvatar } from "../shared/EntityAvatar";
+import { RowActionsMenu } from "../shared/RowActionsMenu";
+import { ProjectMembersStack } from "./ProjectMembersStack";
+function useProjectRow({ project, canManage, onOpen, onDelete }) {
+  const translate = useTranslations();
+  const menuItems = canManage ? [
+    {
+      icon: /* @__PURE__ */ jsx(IconTrash, { size: 20, className: "text-zinc-400" }),
+      label: translate("common.account.workspace.projects.delete"),
+      onClick: () => onDelete(project)
+    }
+  ] : [];
+  const handleOpen = () => onOpen(project);
+  const detailsButton = /* @__PURE__ */ jsx(
+    Button,
+    {
+      variant: "secondary",
+      className: "h-10! shrink-0",
+      onClick: (event) => {
+        event.stopPropagation();
+        handleOpen();
+      },
+      children: translate("common.account.workspace.projects.details")
+    }
+  );
+  return { menuItems, handleOpen, detailsButton };
+}
+function ProjectRow(props) {
+  const { project } = props;
+  const { menuItems, handleOpen, detailsButton } = useProjectRow(props);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "flex items-center gap-4 px-5 py-4 cursor-pointer hover:bg-zinc-50 transition-colors",
+      onClick: handleOpen,
+      children: [
+        /* @__PURE__ */ jsx(EntityAvatar, { name: project.title, photo: project.photo }),
+        /* @__PURE__ */ jsx("span", { className: "flex-1 min-w-0 truncate paragraph-small-semibold text-zinc-600", title: project.title, children: project.title }),
+        /* @__PURE__ */ jsx(
+          ProjectMembersStack,
+          {
+            projectId: project.id,
+            totalUsers: project.total_users,
+            onSeeMore: handleOpen,
+            className: "w-32 justify-end shrink-0"
+          }
+        ),
+        detailsButton,
+        /* @__PURE__ */ jsx("div", { className: "w-10 shrink-0", children: /* @__PURE__ */ jsx(RowActionsMenu, { items: menuItems, width: 140 }) })
+      ]
+    }
+  );
+}
+function ProjectCard(props) {
+  const { project } = props;
+  const { menuItems, handleOpen, detailsButton } = useProjectRow(props);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "flex flex-col gap-4 rounded-lg border border-zinc-200 bg-white px-3 py-4 cursor-pointer",
+      onClick: handleOpen,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 min-w-0", children: [
+          /* @__PURE__ */ jsx(EntityAvatar, { name: project.title, photo: project.photo }),
+          /* @__PURE__ */ jsx("span", { className: "flex-1 min-w-0 truncate paragraph-small-semibold text-zinc-600", children: project.title }),
+          /* @__PURE__ */ jsx(RowActionsMenu, { items: menuItems, width: 140 })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+          /* @__PURE__ */ jsx(ProjectMembersStack, { projectId: project.id, totalUsers: project.total_users, onSeeMore: handleOpen }),
+          detailsButton
+        ] })
+      ]
+    }
+  );
+}
+export {
+  ProjectCard,
+  ProjectRow
+};
+//# sourceMappingURL=ProjectRow.mjs.map