@open-mercato/core 0.6.4-develop.4217.1.c9aa050183 → 0.6.4-develop.4236.1.9fa6806b34

package/dist/modules/staff/backend/staff/timesheets/projects/create/page.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../../src/modules/staff/backend/staff/timesheets/projects/create/page.tsx"],
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { useRouter } from 'next/navigation'\nimport { Page, PageBody } from '@open-mercato/ui/backend/Page'\nimport { CrudForm } from '@open-mercato/ui/backend/CrudForm'\nimport { createCrud } from '@open-mercato/ui/backend/utils/crud'\nimport { apiCall } from '@open-mercato/ui/backend/utils/apiCall'\nimport { createCrudFormError } from '@open-mercato/ui/backend/utils/serverErrors'\nimport { E } from '#generated/entities.ids.generated'\nimport { flash } from '@open-mercato/ui/backend/FlashMessages'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport {\n  buildProjectPayload,\n  createProjectFormFields,\n  createProjectFormGroups,\n  createProjectFormSchema,\n  type ProjectFormValues,\n} from '../projectFormConfig'\n\nconst BACK_HREF = '/backend/staff/timesheets/projects'\n\nexport default function TimesheetProjectCreatePage() {\n  const t = useT()\n  const router = useRouter()\n\n  const formSchema = React.useMemo(() => createProjectFormSchema(), [])\n  const fields = React.useMemo(() => createProjectFormFields(t), [t])\n  const groups = React.useMemo(() => createProjectFormGroups(t), [t])\n\n  return (\n    <Page>\n      <PageBody>\n        <CrudForm<ProjectFormValues>\n          title={t('staff.timesheets.projects.form.createTitle', 'Create project')}\n          backHref={BACK_HREF}\n          cancelHref={BACK_HREF}\n          fields={fields}\n          groups={groups}\n          schema={formSchema}\n          initialValues={{}}\n          entityIds={[E.staff.staff_time_project]}\n          submitLabel={t('staff.timesheets.projects.form.actions.create', 'Create')}\n          onSubmit={async (values) => {\n            if (!values.name?.trim() || !values.code?.trim()) {\n              const fieldErrors: Record<string, string> = {}\n              if (!values.name?.trim()) fieldErrors.name = 'Required'\n              if (!values.code?.trim()) fieldErrors.code = 'Required'\n              throw createCrudFormError(\n                t('staff.timesheets.projects.errors.required', 'Name and code are required.'),\n                fieldErrors,\n              )\n            }\n\n            const payload = buildProjectPayload(values)\n\n            const { result: created } = await createCrud<{ id?: string }>(\n              'staff/timesheets/time-projects',\n              payload,\n              { errorMessage: t('staff.timesheets.projects.errors.save', 'Failed to save project.') },\n            )\n\n            const newId = created?.id\n\n            // Auto-assign creator to the project\n            if (newId) {\n              try {\n                const selfRes = await apiCall<{ member?: { id?: string } | null }>('/api/staff/team-members/self')\n                const staffMemberId = selfRes.result?.member?.id\n                if (staffMemberId) {\n                  await createCrud('staff/timesheets/time-projects/' + newId + '/employees', {\n                    staffMemberId,\n                    assignedStartDate: new Date().toISOString().slice(0, 10),\n                    status: 'active',\n                  }, { errorMessage: '' })\n                }\n              } catch {\n                // non-critical \u2014 project created, self-assignment is best-effort\n              }\n            }\n\n            flash(t('staff.timesheets.projects.messages.saved', 'Project saved.'), 'success')\n            if (newId) router.push(`/backend/staff/timesheets/projects/${newId}`)\n            else router.push(BACK_HREF)\n          }}\n        />\n      </PageBody>\n    </Page>\n  )\n}\n"],
+  "mappings": ";AAiCQ;AA/BR,YAAY,WAAW;AACvB,SAAS,iBAAiB;AAC1B,SAAS,MAAM,gBAAgB;AAC/B,SAAS,gBAAgB;AACzB,SAAS,kBAAkB;AAC3B,SAAS,eAAe;AACxB,SAAS,2BAA2B;AACpC,SAAS,SAAS;AAClB,SAAS,aAAa;AACtB,SAAS,YAAY;AACrB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AAEP,MAAM,YAAY;AAEH,SAAR,6BAA8C;AACnD,QAAM,IAAI,KAAK;AACf,QAAM,SAAS,UAAU;AAEzB,QAAM,aAAa,MAAM,QAAQ,MAAM,wBAAwB,GAAG,CAAC,CAAC;AACpE,QAAM,SAAS,MAAM,QAAQ,MAAM,wBAAwB,CAAC,GAAG,CAAC,CAAC,CAAC;AAClE,QAAM,SAAS,MAAM,QAAQ,MAAM,wBAAwB,CAAC,GAAG,CAAC,CAAC,CAAC;AAElE,SACE,oBAAC,QACC,8BAAC,YACC;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,EAAE,8CAA8C,gBAAgB;AAAA,MACvE,UAAU;AAAA,MACV,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,MACR,eAAe,CAAC;AAAA,MAChB,WAAW,CAAC,EAAE,MAAM,kBAAkB;AAAA,MACtC,aAAa,EAAE,iDAAiD,QAAQ;AAAA,MACxE,UAAU,OAAO,WAAW;AAC1B,YAAI,CAAC,OAAO,MAAM,KAAK,KAAK,CAAC,OAAO,MAAM,KAAK,GAAG;AAChD,gBAAM,cAAsC,CAAC;AAC7C,cAAI,CAAC,OAAO,MAAM,KAAK,EAAG,aAAY,OAAO;AAC7C,cAAI,CAAC,OAAO,MAAM,KAAK,EAAG,aAAY,OAAO;AAC7C,gBAAM;AAAA,YACJ,EAAE,6CAA6C,6BAA6B;AAAA,YAC5E;AAAA,UACF;AAAA,QACF;AAEA,cAAM,UAAU,oBAAoB,MAAM;AAE1C,cAAM,EAAE,QAAQ,QAAQ,IAAI,MAAM;AAAA,UAChC;AAAA,UACA;AAAA,UACA,EAAE,cAAc,EAAE,yCAAyC,yBAAyB,EAAE;AAAA,QACxF;AAEA,cAAM,QAAQ,SAAS;AAGvB,YAAI,OAAO;AACT,cAAI;AACF,kBAAM,UAAU,MAAM,QAA6C,8BAA8B;AACjG,kBAAM,gBAAgB,QAAQ,QAAQ,QAAQ;AAC9C,gBAAI,eAAe;AACjB,oBAAM,WAAW,oCAAoC,QAAQ,cAAc;AAAA,gBACzE;AAAA,gBACA,oBAAmB,oBAAI,KAAK,GAAE,YAAY,EAAE,MAAM,GAAG,EAAE;AAAA,gBACvD,QAAQ;AAAA,cACV,GAAG,EAAE,cAAc,GAAG,CAAC;AAAA,YACzB;AAAA,UACF,QAAQ;AAAA,UAER;AAAA,QACF;AAEA,cAAM,EAAE,4CAA4C,gBAAgB,GAAG,SAAS;AAChF,YAAI,MAAO,QAAO,KAAK,sCAAsC,KAAK,EAAE;AAAA,YAC/D,QAAO,KAAK,SAAS;AAAA,MAC5B;AAAA;AAAA,EACF,GACF,GACF;AAEJ;",
+  "names": []
+}

package/dist/modules/staff/backend/staff/timesheets/projects/create/page.meta.js

@@ -0,0 +1,16 @@
+const metadata = {
+  requireAuth: true,
+  requireFeatures: ["staff.timesheets.projects.manage"],
+  navHidden: true,
+  pageTitle: "Create Project",
+  pageTitleKey: "staff.timesheets.nav.create_project",
+  breadcrumb: [
+    { label: "My Timesheets", labelKey: "staff.timesheets.nav.my_timesheets", href: "/backend/staff/timesheets" },
+    { label: "Projects", labelKey: "staff.timesheets.nav.projects", href: "/backend/staff/timesheets/projects" },
+    { label: "Create", labelKey: "staff.timesheets.nav.create_project" }
+  ]
+};
+export {
+  metadata
+};
+//# sourceMappingURL=page.meta.js.map

package/dist/modules/staff/backend/staff/timesheets/projects/create/page.meta.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../../src/modules/staff/backend/staff/timesheets/projects/create/page.meta.ts"],
+  "sourcesContent": ["export const metadata = {\n  requireAuth: true,\n  requireFeatures: ['staff.timesheets.projects.manage'],\n  navHidden: true,\n  pageTitle: 'Create Project',\n  pageTitleKey: 'staff.timesheets.nav.create_project',\n  breadcrumb: [\n    { label: 'My Timesheets', labelKey: 'staff.timesheets.nav.my_timesheets', href: '/backend/staff/timesheets' },\n    { label: 'Projects', labelKey: 'staff.timesheets.nav.projects', href: '/backend/staff/timesheets/projects' },\n    { label: 'Create', labelKey: 'staff.timesheets.nav.create_project' },\n  ],\n}\n"],
+  "mappings": "AAAO,MAAM,WAAW;AAAA,EACtB,aAAa;AAAA,EACb,iBAAiB,CAAC,kCAAkC;AAAA,EACpD,WAAW;AAAA,EACX,WAAW;AAAA,EACX,cAAc;AAAA,EACd,YAAY;AAAA,IACV,EAAE,OAAO,iBAAiB,UAAU,sCAAsC,MAAM,4BAA4B;AAAA,IAC5G,EAAE,OAAO,YAAY,UAAU,iCAAiC,MAAM,qCAAqC;AAAA,IAC3G,EAAE,OAAO,UAAU,UAAU,sCAAsC;AAAA,EACrE;AACF;",
+  "names": []
+}

package/dist/modules/staff/backend/staff/timesheets/projects/page.js

@@ -0,0 +1,602 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import Link from "next/link";
+import { useRouter, useSearchParams } from "next/navigation";
+import { Page, PageBody } from "@open-mercato/ui/backend/Page";
+import { DataTable, withDataTableNamespaces } from "@open-mercato/ui/backend/DataTable";
+import { RowActions } from "@open-mercato/ui/backend/RowActions";
+import { Button } from "@open-mercato/ui/primitives/button";
+import { readApiResultOrThrow } from "@open-mercato/ui/backend/utils/apiCall";
+import { deleteCrud } from "@open-mercato/ui/backend/utils/crud";
+import { flash } from "@open-mercato/ui/backend/FlashMessages";
+import { useConfirmDialog } from "@open-mercato/ui/backend/confirm-dialog";
+import { useOrganizationScopeVersion } from "@open-mercato/shared/lib/frontend/useOrganizationScope";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { formatDateTime } from "@open-mercato/shared/lib/time";
+import { ProjectColorDot } from "../../../../lib/timesheets-ui/ProjectColorDot.js";
+import { resolveProjectColorHex } from "../../../../lib/timesheets-ui/colors.js";
+import {
+  ProjectsKpiStrip
+} from "../../../../lib/timesheets-projects-ui/ProjectsKpiStrip.js";
+import { SavedViewTabs } from "../../../../lib/timesheets-projects-ui/SavedViewTabs.js";
+import { HoursSparkline } from "../../../../lib/timesheets-projects-ui/HoursSparkline.js";
+import {
+  ProjectMembersAvatarStack
+} from "../../../../lib/timesheets-projects-ui/ProjectMembersAvatarStack.js";
+import { ViewModeToggle } from "../../../../lib/timesheets-projects-ui/ViewModeToggle.js";
+import {
+  useProjectsViewMode
+} from "../../../../lib/timesheets-projects-ui/useProjectsViewMode.js";
+import {
+  ProjectCard
+} from "../../../../lib/timesheets-projects-ui/ProjectCard.js";
+const PAGE_SIZE = 50;
+const INCLUDE_FIELDS = "hoursWeek,hoursTrend,members,myRole";
+function formatRelativeTime(iso, fallback, t) {
+  if (!iso) return fallback;
+  const parsed = new Date(iso);
+  if (Number.isNaN(parsed.getTime())) return fallback;
+  const diffMs = Date.now() - parsed.getTime();
+  const minutes = Math.round(diffMs / 6e4);
+  if (minutes < 1) return t("staff.timesheets.projects.portfolio.relativeTime.justNow", "just now");
+  if (minutes < 60) return t("staff.timesheets.projects.portfolio.relativeTime.minutesAgo", "{minutes}m ago", { minutes });
+  const hours = Math.round(minutes / 60);
+  if (hours < 24) return t("staff.timesheets.projects.portfolio.relativeTime.hoursAgo", "{hours}h ago", { hours });
+  const days = Math.round(hours / 24);
+  if (days < 14) return t("staff.timesheets.projects.portfolio.relativeTime.daysAgo", "{days}d ago", { days });
+  return formatDateTime(iso) ?? fallback;
+}
+function mapApiProject(item) {
+  const id = typeof item.id === "string" ? item.id : "";
+  const name = typeof item.name === "string" ? item.name : id;
+  const code = typeof item.code === "string" && item.code.trim().length ? item.code.trim() : null;
+  const customerId = typeof item.customerId === "string" ? item.customerId : typeof item.customer_id === "string" ? item.customer_id : null;
+  const customerName = typeof item.customerName === "string" ? item.customerName : typeof item.customer_name === "string" ? item.customer_name : null;
+  const status = typeof item.status === "string" ? item.status : "active";
+  const projectType = typeof item.projectType === "string" ? item.projectType : typeof item.project_type === "string" ? item.project_type : null;
+  const color = typeof item.color === "string" ? item.color : null;
+  const startDate = typeof item.startDate === "string" ? item.startDate : typeof item.start_date === "string" ? item.start_date : null;
+  const updatedAt = typeof item.updatedAt === "string" ? item.updatedAt : typeof item.updated_at === "string" ? item.updated_at : null;
+  const enrichment = item._staff ?? {};
+  const hoursWeek = typeof enrichment.hoursWeek === "number" ? enrichment.hoursWeek : 0;
+  const hoursTrend = Array.isArray(enrichment.hoursTrend) ? enrichment.hoursTrend.filter((v) => typeof v === "number") : [];
+  const members = Array.isArray(enrichment.members) ? enrichment.members.filter((m) => !!m && typeof m === "object" && typeof m.id === "string").map((m) => ({
+    id: m.id,
+    name: m.name ?? "",
+    initials: m.initials ?? "",
+    avatarUrl: m.avatarUrl ?? null
+  })) : [];
+  const memberCount = typeof enrichment.memberCount === "number" ? enrichment.memberCount : members.length;
+  const myRole = typeof enrichment.myRole === "string" ? enrichment.myRole : null;
+  return withDataTableNamespaces(
+    {
+      id,
+      name,
+      code,
+      customerId,
+      customerName,
+      status,
+      projectType,
+      color,
+      startDate,
+      updatedAt,
+      hoursWeek,
+      hoursTrend,
+      myRole,
+      members,
+      memberCount
+    },
+    item
+  );
+}
+function TimesheetProjectsPage() {
+  const t = useT();
+  const router = useRouter();
+  const searchParams = useSearchParams();
+  const scopeVersion = useOrganizationScopeVersion();
+  const { confirm, ConfirmDialogElement } = useConfirmDialog();
+  const [rows, setRows] = React.useState([]);
+  const [page, setPage] = React.useState(1);
+  const [total, setTotal] = React.useState(0);
+  const [totalPages, setTotalPages] = React.useState(1);
+  const [sorting, setSorting] = React.useState([{ id: "updatedAt", desc: true }]);
+  const [search, setSearch] = React.useState("");
+  const [filterValues, setFilterValues] = React.useState({});
+  const [isLoading, setIsLoading] = React.useState(true);
+  const [isRefreshing, setIsRefreshing] = React.useState(false);
+  const hasLoadedOnceRef = React.useRef(false);
+  const [reloadToken, setReloadToken] = React.useState(0);
+  const [kpis, setKpis] = React.useState(null);
+  const [isLoadingKpis, setIsLoadingKpis] = React.useState(true);
+  const activeTab = searchParams.get("tab") ?? "all";
+  const urlViewMode = searchParams.get("view");
+  const [viewMode, setViewMode] = useProjectsViewMode({
+    userKey: null,
+    urlOverride: urlViewMode
+  });
+  const labels = React.useMemo(
+    () => ({
+      title: t("staff.timesheets.projects.page.title", "Projects"),
+      table: {
+        name: t("staff.timesheets.projects.table.name", "Project"),
+        status: t("staff.timesheets.projects.table.status", "Status"),
+        type: t("staff.timesheets.projects.table.type", "Type"),
+        updatedAt: t("staff.timesheets.projects.table.updatedAt", "Updated"),
+        empty: t("staff.timesheets.projects.table.empty", "No projects yet."),
+        search: t("staff.timesheets.projects.table.search", "Search projects..."),
+        team: t("staff.timesheets.projects.portfolio.team", "Team"),
+        myRole: t("staff.timesheets.projects.portfolio.myRole", "My role"),
+        hoursWeek: t("staff.timesheets.projects.portfolio.hoursWeek", "Hours / week"),
+        myHoursWeek: t("staff.timesheets.projects.portfolio.myHoursWeek", "My hours / week")
+      },
+      actions: {
+        add: t("staff.timesheets.projects.actions.add", "Add Project"),
+        addFirst: t("staff.timesheets.projects.actions.addFirst", "+ Add first project"),
+        viewDetails: t("staff.timesheets.projects.actions.viewDetails", "View Details"),
+        delete: t("staff.timesheets.projects.actions.delete", "Delete"),
+        deleteConfirm: t("staff.timesheets.projects.actions.deleteConfirm", 'Delete project "{{name}}"?'),
+        refresh: t("staff.timesheets.projects.actions.refresh", "Refresh")
+      },
+      messages: {
+        deleted: t("staff.timesheets.projects.messages.deleted", "Project deleted.")
+      },
+      errors: {
+        load: t("staff.timesheets.projects.errors.load", "Failed to load projects."),
+        delete: t("staff.timesheets.projects.errors.delete", "Failed to delete project.")
+      },
+      statuses: {
+        all: t("staff.timesheets.projects.statuses.all", "All"),
+        active: t("staff.timesheets.projects.statuses.active", "Active"),
+        on_hold: t("staff.timesheets.projects.statuses.onHold", "On Hold"),
+        completed: t("staff.timesheets.projects.statuses.completed", "Completed")
+      },
+      tabs: {
+        all: t("staff.timesheets.projects.portfolio.tabs.all", "All"),
+        active: t("staff.timesheets.projects.portfolio.tabs.active", "Active"),
+        onHold: t("staff.timesheets.projects.portfolio.tabs.onHold", "On Hold"),
+        completed: t("staff.timesheets.projects.portfolio.tabs.completed", "Completed"),
+        mine: t("staff.timesheets.projects.portfolio.tabs.mine", "Mine")
+      },
+      viewMode: {
+        table: t("staff.timesheets.projects.portfolio.viewMode.table", "Table"),
+        cards: t("staff.timesheets.projects.portfolio.viewMode.cards", "Cards")
+      },
+      kpi: {
+        totalProjects: t("staff.timesheets.projects.portfolio.kpi.totalProjects", "Total Projects"),
+        hoursWeek: t("staff.timesheets.projects.portfolio.kpi.hoursWeek", "Hours this week"),
+        hoursWeekSub: t("staff.timesheets.projects.portfolio.kpi.hoursWeekSub", "vs previous week"),
+        assignedToMe: t("staff.timesheets.projects.portfolio.kpi.assignedToMe", "Assigned to me"),
+        hoursMonth: t("staff.timesheets.projects.portfolio.kpi.hoursMonth", "Hours this month"),
+        hoursMonthSub: t("staff.timesheets.projects.portfolio.kpi.hoursMonthSub", "vs previous month"),
+        teamActive: t("staff.timesheets.projects.portfolio.kpi.teamActive", "Active team"),
+        teamActiveSub: t("staff.timesheets.projects.portfolio.kpi.teamActiveSub", "Members with entries this month"),
+        myProjects: t("staff.timesheets.projects.portfolio.kpi.myProjects", "My projects"),
+        myHoursWeek: t("staff.timesheets.projects.portfolio.kpi.myHoursWeek", "My hours this week"),
+        myHoursMonth: t("staff.timesheets.projects.portfolio.kpi.myHoursMonth", "My hours this month"),
+        deltaFlat: t("staff.timesheets.projects.portfolio.kpi.deltaFlat", "no change"),
+        noPrevious: t("staff.timesheets.projects.portfolio.kpi.noPrevious", "no previous data")
+      },
+      card: {
+        hoursPanelPm: t("staff.timesheets.projects.portfolio.card.hoursPanelPm", "Team hours \xB7 last 7w"),
+        hoursPanelCollab: t("staff.timesheets.projects.portfolio.card.hoursPanelCollab", "My hours \xB7 last 7w"),
+        sparklineAria: t("staff.timesheets.projects.portfolio.sparkline.ariaLabel", "Hours per week, last 7 weeks"),
+        role: t("staff.timesheets.projects.portfolio.card.role", "Role")
+      },
+      emptyState: {
+        noProjects: t("staff.timesheets.projects.portfolio.emptyState.noProjects", "No projects yet."),
+        noAssignments: t(
+          "staff.timesheets.projects.portfolio.emptyState.noAssignments",
+          "You aren't assigned to any projects yet. Ask a PM to add you."
+        ),
+        noMatches: t("staff.timesheets.projects.portfolio.emptyState.noMatches", "No projects match these filters.")
+      }
+    }),
+    [t]
+  );
+  const kpiLabels = React.useMemo(
+    () => ({
+      totalProjects: labels.kpi.totalProjects,
+      totalProjectsSub: ({ active, onHold }) => `${active} ${labels.statuses.active.toLowerCase()} \xB7 ${onHold} ${labels.statuses.on_hold.toLowerCase()}`,
+      hoursWeek: labels.kpi.hoursWeek,
+      hoursWeekSub: labels.kpi.hoursWeekSub,
+      assignedToMe: labels.kpi.assignedToMe,
+      assignedToMeSub: (active) => `${active} ${labels.statuses.active.toLowerCase()}`,
+      hoursMonth: labels.kpi.hoursMonth,
+      hoursMonthSub: labels.kpi.hoursMonthSub,
+      teamActive: labels.kpi.teamActive,
+      teamActiveSub: labels.kpi.teamActiveSub,
+      myProjects: labels.kpi.myProjects,
+      myProjectsSub: (active) => `${active} ${labels.statuses.active.toLowerCase()}`,
+      myHoursWeek: labels.kpi.myHoursWeek,
+      myHoursMonth: labels.kpi.myHoursMonth,
+      deltaUp: (pct) => `up ${pct}%`,
+      deltaDown: (pct) => `down ${pct}%`,
+      deltaFlat: labels.kpi.deltaFlat,
+      noPrevious: labels.kpi.noPrevious
+    }),
+    [labels]
+  );
+  const isPmRole = kpis?.role === "pm";
+  const filters = React.useMemo(
+    () => [
+      {
+        id: "status",
+        label: labels.table.status,
+        type: "select",
+        options: [
+          { value: "active", label: labels.statuses.active },
+          { value: "on_hold", label: labels.statuses.on_hold },
+          { value: "completed", label: labels.statuses.completed }
+        ]
+      }
+    ],
+    [labels.table.status, labels.statuses]
+  );
+  const tabs = React.useMemo(() => {
+    const base = [
+      { id: "all", label: labels.tabs.all },
+      { id: "active", label: labels.tabs.active }
+    ];
+    if (isPmRole) {
+      base.push({ id: "on_hold", label: labels.tabs.onHold });
+    }
+    base.push({ id: "completed", label: labels.tabs.completed });
+    if (isPmRole) {
+      base.push({ id: "mine", label: labels.tabs.mine });
+    }
+    return base;
+  }, [labels.tabs, isPmRole]);
+  const statusFromTab = (tabId) => {
+    if (tabId === "active" || tabId === "on_hold" || tabId === "completed") return tabId;
+    return null;
+  };
+  const mineFromTab = (tabId) => tabId === "mine" || !isPmRole;
+  const loadKpis = React.useCallback(async () => {
+    setIsLoadingKpis(true);
+    try {
+      const payload = await readApiResultOrThrow(
+        "/api/staff/timesheets/projects/kpis",
+        void 0,
+        {
+          errorMessage: labels.errors.load,
+          fallback: null
+        }
+      );
+      setKpis(payload);
+    } catch {
+      setKpis(null);
+    } finally {
+      setIsLoadingKpis(false);
+    }
+  }, [labels.errors.load]);
+  const loadProjects = React.useCallback(async () => {
+    if (hasLoadedOnceRef.current) {
+      setIsRefreshing(true);
+    } else {
+      setIsLoading(true);
+    }
+    try {
+      const params = new URLSearchParams({
+        page: String(page),
+        pageSize: String(PAGE_SIZE),
+        include: INCLUDE_FIELDS
+      });
+      const sort = sorting[0];
+      if (sort?.id) {
+        params.set("sortField", sort.id);
+        params.set("sortDir", sort.desc ? "desc" : "asc");
+      }
+      if (search.trim()) params.set("q", search.trim());
+      const tabStatus = statusFromTab(activeTab);
+      if (tabStatus) params.set("status", tabStatus);
+      else if (typeof filterValues.status === "string" && filterValues.status.length > 0) {
+        params.set("status", filterValues.status);
+      }
+      if (mineFromTab(activeTab)) params.set("mine", "1");
+      const payload = await readApiResultOrThrow(
+        `/api/staff/timesheets/time-projects?${params.toString()}`,
+        void 0,
+        { errorMessage: labels.errors.load, fallback: { items: [], total: 0, totalPages: 1 } }
+      );
+      const items = Array.isArray(payload.items) ? payload.items : [];
+      setRows(items.map(mapApiProject));
+      setTotal(typeof payload.total === "number" ? payload.total : items.length);
+      setTotalPages(
+        typeof payload.totalPages === "number" ? payload.totalPages : Math.max(1, Math.ceil(items.length / PAGE_SIZE))
+      );
+    } catch (error) {
+      console.error("staff.timesheets.projects.list", error);
+      flash(labels.errors.load, "error");
+    } finally {
+      setIsLoading(false);
+      setIsRefreshing(false);
+      hasLoadedOnceRef.current = true;
+    }
+  }, [labels.errors.load, page, search, sorting, filterValues.status, activeTab, isPmRole]);
+  React.useEffect(() => {
+    void loadKpis();
+  }, [loadKpis, scopeVersion, reloadToken]);
+  React.useEffect(() => {
+    void loadProjects();
+  }, [loadProjects, scopeVersion, reloadToken]);
+  const handleTabSelect = React.useCallback(
+    (id) => {
+      const params = new URLSearchParams(searchParams.toString());
+      if (id === "all") params.delete("tab");
+      else params.set("tab", id);
+      router.replace(`?${params.toString()}`);
+      setPage(1);
+    },
+    [router, searchParams]
+  );
+  const handleViewModeChange = React.useCallback(
+    (next) => {
+      setViewMode(next);
+      const params = new URLSearchParams(searchParams.toString());
+      if (next === "table") params.delete("view");
+      else params.set("view", next);
+      router.replace(`?${params.toString()}`);
+    },
+    [router, searchParams, setViewMode]
+  );
+  const handleSearchChange = React.useCallback((value) => {
+    setSearch(value);
+    setPage(1);
+  }, []);
+  const handleFiltersApply = React.useCallback((values) => {
+    setFilterValues(values);
+    setPage(1);
+  }, []);
+  const handleFiltersClear = React.useCallback(() => {
+    setFilterValues({});
+    setPage(1);
+  }, []);
+  const handleRefresh = React.useCallback(() => {
+    setReloadToken((token) => token + 1);
+  }, []);
+  const handleDelete = React.useCallback(
+    async (entry) => {
+      const message = labels.actions.deleteConfirm.replace("{{name}}", entry.name);
+      const confirmed = await confirm({
+        title: labels.actions.delete,
+        text: message,
+        variant: "destructive"
+      });
+      if (!confirmed) return;
+      try {
+        await deleteCrud("staff/timesheets/time-projects", entry.id, { errorMessage: labels.errors.delete });
+        flash(labels.messages.deleted, "success");
+        handleRefresh();
+      } catch (error) {
+        console.error("staff.timesheets.projects.delete", error);
+        flash(labels.errors.delete, "error");
+      }
+    },
+    [confirm, handleRefresh, labels.actions.deleteConfirm, labels.actions.delete, labels.errors.delete, labels.messages.deleted]
+  );
+  const columns = React.useMemo(
+    () => [
+      {
+        accessorKey: "name",
+        header: labels.table.name,
+        meta: { priority: 1, sticky: true },
+        cell: ({ row }) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2.5", children: [
+          /* @__PURE__ */ jsx(ProjectColorDot, { colorKey: row.original.color, projectName: row.original.name, size: "sm" }),
+          /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col", children: [
+            /* @__PURE__ */ jsx("span", { className: "truncate text-sm font-medium text-foreground", children: row.original.name }),
+            /* @__PURE__ */ jsxs("span", { className: "truncate font-mono text-[11px] text-muted-foreground", children: [
+              row.original.code ?? "\u2014",
+              row.original.customerName ? ` \xB7 ${row.original.customerName}` : ""
+            ] })
+          ] })
+        ] })
+      },
+      {
+        accessorKey: "status",
+        header: labels.table.status,
+        meta: { priority: 2 },
+        cell: ({ row }) => {
+          const badgeClass = row.original.status === "active" ? "bg-lime-100 text-lime-800 dark:bg-lime-900/30 dark:text-lime-300" : row.original.status === "on_hold" ? "bg-amber-100 text-amber-800 dark:bg-amber-900/30 dark:text-amber-300" : "bg-muted text-muted-foreground";
+          const statusLabel = labels.statuses[row.original.status] ?? row.original.status;
+          return /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: `inline-flex items-center rounded-full px-2 py-0.5 text-[11px] font-medium ${badgeClass}`,
+              children: statusLabel
+            }
+          );
+        }
+      },
+      {
+        accessorKey: "projectType",
+        header: labels.table.type,
+        meta: { priority: 3 },
+        cell: ({ row }) => row.original.projectType ? /* @__PURE__ */ jsx("span", { className: "text-sm text-foreground", children: row.original.projectType }) : /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground/70", children: "\u2014" })
+      },
+      isPmRole ? {
+        accessorKey: "members",
+        id: "members",
+        header: labels.table.team,
+        enableSorting: false,
+        meta: { priority: 4 },
+        cell: ({ row }) => /* @__PURE__ */ jsx(
+          ProjectMembersAvatarStack,
+          {
+            members: row.original.members,
+            total: row.original.memberCount,
+            peopleCountLabel: `${row.original.memberCount}`
+          }
+        )
+      } : {
+        accessorKey: "myRole",
+        header: labels.table.myRole,
+        enableSorting: false,
+        meta: { priority: 4 },
+        cell: ({ row }) => row.original.myRole ? /* @__PURE__ */ jsx("span", { className: "text-sm text-foreground", children: row.original.myRole }) : /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground/70", children: "\u2014" })
+      },
+      {
+        accessorKey: "hoursWeek",
+        header: isPmRole ? labels.table.hoursWeek : labels.table.myHoursWeek,
+        enableSorting: false,
+        meta: { priority: 5 },
+        cell: ({ row }) => {
+          const stripe = resolveProjectColorHex(row.original.color, row.original.name);
+          return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-2", children: [
+            /* @__PURE__ */ jsx(
+              HoursSparkline,
+              {
+                values: row.original.hoursTrend,
+                color: stripe,
+                ariaLabel: labels.card.sparklineAria
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { className: "text-xs font-medium tabular-nums text-foreground", children: row.original.hoursWeek > 0 ? `${row.original.hoursWeek}h` : "\u2014" })
+          ] });
+        }
+      },
+      {
+        accessorKey: "updatedAt",
+        header: labels.table.updatedAt,
+        meta: { priority: 6 },
+        cell: ({ row }) => /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: formatRelativeTime(row.original.updatedAt, "\u2014", t) })
+      }
+    ],
+    [labels.table, labels.statuses, labels.card.sparklineAria, isPmRole]
+  );
+  const cardLabels = React.useMemo(
+    () => ({
+      hoursPanelPm: labels.card.hoursPanelPm,
+      hoursPanelCollab: labels.card.hoursPanelCollab,
+      sparklineAria: labels.card.sparklineAria,
+      peopleCount: (count) => `${count}`,
+      role: labels.card.role,
+      noCustomer: "\u2014",
+      statuses: labels.statuses
+    }),
+    [labels.card, labels.statuses]
+  );
+  const canManage = isPmRole;
+  const emptyStateCopy = React.useMemo(() => {
+    const hasFiltersApplied = activeTab !== "all" || search.trim().length > 0 || Object.values(filterValues).some(Boolean);
+    if (hasFiltersApplied) return labels.emptyState.noMatches;
+    if (!canManage) return labels.emptyState.noAssignments;
+    return labels.emptyState.noProjects;
+  }, [activeTab, search, filterValues, canManage, labels.emptyState]);
+  const cardsData = rows.map((row) => ({
+    id: row.id,
+    name: row.name,
+    code: row.code,
+    customerName: row.customerName,
+    color: row.color,
+    status: row.status,
+    hoursWeek: row.hoursWeek,
+    hoursTrend: row.hoursTrend,
+    members: row.members,
+    memberCount: row.memberCount,
+    myRole: row.myRole,
+    updatedAt: row.updatedAt
+  }));
+  return /* @__PURE__ */ jsxs(Page, { children: [
+    /* @__PURE__ */ jsxs(PageBody, { children: [
+      /* @__PURE__ */ jsx("div", { className: "mb-4", children: /* @__PURE__ */ jsx(ProjectsKpiStrip, { kpis, labels: kpiLabels, isLoading: isLoadingKpis }) }),
+      /* @__PURE__ */ jsxs("div", { className: "mb-3 flex flex-wrap items-center justify-between gap-3", children: [
+        /* @__PURE__ */ jsx(
+          SavedViewTabs,
+          {
+            tabs,
+            activeId: activeTab,
+            onSelect: handleTabSelect,
+            ariaLabel: t("staff.timesheets.projects.portfolio.savedViews.ariaLabel", "Saved views")
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ViewModeToggle,
+          {
+            mode: viewMode,
+            onChange: handleViewModeChange,
+            tableLabel: labels.viewMode.table,
+            cardsLabel: labels.viewMode.cards,
+            ariaLabel: t("staff.timesheets.projects.portfolio.viewMode.ariaLabel", "View mode")
+          }
+        )
+      ] }),
+      viewMode === "cards" ? /* @__PURE__ */ jsx("div", { children: isLoading ? /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-3 md:grid-cols-2 lg:grid-cols-3", children: Array.from({ length: 6 }).map((_, idx) => /* @__PURE__ */ jsx("div", { className: "h-48 animate-pulse rounded-lg border border-border bg-muted/40" }, idx)) }) : rows.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-dashed border-border bg-card p-10 text-center", children: [
+        /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: emptyStateCopy }),
+        canManage ? /* @__PURE__ */ jsx("div", { className: "mt-3", children: /* @__PURE__ */ jsx(Button, { asChild: true, size: "sm", children: /* @__PURE__ */ jsx(Link, { href: "/backend/staff/timesheets/projects/create", children: labels.actions.addFirst }) }) }) : null
+      ] }) : /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-3 md:grid-cols-2 lg:grid-cols-3", children: cardsData.map((card) => /* @__PURE__ */ jsx(
+        ProjectCard,
+        {
+          data: card,
+          labels: cardLabels,
+          showTeam: isPmRole,
+          href: `/backend/staff/timesheets/projects/${card.id}`
+        },
+        card.id
+      )) }) }) : /* @__PURE__ */ jsx(
+        DataTable,
+        {
+          title: labels.title,
+          data: rows,
+          columns,
+          isLoading,
+          searchValue: search,
+          onSearchChange: handleSearchChange,
+          searchPlaceholder: labels.table.search,
+          filters,
+          filterValues,
+          onFiltersApply: handleFiltersApply,
+          onFiltersClear: handleFiltersClear,
+          emptyState: /* @__PURE__ */ jsxs("div", { className: "py-12 text-center", children: [
+            /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground mb-4", children: emptyStateCopy }),
+            canManage ? /* @__PURE__ */ jsx(Button, { asChild: true, size: "sm", children: /* @__PURE__ */ jsx(Link, { href: "/backend/staff/timesheets/projects/create", children: labels.actions.addFirst }) }) : null
+          ] }),
+          actions: canManage ? /* @__PURE__ */ jsx(Button, { asChild: true, size: "sm", children: /* @__PURE__ */ jsx(Link, { href: "/backend/staff/timesheets/projects/create", children: labels.actions.add }) }) : void 0,
+          refreshButton: {
+            label: labels.actions.refresh,
+            onRefresh: handleRefresh,
+            isRefreshing: isLoading || isRefreshing
+          },
+          sortable: true,
+          sorting,
+          onSortingChange: setSorting,
+          pagination: {
+            page,
+            pageSize: PAGE_SIZE,
+            total,
+            totalPages,
+            onPageChange: setPage
+          },
+          rowActions: (row) => /* @__PURE__ */ jsx(
+            RowActions,
+            {
+              items: [
+                {
+                  id: "view",
+                  label: labels.actions.viewDetails,
+                  href: `/backend/staff/timesheets/projects/${row.id}`
+                },
+                ...canManage ? [
+                  {
+                    id: "delete",
+                    label: labels.actions.delete,
+                    destructive: true,
+                    onSelect: () => {
+                      void handleDelete(row);
+                    }
+                  }
+                ] : []
+              ]
+            }
+          ),
+          onRowClick: (row) => router.push(`/backend/staff/timesheets/projects/${row.id}`)
+        }
+      )
+    ] }),
+    ConfirmDialogElement
+  ] });
+}
+export {
+  TimesheetProjectsPage as default
+};
+//# sourceMappingURL=page.js.map