fix: repair more state assignment svelte/legacy run usage

apps/desktop/src/lib/commit/CommitCard.svelte

@@ -1,6 +1,4 @@
 <script lang="ts">
-	import { run } from 'svelte/legacy';
-
 	import CommitContextMenu from './CommitContextMenu.svelte';
 	import CommitDragItem from './CommitDragItem.svelte';
 	import { Project } from '$lib/backend/projects';
@@ -32,30 +30,7 @@
 	import { getTimeAndAuthor } from '@gitbutler/ui/utils/getTimeAndAuthor';
 	import { getTimeAgo } from '@gitbutler/ui/utils/timeAgo';
 	import { type Snippet } from 'svelte';
-
-	const branchController = getContext(BranchController);
-	const baseBranch = getContextStore(BaseBranch);
-	const project = getContext(Project);
-	const modeService = maybeGetContext(ModeService);
-
-	const commitStore = createCommitStore(commit);
-	run(() => {
-		commitStore.set(commit);
-	});
-
-	const currentCommitMessage = persistedCommitMessage(project.id, branch?.id || '');
-
-	let draggableCommitElement: HTMLElement = $state();
-	let contextMenu: ReturnType<typeof ContextMenu> | undefined = $state();
-	let files: RemoteFile[] = $state([]);
-	let showDetails = $state(false);
-
-	let conflicted = $derived(commit.conflicted);
-	let isAncestorMostConflicted = $derived(branch?.ancestorMostConflictedCommit?.id === commit.id);
-
-	async function loadFiles() {
-		files = await listRemoteCommitFiles(project.id, commit.id);
-	}
+	import { run } from 'svelte/legacy';
 
 	interface Props {
 		branch?: VirtualBranch | undefined;
@@ -83,6 +58,30 @@
 		filesToggleable = true
 	}: Props = $props();
 
+	const branchController = getContext(BranchController);
+	const baseBranch = getContextStore(BaseBranch);
+	const project = getContext(Project);
+	const modeService = maybeGetContext(ModeService);
+
+	const commitStore = createCommitStore(commit);
+	$effect(() => {
+		commitStore.set(commit);
+	});
+
+	const currentCommitMessage = persistedCommitMessage(project.id, branch?.id || '');
+
+	let draggableCommitElement = $state<HTMLElement>();
+	let contextMenu: ReturnType<typeof ContextMenu> | undefined = $state();
+	let files: RemoteFile[] = $state([]);
+	let showDetails = $state(false);
+
+	let conflicted = $derived(commit.conflicted);
+	let isAncestorMostConflicted = $derived(branch?.ancestorMostConflictedCommit?.id === commit.id);
+
+	async function loadFiles() {
+		files = await listRemoteCommitFiles(project.id, commit.id);
+	}
+
 	function toggleFiles() {
 		if (!filesToggleable) return;
 		showDetails = !showDetails;

apps/desktop/src/lib/commit/CommitMessageInput.svelte

@@ -1,6 +1,4 @@
 <script lang="ts">
-	import { run } from 'svelte/legacy';
-
 	import { PromptService } from '$lib/ai/promptService';
 	import { AIService } from '$lib/ai/service';
 	import { Project } from '$lib/backend/projects';
@@ -25,6 +23,7 @@
 	import Tooltip from '@gitbutler/ui/Tooltip.svelte';
 	import { isWhiteSpaceString } from '@gitbutler/ui/utils/string';
 	import { createEventDispatcher, onMount, tick } from 'svelte';
+	import { run } from 'svelte/legacy';
 	import { fly } from 'svelte/transition';
 
 	interface Props {

apps/desktop/src/lib/components/AIPromptEdit/AIPromptEdit.svelte

@@ -55,9 +55,9 @@
 			}}
 		/>
 
