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