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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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