fix: use untrack() in \$state initialisers to silence state_referenced_locally warnings

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-08 11:31:51 +01:00
parent b9b98f178f
commit edee98b552
13 changed files with 57 additions and 45 deletions

View File

@@ -1,4 +1,5 @@
<script lang="ts"> <script lang="ts">
import { untrack } from "svelte";
import { goto, invalidateAll } from "$app/navigation"; import { goto, invalidateAll } from "$app/navigation";
import { page } from "$app/state"; import { page } from "$app/state";
import { SvelteURLSearchParams } from "svelte/reactivity"; import { SvelteURLSearchParams } from "svelte/reactivity";
@@ -20,7 +21,7 @@
let deleteTarget: Article | null = $state(null); let deleteTarget: Article | null = $state(null);
let deleteOpen = $state(false); let deleteOpen = $state(false);
let deleting = $state(false); let deleting = $state(false);
let searchValue = $state(data.search ?? ""); let searchValue = $state(untrack(() => data.search ?? ""));
$effect(() => { searchValue = data.search ?? ""; }); $effect(() => { searchValue = data.search ?? ""; });
let searchTimeout: ReturnType<typeof setTimeout>; let searchTimeout: ReturnType<typeof setTimeout>;

View File

@@ -1,4 +1,5 @@
<script lang="ts"> <script lang="ts">
import { untrack } from "svelte";
import { goto } from "$app/navigation"; import { goto } from "$app/navigation";
import { toast } from "svelte-sonner"; import { toast } from "svelte-sonner";
import { _ } from "svelte-i18n"; import { _ } from "svelte-i18n";
@@ -16,18 +17,18 @@
const { data } = $props(); const { data } = $props();
let title = $state(data.article.title); let title = $state(untrack(() => data.article.title));
let slug = $state(data.article.slug); let slug = $state(untrack(() => data.article.slug));
let excerpt = $state(data.article.excerpt ?? ""); let excerpt = $state(untrack(() => data.article.excerpt ?? ""));
let content = $state(data.article.content ?? ""); let content = $state(untrack(() => data.article.content ?? ""));
let category = $state(data.article.category ?? ""); let category = $state(untrack(() => data.article.category ?? ""));
let tags = $state<string[]>(data.article.tags ?? []); let tags = $state<string[]>(untrack(() => data.article.tags ?? []));
let featured = $state(data.article.featured ?? false); let featured = $state(untrack(() => data.article.featured ?? false));
let publishDate = $state( let publishDate = $state(
data.article.publish_date ? new Date(data.article.publish_date).toISOString().slice(0, 16) : "", untrack(() => data.article.publish_date ? new Date(data.article.publish_date).toISOString().slice(0, 16) : ""),
); );
let imageId = $state<string | null>(data.article.image ?? null); let imageId = $state<string | null>(untrack(() => data.article.image ?? null));
let authorId = $state(data.article.author?.id ?? ""); let authorId = $state(untrack(() => data.article.author?.id ?? ""));
$effect(() => { $effect(() => {
title = data.article.title; title = data.article.title;
slug = data.article.slug; slug = data.article.slug;

View File

@@ -1,4 +1,5 @@
<script lang="ts"> <script lang="ts">
import { untrack } from "svelte";
import { goto, invalidateAll } from "$app/navigation"; import { goto, invalidateAll } from "$app/navigation";
import { page } from "$app/state"; import { page } from "$app/state";
import { SvelteURLSearchParams } from "svelte/reactivity"; import { SvelteURLSearchParams } from "svelte/reactivity";
@@ -17,7 +18,7 @@
let deleteTarget: { id: number; comment: string } | null = $state(null); let deleteTarget: { id: number; comment: string } | null = $state(null);
let deleteOpen = $state(false); let deleteOpen = $state(false);
let deleting = $state(false); let deleting = $state(false);
let searchValue = $state(data.search ?? ""); let searchValue = $state(untrack(() => data.search ?? ""));
$effect(() => { searchValue = data.search ?? ""; }); $effect(() => { searchValue = data.search ?? ""; });
let searchTimeout: ReturnType<typeof setTimeout>; let searchTimeout: ReturnType<typeof setTimeout>;

View File

@@ -1,4 +1,5 @@
<script lang="ts"> <script lang="ts">
import { untrack } from "svelte";
import { goto, invalidateAll } from "$app/navigation"; import { goto, invalidateAll } from "$app/navigation";
import { page } from "$app/state"; import { page } from "$app/state";
import { SvelteURLSearchParams } from "svelte/reactivity"; import { SvelteURLSearchParams } from "svelte/reactivity";
@@ -18,7 +19,7 @@
let deleteTarget: Recording | null = $state(null); let deleteTarget: Recording | null = $state(null);
let deleteOpen = $state(false); let deleteOpen = $state(false);
let deleting = $state(false); let deleting = $state(false);
let searchValue = $state(data.search ?? ""); let searchValue = $state(untrack(() => data.search ?? ""));
$effect(() => { searchValue = data.search ?? ""; }); $effect(() => { searchValue = data.search ?? ""; });
let searchTimeout: ReturnType<typeof setTimeout>; let searchTimeout: ReturnType<typeof setTimeout>;

View File

@@ -1,4 +1,5 @@
<script lang="ts"> <script lang="ts">
import { untrack } from "svelte";
import { goto, invalidateAll } from "$app/navigation"; import { goto, invalidateAll } from "$app/navigation";
import { page } from "$app/state"; import { page } from "$app/state";
import { SvelteURLSearchParams } from "svelte/reactivity"; import { SvelteURLSearchParams } from "svelte/reactivity";
@@ -15,7 +16,7 @@
const { data } = $props(); const { data } = $props();
let searchValue = $state(data.search ?? ""); let searchValue = $state(untrack(() => data.search ?? ""));
$effect(() => { searchValue = data.search ?? ""; }); $effect(() => { searchValue = data.search ?? ""; });
let searchTimeout: ReturnType<typeof setTimeout>; let searchTimeout: ReturnType<typeof setTimeout>;
let deleteTarget: User | null = $state(null); let deleteTarget: User | null = $state(null);

View File

@@ -1,4 +1,5 @@
<script lang="ts"> <script lang="ts">
import { untrack } from "svelte";
import { toast } from "svelte-sonner"; import { toast } from "svelte-sonner";
import { invalidateAll } from "$app/navigation"; import { invalidateAll } from "$app/navigation";
import { import {
@@ -16,13 +17,13 @@
const { data } = $props(); const { data } = $props();
let firstName = $state(data.user.first_name ?? ""); let firstName = $state(untrack(() => data.user.first_name ?? ""));
let lastName = $state(data.user.last_name ?? ""); let lastName = $state(untrack(() => data.user.last_name ?? ""));
let artistName = $state(data.user.artist_name ?? ""); let artistName = $state(untrack(() => data.user.artist_name ?? ""));
let avatarId = $state<string | null>(data.user.avatar ?? null); let avatarId = $state<string | null>(untrack(() => data.user.avatar ?? null));
let bannerId = $state<string | null>(data.user.banner ?? null); let bannerId = $state<string | null>(untrack(() => data.user.banner ?? null));
let photoId = $state<string | null>(data.user.photo ?? null); let photoId = $state<string | null>(untrack(() => data.user.photo ?? null));
let isAdmin = $state(data.user.is_admin ?? false); let isAdmin = $state(untrack(() => data.user.is_admin ?? false));
let saving = $state(false); let saving = $state(false);
$effect(() => { $effect(() => {
firstName = data.user.first_name ?? ""; firstName = data.user.first_name ?? "";

View File

@@ -1,4 +1,5 @@
<script lang="ts"> <script lang="ts">
import { untrack } from "svelte";
import { goto, invalidateAll } from "$app/navigation"; import { goto, invalidateAll } from "$app/navigation";
import { page } from "$app/state"; import { page } from "$app/state";
import { SvelteURLSearchParams } from "svelte/reactivity"; import { SvelteURLSearchParams } from "svelte/reactivity";
@@ -17,7 +18,7 @@
let deleteTarget: Video | null = $state(null); let deleteTarget: Video | null = $state(null);
let deleteOpen = $state(false); let deleteOpen = $state(false);
let deleting = $state(false); let deleting = $state(false);
let searchValue = $state(data.search ?? ""); let searchValue = $state(untrack(() => data.search ?? ""));
$effect(() => { searchValue = data.search ?? ""; }); $effect(() => { searchValue = data.search ?? ""; });
let searchTimeout: ReturnType<typeof setTimeout>; let searchTimeout: ReturnType<typeof setTimeout>;

View File

@@ -1,4 +1,5 @@
<script lang="ts"> <script lang="ts">
import { untrack } from "svelte";
import { goto } from "$app/navigation"; import { goto } from "$app/navigation";
import { toast } from "svelte-sonner"; import { toast } from "svelte-sonner";
import { _ } from "svelte-i18n"; import { _ } from "svelte-i18n";
@@ -15,19 +16,19 @@
const { data } = $props(); const { data } = $props();
let title = $state(data.video.title); let title = $state(untrack(() => data.video.title));
let slug = $state(data.video.slug); let slug = $state(untrack(() => data.video.slug));
let description = $state(data.video.description ?? ""); let description = $state(untrack(() => data.video.description ?? ""));
let tags = $state<string[]>(data.video.tags ?? []); let tags = $state<string[]>(untrack(() => data.video.tags ?? []));
let premium = $state(data.video.premium ?? false); let premium = $state(untrack(() => data.video.premium ?? false));
let featured = $state(data.video.featured ?? false); let featured = $state(untrack(() => data.video.featured ?? false));
let uploadDate = $state( let uploadDate = $state(
data.video.upload_date ? new Date(data.video.upload_date).toISOString().slice(0, 16) : "", untrack(() => data.video.upload_date ? new Date(data.video.upload_date).toISOString().slice(0, 16) : ""),
); );
let imageId = $state<string | null>(data.video.image ?? null); let imageId = $state<string | null>(untrack(() => data.video.image ?? null));
let movieId = $state<string | null>(data.video.movie ?? null); let movieId = $state<string | null>(untrack(() => data.video.movie ?? null));
let selectedModelIds = $state<string[]>( let selectedModelIds = $state<string[]>(
data.video.models?.map((m: { id: string }) => m.id) ?? [], untrack(() => data.video.models?.map((m: { id: string }) => m.id) ?? []),
); );
$effect(() => { $effect(() => {
title = data.video.title; title = data.video.title;

View File

@@ -1,4 +1,5 @@
<script lang="ts"> <script lang="ts">
import { untrack } from "svelte";
import { _ } from "svelte-i18n"; import { _ } from "svelte-i18n";
import { goto } from "$app/navigation"; import { goto } from "$app/navigation";
import { page } from "$app/state"; import { page } from "$app/state";
@@ -17,7 +18,7 @@
const timeAgo = new TimeAgo("en"); const timeAgo = new TimeAgo("en");
const { data } = $props(); const { data } = $props();
let searchValue = $state(data.search ?? ""); let searchValue = $state(untrack(() => data.search ?? ""));
$effect(() => { searchValue = data.search ?? ""; }); $effect(() => { searchValue = data.search ?? ""; });
let searchTimeout: ReturnType<typeof setTimeout>; let searchTimeout: ReturnType<typeof setTimeout>;

View File

@@ -12,7 +12,7 @@
import { Input } from "$lib/components/ui/input"; import { Input } from "$lib/components/ui/input";
import { Label } from "$lib/components/ui/label"; import { Label } from "$lib/components/ui/label";
import SexyBackground from "$lib/components/background/background.svelte"; import SexyBackground from "$lib/components/background/background.svelte";
import { onMount } from "svelte"; import { onMount, untrack } from "svelte";
import { goto, invalidateAll } from "$app/navigation"; import { goto, invalidateAll } from "$app/navigation";
import { getAssetUrl, isModel } from "$lib/api"; import { getAssetUrl, isModel } from "$lib/api";
import * as Alert from "$lib/components/ui/alert"; import * as Alert from "$lib/components/ui/alert";
@@ -27,18 +27,18 @@
const { data } = $props(); const { data } = $props();
let recordings = $state(data.recordings); let recordings = $state(untrack(() => data.recordings));
let deleteTarget = $state<string | null>(null); let deleteTarget = $state<string | null>(null);
let deleteOpen = $state(false); let deleteOpen = $state(false);
let deleting = $state(false); let deleting = $state(false);
let activeTab = $state("settings"); let activeTab = $state("settings");
let firstName = $state(data.authStatus.user!.first_name); let firstName = $state(untrack(() => data.authStatus.user!.first_name));
let lastName = $state(data.authStatus.user!.last_name); let lastName = $state(untrack(() => data.authStatus.user!.last_name));
let artistName = $state(data.authStatus.user!.artist_name); let artistName = $state(untrack(() => data.authStatus.user!.artist_name));
let description = $state(data.authStatus.user!.description); let description = $state(untrack(() => data.authStatus.user!.description));
let tags = $state(data.authStatus.user!.tags ?? undefined); let tags = $state(untrack(() => data.authStatus.user!.tags ?? undefined));
$effect(() => { $effect(() => {
recordings = data.recordings; recordings = data.recordings;
firstName = data.authStatus.user!.first_name; firstName = data.authStatus.user!.first_name;
@@ -49,7 +49,7 @@
email = data.authStatus.user!.email; email = data.authStatus.user!.email;
}); });
let email = $state(data.authStatus.user!.email); let email = $state(untrack(() => data.authStatus.user!.email));
let password = $state(""); let password = $state("");
let confirmPassword = $state(""); let confirmPassword = $state("");

View File

@@ -1,4 +1,5 @@
<script lang="ts"> <script lang="ts">
import { untrack } from "svelte";
import { _ } from "svelte-i18n"; import { _ } from "svelte-i18n";
import { goto } from "$app/navigation"; import { goto } from "$app/navigation";
import { page } from "$app/state"; import { page } from "$app/state";
@@ -14,7 +15,7 @@
const { data } = $props(); const { data } = $props();
let searchValue = $state(data.search ?? ""); let searchValue = $state(untrack(() => data.search ?? ""));
$effect(() => { searchValue = data.search ?? ""; }); $effect(() => { searchValue = data.search ?? ""; });
let searchTimeout: ReturnType<typeof setTimeout>; let searchTimeout: ReturnType<typeof setTimeout>;

View File

@@ -1,4 +1,5 @@
<script lang="ts"> <script lang="ts">
import { untrack } from "svelte";
import { _ } from "svelte-i18n"; import { _ } from "svelte-i18n";
import { goto } from "$app/navigation"; import { goto } from "$app/navigation";
import { page } from "$app/state"; import { page } from "$app/state";
@@ -17,7 +18,7 @@
const timeAgo = new TimeAgo("en"); const timeAgo = new TimeAgo("en");
const { data } = $props(); const { data } = $props();
let searchValue = $state(data.search ?? ""); let searchValue = $state(untrack(() => data.search ?? ""));
$effect(() => { $effect(() => {
searchValue = data.search ?? ""; searchValue = data.search ?? "";
}); });

View File

@@ -1,4 +1,5 @@
<script lang="ts"> <script lang="ts">
import { untrack } from "svelte";
import { _ } from "svelte-i18n"; import { _ } from "svelte-i18n";
import { Button } from "$lib/components/ui/button"; import { Button } from "$lib/components/ui/button";
import { Card, CardContent } from "$lib/components/ui/card"; import { Card, CardContent } from "$lib/components/ui/card";
@@ -28,8 +29,8 @@
const { data } = $props(); const { data } = $props();
const timeAgo = new TimeAgo("en"); const timeAgo = new TimeAgo("en");
let isLiked = $state(data.likeStatus.liked); let isLiked = $state(untrack(() => data.likeStatus.liked));
let likesCount = $state(data.video.likes_count || 0); let likesCount = $state(untrack(() => data.video.likes_count || 0));
$effect(() => { $effect(() => {
isLiked = data.likeStatus.liked; isLiked = data.likeStatus.liked;
likesCount = data.video.likes_count || 0; likesCount = data.video.likes_count || 0;