-		{#each $userPrompts as prompt}
+		{#each $userPrompts as _prompt, idx}
 			<Content
-				bind:prompt
+				bind:prompt={$userPrompts[idx] as UserPrompt}
 				displayMode="writable"
 				on:deletePrompt={(e) => deletePrompt(e.detail.prompt)}
 			/>

apps/desktop/src/lib/components/AIPromptEdit/Content.svelte

@@ -15,8 +15,8 @@
 
 	let expanded = $state(false);
 	let editing = $state(false);
-	let promptMessages = $state(structuredClone(prompt.prompt));
-	let promptName = $state(structuredClone(prompt.name));
+	let promptMessages = $state(structuredClone($state.snapshot(prompt.prompt)));
+	let promptName = $state(structuredClone($state.snapshot(prompt.name)));
 	let initialName = $derived(promptName);
 	let isInEditing = $state(false) as boolean;
 	let errorMessages = $state([]) as number[];
@@ -76,8 +76,8 @@
 	}
 
 	function cancel() {
-		promptMessages = structuredClone(prompt.prompt);
-		promptName = structuredClone(prompt.name);
+		promptMessages = structuredClone($state.snapshot(prompt.prompt));
+		promptName = structuredClone($state.snapshot(prompt.name));
 		editing = false;
 	}
 

apps/desktop/src/lib/components/AIPromptSelect.svelte

@@ -1,11 +1,10 @@
 <script lang="ts">
-	import { run } from 'svelte/legacy';
-
 	import { PromptService } from '$lib/ai/promptService';
 	import { Project } from '$lib/backend/projects';
 	import Select from '$lib/select/Select.svelte';
 	import SelectItem from '$lib/select/SelectItem.svelte';
 	import { getContext } from '@gitbutler/shared/context';
+	import { run } from 'svelte/legacy';
 	import type { Prompts, UserPrompt } from '$lib/ai/types';
 	import type { Persisted } from '@gitbutler/shared/persisted';
 
@@ -45,7 +44,7 @@
 		setAllPrompts($userPrompts);
 	});
 
