mirror of
https://github.com/solidtime-io/solidtime.git
synced 2026-06-15 05:22:44 +01:00
Compare commits
4 Commits
feature/us
...
1e93830672
| Author | SHA1 | Date | |
|---|---|---|---|
|
1e93830672 | ||
|
|
cb5c2547f4 | ||
|
|
13a25524f3 | ||
|
|
112f6aa6a6 |
@@ -9,9 +9,9 @@
|
||||
"ext-zip": "*",
|
||||
"brick/money": "^0.10.0",
|
||||
"datomatic/laravel-enum-helper": "^2.0.0",
|
||||
"dedoc/scramble": "^0.12.2",
|
||||
"dedoc/scramble": "^0.13.26",
|
||||
"filament/filament": "^3.2",
|
||||
"flowframe/laravel-trend": "^0.4.0",
|
||||
"flowframe/laravel-trend": "^0.5.0",
|
||||
"gotenberg/gotenberg-php": "^2.8",
|
||||
"guzzlehttp/guzzle": "^7.2",
|
||||
"inertiajs/inertia-laravel": "^2.0.3",
|
||||
|
||||
3103
composer.lock
generated
3103
composer.lock
generated
File diff suppressed because it is too large
Load Diff
@@ -62,4 +62,35 @@ describe('TimesheetCell', () => {
|
||||
expect(wrapper.emitted('update')).toBeUndefined();
|
||||
expect((input.element as HTMLInputElement).value).toBe(previousValue);
|
||||
});
|
||||
|
||||
it('shows a pending 0 (delete in flight) over the cell total', () => {
|
||||
const wrapper = mount(TimesheetCell, {
|
||||
props: {
|
||||
cell: buildCell(2 * 3600),
|
||||
dayIndex: 0,
|
||||
date: '2026-04-13',
|
||||
isToday: false,
|
||||
hasRunningEntry: false,
|
||||
pendingSeconds: 0,
|
||||
},
|
||||
});
|
||||
|
||||
// `??` (not `||`): a pending 0 must win over the 2h cell total.
|
||||
expect((wrapper.get('input').element as HTMLInputElement).value).toBe('');
|
||||
});
|
||||
|
||||
it('disables editing while the cell is saving', () => {
|
||||
const wrapper = mount(TimesheetCell, {
|
||||
props: {
|
||||
cell: buildCell(2 * 3600),
|
||||
dayIndex: 0,
|
||||
date: '2026-04-13',
|
||||
isToday: false,
|
||||
hasRunningEntry: false,
|
||||
saveStatus: 'saving',
|
||||
},
|
||||
});
|
||||
|
||||
expect((wrapper.get('input').element as HTMLInputElement).disabled).toBe(true);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,5 +1,8 @@
|
||||
<script setup lang="ts">
|
||||
import { computed } from 'vue';
|
||||
import { CheckIcon } from '@heroicons/vue/16/solid';
|
||||
import DurationSecondsInput from '@/packages/ui/src/Input/DurationSecondsInput.vue';
|
||||
import LoadingSpinner from '@/packages/ui/src/LoadingSpinner.vue';
|
||||
import {
|
||||
Tooltip,
|
||||
TooltipContent,
|
||||
@@ -7,18 +10,40 @@ import {
|
||||
TooltipTrigger,
|
||||
} from '@/packages/ui/src/tooltip';
|
||||
import type { TimesheetCell } from '@/utils/useTimesheetGrid';
|
||||
import type { CellSaveStatus } from '@/utils/timesheet/useTimesheetCellMutations';
|
||||
|
||||
defineProps<{
|
||||
const props = defineProps<{
|
||||
cell?: TimesheetCell;
|
||||
dayIndex: number;
|
||||
date: string;
|
||||
isToday: boolean;
|
||||
hasRunningEntry: boolean;
|
||||
saveStatus?: CellSaveStatus;
|
||||
pendingSeconds?: number;
|
||||
}>();
|
||||
|
||||
const emit = defineEmits<{
|
||||
update: [newSeconds: number];
|
||||
}>();
|
||||
|
||||
// Show the optimistic value while saving; `??` (not `||`) so a pending 0 (delete) wins.
|
||||
const displaySeconds = computed(() => props.pendingSeconds ?? props.cell?.totalSeconds ?? 0);
|
||||
const isSaving = computed(() => props.saveStatus === 'saving');
|
||||
|
||||
// Swap the border color (don't layer) to avoid same-specificity fights.
|
||||
const inputClass = computed(() => {
|
||||
const border = props.saveStatus === 'error' ? 'border-red-500/70' : 'border-input-border';
|
||||
return [
|
||||
'w-[80px] mx-auto text-center font-medium',
|
||||
'bg-transparent text-text-primary placeholder:text-text-quaternary',
|
||||
'rounded-lg border shadow-none',
|
||||
border,
|
||||
'hover:bg-card-background',
|
||||
'focus-visible:bg-tertiary focus-visible:border-transparent',
|
||||
'focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none',
|
||||
'disabled:cursor-wait disabled:opacity-70',
|
||||
].join(' ');
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -46,18 +71,26 @@ const emit = defineEmits<{
|
||||
<TooltipContent> Stop the running time entry to edit the timesheet </TooltipContent>
|
||||
</Tooltip>
|
||||
</TooltipProvider>
|
||||
<DurationSecondsInput
|
||||
v-else
|
||||
:model-value="cell?.totalSeconds ?? 0"
|
||||
default-unit="hours"
|
||||
placeholder="-"
|
||||
size="sm"
|
||||
input-class="w-[80px] mx-auto text-center font-medium
|
||||
bg-transparent text-text-primary placeholder:text-text-quaternary
|
||||
rounded-lg border border-input-border shadow-none
|
||||
hover:bg-card-background
|
||||
focus-visible:bg-tertiary focus-visible:border-transparent
|
||||
focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none"
|
||||
@commit="(seconds) => emit('update', seconds ?? 0)" />
|
||||
<template v-else>
|
||||
<span class="relative inline-flex items-center">
|
||||
<DurationSecondsInput
|
||||
:model-value="displaySeconds"
|
||||
default-unit="hours"
|
||||
placeholder="-"
|
||||
size="sm"
|
||||
:disabled="isSaving"
|
||||
:input-class="inputClass"
|
||||
@commit="(seconds) => emit('update', seconds ?? 0)" />
|
||||
<span
|
||||
v-if="saveStatus === 'saving' || saveStatus === 'saved'"
|
||||
class="pointer-events-none absolute left-full top-1/2 ml-1.5 flex -translate-y-1/2 items-center"
|
||||
:aria-label="saveStatus === 'saving' ? 'Saving' : 'Saved'">
|
||||
<LoadingSpinner
|
||||
v-if="saveStatus === 'saving'"
|
||||
class="h-3 w-3 m-0 text-text-tertiary" />
|
||||
<CheckIcon v-else class="h-3 w-3 text-text-tertiary" />
|
||||
</span>
|
||||
</span>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -15,6 +15,7 @@ import type {
|
||||
Task,
|
||||
} from '@/packages/api/src';
|
||||
import type { TimesheetRow as TimesheetRowType, TimesheetRowKey } from '@/utils/useTimesheetGrid';
|
||||
import type { CellSaveStatus } from '@/utils/timesheet/useTimesheetCellMutations';
|
||||
|
||||
const organization = inject<ComputedRef<Organization>>('organization');
|
||||
const dayjs = getDayJsInstance();
|
||||
@@ -36,6 +37,8 @@ defineProps<{
|
||||
createClient: (client: CreateClientBody) => Promise<Client | undefined>;
|
||||
createTag: (name: string) => Promise<Tag | undefined>;
|
||||
formatDuration: (seconds: number) => string;
|
||||
cellStatuses: Record<string, CellSaveStatus>;
|
||||
cellPendingSeconds: Record<string, number>;
|
||||
}>();
|
||||
|
||||
const emit = defineEmits<{
|
||||
@@ -60,7 +63,7 @@ const emit = defineEmits<{
|
||||
class="grid min-w-full w-max border-y border-default-background-separator"
|
||||
style="
|
||||
grid-template-columns:
|
||||
minmax(420px, 1fr) repeat(7, minmax(96px, 120px)) minmax(100px, auto)
|
||||
minmax(420px, 1fr) repeat(7, minmax(116px, 120px)) minmax(100px, auto)
|
||||
40px;
|
||||
">
|
||||
<!-- Header row -->
|
||||
@@ -100,6 +103,8 @@ const emit = defineEmits<{
|
||||
:create-client="createClient"
|
||||
:create-tag="createTag"
|
||||
:format-duration="formatDuration"
|
||||
:cell-statuses="cellStatuses"
|
||||
:cell-pending-seconds="cellPendingSeconds"
|
||||
@remove-row="$emit('remove-row', $event)"
|
||||
@cell-update="
|
||||
(dayIndex, seconds) => $emit('cell-update', row, dayIndex, seconds)
|
||||
|
||||
@@ -15,6 +15,10 @@ import type {
|
||||
Organization,
|
||||
} from '@/packages/api/src';
|
||||
import type { TimesheetRow, TimesheetRowKey } from '@/utils/useTimesheetGrid';
|
||||
import {
|
||||
makeCellStatusKey,
|
||||
type CellSaveStatus,
|
||||
} from '@/utils/timesheet/useTimesheetCellMutations';
|
||||
import { Button } from '@/packages/ui/src/Buttons';
|
||||
|
||||
const organization = inject<ComputedRef<Organization>>('organization');
|
||||
@@ -34,6 +38,8 @@ const props = defineProps<{
|
||||
createClient: (client: CreateClientBody) => Promise<Client | undefined>;
|
||||
createTag: (name: string) => Promise<Tag | undefined>;
|
||||
formatDuration: (seconds: number) => string;
|
||||
cellStatuses: Record<string, CellSaveStatus>;
|
||||
cellPendingSeconds: Record<string, number>;
|
||||
}>();
|
||||
|
||||
const emit = defineEmits<{
|
||||
@@ -109,6 +115,8 @@ function hasRunningEntry(dayIndex: number): boolean {
|
||||
:date="day"
|
||||
:is-today="day === todayDate"
|
||||
:has-running-entry="hasRunningEntry(dayIndex)"
|
||||
:save-status="cellStatuses[makeCellStatusKey(row.key, dayIndex)]"
|
||||
:pending-seconds="cellPendingSeconds[makeCellStatusKey(row.key, dayIndex)]"
|
||||
@update="(seconds) => emit('cellUpdate', dayIndex, seconds)" />
|
||||
|
||||
<!-- Row total -->
|
||||
|
||||
@@ -293,7 +293,7 @@ const page = usePage<{
|
||||
<div class="justify-self-end">
|
||||
<UpdateSidebarNotification></UpdateSidebarNotification>
|
||||
<ul
|
||||
class="border-t border-default-background-separator pt-3 gap-1 pr-2 flex justify-between items-center">
|
||||
class="border-t border-default-background-separator pt-3 gap-1 flex justify-between items-center">
|
||||
<UserSettingsIcon></UserSettingsIcon>
|
||||
|
||||
<NavigationSidebarItem
|
||||
|
||||
@@ -90,7 +90,12 @@ const weekRangeDisplay = computed(() => {
|
||||
});
|
||||
|
||||
// ── Cell / row mutation handlers ──────────────────────────────────
|
||||
const { handleCellUpdate } = useTimesheetCellMutations(weekDays, timeEntries, rows, removeSlot);
|
||||
const { handleCellUpdate, cellStatus, cellPendingSeconds } = useTimesheetCellMutations(
|
||||
weekDays,
|
||||
timeEntries,
|
||||
rows,
|
||||
removeSlot
|
||||
);
|
||||
|
||||
const { handleRowIdentityChange, handleAddRow } = useTimesheetRowMutations(
|
||||
mutations,
|
||||
@@ -167,6 +172,8 @@ async function createTag(name: string): Promise<Tag | undefined> {
|
||||
:create-client="createClient"
|
||||
:create-tag="createTag"
|
||||
:format-duration="formatDuration"
|
||||
:cell-statuses="cellStatus"
|
||||
:cell-pending-seconds="cellPendingSeconds"
|
||||
@remove-row="handleRemoveRow"
|
||||
@cell-update="handleCellUpdate"
|
||||
@project-task-change="
|
||||
|
||||
@@ -114,6 +114,8 @@ export type ApiToken = ApiTokenIndexResponse['data'][0];
|
||||
|
||||
export type DetailedInvoiceResponse = ZodiosResponseByAlias<SolidTimeApi, 'getInvoice'>;
|
||||
|
||||
export type DetailedInvoice = DetailedInvoiceResponse['data'];
|
||||
|
||||
export type InvoiceIndexEntry = ZodiosResponseByAlias<SolidTimeApi, 'getInvoices'>['data'][0];
|
||||
|
||||
export type UpdateInvoiceSettings = ZodiosBodyByAlias<SolidTimeApi, 'updateInvoiceSettings'>;
|
||||
|
||||
@@ -1886,6 +1886,54 @@ const endpoints = makeApi([
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
method: 'post',
|
||||
path: '/v1/organizations/:organization/invoices/:invoice/copy',
|
||||
alias: 'copyInvoice',
|
||||
requestFormat: 'json',
|
||||
parameters: [
|
||||
{
|
||||
name: 'body',
|
||||
type: 'Body',
|
||||
schema: z.object({ reference: z.string() }).passthrough(),
|
||||
},
|
||||
{
|
||||
name: 'organization',
|
||||
type: 'Path',
|
||||
schema: z.string(),
|
||||
},
|
||||
{
|
||||
name: 'invoice',
|
||||
type: 'Path',
|
||||
schema: z.string(),
|
||||
},
|
||||
],
|
||||
response: z.object({ data: DetailedInvoiceResource }).passthrough(),
|
||||
errors: [
|
||||
{
|
||||
status: 401,
|
||||
description: `Unauthenticated`,
|
||||
schema: z.object({ message: z.string() }).passthrough(),
|
||||
},
|
||||
{
|
||||
status: 403,
|
||||
description: `Authorization error`,
|
||||
schema: z.object({ message: z.string() }).passthrough(),
|
||||
},
|
||||
{
|
||||
status: 404,
|
||||
description: `Not found`,
|
||||
schema: z.object({ message: z.string() }).passthrough(),
|
||||
},
|
||||
{
|
||||
status: 422,
|
||||
description: `Validation error`,
|
||||
schema: z
|
||||
.object({ message: z.string(), errors: z.record(z.array(z.string())) })
|
||||
.passthrough(),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
method: 'get',
|
||||
path: '/v1/organizations/:organization/invoices/:invoice',
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
|
||||
import { ref } from 'vue';
|
||||
import { createPinia, setActivePinia } from 'pinia';
|
||||
import { useTimesheetCellMutations } from './useTimesheetCellMutations';
|
||||
import { useTimesheetCellMutations, makeCellStatusKey } from './useTimesheetCellMutations';
|
||||
import { api } from '@/packages/api/src';
|
||||
import type { TimesheetRow, TimesheetCell } from '@/utils/useTimesheetGrid';
|
||||
import type { TimeEntry } from '@/packages/api/src';
|
||||
@@ -549,3 +549,119 @@ describe('useTimesheetCellMutations.handleCellUpdate', () => {
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('useTimesheetCellMutations save status', () => {
|
||||
// Timer handles keep old fade-outs from clearing newer status, and
|
||||
// the same-cell saving guard prevents concurrent writes from stale rows.
|
||||
|
||||
it('does not let a stale fade-out timer clear a newer edit on the same cell', async () => {
|
||||
const { cellMutations } = setup([]);
|
||||
const row = buildEmptyRow('p-1');
|
||||
const key = makeCellStatusKey(row.key, 0);
|
||||
|
||||
await cellMutations.handleCellUpdate(row, 0, HOUR);
|
||||
expect(cellMutations.cellStatus.value[key]).toBe('saved');
|
||||
|
||||
// Re-edit the same cell partway through the first "saved" window.
|
||||
vi.advanceTimersByTime(1000);
|
||||
await cellMutations.handleCellUpdate(row, 0, 2 * HOUR);
|
||||
expect(cellMutations.cellPendingSeconds.value[key]).toBe(2 * HOUR);
|
||||
|
||||
// Advance past the FIRST timer's deadline: it must not wipe the newer state.
|
||||
vi.advanceTimersByTime(2000);
|
||||
expect(cellMutations.cellStatus.value[key]).toBe('saved');
|
||||
expect(cellMutations.cellPendingSeconds.value[key]).toBe(2 * HOUR);
|
||||
});
|
||||
|
||||
it('ignores another commit while the same cell is saving', async () => {
|
||||
const { cellMutations } = setup([]);
|
||||
const row = buildEmptyRow('p-1');
|
||||
const key = makeCellStatusKey(row.key, 0);
|
||||
|
||||
let release!: () => void;
|
||||
const gateA = new Promise<void>((res) => {
|
||||
release = () => res();
|
||||
});
|
||||
apiMocks.createTimeEntry.mockImplementationOnce(async () => {
|
||||
await gateA;
|
||||
return { data: { id: 'a' } } as never;
|
||||
});
|
||||
|
||||
const save = cellMutations.handleCellUpdate(row, 0, HOUR);
|
||||
expect(cellMutations.cellStatus.value[key]).toBe('saving');
|
||||
expect(cellMutations.cellPendingSeconds.value[key]).toBe(HOUR);
|
||||
|
||||
// The second commit would be planned from the same stale row, so it is ignored.
|
||||
await cellMutations.handleCellUpdate(row, 0, 2 * HOUR);
|
||||
expect(apiMocks.createTimeEntry).toHaveBeenCalledTimes(1);
|
||||
expect(cellMutations.cellPendingSeconds.value[key]).toBe(HOUR);
|
||||
|
||||
release();
|
||||
await save;
|
||||
expect(cellMutations.cellStatus.value[key]).toBe('saved');
|
||||
expect(cellMutations.cellPendingSeconds.value[key]).toBe(HOUR);
|
||||
});
|
||||
|
||||
it('marks error and drops the optimistic value when the save fails', async () => {
|
||||
const { cellMutations } = setup([]);
|
||||
const row = buildEmptyRow('p-1');
|
||||
const key = makeCellStatusKey(row.key, 0);
|
||||
|
||||
apiMocks.createTimeEntry.mockRejectedValueOnce(new Error('boom'));
|
||||
|
||||
await cellMutations.handleCellUpdate(row, 0, HOUR);
|
||||
|
||||
expect(cellMutations.cellStatus.value[key]).toBe('error');
|
||||
expect(cellMutations.cellPendingSeconds.value[key]).toBeUndefined();
|
||||
expect(addNotification).toHaveBeenCalledWith(
|
||||
'error',
|
||||
'Failed to update timesheet',
|
||||
expect.any(String)
|
||||
);
|
||||
});
|
||||
|
||||
it('marks error and drops the optimistic value when the day is full', async () => {
|
||||
// Block all but the last 2h, then ask for 3h → NoFreeWindowError.
|
||||
const blocker = entry('2026-04-10T00:00:00Z', '2026-04-10T22:00:00Z', { id: 'blocker' });
|
||||
const { cellMutations } = setup([blocker]);
|
||||
const row = buildEmptyRow('p-1');
|
||||
const key = makeCellStatusKey(row.key, 0);
|
||||
|
||||
await cellMutations.handleCellUpdate(row, 0, 3 * HOUR);
|
||||
|
||||
expect(cellMutations.cellStatus.value[key]).toBe('error');
|
||||
expect(cellMutations.cellPendingSeconds.value[key]).toBeUndefined();
|
||||
expect(addNotification).toHaveBeenCalledWith(
|
||||
'error',
|
||||
"This day can't fit any more work",
|
||||
expect.any(String)
|
||||
);
|
||||
});
|
||||
|
||||
it('creates no status when the committed value is unchanged', async () => {
|
||||
const cellEntry = entry('2026-04-10T09:00:00Z', '2026-04-10T10:00:00Z');
|
||||
const { cellMutations } = setup([cellEntry]);
|
||||
const row = buildRow('p-1', [cellEntry]);
|
||||
const key = makeCellStatusKey(row.key, 0);
|
||||
|
||||
await cellMutations.handleCellUpdate(row, 0, HOUR);
|
||||
|
||||
expect(cellMutations.cellStatus.value[key]).toBeUndefined();
|
||||
expect(cellMutations.cellPendingSeconds.value[key]).toBeUndefined();
|
||||
});
|
||||
|
||||
it('tracks save status independently for each cell', async () => {
|
||||
const { cellMutations } = setup([]);
|
||||
const row = buildEmptyRow('p-1');
|
||||
const mondayKey = makeCellStatusKey(row.key, 0);
|
||||
const tuesdayKey = makeCellStatusKey(row.key, 1);
|
||||
|
||||
await cellMutations.handleCellUpdate(row, 0, HOUR);
|
||||
await cellMutations.handleCellUpdate(row, 1, 2 * HOUR);
|
||||
|
||||
expect(cellMutations.cellStatus.value[mondayKey]).toBe('saved');
|
||||
expect(cellMutations.cellStatus.value[tuesdayKey]).toBe('saved');
|
||||
expect(cellMutations.cellPendingSeconds.value[mondayKey]).toBe(HOUR);
|
||||
expect(cellMutations.cellPendingSeconds.value[tuesdayKey]).toBe(2 * HOUR);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import type { Ref } from 'vue';
|
||||
import { ref, type Ref } from 'vue';
|
||||
import { useQueryClient } from '@tanstack/vue-query';
|
||||
import { api, type CreateTimeEntryBody, type TimeEntry } from '@/packages/api/src';
|
||||
import { formatHumanReadableDuration, getDayJsInstance } from '@/packages/ui/src/utils/time';
|
||||
@@ -19,6 +19,17 @@ import {
|
||||
type FreeWindow,
|
||||
} from './cellMath';
|
||||
|
||||
export type CellSaveStatus = 'saving' | 'saved' | 'error';
|
||||
|
||||
/** Map key for a cell's save state (row + day). */
|
||||
export function makeCellStatusKey(rowKey: TimesheetRowKey, dayIndex: number): string {
|
||||
return `${rowKey}:${dayIndex}`;
|
||||
}
|
||||
|
||||
/** How long the saved/error state stays visible before fading. */
|
||||
const SAVED_VISIBLE_MS = 2800;
|
||||
const ERROR_VISIBLE_MS = 2500;
|
||||
|
||||
/**
|
||||
* Cell-level edit dispatcher. Picks one of four strategies based on
|
||||
* the diff between current and requested totals:
|
||||
@@ -48,15 +59,58 @@ export function useTimesheetCellMutations(
|
||||
const queryClient = useQueryClient();
|
||||
const notifications = useNotificationsStore();
|
||||
|
||||
// Save status + the optimistic value shown while saving, so a saved cell
|
||||
// doesn't flicker back to its old total before the refetch lands.
|
||||
const cellStatus = ref<Record<string, CellSaveStatus>>({});
|
||||
const cellPendingSeconds = ref<Record<string, number>>({});
|
||||
const statusClearTimers: Record<string, ReturnType<typeof setTimeout>> = {};
|
||||
|
||||
function clearStatusTimer(key: string): void {
|
||||
clearTimeout(statusClearTimers[key]);
|
||||
delete statusClearTimers[key];
|
||||
}
|
||||
|
||||
function beginSaving(key: string, seconds: number): void {
|
||||
clearStatusTimer(key);
|
||||
cellPendingSeconds.value[key] = seconds;
|
||||
cellStatus.value[key] = 'saving';
|
||||
}
|
||||
|
||||
function markSaved(key: string): void {
|
||||
clearStatusTimer(key);
|
||||
cellStatus.value[key] = 'saved';
|
||||
statusClearTimers[key] = setTimeout(() => {
|
||||
delete cellStatus.value[key];
|
||||
delete cellPendingSeconds.value[key];
|
||||
delete statusClearTimers[key];
|
||||
}, SAVED_VISIBLE_MS);
|
||||
}
|
||||
|
||||
function markError(key: string): void {
|
||||
clearStatusTimer(key);
|
||||
cellStatus.value[key] = 'error';
|
||||
// Drop the optimistic value so the cell shows server truth after refetch.
|
||||
delete cellPendingSeconds.value[key];
|
||||
statusClearTimers[key] = setTimeout(() => {
|
||||
delete cellStatus.value[key];
|
||||
delete statusClearTimers[key];
|
||||
}, ERROR_VISIBLE_MS);
|
||||
}
|
||||
|
||||
async function handleCellUpdate(
|
||||
row: TimesheetRow,
|
||||
dayIndex: number,
|
||||
newTotalSeconds: number
|
||||
): Promise<void> {
|
||||
const statusKey = makeCellStatusKey(row.key, dayIndex);
|
||||
if (cellStatus.value[statusKey] === 'saving') return;
|
||||
|
||||
const cell = row.cells.get(dayIndex);
|
||||
const existingSeconds = cell?.totalSeconds ?? 0;
|
||||
if (newTotalSeconds === existingSeconds) return;
|
||||
|
||||
beginSaving(statusKey, newTotalSeconds);
|
||||
|
||||
// Capture row state before the mutation: a row that was empty
|
||||
// and shares identity with another slot collapses after the
|
||||
// first entry lands, so the entry naturally identity-routes to
|
||||
@@ -74,7 +128,9 @@ export function useTimesheetCellMutations(
|
||||
'Another row with the same project, task, billable status and tags already exists.'
|
||||
);
|
||||
}
|
||||
markSaved(statusKey);
|
||||
} catch (err) {
|
||||
markError(statusKey);
|
||||
if (err instanceof NoFreeWindowError) {
|
||||
const friendlyDuration = formatHumanReadableDuration(
|
||||
err.requiredSeconds,
|
||||
@@ -93,7 +149,6 @@ export function useTimesheetCellMutations(
|
||||
'Failed to update timesheet',
|
||||
'Please try again later.'
|
||||
);
|
||||
throw err;
|
||||
} finally {
|
||||
queryClient.invalidateQueries({ queryKey: ['timeEntries'] });
|
||||
}
|
||||
@@ -316,5 +371,5 @@ export function useTimesheetCellMutations(
|
||||
return best;
|
||||
}
|
||||
|
||||
return { handleCellUpdate };
|
||||
return { handleCellUpdate, cellStatus, cellPendingSeconds };
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user