@nuxt-customer-portal/timesheets 0.3.0

package/CHANGELOG.md

@@ -0,0 +1,16 @@
+# @nuxt-customer-portal/timesheets
+
+## 0.3.0
+
+### Major Changes
+
+- ca166fd: Extract invoices into an independent Nuxt layer and add an optional Timesheets source bridge.
+
+  This removes the legacy `/timesheets/invoices`, `/admin/timesheets/invoices`, and Timesheets invoice API routes without redirects or delegates. Use `/invoices`, `/admin/invoices`, `/api/invoices`, and `/api/invoice-timesheets` instead.
+
+### Patch Changes
+
+- @nuxt-customer-portal/clients@0.3.0
+- @nuxt-customer-portal/core@0.3.0
+- @nuxt-customer-portal/organizations@0.3.0
+- @nuxt-customer-portal/ui@0.3.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Nuxt Customer Portal contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,5 @@
+# Timesheets layer
+
+An isolated PortalNuxt feature for weekly time entry, timers, approval, project configuration, tariffs, budgets, and reporting.
+
+All API access is scoped to the active organization through portal-core. Feature-owned database objects live in the PostgreSQL `timesheets` schema.

package/app/assets/timesheets.css

@@ -0,0 +1,368 @@
+/* Hallmark · pre-emit critique: P5 H5 E4 S5 R5 V4 */
+/* Hallmark · genre: modern-minimal · macrostructure: Workbench · theme: portal-native · enrichment: none · contrast: pass (40–41) · mobile: pass (34, 49–57) */
+@import '../../tokens.css';
+
+html,
+body {
+  overflow-x: clip;
+}
+
+.timesheet-workbench {
+  min-width: 0;
+}
+
+.timesheet-workbench button,
+.timesheet-workbench a,
+.timesheet-admin button,
+.timesheet-admin a {
+  white-space: nowrap;
+}
+
+.timesheet-grid {
+  display: grid;
+  grid-template-columns: minmax(16rem, 2.2fr) repeat(7, minmax(3.5rem, 0.65fr)) minmax(4rem, 0.65fr);
+  min-width: 47rem;
+}
+
+.timesheet-grid__cell {
+  min-width: 0;
+  padding: var(--timesheets-space-cell);
+  border-right: 1px solid var(--timesheets-rule);
+  border-bottom: 1px solid var(--timesheets-rule);
+}
+
+.timesheet-grid__cell--weekend {
+  background: var(--timesheets-color-weekend);
+}
+
+.timesheet-grid button:not(:disabled) {
+  cursor: pointer;
+}
+
+.timesheet-grid button:disabled {
+  cursor: not-allowed;
+}
+
+.timesheet-grid__cell--today {
+  background: var(--ui-primary);
+  color: var(--portal-on-primary, var(--ui-bg));
+}
+
+.timesheet-grid__cell--today .text-muted {
+  color: var(--portal-on-primary, var(--ui-bg));
+}
+
+.timesheet-grid__identity {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  gap: 0.125rem;
+  overflow-wrap: anywhere;
+}
+
+.timesheet-grid__client,
+.timesheet-grid__project,
+.timesheet-grid__activity {
+  display: block;
+  min-width: 0;
+  white-space: normal;
+}
+
+.timesheet-grid__client {
+  color: var(--ui-text-muted);
+  font-size: 0.75rem;
+  line-height: 1rem;
+}
+
+.timesheet-grid__project {
+  color: var(--ui-text-highlighted);
+  font-weight: 600;
+  line-height: 1.25rem;
+}
+
+.timesheet-grid__activity {
+  color: var(--ui-primary);
+  font-size: 0.75rem;
+  line-height: 1rem;
+}
+
+.timesheet-timer {
+  border-inline-start: 3px solid var(--timesheets-color-running);
+  background: var(--timesheets-color-running-soft);
+}
+
+.timesheet-row-action {
+  transition:
+    opacity var(--timesheets-duration-fast) var(--timesheets-ease-out),
+    transform var(--timesheets-duration-fast) var(--timesheets-ease-out);
+}
+
+.timesheet-row-action:active {
+  transform: translateY(1px);
+}
+
+.timesheet-row-action:focus-visible {
+  outline: 3px solid var(--ui-primary);
+  outline-offset: 2px;
+}
+
+.timesheet-grid .timesheet-row-action:disabled {
+  cursor: not-allowed;
+  background: color-mix(in srgb, var(--ui-bg-accented) 35%, var(--ui-bg));
+  color: var(--ui-text-dimmed);
+  opacity: 1;
+}
+
+.timesheet-grid .timesheet-row-action:disabled:hover {
+  background: color-mix(in srgb, var(--ui-bg-accented) 35%, var(--ui-bg));
+}
+
+.timesheet-grid .timesheet-grid__cell--locked,
+.timesheet-grid .timesheet-grid__cell--locked:hover,
+.timesheet-grid .timesheet-grid__cell--locked > .timesheet-row-action:hover {
+  background: color-mix(in srgb, var(--ui-bg-accented) 35%, var(--ui-bg));
+}
+
+.timesheet-mobile {
+  overflow: clip;
+  border: 1px solid var(--timesheets-rule);
+  border-radius: var(--timesheets-radius);
+  background: var(--ui-bg);
+}
+
+.timesheet-mobile__loading,
+.timesheet-mobile__empty {
+  display: grid;
+  min-height: 9rem;
+  place-items: center;
+  padding: 1.5rem;
+  text-align: center;
+}
+
+.timesheet-mobile__empty {
+  align-content: center;
+  gap: 0.5rem;
+  color: var(--ui-text-muted);
+}
+
+.timesheet-mobile__empty span {
+  max-width: 18rem;
+  color: var(--ui-text-muted);
+  font-size: 0.8125rem;
+}
+
+.timesheet-mobile__days {
+  display: grid;
+  grid-template-columns: repeat(7, minmax(0, 1fr));
+  border-block-end: 1px solid var(--timesheets-rule);
+}
+
+.timesheet-mobile__day {
+  display: grid;
+  min-width: 0;
+  min-height: 5.25rem;
+  place-items: center;
+  align-content: center;
+  gap: 0.125rem;
+  padding: 0.5rem 0.125rem;
+  border-inline-end: 1px solid var(--timesheets-rule);
+  color: var(--ui-text-muted);
+  transition: background-color var(--timesheets-duration-fast) var(--timesheets-ease-out);
+}
+
+.timesheet-mobile__day:last-child {
+  border-inline-end: 0;
+}
+
+.timesheet-mobile__day span,
+.timesheet-mobile__day small {
+  overflow: hidden;
+  max-width: 100%;
+  font-size: 0.625rem;
+  line-height: 1rem;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.timesheet-mobile__day strong {
+  color: var(--ui-text-highlighted);
+  font-size: 0.875rem;
+}
+
+.timesheet-mobile__day small {
+  color: var(--ui-text-highlighted);
+  font-size: 0.875rem;
+  font-weight: 600;
+  line-height: 1.25rem;
+  font-variant-numeric: tabular-nums;
+}
+
+.timesheet-mobile__day--weekend {
+  background: var(--timesheets-color-weekend);
+}
+
+.timesheet-mobile__day--active {
+  background: var(--ui-primary);
+  color: var(--portal-on-primary, var(--ui-bg));
+}
+
+.timesheet-mobile__day--active strong,
+.timesheet-mobile__day--active small {
+  color: var(--portal-on-primary, var(--ui-bg));
+}
+
+.timesheet-mobile__day:focus-visible,
+.timesheet-mobile__entry:focus-visible {
+  position: relative;
+  z-index: 1;
+  outline: 3px solid var(--ui-primary);
+  outline-offset: -3px;
+}
+
+.timesheet-mobile__summary {
+  display: flex;
+  min-width: 0;
+  align-items: center;
+  justify-content: space-between;
+  gap: 1rem;
+  padding: 1rem;
+  border-block-end: 1px solid var(--timesheets-rule);
+}
+
+.timesheet-mobile__date,
+.timesheet-mobile__total {
+  color: var(--ui-text-highlighted);
+  font-weight: 650;
+}
+
+.timesheet-mobile__day-total {
+  display: grid;
+  justify-items: end;
+  gap: 0.125rem;
+  text-align: end;
+}
+
+.timesheet-mobile__day-total > span {
+  color: var(--ui-text-muted);
+  font-size: 0.6875rem;
+  font-weight: 500;
+  line-height: 1rem;
+}
+
+.timesheet-mobile__total {
+  font-size: 1.25rem;
+  line-height: 1.5rem;
+}
+
+.timesheet-mobile__total,
+.timesheet-mobile__duration {
+  font-variant-numeric: tabular-nums;
+}
+
+.timesheet-mobile__entries {
+  display: grid;
+}
+
+.timesheet-mobile__entry {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto;
+  min-width: 0;
+  min-height: 4.75rem;
+  align-items: center;
+  gap: 0.75rem;
+  padding: 0.875rem 1rem;
+  border-block-end: 1px solid var(--timesheets-rule);
+  text-align: start;
+}
+
+button.timesheet-mobile__entry {
+  cursor: pointer;
+}
+
+.timesheet-mobile__entry-copy {
+  display: grid;
+  min-width: 0;
+  gap: 0.125rem;
+}
+
+.timesheet-mobile__entry-copy small,
+.timesheet-mobile__entry-copy strong,
+.timesheet-mobile__entry-copy span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.timesheet-mobile__entry-copy small {
+  color: var(--ui-text-muted);
+  font-size: 0.75rem;
+}
+
+.timesheet-mobile__entry-copy strong {
+  color: var(--ui-text-highlighted);
+  font-size: 1rem;
+}
+
+.timesheet-mobile__entry-activity {
+  color: var(--ui-text-muted);
+  font-size: 0.875rem;
+}
+
+.timesheet-mobile__entry-copy .timesheet-mobile__entry-note {
+  margin-block-start: 0.125rem;
+  color: var(--ui-text-muted);
+  font-size: 0.75rem;
+}
+
+.timesheet-mobile__entry-meta {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+  gap: 0.5rem;
+}
+
+.timesheet-mobile__edit-cue {
+  width: 0.875rem;
+  height: 0.875rem;
+  color: var(--ui-primary);
+}
+
+.timesheet-mobile__duration {
+  color: var(--ui-text-highlighted);
+  font-size: 1.125rem;
+  font-weight: 650;
+}
+
+.timesheet-mobile__add {
+  margin: 0.75rem 1rem;
+  justify-self: start;
+}
+
+.timesheet-mobile button:disabled {
+  cursor: not-allowed;
+  opacity: 0.55;
+}
+
+@media (hover: hover) and (pointer: fine) {
+  .timesheet-mobile__day:hover,
+  button.timesheet-mobile__entry:hover {
+    background: var(--ui-bg-elevated);
+  }
+
+  .timesheet-mobile__day--active:hover {
+    background: var(--ui-primary);
+  }
+}
+
+@media (pointer: coarse) {
+  .timesheet-mobile button {
+    min-height: 3rem;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .timesheet-row-action,
+  .timesheet-mobile__day {
+    transition-duration: 0ms;
+  }
+}

package/app/components/TimesheetsActivityForm.vue

@@ -0,0 +1,61 @@
+<script setup lang="ts">
+import { z } from 'zod'
+
+export interface TimesheetsActivityFormModel {
+  name: string
+  billable: boolean
+}
+
+defineProps<{
+  editing: boolean
+  busy: boolean
+  showCancel: boolean
+}>()
+const emit = defineEmits<{
+  submit: []
+  cancel: []
+}>()
+const form = defineModel<TimesheetsActivityFormModel>({ required: true })
+const { t } = useI18n()
+const schema = computed(() =>
+  z.object({
+    name: z.string().trim().min(2, t('features.timesheets.validation.activityNameLength')).max(120),
+    billable: z.boolean()
+  })
+)
+</script>
+
+<template>
+  <UCard>
+    <template #header>
+      <div class="flex items-center justify-between gap-3">
+        <h2 class="font-semibold">
+          {{ editing ? t('features.timesheets.admin.editActivity') : t('features.timesheets.admin.newActivity') }}
+        </h2>
+        <UButton
+          v-if="editing"
+          type="button"
+          color="neutral"
+          variant="ghost"
+          icon="i-lucide-x"
+          :aria-label="t('features.timesheets.admin.close')"
+          @click="emit('cancel')"
+        />
+      </div>
+    </template>
+    <UForm :state="form" :schema="schema" class="space-y-4" @submit="emit('submit')">
+      <UFormField name="name" :label="t('features.timesheets.fields.activity')" required>
+        <UInput v-model="form.name" class="w-full" />
+      </UFormField>
+      <UCheckbox v-model="form.billable" :label="t('features.timesheets.billable')" />
+      <div class="flex justify-end gap-2">
+        <UButton v-if="showCancel" type="button" color="neutral" variant="outline" @click="emit('cancel')">
+          {{ t('features.timesheets.cancel') }}
+        </UButton>
+        <UButton type="submit" :loading="busy">
+          {{ editing ? t('features.timesheets.save') : t('features.timesheets.admin.createActivity') }}
+        </UButton>
+      </div>
+    </UForm>
+  </UCard>
+</template>