popertots/Crussell
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(frontend): Svelte 5 reactivity, each block keys, and path resolution

Browse Source 
Add proper keys to #each blocks across 15+ components to fix reordering bugs. Replace new Date() with SvelteDate in reactive contexts. Use $derived for computed values (totalPages). Use resolve() from $app/paths for all internal navigation hrefs. Add ARIA labels and keyboard accessibility to NavBar mobile menu. Remove unused handleRetry from UserPaymentModal.

Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent)

Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
This commit is contained in:
popertots
2026-06-04 01:08:36 +01:00
co-authored by Sisyphus
parent c76c3f52f7
commit 6c16d65476
33 changed files with 417 additions and 300 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/lib/components/admin/BookingCreateModal.svelte
+8 -8
View File
@@ -85,7 +85,7 @@
let selectedTime = $state<string | null>(null);
let workingHours = $state<Record<string, DayHours> | null>(null);
let availableHours = $state<Record<string, DayAvailability> | null>(null);
let loadingWorkingHours = $state(false);
let _loadingWorkingHours = $state(false);
let loadingAvailableHours = $state(false);
let hoursRangeGeneration = $state(0);
let hoursMonthGeneration = $state(0);
@@ -340,7 +340,7 @@
hoursRangeGeneration++;
const gen = hoursRangeGeneration;
loadingWorkingHours = true;
_loadingWorkingHours = true;
loadingAvailableHours = true;
try {
@@ -388,7 +388,7 @@
console.error('Failed to fetch hours', err);
toast.error('Failed to load availability');
} finally {
loadingWorkingHours = false;
_loadingWorkingHours = false;
loadingAvailableHours = false;
}
}
@@ -410,7 +410,7 @@
hoursMonthGeneration++;
const gen = hoursMonthGeneration;
loadingWorkingHours = true;
_loadingWorkingHours = true;
loadingAvailableHours = true;
try {
@@ -453,7 +453,7 @@
console.error('Failed to fetch hours', err);
toast.error('Failed to load availability');
} finally {
loadingWorkingHours = false;
_loadingWorkingHours = false;
loadingAvailableHours = false;
loadingMonthKeys = new Set([...loadingMonthKeys].filter((k) => k !== monthKey));
}
@@ -547,7 +547,7 @@
return;
}
const now = new Date();
const now = new SvelteDate();
const diff = reservationExpiresAt.getTime() - now.getTime();
if (diff <= 0) {
@@ -862,7 +862,7 @@
<div class="max-h-[300px] overflow-y-auto rounded-md border border-gray-200">
{#if loadingUsers}
<div class="space-y-2 p-2">
{#each Array(3) as _}
{#each Array(3) as _, i (i)}
<Skeleton class="h-10 w-full" />
{/each}
</div>
@@ -970,7 +970,7 @@
<Card.Content class="space-y-4">
{#if loadingServices}
<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
{#each Array(4) as _}
{#each Array(4) as _, i (i)}
<Skeleton class="h-28 w-full" />
{/each}
</div>