@open-mercato/core 0.7.1-develop.7178.1.ab93fbaf4e → 0.7.1-develop.7180.1.9717fbbb43

package/src/modules/staff/api/timesheets/time-projects/route.ts

@@ -1,14 +1,29 @@
+import { NextResponse } from 'next/server'
 import { z } from 'zod'
 import type { EntityManager } from '@mikro-orm/postgresql'
-import { makeCrudRoute } from '@open-mercato/shared/lib/crud/factory'
+import { makeCrudRoute, type CrudCtx } from '@open-mercato/shared/lib/crud/factory'
+import { staffTimeProjectCrudEvents } from '../../../lib/crud'
 import { resolveTranslations } from '@open-mercato/shared/lib/i18n/server'
 import { resolveCrudRecordId, parseScopedCommandInput } from '@open-mercato/shared/lib/api/scoped'
 import { escapeLikePattern } from '@open-mercato/shared/lib/db/escapeLikePattern'
 import { findOneWithDecryption } from '@open-mercato/shared/lib/encryption/find'
+import { createRequestContainer } from '@open-mercato/shared/lib/di/container'
+import { getAuthFromRequest } from '@open-mercato/shared/lib/auth/server'
+import { resolveOrganizationScopeForRequest } from '@open-mercato/core/modules/directory/utils/organizationScope'
+import { isIdsParamProvided, parseIdsParam } from '@open-mercato/shared/lib/crud/ids'
+import { createLogger } from '@open-mercato/shared/lib/logger'
+import type { ModuleConfigService } from '@open-mercato/core/modules/configs/lib/module-config-service'
 import { StaffTimeProject, StaffTimeProjectMember, StaffTeamMember } from '../../../data/entities'
 import { staffTimeProjectCreateSchema, staffTimeProjectUpdateSchema } from '../../../data/validators'
+import { resolveFeatureAccess } from '../../../lib/time-tracking/featureAccess'
+import { MANAGE_PROJECTS_FEATURE, resolveProjectAccess, type ProjectAccess } from '../../../lib/time-tracking/access'
+import { readTimeTrackingSettings } from '../../../lib/time-tracking/settings'
+import { buildSqlInClause } from '../../../lib/time-tracking/sqlInClause'
 import { sanitizeSearchTerm, parseBooleanFlag } from '../../helpers'
 import { createStaffCrudOpenApi, createPagedListResponseSchema, defaultOkResponseSchema } from '../../openapi'
+import { E } from '#generated/entities.ids.generated'
+
+const logger = createLogger('staff').child({ component: 'api/timesheets/time-projects' })
 
 const F = {
   id: 'id',
@@ -21,9 +36,16 @@ const F = {
   color: 'color',
   status: 'status',
   customer_id: 'customer_id',
+  customer_snapshot: 'customer_snapshot',
   owner_user_id: 'owner_user_id',
   cost_center: 'cost_center',
   start_date: 'start_date',
+  hourly_rate: 'hourly_rate',
+  currency_code: 'currency_code',
+  billable_by_default: 'billable_by_default',
+  budget_kind: 'budget_kind',
+  budget_value: 'budget_value',
+  budget_warn_at_percent: 'budget_warn_at_percent',
   created_at: 'created_at',
   updated_at: 'updated_at',
   deleted_at: 'deleted_at',
@@ -56,6 +78,152 @@ const listSchema = z
   })
   .passthrough()
 
