fix: suppress state_referenced_locally warnings in ProductForm

Wrap all prop-derived $state initializers with untrack() to explicitly
signal that one-time capture from the product prop is intentional.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Piotr Oleszczyk 2026-02-27 16:37:00 +01:00
parent 43fcba4de6
commit c413e27768

View file

@ -1,4 +1,5 @@
<script lang="ts"> <script lang="ts">
import { untrack } from 'svelte';
import type { Product } from '$lib/types'; import type { Product } from '$lib/types';
import type { IngredientFunction, InteractionScope } from '$lib/types'; import type { IngredientFunction, InteractionScope } from '$lib/types';
import { Button } from '$lib/components/ui/button'; import { Button } from '$lib/components/ui/button';
@ -59,30 +60,30 @@
// ── Select reactive state ───────────────────────────────────────────────── // ── Select reactive state ─────────────────────────────────────────────────
let category = $state(product?.category ?? ''); let category = $state(untrack(() => product?.category ?? ''));
let recommendedTime = $state(product?.recommended_time ?? ''); let recommendedTime = $state(untrack(() => product?.recommended_time ?? ''));
let leaveOn = $state(product?.leave_on != null ? String(product.leave_on) : 'true'); let leaveOn = $state(untrack(() => (product?.leave_on != null ? String(product.leave_on) : 'true')));
let texture = $state(product?.texture ?? ''); let texture = $state(untrack(() => product?.texture ?? ''));
let absorptionSpeed = $state(product?.absorption_speed ?? ''); let absorptionSpeed = $state(untrack(() => product?.absorption_speed ?? ''));
let priceTier = $state(product?.price_tier ?? ''); let priceTier = $state(untrack(() => product?.price_tier ?? ''));
let fragranceFree = $state( let fragranceFree = $state(
product?.fragrance_free != null ? String(product.fragrance_free) : '' untrack(() => (product?.fragrance_free != null ? String(product.fragrance_free) : ''))
); );
let essentialOilsFree = $state( let essentialOilsFree = $state(
product?.essential_oils_free != null ? String(product.essential_oils_free) : '' untrack(() => (product?.essential_oils_free != null ? String(product.essential_oils_free) : ''))
); );
let alcoholDenatFree = $state( let alcoholDenatFree = $state(
product?.alcohol_denat_free != null ? String(product.alcohol_denat_free) : '' untrack(() => (product?.alcohol_denat_free != null ? String(product.alcohol_denat_free) : ''))
); );
let pregnancySafe = $state( let pregnancySafe = $state(
product?.pregnancy_safe != null ? String(product.pregnancy_safe) : '' untrack(() => (product?.pregnancy_safe != null ? String(product.pregnancy_safe) : ''))
); );
let personalRepurchaseIntent = $state( let personalRepurchaseIntent = $state(
product?.personal_repurchase_intent != null ? String(product.personal_repurchase_intent) : '' untrack(() => (product?.personal_repurchase_intent != null ? String(product.personal_repurchase_intent) : ''))
); );
// context rules tristate // context rules tristate
const cr = product?.context_rules; const cr = untrack(() => product?.context_rules);
let ctxAfterShaving = $state( let ctxAfterShaving = $state(
cr?.safe_after_shaving != null ? String(cr.safe_after_shaving) : '' cr?.safe_after_shaving != null ? String(cr.safe_after_shaving) : ''
); );
@ -97,7 +98,7 @@
// ── Effect profile ──────────────────────────────────────────────────────── // ── Effect profile ────────────────────────────────────────────────────────
const ep = product?.product_effect_profile; const ep = untrack(() => product?.product_effect_profile);
let effectValues = $state({ let effectValues = $state({
hydration_immediate: ep?.hydration_immediate ?? 0, hydration_immediate: ep?.hydration_immediate ?? 0,
hydration_long_term: ep?.hydration_long_term ?? 0, hydration_long_term: ep?.hydration_long_term ?? 0,
@ -125,13 +126,15 @@
}; };
let actives: ActiveRow[] = $state( let actives: ActiveRow[] = $state(
product?.actives?.map((a) => ({ untrack(() =>
name: a.name, product?.actives?.map((a) => ({
percent: a.percent != null ? String(a.percent) : '', name: a.name,
functions: [...(a.functions ?? [])] as IngredientFunction[], percent: a.percent != null ? String(a.percent) : '',
strength_level: a.strength_level != null ? String(a.strength_level) : '', functions: [...(a.functions ?? [])] as IngredientFunction[],
irritation_potential: a.irritation_potential != null ? String(a.irritation_potential) : '' strength_level: a.strength_level != null ? String(a.strength_level) : '',
})) ?? [] irritation_potential: a.irritation_potential != null ? String(a.irritation_potential) : ''
})) ?? []
)
); );
function addActive() { function addActive() {
@ -171,11 +174,13 @@
type IncompatibleRow = { target: string; scope: string; reason: string }; type IncompatibleRow = { target: string; scope: string; reason: string };
let incompatibleWith: IncompatibleRow[] = $state( let incompatibleWith: IncompatibleRow[] = $state(
product?.incompatible_with?.map((i) => ({ untrack(() =>
target: i.target, product?.incompatible_with?.map((i) => ({
scope: i.scope, target: i.target,
reason: i.reason ?? '' scope: i.scope,
})) ?? [] reason: i.reason ?? ''
})) ?? []
)
); );
function addIncompatible() { function addIncompatible() {