fix: replace {__} workaround with clean range() helper in Svelte templates

This commit is contained in:
2026-07-11 12:50:13 +01:00
parent d172adf392
commit 294d844493
21 changed files with 71 additions and 71 deletions
+10 -14
View File
@@ -8,6 +8,7 @@
import { apiFetch } from '$lib/utils/api';
import UserBookingModal from '$lib/components/account/UserBookingModal.svelte';
import { isValidUKPhone, formatPhoneDisplay, toE164UK } from '$lib/utils/phone';
import { range } from '$lib/utils/format';
import { savedCardsStore, type SavedCard } from '$lib/stores/savedCards.svelte';
// zxcvbn-ts imports
@@ -1284,8 +1285,7 @@
</div>
<Card.Root>
<Card.Content class="space-y-4 pt-6">
{#each Array(5) as __, i (i)}
{__}
{#each range(5) as i (i)}
<Skeleton class="h-12 w-full" />
{/each}
</Card.Content>
@@ -1523,9 +1523,8 @@
</Dialog.Root>
{#if loadingUser}
{#each Array(6) as __, i (i)}
{__}
<Skeleton class="h-12 w-full" />
{#each range(6) as i (i)}
<Skeleton class="h-12 w-full" />
{/each}
{:else if userData}
<div class="grid gap-4 md:grid-cols-2">
@@ -1723,9 +1722,8 @@
</div>
<div class="grid grid-cols-5 gap-3 sm:grid-cols-10">
{#each Array(10) as __, i (i)}
{__}
{@const slotNum = i + 1}
{#each range(10) as i (i)}
{@const slotNum = i + 1}
{@const rot = ((slotNum * 37 + 13) % 7) - 3}
{#if slotNum <= (stamps > 0 ? stamps % 10 || 10 : 0)}
<div
@@ -1797,9 +1795,8 @@
</Card.Header>
<Card.Content class="space-y-2">
{#if loadingUpcoming}
{#each Array(3) as __, i (i)}
{__}
<Skeleton class="h-16 w-full" />
{#each range(3) as i (i)}
<Skeleton class="h-16 w-full" />
{/each}
{:else}
{#each upcomingBookings as b (b.id)}
@@ -1852,9 +1849,8 @@
</Card.Header>
<Card.Content class="space-y-2">
{#if loadingPast}
{#each Array(5) as __, i (i)}
{__}
<Skeleton class="h-16 w-full" />
{#each range(5) as i (i)}
<Skeleton class="h-16 w-full" />
{/each}
{:else if pastBookings.length === 0}
<div class="py-4 text-center text-gray-500">No past bookings</div>
@@ -8,6 +8,7 @@
import { apiFetch } from '$lib/utils/api';
import { Skeleton } from '$lib/components/ui/skeleton';
import { Button } from '$lib/components/ui/button';
import { range } from '$lib/utils/format';
import { Checkbox } from '$lib/components/ui/checkbox';
import ApprovalModal from '$lib/components/admin/ApprovalModal.svelte';
import BookingModal from '$lib/components/admin/BookingModal.svelte';
@@ -367,8 +368,7 @@
{#if pageState === 'loading'}
<div class="mx-auto max-w-3xl space-y-4 p-6 pt-24">
<Skeleton class="h-8 w-48" />
{#each Array(5) as __, i (i)}
{__}
{#each range(5) as i (i)}
<Skeleton class="h-24 w-full" />
{/each}
</div>
+2 -3
View File
@@ -5,7 +5,7 @@
import { Skeleton } from '$lib/components/ui/skeleton/index.js';
import { toast } from 'svelte-sonner';
import { apiFetch } from '$lib/utils/api';
import { formatDuration } from '$lib/utils/format';
import { formatDuration, range } from '$lib/utils/format';
type Service = {
id: string;
@@ -62,8 +62,7 @@
{#if servicesLoading}
<div class="space-y-4">
{#each Array(5) as __, i (i)}
{__}
{#each range(5) as i (i)}
<Card.Root class="shadow-sm">
<Card.Content>
<div class="flex items-start justify-between">
+3 -4
View File
@@ -8,6 +8,7 @@
import { toast } from 'svelte-sonner';
import { SvelteDate } from 'svelte/reactivity';
import { fly } from 'svelte/transition';
import { range } from '$lib/utils/format';
import UserBookingModal from '$lib/components/account/UserBookingModal.svelte';
import type { Booking, BookingService } from '$lib/types/booking';
import { Button } from '$lib/components/ui/button';
@@ -208,8 +209,7 @@
<div class="h-8 w-44 rounded-lg bg-gray-200"></div>
<div class="h-4 w-64 rounded bg-gray-200"></div>
<div class="space-y-4 pt-2">
{#each Array(3) as __, i (i)}
{__}
{#each range(3) as i (i)}
<div class="rounded-xl border bg-white p-5 shadow-sm">
<div class="mb-3 flex items-center gap-3">
<div class="h-4 w-24 rounded bg-gray-200"></div>
@@ -242,8 +242,7 @@
{#if loading}
<div class="space-y-6">
{#each Array(3) as __, i (i)}
{__}
{#each range(3) as i (i)}
<div class="animate-pulse rounded-xl border bg-white p-5 shadow-sm">
<div class="mb-3 flex items-center gap-3">
<div class="h-4 w-24 rounded bg-gray-200"></div>