-	run(() => {
+	$effect(() => {
 		if (!$selectedPromptId || !promptService.findPrompt(allPrompts, $selectedPromptId)) {
 			$selectedPromptId = defaultId;
 		}

apps/desktop/src/lib/components/Board.svelte

@@ -1,6 +1,4 @@
 <script lang="ts">
-	import { run } from 'svelte/legacy';
-
 	import BoardEmptyState from './BoardEmptyState.svelte';
 	import FullviewLoading from './FullviewLoading.svelte';
 	import BranchDropzone from '$lib/branch/BranchDropzone.svelte';
@@ -13,30 +11,33 @@
 	import { VirtualBranchService } from '$lib/vbranches/virtualBranch';
 	import { getContext } from '@gitbutler/shared/context';
 	import { flip } from 'svelte/animate';
+	import type { VirtualBranch } from '$lib/vbranches/types';
 
 	const vbranchService = getContext(VirtualBranchService);
 	const branchController = getContext(BranchController);
 	const error = vbranchService.error;
 	const branches = vbranchService.branches;
 
-	let dragged: HTMLDivElement | undefined = $state();
-	let dropZone: HTMLDivElement = $state();
+	let dragged = $state<HTMLDivElement>();
+	let dropZone = $state<HTMLDivElement>();
 
 	let dragHandle: any = $state();
 	let clone: any = $state();
-	run(() => {
+	$effect(() => {
 		if ($error) {
 			$showHistoryView = true;
 		}
 	});
-	let sortedBranches;
-	run(() => {
+
+	let sortedBranches = $state<VirtualBranch[]>();
+
+	$effect(() => {
 		sortedBranches = $branches?.sort((a, b) => a.order - b.order) || [];
 	});
 
 	const handleDragOver = throttle((e: MouseEvent & { currentTarget: HTMLDivElement }) => {
 		e.preventDefault();
-		if (!dragged) {
+		if (!dragged || !dropZone) {
 			return; // Something other than a lane is being dragged.
 		}
 
@@ -64,9 +65,11 @@
 
 		// Update sorted branch array manually.
 		if (currentPosition !== dropPosition) {
-			const el = sortedBranches.splice(currentPosition, 1);
-			sortedBranches.splice(dropPosition, 0, ...el);
-			sortedBranches = sortedBranches; // Redraws #each loop.
+			const el = sortedBranches?.splice(currentPosition, 1);
+			if (el) {
+				sortedBranches?.splice(dropPosition, 0, ...el);
+				sortedBranches = sortedBranches; // Redraws #each loop.
+			}
 		}
 	}, 200);
 
@@ -92,7 +95,7 @@
 		data-tauri-drag-region
 		ondrop={(e) => {
 			e.preventDefault();
-			if (!dragged) {
+			if (!dragged || !sortedBranches) {
 				return; // Something other than a lane was dropped.
 			}
 			branchController.updateBranchOrder(sortedBranches.map((b, i) => ({ id: b.id, order: i })));
@@ -105,42 +108,44 @@
 			bind:this={dropZone}
 			ondragover={(e) => handleDragOver(e)}
 		>
-			{#each sortedBranches as branch (branch.id)}
-				<div
-					role="presentation"
-					aria-label="Branch"
-					tabindex="-1"
-					class="branch draggable-branch"
-					draggable="true"
-					animate:flip={{ duration: 150 }}
-					onmousedown={(e) => (dragHandle = e.target)}
-					ondragstart={(e) => {
-						if (dragHandle.dataset.dragHandle === undefined) {
-							// We rely on elements with id `drag-handle` to initiate this drag
-							e.preventDefault();
-							e.stopPropagation();
-							return;
-						}
-						clone = cloneElement(e.currentTarget);
-						document.body.appendChild(clone);
-						// Get chromium to fire dragover & drop events
-						// https://stackoverflow.com/questions/6481094/html5-drag-and-drop-ondragover-not-firing-in-chrome/6483205#6483205
-						e.dataTransfer?.setData('text/html', 'd'); // cannot be empty string
-						e.dataTransfer?.setDragImage(clone, e.offsetX, e.offsetY); // Adds the padding
-						dragged = e.currentTarget;
-						dragged.style.opacity = '0.6';
-					}}
-					ondragend={() => {
-						if (dragged) {
-							dragged.style.opacity = '1';
-							dragged = undefined;
-						}
-						clone?.remove();
-					}}
-				>
-					<BranchLane {branch} />
-				</div>
-			{/each}
+			{#if sortedBranches}
+				{#each sortedBranches as branch (branch.id)}
+					<div
+						role="presentation"
+						aria-label="Branch"
+						tabindex="-1"
+						class="branch draggable-branch"
+						draggable="true"
+						animate:flip={{ duration: 150 }}
+						onmousedown={(e) => (dragHandle = e.target)}
+						ondragstart={(e) => {
+							if (dragHandle.dataset.dragHandle === undefined) {
+								// We rely on elements with id `drag-handle` to initiate this drag
+								e.preventDefault();
+								e.stopPropagation();
+								return;
+							}
+							clone = cloneElement(e.currentTarget);
+							document.body.appendChild(clone);
+							// Get chromium to fire dragover & drop events
+							// https://stackoverflow.com/questions/6481094/html5-drag-and-drop-ondragover-not-firing-in-chrome/6483205#6483205
+							e.dataTransfer?.setData('text/html', 'd'); // cannot be empty string
+							e.dataTransfer?.setDragImage(clone, e.offsetX, e.offsetY); // Adds the padding
+							dragged = e.currentTarget;
+							dragged.style.opacity = '0.6';
+						}}
+						ondragend={() => {
+							if (dragged) {
+								dragged.style.opacity = '1';
+								dragged = undefined;
+							}
+							clone?.remove();
+						}}
+					>
+						<BranchLane {branch} />
+					</div>
+				{/each}
+			{/if}
 		</div>
 
 		{#if $branches.length === 0}

apps/desktop/src/lib/components/BranchPreview.svelte

@@ -1,6 +1,4 @@
 <script lang="ts">
-	import { run } from 'svelte/legacy';
-
 	import BranchPreviewHeader from '../branch/BranchPreviewHeader.svelte';
 	import Resizer from '../shared/Resizer.svelte';
 	import { Project } from '$lib/backend/projects';
@@ -19,6 +17,7 @@
 	import { LineManagerFactory } from '@gitbutler/ui/commitLines/lineManager';
 	import lscache from 'lscache';
 	import { onMount, setContext } from 'svelte';
+	import { run } from 'svelte/legacy';
 	import { writable } from 'svelte/store';
 	import type { PullRequest } from '$lib/forge/interface/types';
 

apps/desktop/src/lib/history/SnapshotAttachment.svelte

@@ -20,12 +20,14 @@
 	}: Props = $props();
 
 	let isOpen: boolean = $state(false);
-	let el: HTMLElement = $state();
+	let el = $state<HTMLElement>();
 
-	let contentHeight: string = $state();
+	let contentHeight = $state<string>();
 
 	function setHeight() {
-		contentHeight = `calc(${pxToRem(el.scrollHeight)} + ${pxToRem(8)})`;
+		if (el) {
+			contentHeight = `calc(${pxToRem(el.scrollHeight)} + ${pxToRem(8)})`;
+		}
 	}
 
 	onMount(() => {

apps/desktop/src/lib/settings/CredentialCheck.svelte

@@ -1,6 +1,4 @@
 <script lang="ts">
-	import { run } from 'svelte/legacy';
-
 	import SectionCardDisclaimer from '../components/SectionCardDisclaimer.svelte';
 	import InfoMessage from '../shared/InfoMessage.svelte';
 	import Link from '../shared/Link.svelte';
@@ -21,19 +19,9 @@
 	const authService = getContext(AuthService);
 
 	type Check = { name: string; promise: Promise<any> };
-	let checks;
-	run(() => {
-		checks = [] as Check[];
-	});
-
-	let errors;
-	run(() => {
-		errors = 0;
-	});
-	let loading;
-	run(() => {
-		loading = false;
-	});
+	let checks = $state<Check[]>([]);
+	let errors = $state(0);
+	let loading = $state(false);
 
 	async function checkCredentials() {
 		if (!remoteName || !branchName) return;