+/**
+ * Discriminator returned with the 404 a project-scoped read answers when the
+ * caller may not see the record. It is the whole body besides a generic error
+ * string: naming the project or the customer here would confirm the resource to
+ * someone who has no right to it (screen 17 note 1).
+ *
+ * Denied and genuinely-missing are deliberately indistinguishable for a caller
+ * without `staff.timesheets.projects.manage` — both answer this same 404 — so the
+ * endpoint cannot be used to enumerate which project ids exist. The discriminator
+ * only tells the client "you are not a member", which is what screen 17 needs to
+ * render the request-access affordance; a manager still gets a plain 200-empty
+ * for an id that really does not exist.
+ */
+export const NO_PROJECT_ACCESS_REASON = 'no_project_access'
+
+/**
+ * Non-UUID sentinel used as the "match nothing" id filter. Kept in the shape the
+ * `mine=true` branch has always used so both narrowing paths behave identically.
+ */
+const IMPOSSIBLE_PROJECT_ID = '00000000-0000-0000-0000-000000000000'
+
+const DENIED_ACCESS: ProjectAccess = { canManageAll: false, projectIds: [], staffMemberId: null }
+
+type RbacServiceLike = {
+  getGrantedFeatures?: (
+    userId: string,
+    options: { tenantId: string | null; organizationId: string | null },
+  ) => Promise<string[]>
+  userHasAllFeatures?: (
+    userId: string,
+    required: string[],
+    options: { tenantId: string | null; organizationId: string | null },
+  ) => Promise<boolean>
+}
+
+type ContainerLike = { resolve: (name: string) => unknown }
+
+/**
+ * Both entry points into a single request — the denial probe on `GET` and the
+ * list narrowing in `buildFilters` — must agree on what the caller may see, and
+ * neither should pay for the other's lookups. The resolved access is therefore
+ * memoised per `Request`; the factory hands `buildFilters` the same object the
+ * route received.
+ */
+const accessByRequest = new WeakMap<Request, Promise<ProjectAccess>>()
+
+async function resolveGrantedFeatures(
+  container: ContainerLike,
+  userId: string,
+  scope: { tenantId: string; organizationId: string },
+): Promise<string[]> {
+  try {
+    const rbac = container.resolve('rbacService') as RbacServiceLike | undefined
+    if (!rbac?.getGrantedFeatures) return []
+    return (await rbac.getGrantedFeatures(userId, scope)) ?? []
+  } catch {
+    // Fail closed: an unreadable grant set is no grant set, so the caller falls
+    // back to their project memberships instead of being treated as a manager.
+    return []
+  }
+}
+
+async function resolveUnrestricted(
+  container: ContainerLike,
+  userId: string,
+  scope: { tenantId: string; organizationId: string },
+): Promise<boolean> {
+  try {
+    const rbac = container.resolve('rbacService') as RbacServiceLike | undefined
+    if (!rbac?.userHasAllFeatures) return false
+    return (await rbac.userHasAllFeatures(userId, [MANAGE_PROJECTS_FEATURE], scope)) === true
+  } catch {
+    // Fail closed, exactly as the grant lookup does.
+    return false
+  }
+}
+
+async function resolveAssignmentGraceDays(
+  container: ContainerLike,
+  tenantId: string,
+): Promise<number | null> {
+  try {
+    const configService = container.resolve('moduleConfigService') as ModuleConfigService
+    const settings = await readTimeTrackingSettings(configService, { tenantId })
+    return settings.access.assignmentGraceDays
+  } catch {
+    // Fail safe to the documented default rather than widening the window.
+    return null
+  }
+}
+
+async function loadProjectAccess(
+  container: ContainerLike,
+  userId: string | null,
+  tenantId: string | null,
+  organizationId: string | null,
+): Promise<ProjectAccess> {
+  if (!tenantId || !organizationId) return { ...DENIED_ACCESS }
+  const scope = { tenantId, organizationId }
+  try {
+    // One lookup, one authority, and a failure that says so. The two-call version
+    // this replaces rescued `canManageAll` but still fed a possibly-empty array
+    // into `userFeatures`, which the guards downstream read.
+    const access = await resolveFeatureAccess(container, userId, [MANAGE_PROJECTS_FEATURE], scope)
+    const em = container.resolve('em') as EntityManager
+    return await resolveProjectAccess({
+      em: em.fork(),
+      userId,
+      tenantId,
+      organizationId,
+      canManageAll: access.allowed,
+      userFeatures: access.grantedFeatures,
+      assignmentGraceDays: await resolveAssignmentGraceDays(container, tenantId),
+    })
+  } catch (err) {
+    logger.error('staff.timesheets.time-projects access resolution failed', { err })
+    return { ...DENIED_ACCESS }
+  }
+}
+
+function resolveRequestProjectAccess(
+  request: Request | undefined,
+  load: () => Promise<ProjectAccess>,
+): Promise<ProjectAccess> {
+  if (!request) return load()
+  const cached = accessByRequest.get(request)
+  if (cached) return cached
+  const pending = load()
+  accessByRequest.set(request, pending)
+  return pending
+}
+
+function resolveCtxScope(ctx: CrudCtx): { tenantId: string | null; organizationId: string | null } {
+  return {
+    tenantId: ctx.auth?.tenantId ?? null,
+    organizationId: ctx.selectedOrganizationId ?? ctx.auth?.orgId ?? null,
+  }
+}
+
+async function resolveListProjectAccess(ctx: CrudCtx): Promise<ProjectAccess> {
+  const { tenantId, organizationId } = resolveCtxScope(ctx)
+  return resolveRequestProjectAccess(ctx.request, () =>
+    loadProjectAccess(ctx.container, ctx.auth?.sub ?? null, tenantId, organizationId),
+  )
+}
+
 async function resolveCallerAssignedProjectIds(
   em: EntityManager,
   userId: string,
@@ -81,6 +249,98 @@ async function resolveCallerAssignedProjectIds(
   return Array.from(new Set(memberships.map((m) => m.timeProjectId)))
 }
 
+type ProjectEntryCountRow = {
+  time_project_id: string
+  entry_count: string | number
+  locked_entry_count: string | number
+}
+
+type ProjectListItem = {
+  id?: unknown
+  entryCount?: number
+  lockedEntryCount?: number
+  currencyLocked?: boolean
+}
+
+function toCount(value: string | number | null | undefined): number {
+  const parsed = typeof value === 'number' ? value : Number(value ?? 0)
+  return Number.isFinite(parsed) ? parsed : 0
+}
+
+/**
+ * D-3 read-side signal: currency is read-only once hours have been logged, so the
+ * project list/detail response carries the reason alongside the value.
+ * `currencyLocked` tells the form to render the field read-only behind the explicit
+ * change action, `entryCount` names why, and `lockedEntryCount` says whether even
+ * that action will be refused (entries frozen in a closed report).
+ *
+ * One grouped aggregate for the whole page — never a per-row count.
+ */
+export async function decorateProjectCurrencyLock(
+  items: ProjectListItem[],
+  em: EntityManager,
+  scope: { tenantId: string; organizationId: string },
+): Promise<void> {
+  const ids = Array.from(
+    new Set(items.map((item) => item.id).filter((value): value is string => typeof value === 'string' && value.length > 0)),
+  )
+  if (ids.length === 0) return
+
+  const projectIn = buildSqlInClause('time_project_id', ids)
+  const rows = (await em.getConnection().execute(
+    `
+      SELECT time_project_id,
+             COUNT(*)::bigint AS entry_count,
+             COUNT(locked_report_id)::bigint AS locked_entry_count
+      FROM staff_time_entries
+      WHERE tenant_id = ?
+        AND organization_id = ?
+        AND deleted_at IS NULL
+        AND ${projectIn.sql}
+      GROUP BY time_project_id
+    `,
+    [scope.tenantId, scope.organizationId, ...projectIn.params],
+  )) as ProjectEntryCountRow[]
+
+  const counts = new Map(rows.map((row) => [row.time_project_id, row]))
+  for (const item of items) {
+    const row = typeof item.id === 'string' ? counts.get(item.id) : undefined
+    const entryCount = toCount(row?.entry_count)
+    item.entryCount = entryCount
+    item.lockedEntryCount = toCount(row?.locked_entry_count)
+    item.currencyLocked = entryCount > 0
+  }
+}
+
+/**
+ * The list projection doubles as the detail projection (the edit page re-reads this
+ * route with `?id=`), so every column the project form round-trips has to be here.
+ */
+export const timeProjectListFields = [
+  F.id,
+  F.organization_id,
+  F.tenant_id,
+  F.name,
+  F.code,
+  F.description,
+  F.project_type,
+  F.color,
+  F.status,
+  F.customer_id,
+  F.customer_snapshot,
+  F.owner_user_id,
+  F.cost_center,
+  F.start_date,
+  F.hourly_rate,
+  F.currency_code,
+  F.billable_by_default,
+  F.budget_kind,
+  F.budget_value,
+  F.budget_warn_at_percent,
+  F.created_at,
+  F.updated_at,
+] as const
+
 const crud = makeCrudRoute({
   metadata: routeMetadata,
   orm: {
@@ -90,28 +350,14 @@ const crud = makeCrudRoute({
     tenantField: 'tenantId',
     softDeleteField: 'deletedAt',
   },
+  events: staffTimeProjectCrudEvents,
   indexer: { entityType: 'staff:staff_time_project' },
   enrichers: { entityId: 'staff:staff_time_project' },
   list: {
     schema: listSchema,
     entityId: 'staff:staff_time_project',
-    fields: [
-      F.id,
-      F.organization_id,
-      F.tenant_id,
-      F.name,
-      F.code,
-      F.description,
-      F.project_type,
-      F.color,
-      F.status,
-      F.customer_id,
-      F.owner_user_id,
-      F.cost_center,
-      F.start_date,
-      F.created_at,
-      F.updated_at,
-    ],
+    fields: [...timeProjectListFields],
+    decorateCustomFields: { entityIds: [E.staff.staff_time_project] },
     sortFieldMap: {
       name: F.name,
       code: F.code,
@@ -143,7 +389,21 @@ const crud = makeCrudRoute({
           ? narrowIds.filter((id) => assigned.includes(id))
           : assigned
         if (narrowIds.length === 0) {
-          filters[F.id] = { $in: ['00000000-0000-0000-0000-000000000000'] }
+          filters[F.id] = { $in: [IMPOSSIBLE_PROJECT_ID] }
+          return filters
+        }
+      }
+      // Every project-scoped read filters through the one resolver: a caller
+      // without `staff.timesheets.projects.manage` only ever sees the projects
+      // they are an active member of. A non-member gets no row at all — not a
+      // redacted one — so the customer and project name never leave the server.
+      const access = await resolveListProjectAccess(ctx)
+      if (!access.canManageAll) {
+        narrowIds = narrowIds
+          ? narrowIds.filter((id) => access.projectIds.includes(id))
+          : [...access.projectIds]
+        if (narrowIds.length === 0) {
+          filters[F.id] = { $in: [IMPOSSIBLE_PROJECT_ID] }
           return filters
         }
       }
@@ -166,6 +426,19 @@ const crud = makeCrudRoute({
       return filters
     },
   },
+  hooks: {
+    afterList: async (res, ctx) => {
+      const items = Array.isArray((res as { items?: unknown })?.items)
+        ? ((res as { items: ProjectListItem[] }).items)
+        : []
+      if (items.length === 0) return
+      const tenantId = ctx.auth?.tenantId ?? null
+      const organizationId = ctx.selectedOrganizationId ?? ctx.auth?.orgId ?? null
+      if (!tenantId || !organizationId) return
+      const em = ctx.container.resolve('em') as EntityManager
+      await decorateProjectCurrencyLock(items, em.fork(), { tenantId, organizationId })
+    },
+  },
   actions: {
     create: {
       commandId: 'staff.timesheets.time_projects.create',
@@ -199,12 +472,74 @@ const crud = makeCrudRoute({
   },
 })
 
-export const GET = crud.GET
+async function buildAccessDenialResponse(): Promise<Response> {
+  const { translate } = await resolveTranslations()
+  return NextResponse.json(
+    {
+      // Same string a genuinely missing record gets: the body must not tell the
+      // caller which of the two it is beyond the membership discriminator.
+      error: translate('staff.timesheets.projects.errors.notFound', 'Project not found.'),
+      reason: NO_PROJECT_ACCESS_REASON,
+    },
+    { status: 404 },
+  )
+}
+
+/**
+ * The list route doubles as the detail read (`?ids=<id>`, and defensively `?id=`),
+ * so a caller asking for one specific project needs an answer the UI can turn
+ * into screen 17 rather than an indistinguishable empty page. Returning 404 for
+ * denied *and* unknown ids alike keeps the endpoint useless for enumeration; the
+ * `reason` discriminator carries only "you are not a member of this project",
+ * never the project or customer it is refusing to describe.
+ */
+async function resolveProjectAccessDenial(req: Request): Promise<Response | null> {
+  const url = new URL(req.url)
+  const rawIds = url.searchParams.get('ids') ?? url.searchParams.get('id')
+  if (!isIdsParamProvided(rawIds)) return null
+  const requestedIds = parseIdsParam(rawIds)
+  // Malformed ids match nothing on their own; the factory answers an empty list.
+  if (requestedIds.length === 0) return null
+
+  try {
+    const container = await createRequestContainer()
+    const auth = await getAuthFromRequest(req)
+    // Unauthenticated and unscoped requests are the factory's to reject.
+    if (!auth) return null
+    const orgScope = await resolveOrganizationScopeForRequest({ container, auth, request: req })
+    const tenantId = orgScope?.tenantId ?? auth.tenantId ?? null
+    const organizationId = orgScope?.selectedId ?? auth.orgId ?? null
+    if (!tenantId || !organizationId) return null
+
+    const access = await resolveRequestProjectAccess(req, () =>
+      loadProjectAccess(
+        container,
+        typeof auth.sub === 'string' ? auth.sub : null,
+        tenantId,
+        organizationId,
+      ),
+    )
+    if (access.canManageAll) return null
+    if (requestedIds.some((id) => access.projectIds.includes(id))) return null
+    return await buildAccessDenialResponse()
+  } catch (err) {
+    // Fail closed: an access decision that could not be made is a denial.
+    logger.error('staff.timesheets.time-projects denial probe failed', { err })
+    return await buildAccessDenialResponse()
+  }
+}
+
+export async function GET(req: Request): Promise<Response> {
+  const denial = await resolveProjectAccessDenial(req)
+  if (denial) return denial
+  return crud.GET(req)
+}
+
 export const POST = crud.POST
 export const PUT = crud.PUT
 export const DELETE = crud.DELETE
 
-const timeProjectListItemSchema = z.object({
+export const timeProjectListItemSchema = z.object({
   id: z.string().uuid().nullable().optional(),
   organization_id: z.string().uuid().nullable().optional(),
   tenant_id: z.string().uuid().nullable().optional(),
@@ -215,14 +550,31 @@ const timeProjectListItemSchema = z.object({
   color: z.string().nullable().optional(),
   status: z.string().nullable().optional(),
   customer_id: z.string().uuid().nullable().optional(),
+  customer_snapshot: z.record(z.string(), z.unknown()).nullable().optional(),
   owner_user_id: z.string().uuid().nullable().optional(),
   cost_center: z.string().nullable().optional(),
   start_date: z.string().nullable().optional(),
+  // numeric(14,4) reaches the client as a decimal string; a number stays accepted
+  // for callers that read the column through a numeric-casting driver.
+  hourly_rate: z.union([z.string(), z.number()]).nullable().optional(),
+  currency_code: z.string().nullable().optional(),
+  billable_by_default: z.boolean().nullable().optional(),
+  budget_kind: z.string().nullable().optional(),
+  budget_value: z.union([z.string(), z.number()]).nullable().optional(),
+  budget_warn_at_percent: z.number().int().nullable().optional(),
   created_at: z.string().nullable().optional(),
   updated_at: z.string().nullable().optional(),
+  entryCount: z.number().int().optional(),
+  lockedEntryCount: z.number().int().optional(),
+  currencyLocked: z.boolean().optional(),
+})
+
+export const projectAccessDeniedResponseSchema = z.object({
+  error: z.string(),
+  reason: z.literal(NO_PROJECT_ACCESS_REASON),
 })
 
-export const openApi = createStaffCrudOpenApi({
+const baseOpenApi = createStaffCrudOpenApi({
   resourceName: 'TimeProject',
   pluralName: 'Time Projects',
   querySchema: listSchema,
@@ -242,3 +594,26 @@ export const openApi = createStaffCrudOpenApi({
     description: 'Soft-deletes a time project by id.',
   },
 })
+
+export const openApi = {
+  ...baseOpenApi,
+  methods: {
+    ...baseOpenApi.methods,
+    ...(baseOpenApi.methods?.GET
+      ? {
+          GET: {
+            ...baseOpenApi.methods.GET,
+            description: `${baseOpenApi.methods.GET.description ?? ''} Rows are intersected with the caller's project access: without staff.timesheets.projects.manage only projects the caller is an active member of are returned. Asking for a single id the caller may not see answers 404 with reason=${NO_PROJECT_ACCESS_REASON} and never names the project or its customer; the same 404 covers ids that do not exist, so the endpoint cannot be used to enumerate projects.`.trim(),
+            responses: [
+              ...(baseOpenApi.methods.GET.responses ?? []),
+              {
+                status: 404,
+                description: 'The caller is not a member of the requested project (or it does not exist)',
+                schema: projectAccessDeniedResponseSchema,
+              },
+            ],
+          },
+        }
+      : {}),
+  },
+} satisfies typeof baseOpenApi

package/src/modules/staff/backend/staff/time-tracking/board/page.meta.ts

@@ -0,0 +1,14 @@
+export const metadata = {
+  requireAuth: true,
+  requireFeatures: ['staff.timesheets.tasks.view'],
+  pageTitle: 'Tasks',
+  pageTitleKey: 'staff.time_tracking.nav.tasks',
+  pageGroup: 'Time tracking',
+  pageGroupKey: 'staff.time_tracking.nav.group',
+  pageOrder: 30,
+  icon: 'layers',
+  breadcrumb: [
+    { label: 'Time tracking', labelKey: 'staff.time_tracking.nav.group', href: '/backend/staff/time-tracking' },
+    { label: 'Tasks', labelKey: 'staff.time_tracking.nav.tasks' },
+  ],
+}

package/src/modules/staff/backend/staff/time-tracking/board/page.tsx

@@ -0,0 +1,151 @@
+"use client"
+
+import * as React from 'react'
+import { useRouter, useSearchParams } from 'next/navigation'
+import { useQuery } from '@tanstack/react-query'
+import { Page, PageBody, PageHeader } from '@open-mercato/ui/backend/Page'
+import { Button } from '@open-mercato/ui/primitives/button'
+import { EmptyState } from '@open-mercato/ui/primitives/empty-state'
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@open-mercato/ui/primitives/select'
+import { ErrorMessage, LoadingMessage } from '@open-mercato/ui/backend/detail'
+import { apiCall } from '@open-mercato/ui/backend/utils/apiCall'
+import { useT } from '@open-mercato/shared/lib/i18n/context'
+import { useOrganizationScopeVersion } from '@open-mercato/shared/lib/frontend/useOrganizationScope'
+import { TaskBoardScreen } from '../../../../lib/time-tracking-ui/TaskBoardScreen'
+import { readItems, readString } from '../../../../lib/time-tracking-ui/kanbanBoardData'
+
+type BoardProject = {
+  id: string
+  name: string
+}
+
+/**
+ * The module-level Tasks board (screen 6).
+ *
+ * Columns are per project (D-1), so the board always needs one. This route carries the
+ * project in `?projectId=` and falls back to the first project the caller can see; the
+ * per-project route renders the same screen with the id already resolved.
+ */
+export default function TimeTrackingBoardPage() {
+  const t = useT()
+  const router = useRouter()
+  const searchParams = useSearchParams()
+  const scopeVersion = useOrganizationScopeVersion()
+  const requestedProjectId = searchParams?.get('projectId') ?? null
+
+  const projectsQuery = useQuery<BoardProject[]>({
+    queryKey: ['staff', 'time-tracking', 'board', 'projects', `scope:${scopeVersion}`],
+    staleTime: 60_000,
+    queryFn: async () => {
+      const call = await apiCall<Record<string, unknown>>(
+        '/api/staff/timesheets/time-projects?page=1&pageSize=100&sortField=name&sortDir=asc',
+      )
+      // A failed call must not look like an empty project list: the empty state below
+      // tells the caller to ask a Team Leader for access, which is the wrong advice for
+      // a network error or a 500.
+      if (!call.ok) throw new Error(`[internal] staff.time_tracking board projects request failed (${call.status})`)
+      return readItems(call.result)
+        .map((row) => {
+          const id = readString(row, 'id')
+          if (!id) return null
+          return { id, name: readString(row, 'name') ?? id }
+        })
+        .filter((project): project is BoardProject => project !== null)
+    },
+  })
+
+  const projects = projectsQuery.data ?? []
+  const activeProject =
+    projects.find((project) => project.id === requestedProjectId) ?? projects[0] ?? null
+
+  const handleProjectChange = React.useCallback(
+    (projectId: string) => {
+      const params = new URLSearchParams(searchParams?.toString() ?? '')
+      params.set('projectId', projectId)
+      params.delete('task')
+      router.replace(`?${params.toString()}`, { scroll: false })
+    },
+    [router, searchParams],
+  )
+
+  const projectPicker =
+    projects.length > 0 && activeProject ? (
+      <Select value={activeProject.id} onValueChange={handleProjectChange}>
+        <SelectTrigger
+          className="w-64"
+          aria-label={t('staff.time_tracking.board.projectPicker', 'Project')}
+        >
+          <SelectValue />
+        </SelectTrigger>
+        <SelectContent>
+          {projects.map((project) => (
+            <SelectItem key={project.id} value={project.id}>
+              {project.name}
+            </SelectItem>
+          ))}
+        </SelectContent>
+      </Select>
+    ) : null
+
+  if (projectsQuery.isLoading) {
+    return (
+      <Page>
+        <PageHeader title={t('staff.time_tracking.nav.tasks', 'Tasks')} />
+        <PageBody>
+          <LoadingMessage label={t('staff.time_tracking.board.loading', 'Loading the board…')} />
+        </PageBody>
+      </Page>
+    )
+  }
+
+  if (projectsQuery.isError) {
+    return (
+      <Page>
+        <PageHeader title={t('staff.time_tracking.nav.tasks', 'Tasks')} />
+        <PageBody>
+          <ErrorMessage
+            label={t('staff.time_tracking.board.projectsLoadError', 'Could not load your projects.')}
+            action={
+              <Button type="button" variant="outline" size="sm" onClick={() => void projectsQuery.refetch()}>
+                {t('staff.time_tracking.board.reload', 'Try again')}
+              </Button>
+            }
+          />
+        </PageBody>
+      </Page>
+    )
+  }
+
+  if (!activeProject) {
+    return (
+      <Page>
+        <PageHeader title={t('staff.time_tracking.nav.tasks', 'Tasks')} />
+        <PageBody>
+          <EmptyState
+            title={t('staff.time_tracking.board.noProject.title', 'No project to show')}
+            description={t(
+              'staff.time_tracking.board.noProject.description',
+              'The board needs a project. Ask a Team Leader for access to one.',
+            )}
+          />
+        </PageBody>
+      </Page>
+    )
+  }
+
+  return (
+    <Page>
+      <TaskBoardScreen
+        timeProjectId={activeProject.id}
+        projectName={activeProject.name}
+        headerActions={projectPicker}
+      />
+    </Page>
+  )
+}

package/src/modules/staff/backend/staff/time-tracking/entries/page.meta.ts

@@ -0,0 +1,14 @@
+export const metadata = {
+  requireAuth: true,
+  requireFeatures: ['staff.timesheets.view'],
+  pageTitle: 'Time entries',
+  pageTitleKey: 'staff.time_tracking.nav.entries',
+  pageGroup: 'Time tracking',
+  pageGroupKey: 'staff.time_tracking.nav.group',
+  pageOrder: 40,
+  icon: 'list',
+  breadcrumb: [
+    { label: 'Time tracking', labelKey: 'staff.time_tracking.nav.group', href: '/backend/staff/time-tracking' },
+    { label: 'Time entries', labelKey: 'staff.time_tracking.nav.entries' },
+  ],
+}