diff --git a/apps/whispering/src-tauri/Cargo.toml b/apps/whispering/src-tauri/Cargo.toml
index 09fc1d185c..14e5d63727 100644
--- a/apps/whispering/src-tauri/Cargo.toml
+++ b/apps/whispering/src-tauri/Cargo.toml
@@ -12,6 +12,10 @@ cargo-target-macos-version = "10.15"
 
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
 
+[[bin]]
+name = "whispering"
+path = "src/main.rs"
+
 [lib]
 # The `_lib` suffix may seem redundant but it is necessary
 # to make the lib name unique and wouldn't conflict with the bin name.
diff --git a/apps/whispering/src-tauri/tauri.conf.json b/apps/whispering/src-tauri/tauri.conf.json
index 17488314d7..03e586b7d1 100644
--- a/apps/whispering/src-tauri/tauri.conf.json
+++ b/apps/whispering/src-tauri/tauri.conf.json
@@ -21,9 +21,8 @@
 		"createUpdaterArtifacts": true,
 		"macOS": {
 			"entitlements": "entitlements.plist",
-			"hardenedRuntime": true,
-			"minimumSystemVersion": "10.15",
-			"signingIdentity": "Developer ID Application: Braden Wong (3C7J97QA5Z)"
+			"hardenedRuntime": false,
+			"minimumSystemVersion": "10.15"
 		},
 		"linux": {
 			"appimage": {
diff --git a/apps/whispering/src/lib/commands.ts b/apps/whispering/src/lib/commands.ts
index aaf9c02d20..ecbb67ebf7 100644
--- a/apps/whispering/src/lib/commands.ts
+++ b/apps/whispering/src/lib/commands.ts
@@ -1,61 +1,86 @@
 import { rpc } from '$lib/query';
+
 import type { ShortcutTriggerState } from './services/_shortcut-trigger-state';
 
 type SatisfiedCommand = {
+	callback: () => void;
 	id: string;
-	title: string;
 	on: ShortcutTriggerState;
-	callback: () => void;
+	title: string;
 };
 
 export const commands = [
 	{
-		id: 'pushToTalk',
 		title: 'Push to talk',
-		on: 'Both',
 		callback: () => rpc.commands.toggleManualRecording.execute(undefined),
+		id: 'pushToTalk',
+		on: 'Both',
 	},
 	{
-		id: 'toggleManualRecording',
 		title: 'Toggle recording',
-		on: 'Pressed',
 		callback: () => rpc.commands.toggleManualRecording.execute(undefined),
+		id: 'toggleManualRecording',
+		on: 'Pressed',
 	},
 	{
-		id: 'startManualRecording',
 		title: 'Start recording',
-		on: 'Pressed',
 		callback: () => rpc.commands.startManualRecording.execute(undefined),
+		id: 'startManualRecording',
+		on: 'Pressed',
 	},
 	{
-		id: 'stopManualRecording',
 		title: 'Stop recording',
-		on: 'Pressed',
 		callback: () => rpc.commands.stopManualRecording.execute(undefined),
+		id: 'stopManualRecording',
+		on: 'Pressed',
 	},
 	{
-		id: 'cancelManualRecording',
 		title: 'Cancel recording',
-		on: 'Pressed',
 		callback: () => rpc.commands.cancelManualRecording.execute(undefined),
+		id: 'cancelManualRecording',
+		on: 'Pressed',
 	},
 	{
-		id: 'startVadRecording',
 		title: 'Start voice activated recording',
-		on: 'Pressed',
 		callback: () => rpc.commands.startVadRecording.execute(undefined),
+		id: 'startVadRecording',
+		on: 'Pressed',
 	},
 	{
-		id: 'stopVadRecording',
 		title: 'Stop voice activated recording',
-		on: 'Pressed',
 		callback: () => rpc.commands.stopVadRecording.execute(undefined),
+		id: 'stopVadRecording',
+		on: 'Pressed',
 	},
 	{
-		id: 'toggleVadRecording',
 		title: 'Toggle voice activated recording',
-		on: 'Pressed',
 		callback: () => rpc.commands.toggleVadRecording.execute(undefined),
+		id: 'toggleVadRecording',
+		on: 'Pressed',
+	},
+	{
+		title: 'Cycle through favorite output languages',
+		callback: () => rpc.commands.toggleOutputLanguage.execute(undefined),
+		id: 'toggleOutputLanguage',
+		on: 'Pressed',
+	},
+	{
+		title: 'Switch to favorite language #1',
+		callback: () => rpc.commands.setOutputLanguageSlot.execute({ slot: 1 }),
+		id: 'setOutputLanguageSlot1',
+		on: 'Pressed',
+	},
+	{
+		title: 'Switch to favorite language #2',
+		callback: () => rpc.commands.setOutputLanguageSlot.execute({ slot: 2 }),
+		id: 'setOutputLanguageSlot2',
+		on: 'Pressed',
+	},
+	{
+		title: 'Switch to favorite language #3',
+		callback: () => rpc.commands.setOutputLanguageSlot.execute({ slot: 3 }),
+		id: 'setOutputLanguageSlot3',
+		on: 'Pressed',
 	},
 ] as const satisfies SatisfiedCommand[];
 
diff --git a/apps/whispering/src/lib/components/ConfirmationDialog.svelte b/apps/whispering/src/lib/components/ConfirmationDialog.svelte
index 38bc4ad8c3..e70717cb77 100644
--- a/apps/whispering/src/lib/components/ConfirmationDialog.svelte
+++ b/apps/whispering/src/lib/components/ConfirmationDialog.svelte
@@ -8,29 +8,26 @@
 		let confirmText = $state('');
 		let onConfirm = () => {};
 		return {
+			close() {
+				isOpen = false;
+			},
+			get confirmText() {
+				return confirmText;
+			},
 			get isOpen() {
 				return isOpen;
 			},
 			set isOpen(v) {
 				isOpen = v;
 			},
-			get title() {
-				return title;
-			},
-			get subtitle() {
-				return subtitle;
-			},
-			get confirmText() {
-				return confirmText;
-			},
 			get onConfirm() {
 				return onConfirm;
 			},
 			open(dialog: {
-				title: string;
-				subtitle: string;
 				confirmText: string;
 				onConfirm: () => void;
+				subtitle: string;
+				title: string;
 			}) {
 				title = dialog.title;
 				subtitle = dialog.subtitle;
@@ -38,8 +35,11 @@
 				onConfirm = dialog.onConfirm;
 				isOpen = true;
 			},
-			close() {
-				isOpen = false;
+			get subtitle() {
+				return subtitle;
+			},
+			get title() {
+				return title;
 			},
 		};
 	}
diff --git a/apps/whispering/src/lib/components/MoreDetailsDialog.svelte b/apps/whispering/src/lib/components/MoreDetailsDialog.svelte
index 129b0dee0c..107f0d30b0 100644
--- a/apps/whispering/src/lib/components/MoreDetailsDialog.svelte
+++ b/apps/whispering/src/lib/components/MoreDetailsDialog.svelte
@@ -13,17 +13,8 @@
 		>([]);
 
 		return {
-			get isOpen() {
-				return isOpen;
-			},
-			set isOpen(value: boolean) {
-				isOpen = value;
-			},
-			get title() {
-				return title;
-			},
-			get description() {
-				return description;
+			get buttons() {
+				return buttons;
 			},
 			get content() {
 				if (typeof content === 'string') {
@@ -34,18 +25,24 @@
 				}
 				return JSON.stringify(content, null, 2);
 			},
-			get buttons() {
-				return buttons;
+			get description() {
+				return description;
+			},
+			get isOpen() {
+				return isOpen;
+			},
+			set isOpen(value: boolean) {
+				isOpen = value;
 			},
 			open: (payload: {
-				title: string;
-				description: string;
-				content: unknown;
 				buttons?: {
 					label: string;
 					onClick: () => void;
 					variant?: 'default' | 'destructive';
 				}[];
+				content: unknown;
+				description: string;
+				title: string;
 			}) => {
 				title = payload.title;
 				description = payload.description;
@@ -53,13 +50,16 @@
 				buttons = payload.buttons ?? [];
 				isOpen = true;
 			},
+			get title() {
+				return title;
+			},
 		};
 	})();
 </script>
 
 <script lang="ts">
-	import * as Dialog from '@repo/ui/dialog';
 	import { Button } from '@repo/ui/button';
+	import * as Dialog from '@repo/ui/dialog';
 </script>
 
 <Dialog.Root bind:open={moreDetailsDialog.isOpen}>
diff --git a/apps/whispering/src/lib/components/NavItems.svelte b/apps/whispering/src/lib/components/NavItems.svelte
index 321e34cd62..a212e458dd 100644
--- a/apps/whispering/src/lib/components/NavItems.svelte
+++ b/apps/whispering/src/lib/components/NavItems.svelte
@@ -1,10 +1,7 @@
 <script lang="ts">
 	import { page } from '$app/state';
-	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import { GithubIcon } from '$lib/components/icons';
-	import * as DropdownMenu from '@repo/ui/dropdown-menu';
-	import { cn } from '@repo/ui/utils';
-	import { LogicalSize, getCurrentWindow } from '@tauri-apps/api/window';
+	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import {
 		LayersIcon,
 		ListIcon,
@@ -14,6 +11,9 @@
 		SettingsIcon,
 		SunIcon,
 	} from '@lucide/svelte';
+	import * as DropdownMenu from '@repo/ui/dropdown-menu';
+	import { cn } from '@repo/ui/utils';
+	import { getCurrentWindow, LogicalSize } from '@tauri-apps/api/window';
 	import { toggleMode } from 'mode-watcher';
 
 	let {
@@ -23,69 +23,69 @@
 
 	const navItems = [
 		{
-			label: 'Recordings',
+			href: '/recordings',
 			icon: ListIcon,
+			label: 'Recordings',
 			type: 'anchor',
-			href: '/recordings',
 		},
 		{
-			label: 'Transformations',
+			href: '/transformations',
 			icon: LayersIcon,
+			label: 'Transformations',
 			type: 'anchor',
-			href: '/transformations',
 		},
 		{
-			label: 'Settings',
+			activePathPrefix: '/settings',
+			href: '/settings',
 			icon: SettingsIcon,
+			label: 'Settings',
 			type: 'anchor',
-			href: '/settings',
-			activePathPrefix: '/settings',
 		},
 		{
-			label: 'View project on GitHub',
-			icon: GithubIcon,
+			external: true,
 			href: 'https://github.com/epicenter-so/epicenter',
+			icon: GithubIcon,
+			label: 'View project on GitHub',
 			type: 'anchor',
-			external: true,
 		},
 		{
-			label: 'Toggle dark mode',
+			action: toggleMode,
 			icon: SunIcon,
+			label: 'Toggle dark mode',
 			type: 'theme',
-			action: toggleMode,
 		},
 		...(window.__TAURI_INTERNALS__
 			? ([
 					{
-						label: 'Minimize',
+						action: () => getCurrentWindow().setSize(new LogicalSize(72, 84)),
 						icon: Minimize2Icon,
+						label: 'Minimize',
 						type: 'button',
-						action: () => getCurrentWindow().setSize(new LogicalSize(72, 84)),
 					},
 				] as const)
 			: []),
 	] satisfies NavItem[];
 
 	type BaseNavItem = {
-		label: string;
 		icon: unknown;
+		label: string;
 	};
 
 	type AnchorItem = BaseNavItem & {
-		type: 'anchor';
-		href: string;
-		external?: boolean;
 		activePathPrefix?: string;
+		external?: boolean;
+		href: string;
+		type: 'anchor';
 	};
 
 	type ButtonItem = BaseNavItem & {
-		type: 'button';
 		action: () => void;
+		type: 'button';
 	};
 
 	type ThemeItem = BaseNavItem & {
-		type: 'theme';
 		action: () => void;
+		type: 'theme';
 	};
 
 	type NavItem = AnchorItem | ButtonItem | ThemeItem;
diff --git a/apps/whispering/src/lib/components/NotificationLog.svelte b/apps/whispering/src/lib/components/NotificationLog.svelte
index 223335628d..d6726dd15b 100644
--- a/apps/whispering/src/lib/components/NotificationLog.svelte
+++ b/apps/whispering/src/lib/components/NotificationLog.svelte
@@ -3,6 +3,12 @@
 		let isOpen = $state(false);
 		let logs = $state<UnifiedNotificationOptions[]>([]);
 		return {
+			addLog: (log: UnifiedNotificationOptions) => {
+				logs.push(log);
+			},
+			clearLogs: () => {
+				logs = [];
+			},
 			get isOpen() {
 				return isOpen;
 			},
@@ -12,12 +18,6 @@
 			get logs() {
 				return logs;
 			},
-			addLog: (log: UnifiedNotificationOptions) => {
-				logs.push(log);
-			},
-			clearLogs: () => {
-				logs = [];
-			},
 		};
 	})();
 
@@ -25,10 +25,8 @@
 </script>
 
 <script lang="ts">
-	import * as Alert from '@repo/ui/alert';
-	import * as Popover from '@repo/ui/popover';
 	import type { UnifiedNotificationOptions } from '$lib/services/notifications/types';
-	import { ScrollArea } from '@repo/ui/scroll-area';
+
 	import {
 		AlertCircle,
 		AlertTriangle,
@@ -37,9 +35,13 @@
 		Loader,
 		LogsIcon,
 	} from '@lucide/svelte';
+	import * as Alert from '@repo/ui/alert';
+	import * as Popover from '@repo/ui/popover';
+	import { ScrollArea } from '@repo/ui/scroll-area';
+	import { cn } from '@repo/ui/utils';
 	import { mode } from 'mode-watcher';
+
 	import WhisperingButton from './WhisperingButton.svelte';
-	import { cn } from '@repo/ui/utils';
 </script>
 
 <Popover.Root bind:open={notificationLog.isOpen}>
diff --git a/apps/whispering/src/lib/components/UpdateDialog.svelte b/apps/whispering/src/lib/components/UpdateDialog.svelte
index b7cdbb7e05..d029caabb8 100644
--- a/apps/whispering/src/lib/components/UpdateDialog.svelte
+++ b/apps/whispering/src/lib/components/UpdateDialog.svelte
@@ -2,39 +2,36 @@
 	import type { Update } from '@tauri-apps/plugin-updater';
 
 	export const updateDialog = createUpdateDialog();
-	export type UpdateInfo = Pick<
+	export type UpdateInfo = null | Pick<
 		Update,
-		'version' | 'date' | 'body' | 'downloadAndInstall'
-	> | null;
+		'body' | 'date' | 'downloadAndInstall' | 'version'
+	>;
 
 	function createUpdateDialog() {
 		let isOpen = $state(false);
-		let update = $state<UpdateInfo | null>(null);
+		let update = $state<null | UpdateInfo>(null);
 		let downloadProgress = $state(0);
 		let downloadTotal = $state(0);
-		let error = $state<string | null>(null);
+		let error = $state<null | string>(null);
 
 		return {
-			get isOpen() {
-				return isOpen;
+			close() {
+				isOpen = false;
 			},
-			set isOpen(v) {
-				isOpen = v;
+			get error() {
+				return error;
 			},
-			get update() {
-				return update;
+			get isDownloadComplete() {
+				return downloadTotal > 0 && downloadProgress >= downloadTotal && !error;
 			},
 			get isDownloading() {
 				return downloadTotal > 0 && downloadProgress < downloadTotal && !error;
 			},
-			get isDownloadComplete() {
-				return downloadTotal > 0 && downloadProgress >= downloadTotal && !error;
-			},
-			get progressPercentage() {
-				return downloadTotal > 0 ? (downloadProgress / downloadTotal) * 100 : 0;
+			get isOpen() {
+				return isOpen;
 			},
-			get error() {
-				return error;
+			set isOpen(v) {
+				isOpen = v;
 			},
 			open(newUpdate: UpdateInfo) {
 				update = newUpdate;
@@ -43,28 +40,31 @@
 				downloadTotal = 0;
 				error = null;
 			},
-			close() {
-				isOpen = false;
+			get progressPercentage() {
+				return downloadTotal > 0 ? (downloadProgress / downloadTotal) * 100 : 0;
+			},
+			setError(err: null | string) {
+				error = err;
+				downloadTotal = 0;
+			},
+			get update() {
+				return update;
 			},
 			updateProgress(progress: number, total: number) {
 				downloadProgress = progress;
 				downloadTotal = total;
 			},
-			setError(err: string | null) {
-				error = err;
-				downloadTotal = 0;
-			},
 		};
 	}
 </script>
 
 <script lang="ts">
-	import * as Dialog from '@repo/ui/dialog';
-	import { Button } from '@repo/ui/button';
-	import { relaunch } from '@tauri-apps/plugin-process';
 	import { rpc } from '$lib/query';
-	import * as Alert from '@repo/ui/alert';
 	import { AlertTriangle } from '@lucide/svelte';
+	import * as Alert from '@repo/ui/alert';
+	import { Button } from '@repo/ui/button';
+	import * as Dialog from '@repo/ui/dialog';
+	import { relaunch } from '@tauri-apps/plugin-process';
 	import { extractErrorMessage } from 'wellcrafted/error';
 
 	async function handleDownloadAndInstall() {
@@ -78,25 +78,25 @@
 
 			await updateDialog.update.downloadAndInstall((event) => {
 				switch (event.event) {
-					case 'Started':
-						contentLength = event.data.contentLength ?? 0;
-						updateDialog.updateProgress(0, contentLength);
-						break;
-					case 'Progress':
-						downloaded += event.data.chunkLength;
-						updateDialog.updateProgress(downloaded, contentLength);
-						break;
 					case 'Finished':
 						rpc.notify.success.execute({
 							title: 'Update installed successfully!',
 							description: 'Restart Whispering to apply the update.',
 							action: {
-								type: 'button',
 								label: 'Restart Whispering',
 								onClick: () => relaunch(),
+								type: 'button',
 							},
 						});
 						break;
+					case 'Progress':
+						downloaded += event.data.chunkLength;
+						updateDialog.updateProgress(downloaded, contentLength);
+						break;
+					case 'Started':
+						contentLength = event.data.contentLength ?? 0;
+						updateDialog.updateProgress(0, contentLength);
+						break;
 				}
 			});
 		} catch (err) {
diff --git a/apps/whispering/src/lib/components/WhisperingButton.svelte b/apps/whispering/src/lib/components/WhisperingButton.svelte
index d07e612d33..a763d0969a 100644
--- a/apps/whispering/src/lib/components/WhisperingButton.svelte
+++ b/apps/whispering/src/lib/components/WhisperingButton.svelte
@@ -1,20 +1,22 @@
 <script lang="ts">
+	import type { Snippet } from 'svelte';
+
 	import { Button, type Props } from '@repo/ui/button';
 	import { mergeProps } from 'bits-ui';
 	import { nanoid } from 'nanoid/non-secure';
-	import type { Snippet } from 'svelte';
+
 	import WhisperingTooltip from './WhisperingTooltip.svelte';
 
 	let {
-		id = nanoid(),
 		children,
+		id = nanoid(),
 		tooltipContent,
 		...buttonProps
-	}: Props & { id?: string; tooltipContent: string | Snippet } = $props();
+	}: Props & { id?: string; tooltipContent: Snippet | string } = $props();
 </script>
 
 <WhisperingTooltip {id} {tooltipContent}>
-	{#snippet trigger({ tooltipProps, tooltip })}
+	{#snippet trigger({ tooltip, tooltipProps })}
 		<Button {...mergeProps(tooltipProps, buttonProps)}>
 			{@render children?.()}
 			<span class="sr-only">
diff --git a/apps/whispering/src/lib/components/WhisperingTooltip.svelte b/apps/whispering/src/lib/components/WhisperingTooltip.svelte
index af555fdda1..9ab8f4bd55 100644
--- a/apps/whispering/src/lib/components/WhisperingTooltip.svelte
+++ b/apps/whispering/src/lib/components/WhisperingTooltip.svelte
@@ -1,19 +1,20 @@
 <script lang="ts">
+	import type { Snippet } from 'svelte';
+
 	import * as Tooltip from '@repo/ui/tooltip';
 	import { mergeProps } from 'bits-ui';
-	import type { Snippet } from 'svelte';
 
 	let {
 		id,
-		trigger,
 		tooltipContent,
+		trigger,
 		...restProps
 	}: {
 		id: string;
+		tooltipContent: Snippet | string;
 		trigger: Snippet<
-			[{ tooltipProps: Record<string, unknown>; tooltip: Snippet<[]> }]
+			[{ tooltip: Snippet<[]>; tooltipProps: Record<string, unknown>; }]
 		>;
-		tooltipContent: string | Snippet;
 	} = $props();
 </script>
 
@@ -30,8 +31,8 @@
 		<Tooltip.Trigger {id}>
 			{#snippet child({ props: tooltipProps })}
 				{@render trigger?.({
-					tooltipProps: mergeProps(tooltipProps, restProps),
 					tooltip,
+					tooltipProps: mergeProps(tooltipProps, restProps),
 				})}
 			{/snippet}
 		</Tooltip.Trigger>
diff --git a/apps/whispering/src/lib/components/copyable/CopyToClipboardButton.svelte b/apps/whispering/src/lib/components/copyable/CopyToClipboardButton.svelte
index 6d3e535b05..5d3a7d8432 100644
--- a/apps/whispering/src/lib/components/copyable/CopyToClipboardButton.svelte
+++ b/apps/whispering/src/lib/components/copyable/CopyToClipboardButton.svelte
@@ -1,29 +1,36 @@
 <script lang="ts">
-	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import type { Props } from '@repo/ui/button';
+	import type { Snippet } from 'svelte';
+
+	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import { rpc } from '$lib/query';
-	import { createMutation } from '@tanstack/svelte-query';
 	import { CheckIcon } from '@lucide/svelte';
-	import type { Snippet } from 'svelte';
+	import { createMutation } from '@tanstack/svelte-query';
 
 	const copyToClipboard = createMutation(rpc.text.copyToClipboard.options);
 
 	let {
 		children,
-		copiedContent,
-		textToCopy,
-		contentDescription,
-		viewTransitionName,
 		class: className,
+		contentDescription,
+		copiedContent,
+		disabled,
 		size = 'icon',
+		textToCopy,
 		variant = 'ghost',
-		disabled,
-	}: {
+		viewTransitionName,
+	}: Partial<Pick<Props, 'disabled' | 'size' | 'variant'>> & {
 		/**
 		 * The content to display in the button's default state.
 		 * This is mandatory and can contain any combination of text, icons, or other elements.
 		 */
 		children: Snippet;
+		class?: string;
+		/**
+		 * A description of the content being copied (e.g., "transcribed text", "API key").
+		 * Used in tooltips and toast messages to provide context to the user.
+		 */
+		contentDescription: string;
 		/**
 		 * The content to display when the copy operation succeeds.
 		 * Defaults to a check icon if not provided.
@@ -34,14 +41,8 @@
 		 * The text that will be copied to the clipboard when the button is clicked.
 		 */
 		textToCopy: string;
-		/**
-		 * A description of the content being copied (e.g., "transcribed text", "API key").
-		 * Used in tooltips and toast messages to provide context to the user.
-		 */
-		contentDescription: string;
 		viewTransitionName?: string;
-		class?: string;
-	} & Partial<Pick<Props, 'disabled' | 'variant' | 'size'>> = $props();
+	} = $props();
 
 	let hasCopied = $state(false);
 </script>
@@ -52,6 +53,13 @@
 		copyToClipboard.mutate(
 			{ text: textToCopy },
 			{
+				onError: (error) => {
+					rpc.notify.error.execute({
+						title: `Error copying ${contentDescription} to clipboard`,
+						description: error.message,
+						action: { error, type: 'more-details' },
+					});
+				},
 				onSuccess: () => {
 					hasCopied = true;
 					setTimeout(() => {
@@ -62,13 +70,6 @@
 						description: textToCopy,
 					});
 				},
-				onError: (error) => {
-					rpc.notify.error.execute({
-						title: `Error copying ${contentDescription} to clipboard`,
-						description: error.message,
-						action: { type: 'more-details', error },
-					});
-				},
 			},
 		)}
 	style={viewTransitionName
diff --git a/apps/whispering/src/lib/components/copyable/CopyablePre.svelte b/apps/whispering/src/lib/components/copyable/CopyablePre.svelte
index f107f36318..0beef19ded 100644
--- a/apps/whispering/src/lib/components/copyable/CopyablePre.svelte
+++ b/apps/whispering/src/lib/components/copyable/CopyablePre.svelte
@@ -1,13 +1,13 @@
 <script lang="ts" module>
-	import { type VariantProps, tv } from 'tailwind-variants';
+	import { tv, type VariantProps } from 'tailwind-variants';
 
 	export const copyableVariants = tv({
 		base: 'relative whitespace-normal rounded p-4 pr-12 text-sm',
 		variants: {
 			variant: {
 				code: 'bg-muted font-mono',
-				text: 'bg-muted text-muted-foreground',
 				error: 'bg-destructive/10 text-destructive',
+				text: 'bg-muted text-muted-foreground',
 			},
 		},
 	});
@@ -18,18 +18,19 @@
 </script>
 
 <script lang="ts">
-	import { cn } from '@repo/ui/utils';
 	import { ClipboardIcon } from '$lib/components/icons';
+	import { cn } from '@repo/ui/utils';
+
 	import CopyToClipboardButton from './CopyToClipboardButton.svelte';
 
 	const {
+		class: className,
 		copyableText,
 		variant,
-		class: className,
 	}: {
+		class?: string;
 		copyableText: string;
 		variant: CopyableVariants;
-		class?: string;
 	} = $props();
 </script>
 
diff --git a/apps/whispering/src/lib/components/copyable/CopyableTextareaExpandsToDialog.svelte b/apps/whispering/src/lib/components/copyable/CopyableTextareaExpandsToDialog.svelte
index 947b57a662..80c7eab822 100644
--- a/apps/whispering/src/lib/components/copyable/CopyableTextareaExpandsToDialog.svelte
+++ b/apps/whispering/src/lib/components/copyable/CopyableTextareaExpandsToDialog.svelte
@@ -1,12 +1,13 @@
 <script lang="ts">
 	import { ClipboardIcon } from '$lib/components/icons';
+	import { rpc } from '$lib/query';
 	import { Button } from '@repo/ui/button';
 	import * as Card from '@repo/ui/card';
 	import * as Dialog from '@repo/ui/dialog';
 	import { Textarea } from '@repo/ui/textarea';
-	import { rpc } from '$lib/query';
 	import { createMutation } from '@tanstack/svelte-query';
 	import { mergeProps } from 'bits-ui';
+
 	import WhisperingTooltip from '../WhisperingTooltip.svelte';
 
 	/**
@@ -34,22 +35,22 @@
 	 * ```
 	 */
 	let {
-		/** Unique identifier for the dialog trigger element */
-		id,
 		/** The title displayed in the dialog header (capitalized) */
 		title,
-		/** The text content to display and copy */
-		text,
+		/** Unique identifier for the dialog trigger element */
+		id,
 		/** Label used for tooltips and accessibility (lowercase) */
 		label,
 		/** Number of rows for the preview textarea */
 		rows = 2,
+		/** The text content to display and copy */
+		text,
 	}: {
 		id: string;
-		title: string;
-		text: string;
 		label: string;
 		rows?: number;
+		text: string;
+		title: string;
 	} = $props();
 
 	let isDialogOpen = $state(false);
@@ -61,7 +62,7 @@
 	<Dialog.Trigger {id}>
 		{#snippet child({ props: dialogTriggerProps })}
 			<WhisperingTooltip {id} tooltipContent="View {label}">
-				{#snippet trigger({ tooltipProps, tooltip })}
+				{#snippet trigger({ tooltip, tooltipProps })}
 					<Textarea
 						{...mergeProps(tooltipProps, dialogTriggerProps)}
 						class="min-h-0 max-h-24 h-full resize-none text-wrap text-left text-sm leading-snug hover:cursor-pointer hover:bg-accent hover:text-accent-foreground w-full"
@@ -90,6 +91,13 @@
 					copyToClipboard.mutate(
 						{ text },
 						{
+							onError: (error) => {
+								rpc.notify.error.execute({
+									title: `Error copying ${title.toLowerCase()} to clipboard`,
+									description: error.message,
+									action: { error, type: 'more-details' },
+								});
+							},
 							onSuccess: () => {
 								isDialogOpen = false;
 								rpc.notify.success.execute({
@@ -97,13 +105,6 @@
 									description: text,
 								});
 							},
-							onError: (error) => {
-								rpc.notify.error.execute({
-									title: `Error copying ${title.toLowerCase()} to clipboard`,
-									description: error.message,
-									action: { type: 'more-details', error },
-								});
-							},
 						},
 					);
 				}}
diff --git a/apps/whispering/src/lib/components/labeled/LabeledInput.svelte b/apps/whispering/src/lib/components/labeled/LabeledInput.svelte
index 70811996e4..8c7ca600b4 100644
--- a/apps/whispering/src/lib/components/labeled/LabeledInput.svelte
+++ b/apps/whispering/src/lib/components/labeled/LabeledInput.svelte
@@ -1,28 +1,29 @@
 <script lang="ts">
+	import type { Snippet } from 'svelte';
+	import type { HTMLInputAttributes } from 'svelte/elements';
+
 	import { Input } from '@repo/ui/input';
 	import { Label } from '@repo/ui/label';
 	import { cn } from '@repo/ui/utils';
-	import type { Snippet } from 'svelte';
-	import type { HTMLInputAttributes } from 'svelte/elements';
 
 	let {
+		description,
+		disabled = false,
+		hideLabel = false,
 		id,
 		label,
-		value = $bindable(),
-		type = 'text',
 		placeholder = '',
-		disabled = false,
-		hideLabel = false,
-		description,
+		type = 'text',
+		value = $bindable(),
 		...restProps
 	}: HTMLInputAttributes & {
-		label: string;
-		value: string;
-		type?: 'text' | 'password' | 'number';
-		placeholder?: string;
+		description?: Snippet | string;
 		disabled?: boolean;
 		hideLabel?: boolean;
-		description?: string | Snippet;
+		label: string;
+		placeholder?: string;
+		type?: 'number' | 'password' | 'text';
+		value: string;
 	} = $props();
 </script>
 
diff --git a/apps/whispering/src/lib/components/labeled/LabeledSelect.svelte b/apps/whispering/src/lib/components/labeled/LabeledSelect.svelte
index 4a6d8e1de5..ec03f40a28 100644
--- a/apps/whispering/src/lib/components/labeled/LabeledSelect.svelte
+++ b/apps/whispering/src/lib/components/labeled/LabeledSelect.svelte
@@ -1,43 +1,44 @@
 <script
 	lang="ts"
-	generics="TItem extends { value: string; label: string; disabled?: boolean }"
+	generics="TItem extends { disabled?: boolean; label: string; value: string; }"
 >
+	import type { Snippet } from 'svelte';
+
 	import { Label } from '@repo/ui/label';
 	import * as Select from '@repo/ui/select';
 	import { cn } from '@repo/ui/utils';
-	import type { Snippet } from 'svelte';
 
 	type T = TItem['value'];
 
 	let {
+		description,
+		class: className,
+		disabled = false,
+		hideLabel = false,
 		id,
-		label,
 		items = [],
-		selected,
+		label,
 		onSelectedChange,
 		placeholder = 'Select an option',
-		class: className,
-		disabled = false,
-		hideLabel = false,
-		description,
 		renderOption = defaultRenderOption,
+		selected,
 	}: {
+		class?: string;
+		description?: Snippet | string;
+		disabled?: boolean;
+		hideLabel?: boolean;
 		id: string;
-		label: string;
 		items: TItem[];
-		selected: T;
+		label: string;
 		onSelectedChange: (selected: T) => void;
 		placeholder?: string;
-		class?: string;
-		disabled?: boolean;
-		hideLabel?: boolean;
-		description?: string | Snippet;
 		/**
 		 * Custom snippet for rendering select option content.
 		 * Receives an item object and should return the desired display.
 		 * If not provided, defaults to showing the item's label.
 		 */
 		renderOption?: Snippet<[{ item: TItem }]>;
+		selected: T;
 	} = $props();
 
 	const selectedLabel = $derived(
diff --git a/apps/whispering/src/lib/components/labeled/LabeledSwitch.svelte b/apps/whispering/src/lib/components/labeled/LabeledSwitch.svelte
index 83072438e2..bbe14fa19e 100644
--- a/apps/whispering/src/lib/components/labeled/LabeledSwitch.svelte
+++ b/apps/whispering/src/lib/components/labeled/LabeledSwitch.svelte
@@ -1,22 +1,23 @@
 <script lang="ts">
+	import type { Snippet } from 'svelte';
+
 	import { Label } from '@repo/ui/label';
 	import { Switch } from '@repo/ui/switch';
-	import type { Snippet } from 'svelte';
 
 	let {
+		description,
+		checked = $bindable(),
+		disabled = $bindable(),
 		id,
 		label,
-		checked = $bindable(),
 		onCheckedChange,
-		description,
-		disabled = $bindable(),
 	}: {
-		id: string;
-		label: string | Snippet;
 		checked: boolean;
-		onCheckedChange?: (value: boolean) => void;
 		description?: string;
 		disabled?: boolean;
+		id: string;
+		label: Snippet | string;
+		onCheckedChange?: (value: boolean) => void;
 	} = $props();
 </script>
 
diff --git a/apps/whispering/src/lib/components/labeled/LabeledTextarea.svelte b/apps/whispering/src/lib/components/labeled/LabeledTextarea.svelte
index 570c251cec..6e7c14b3db 100644
--- a/apps/whispering/src/lib/components/labeled/LabeledTextarea.svelte
+++ b/apps/whispering/src/lib/components/labeled/LabeledTextarea.svelte
@@ -1,23 +1,24 @@
 <script lang="ts">
-	import { Label } from '@repo/ui/label';
-	import { Textarea } from '@repo/ui/textarea';
 	import type { Snippet } from 'svelte';
 	import type { HTMLTextareaAttributes } from 'svelte/elements';
 
+	import { Label } from '@repo/ui/label';
+	import { Textarea } from '@repo/ui/textarea';
+
 	let {
+		description,
+		disabled = false,
 		id,
 		label,
-		value = $bindable(),
 		placeholder = '',
-		disabled = false,
-		description,
+		value = $bindable(),
 		...restProps
 	}: HTMLTextareaAttributes & {
+		description?: Snippet | string;
+		disabled?: boolean;
 		label: string;
-		value: string;
 		placeholder?: string;
-		disabled?: boolean;
-		description?: string | Snippet;
+		value: string;
 	} = $props();
 </script>
 
diff --git a/apps/whispering/src/lib/components/settings/WhisperModelSelector.svelte b/apps/whispering/src/lib/components/settings/WhisperModelSelector.svelte
index 90b9a6e916..5854d43013 100644
--- a/apps/whispering/src/lib/components/settings/WhisperModelSelector.svelte
+++ b/apps/whispering/src/lib/components/settings/WhisperModelSelector.svelte
@@ -1,63 +1,63 @@
 <script lang="ts">
-	import { Button } from '@repo/ui/button';
-	import * as Card from '@repo/ui/card';
-	import * as Tabs from '@repo/ui/tabs';
-	import { Badge } from '@repo/ui/badge';
-	import { Input } from '@repo/ui/input';
-	import { Link } from '@repo/ui/link';
+	import { settings } from '$lib/stores/settings.svelte';
 	import {
-		Download,
 		CheckIcon,
-		Paperclip,
+		Download,
 		LoaderCircle,
+		Paperclip,
 		X,
 	} from '@lucide/svelte';
+	import { Badge } from '@repo/ui/badge';
+	import { Button } from '@repo/ui/button';
+	import * as Card from '@repo/ui/card';
+	import { Input } from '@repo/ui/input';
+	import { Link } from '@repo/ui/link';
+	import * as Tabs from '@repo/ui/tabs';
 	import { createQuery } from '@tanstack/svelte-query';
-	import { toast } from 'svelte-sonner';
-	import { settings } from '$lib/stores/settings.svelte';
 	import { appDataDir } from '@tauri-apps/api/path';
 	import { exists, mkdir, writeFile } from '@tauri-apps/plugin-fs';
 	import { fetch } from '@tauri-apps/plugin-http';
+	import { toast } from 'svelte-sonner';
 	import { SvelteSet } from 'svelte/reactivity';
 	import { extractErrorMessage } from 'wellcrafted/error';
 
 	// Pre-built models configuration
 	const WHISPER_MODELS = [
 		{
+			description: 'Fastest, basic accuracy',
+			filename: 'ggml-tiny.bin',
 			id: 'tiny',
 			name: 'Tiny',
-			description: 'Fastest, basic accuracy',
 			size: '78 MB',
 			sizeBytes: 77_700_000,
 			url: 'https://huggingface.co/ggerganov/whisper.cpp/resolve/main/ggml-tiny.bin',
-			filename: 'ggml-tiny.bin',
 		},
 		{
+			description: 'Fast, good accuracy',
+			filename: 'ggml-small.bin',
 			id: 'small',
 			name: 'Small',
-			description: 'Fast, good accuracy',
 			size: '488 MB',
 			sizeBytes: 488_000_000,
 			url: 'https://huggingface.co/ggerganov/whisper.cpp/resolve/main/ggml-small.bin',
-			filename: 'ggml-small.bin',
 		},
 		{
+			description: 'Balanced speed & accuracy',
+			filename: 'ggml-medium.bin',
 			id: 'medium',
 			name: 'Medium',
-			description: 'Balanced speed & accuracy',
 			size: '1.5 GB',
 			sizeBytes: 1_530_000_000,
 			url: 'https://huggingface.co/ggerganov/whisper.cpp/resolve/main/ggml-medium.bin',
-			filename: 'ggml-medium.bin',
 		},
 		{
+			description: 'Best accuracy, slower',
+			filename: 'ggml-large-v3-turbo.bin',
 			id: 'large-v3-turbo',
 			name: 'Large v3 Turbo',
-			description: 'Best accuracy, slower',
 			size: '1.6 GB',
 			sizeBytes: 1_620_000_000,
 			url: 'https://huggingface.co/ggerganov/whisper.cpp/resolve/main/ggml-large-v3-turbo.bin',
-			filename: 'ggml-large-v3-turbo.bin',
 		},
 	];
 
@@ -86,7 +86,7 @@
 
 	// Query to check which models are downloaded
 	const downloadedModelsQuery = createQuery(() => ({
-		queryKey: ['whisperModels', 'downloaded'],
+		enabled: !!window.__TAURI_INTERNALS__,
 		queryFn: async () => {
 			if (!window.__TAURI_INTERNALS__) return [];
 
@@ -99,8 +99,8 @@
 			}
 			return downloaded;
 		},
+		queryKey: ['whisperModels', 'downloaded'],
 		staleTime: 5000,
-		enabled: !!window.__TAURI_INTERNALS__,
 	}));
 
 	const downloadedModels = $derived(new Set(downloadedModelsQuery.data || []));
@@ -198,14 +198,14 @@
 
 		const { open } = await import('@tauri-apps/plugin-dialog');
 		const selected = await open({
-			multiple: false,
+			title: 'Select Whisper Model File',
 			filters: [
 				{
-					name: 'Whisper Models',
 					extensions: ['bin', 'gguf', 'ggml'],
+					name: 'Whisper Models',
 				},
 			],
-			title: 'Select Whisper Model File',
+			multiple: false,
 		});
 
 		if (selected) {
@@ -231,18 +231,18 @@
 
 	// Query to check if the manual model file exists
 	const modelFileQuery = createQuery(() => ({
-		queryKey: [
-			'modelFileExists',
-			settings.value['transcription.whispercpp.modelPath'],
-		],
+		enabled:
+			!!settings.value['transcription.whispercpp.modelPath'] &&
+			!!window.__TAURI_INTERNALS__,
 		queryFn: async () => {
 			const modelPath = settings.value['transcription.whispercpp.modelPath'];
 			if (!modelPath || !window.__TAURI_INTERNALS__) return null;
 			return await exists(modelPath);
 		},
-		enabled:
-			!!settings.value['transcription.whispercpp.modelPath'] &&
-			!!window.__TAURI_INTERNALS__,
+		queryKey: [
+			'modelFileExists',
+			settings.value['transcription.whispercpp.modelPath'],
+		],
 		staleTime: 5000,
 	}));
 </script>
diff --git a/apps/whispering/src/lib/components/settings/api-key-inputs/AnthropicApiKeyInput.svelte b/apps/whispering/src/lib/components/settings/api-key-inputs/AnthropicApiKeyInput.svelte
index 5c3211c608..bf91d0e394 100644
--- a/apps/whispering/src/lib/components/settings/api-key-inputs/AnthropicApiKeyInput.svelte
+++ b/apps/whispering/src/lib/components/settings/api-key-inputs/AnthropicApiKeyInput.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { LabeledInput } from '$lib/components/labeled/index.js';
-	import { Button } from '@repo/ui/button';
 	import { settings } from '$lib/stores/settings.svelte';
+	import { Button } from '@repo/ui/button';
 </script>
 
 <LabeledInput
diff --git a/apps/whispering/src/lib/components/settings/api-key-inputs/DeepgramApiKeyInput.svelte b/apps/whispering/src/lib/components/settings/api-key-inputs/DeepgramApiKeyInput.svelte
index a113fc4b10..8f82a2da43 100644
--- a/apps/whispering/src/lib/components/settings/api-key-inputs/DeepgramApiKeyInput.svelte
+++ b/apps/whispering/src/lib/components/settings/api-key-inputs/DeepgramApiKeyInput.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
     import { LabeledInput } from '$lib/components/labeled/index.js';
-    import { Button } from '@repo/ui/button';
     import { settings } from '$lib/stores/settings.svelte';
+    import { Button } from '@repo/ui/button';
 </script>
 
 <LabeledInput
diff --git a/apps/whispering/src/lib/components/settings/api-key-inputs/ElevenLabsApiKeyInput.svelte b/apps/whispering/src/lib/components/settings/api-key-inputs/ElevenLabsApiKeyInput.svelte
index 29a5a73a5e..5367686a1e 100644
--- a/apps/whispering/src/lib/components/settings/api-key-inputs/ElevenLabsApiKeyInput.svelte
+++ b/apps/whispering/src/lib/components/settings/api-key-inputs/ElevenLabsApiKeyInput.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { LabeledInput } from '$lib/components/labeled/index.js';
-	import { Button } from '@repo/ui/button';
 	import { settings } from '$lib/stores/settings.svelte';
+	import { Button } from '@repo/ui/button';
 </script>
 
 <LabeledInput
diff --git a/apps/whispering/src/lib/components/settings/api-key-inputs/GoogleApiKeyInput.svelte b/apps/whispering/src/lib/components/settings/api-key-inputs/GoogleApiKeyInput.svelte
index 2b5fc1ed78..da2979073d 100644
--- a/apps/whispering/src/lib/components/settings/api-key-inputs/GoogleApiKeyInput.svelte
+++ b/apps/whispering/src/lib/components/settings/api-key-inputs/GoogleApiKeyInput.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { LabeledInput } from '$lib/components/labeled/index.js';
-	import { Button } from '@repo/ui/button';
 	import { settings } from '$lib/stores/settings.svelte';
+	import { Button } from '@repo/ui/button';
 </script>
 
 <LabeledInput
diff --git a/apps/whispering/src/lib/components/settings/api-key-inputs/GroqApiKeyInput.svelte b/apps/whispering/src/lib/components/settings/api-key-inputs/GroqApiKeyInput.svelte
index 9f1e9eabe2..a261924c26 100644
--- a/apps/whispering/src/lib/components/settings/api-key-inputs/GroqApiKeyInput.svelte
+++ b/apps/whispering/src/lib/components/settings/api-key-inputs/GroqApiKeyInput.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { LabeledInput } from '$lib/components/labeled/index.js';
-	import { Button } from '@repo/ui/button';
 	import { settings } from '$lib/stores/settings.svelte';
+	import { Button } from '@repo/ui/button';
 </script>
 
 <LabeledInput
diff --git a/apps/whispering/src/lib/components/settings/api-key-inputs/OpenAiApiKeyInput.svelte b/apps/whispering/src/lib/components/settings/api-key-inputs/OpenAiApiKeyInput.svelte
index c3666a9458..e78f8f4a89 100644
--- a/apps/whispering/src/lib/components/settings/api-key-inputs/OpenAiApiKeyInput.svelte
+++ b/apps/whispering/src/lib/components/settings/api-key-inputs/OpenAiApiKeyInput.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { LabeledInput } from '$lib/components/labeled/index.js';
-	import { Button } from '@repo/ui/button';
 	import { settings } from '$lib/stores/settings.svelte';
+	import { Button } from '@repo/ui/button';
 </script>
 
 <LabeledInput
diff --git a/apps/whispering/src/lib/components/settings/selectors/DeviceSelector.svelte b/apps/whispering/src/lib/components/settings/selectors/DeviceSelector.svelte
index 2702488a34..7638fb0d02 100644
--- a/apps/whispering/src/lib/components/settings/selectors/DeviceSelector.svelte
+++ b/apps/whispering/src/lib/components/settings/selectors/DeviceSelector.svelte
@@ -1,13 +1,13 @@
 <script lang="ts">
 	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
-	import * as Command from '@repo/ui/command';
-	import * as Popover from '@repo/ui/popover';
-	import { useCombobox } from '@repo/ui/hooks';
 	import { rpc } from '$lib/query';
 	import { settings } from '$lib/stores/settings.svelte';
+	import { CheckIcon, MicIcon, RefreshCwIcon } from '@lucide/svelte';
+	import * as Command from '@repo/ui/command';
+	import { useCombobox } from '@repo/ui/hooks';
+	import * as Popover from '@repo/ui/popover';
 	import { cn } from '@repo/ui/utils';
 	import { createQuery } from '@tanstack/svelte-query';
-	import { CheckIcon, MicIcon, RefreshCwIcon } from '@lucide/svelte';
 
 	let {
 		mode = 'manual'
diff --git a/apps/whispering/src/lib/components/settings/selectors/TranscriptionSelector.svelte b/apps/whispering/src/lib/components/settings/selectors/TranscriptionSelector.svelte
index 2445480c20..7b3b05ca26 100644
--- a/apps/whispering/src/lib/components/settings/selectors/TranscriptionSelector.svelte
+++ b/apps/whispering/src/lib/components/settings/selectors/TranscriptionSelector.svelte
@@ -1,10 +1,6 @@
 <script lang="ts">
 	import { goto } from '$app/navigation';
 	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
-	import { Badge } from '@repo/ui/badge';
-	import * as Command from '@repo/ui/command';
-	import * as Popover from '@repo/ui/popover';
-	import { useCombobox } from '@repo/ui/hooks';
 	import {
 		TRANSCRIPTION_SERVICES,
 		type TranscriptionService,
@@ -14,13 +10,17 @@
 		isTranscriptionServiceConfigured,
 	} from '$lib/settings/transcription-validation';
 	import { settings } from '$lib/stores/settings.svelte';
-	import { cn } from '@repo/ui/utils';
 	import {
 		CheckIcon,
+		ChevronRightIcon,
 		MicIcon,
 		SettingsIcon,
-		ChevronRightIcon,
 	} from '@lucide/svelte';
+	import { Badge } from '@repo/ui/badge';
+	import * as Command from '@repo/ui/command';
+	import { useCombobox } from '@repo/ui/hooks';
+	import * as Popover from '@repo/ui/popover';
+	import { cn } from '@repo/ui/utils';
 	import { SvelteSet } from 'svelte/reactivity';
 
 	let { class: className }: { class?: string } = $props();
@@ -31,10 +31,10 @@
 		switch (service.location) {
 			case 'cloud':
 				return settings.value[service.modelSettingKey];
-			case 'self-hosted':
-				return settings.value[service.serverUrlField];
 			case 'local':
 				return settings.value[service.modelPathField];
+			case 'self-hosted':
+				return settings.value[service.serverUrlField];
 		}
 	}
 
@@ -225,8 +225,8 @@
 									value={`${service.id} ${service.name} ${model.name}`}
 									onSelect={() => {
 										settings.update({
-											'transcription.selectedTranscriptionService': service.id,
 											[service.modelSettingKey]: model.name,
+											'transcription.selectedTranscriptionService': service.id,
 										});
 										combobox.closeAndFocusTrigger();
 									}}
diff --git a/apps/whispering/src/lib/components/settings/selectors/TransformationSelector.svelte b/apps/whispering/src/lib/components/settings/selectors/TransformationSelector.svelte
index 0e8cfd222f..1740dcd5a7 100644
--- a/apps/whispering/src/lib/components/settings/selectors/TransformationSelector.svelte
+++ b/apps/whispering/src/lib/components/settings/selectors/TransformationSelector.svelte
@@ -1,22 +1,23 @@
 <script lang="ts">
+	import type { Transformation } from '$lib/services/db';
+
 	import { goto } from '$app/navigation';
 	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
-	import { Badge } from '@repo/ui/badge';
-	import * as Command from '@repo/ui/command';
-	import * as Popover from '@repo/ui/popover';
-	import { useCombobox } from '@repo/ui/hooks';
 	import { rpc } from '$lib/query';
-	import type { Transformation } from '$lib/services/db';
 	import { settings } from '$lib/stores/settings.svelte';
-	import { cn } from '@repo/ui/utils';
 	import { createTransformationViewTransitionName } from '$lib/utils/createTransformationViewTransitionName';
-	import { createQuery } from '@tanstack/svelte-query';
 	import {
 		CheckIcon,
 		FilterIcon,
 		FilterXIcon,
 		LayersIcon,
 	} from '@lucide/svelte';
+	import { Badge } from '@repo/ui/badge';
+	import * as Command from '@repo/ui/command';
+	import { useCombobox } from '@repo/ui/hooks';
+	import * as Popover from '@repo/ui/popover';
+	import { cn } from '@repo/ui/utils';
+	import { createQuery } from '@tanstack/svelte-query';
 
 	const transformationsQuery = createQuery(
 		rpc.transformations.queries.getAllTransformations.options,
diff --git a/apps/whispering/src/lib/components/transformations-editor/Configuration.svelte b/apps/whispering/src/lib/components/transformations-editor/Configuration.svelte
index ad4eab697e..183d9f8371 100644
--- a/apps/whispering/src/lib/components/transformations-editor/Configuration.svelte
+++ b/apps/whispering/src/lib/components/transformations-editor/Configuration.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
-	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
+	import type { Transformation } from '$lib/services/db';
+
 	import {
 		LabeledInput,
 		LabeledSelect,
@@ -12,12 +13,7 @@
 		GroqApiKeyInput,
 		OpenAiApiKeyInput,
 	} from '$lib/components/settings';
-	import * as Accordion from '@repo/ui/accordion';
-	import * as Alert from '@repo/ui/alert';
-	import { Button } from '@repo/ui/button';
-	import * as Card from '@repo/ui/card';
-	import * as SectionHeader from '@repo/ui/section-header';
-	import { Separator } from '@repo/ui/separator';
+	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import {
 		TRANSFORMATION_STEP_TYPES,
 		TRANSFORMATION_STEP_TYPES_TO_LABELS,
@@ -29,9 +25,14 @@
 		INFERENCE_PROVIDER_OPTIONS,
 		OPENAI_INFERENCE_MODEL_OPTIONS,
 	} from '$lib/constants/inference';
-	import type { Transformation } from '$lib/services/db';
 	import { generateDefaultTransformationStep } from '$lib/services/db';
 	import { CopyIcon, PlusIcon, TrashIcon } from '@lucide/svelte';
+	import * as Accordion from '@repo/ui/accordion';
+	import * as Alert from '@repo/ui/alert';
+	import { Button } from '@repo/ui/button';
+	import * as Card from '@repo/ui/card';
+	import * as SectionHeader from '@repo/ui/section-header';
+	import { Separator } from '@repo/ui/separator';
 	import { slide } from 'svelte/transition';
 
 	let { transformation = $bindable() }: { transformation: Transformation } =
@@ -138,8 +139,8 @@
 									items={TRANSFORMATION_STEP_TYPES.map(
 										(type) =>
 											({
-												value: type,
 												label: TRANSFORMATION_STEP_TYPES_TO_LABELS[type],
+												value: type,
 											}) as const,
 									)}
 									onSelectedChange={(value) => {
diff --git a/apps/whispering/src/lib/components/transformations-editor/Editor.svelte b/apps/whispering/src/lib/components/transformations-editor/Editor.svelte
index 34faa76633..e309462b36 100644
--- a/apps/whispering/src/lib/components/transformations-editor/Editor.svelte
+++ b/apps/whispering/src/lib/components/transformations-editor/Editor.svelte
@@ -1,8 +1,10 @@
 <script lang="ts">
-	import * as Resizable from '@repo/ui/resizable';
-	import { rpc } from '$lib/query';
 	import type { Transformation } from '$lib/services/db';
+
+	import { rpc } from '$lib/query';
+	import * as Resizable from '@repo/ui/resizable';
 	import { createQuery } from '@tanstack/svelte-query';
+
 	import Configuration from './Configuration.svelte';
 	import Runs from './Runs.svelte';
 	import Test from './Test.svelte';
diff --git a/apps/whispering/src/lib/components/transformations-editor/Runs.svelte b/apps/whispering/src/lib/components/transformations-editor/Runs.svelte
index bdfa44081c..79bfbbcfd9 100644
--- a/apps/whispering/src/lib/components/transformations-editor/Runs.svelte
+++ b/apps/whispering/src/lib/components/transformations-editor/Runs.svelte
@@ -1,19 +1,20 @@
 <script lang="ts">
+	import type { TransformationRun } from '$lib/services/db';
+
 	import CopyablePre from '$lib/components/copyable/CopyablePre.svelte';
 	import CopyableTextareaExpandsToDialog from '$lib/components/copyable/CopyableTextareaExpandsToDialog.svelte';
+	import { getTransformationStepRunTransitionId } from '$lib/utils/getRecordingTransitionId';
+	import { ChevronDown, ChevronRight } from '@lucide/svelte';
 	import { Badge } from '@repo/ui/badge';
 	import { Button } from '@repo/ui/button';
 	import * as Card from '@repo/ui/card';
 	import { Label } from '@repo/ui/label';
 	import * as Table from '@repo/ui/table';
-	import type { TransformationRun } from '$lib/services/db';
-	import { getTransformationStepRunTransitionId } from '$lib/utils/getRecordingTransitionId';
 	import { format } from 'date-fns';
-	import { ChevronDown, ChevronRight } from '@lucide/svelte';
 
 	let { runs }: { runs: TransformationRun[] } = $props();
 
-	let expandedRunId = $state<string | null>(null);
+	let expandedRunId = $state<null | string>(null);
 
 	function toggleRunExpanded(runId: string) {
 		expandedRunId = expandedRunId === runId ? null : runId;
@@ -125,8 +126,8 @@
 															<Table.Cell>
 																<CopyableTextareaExpandsToDialog
 																	id={getTransformationStepRunTransitionId({
-																		stepRunId: stepRun.id,
 																		propertyName: 'input',
+																		stepRunId: stepRun.id,
 																	})}
 																	title="Step Input"
 																	label="step input"
@@ -137,8 +138,8 @@
 																{#if stepRun.status === 'completed'}
 																	<CopyableTextareaExpandsToDialog
 																		id={getTransformationStepRunTransitionId({
-																			stepRunId: stepRun.id,
 																			propertyName: 'output',
+																			stepRunId: stepRun.id,
 																		})}
 																		title="Step Output"
 																		label="step output"
@@ -147,8 +148,8 @@
 																{:else if stepRun.status === 'failed'}
 																	<CopyableTextareaExpandsToDialog
 																		id={getTransformationStepRunTransitionId({
-																			stepRunId: stepRun.id,
 																			propertyName: 'error',
+																			stepRunId: stepRun.id,
 																		})}
 																		title="Step Error"
 																		label="step error"
diff --git a/apps/whispering/src/lib/components/transformations-editor/Test.svelte b/apps/whispering/src/lib/components/transformations-editor/Test.svelte
index e1afa35771..33ee57fcbe 100644
--- a/apps/whispering/src/lib/components/transformations-editor/Test.svelte
+++ b/apps/whispering/src/lib/components/transformations-editor/Test.svelte
@@ -1,12 +1,13 @@
 <script lang="ts">
+	import type { Transformation } from '$lib/services/db';
+
 	import { LabeledTextarea } from '$lib/components/labeled/index.js';
+	import { rpc } from '$lib/query';
+	import { Loader2Icon, PlayIcon } from '@lucide/svelte';
 	import { Button } from '@repo/ui/button';
 	import * as SectionHeader from '@repo/ui/section-header';
 	import { Separator } from '@repo/ui/separator';
-	import { rpc } from '$lib/query';
-	import type { Transformation } from '$lib/services/db';
 	import { createMutation } from '@tanstack/svelte-query';
-	import { Loader2Icon, PlayIcon } from '@lucide/svelte';
 
 	const transformInput = createMutation(rpc.transformer.transformInput.options);
 
diff --git a/apps/whispering/src/lib/constants/app/index.ts b/apps/whispering/src/lib/constants/app/index.ts
index d7083f0246..36d8e7363d 100644
--- a/apps/whispering/src/lib/constants/app/index.ts
+++ b/apps/whispering/src/lib/constants/app/index.ts
@@ -1,8 +1,8 @@
 export {
-	WHISPERING_URL,
-	WHISPERING_URL_WILDCARD,
 	WHISPERING_RECORDINGS_PATHNAME,
 	WHISPERING_SETTINGS_PATHNAME,
+	WHISPERING_URL,
+	WHISPERING_URL_WILDCARD,
 } from './urls';
 
 export { DEBOUNCE_TIME_MS } from './timing';
diff --git a/apps/whispering/src/lib/constants/audio/index.ts b/apps/whispering/src/lib/constants/audio/index.ts
index 8ec016fb7f..fd9dd65de3 100644
--- a/apps/whispering/src/lib/constants/audio/index.ts
+++ b/apps/whispering/src/lib/constants/audio/index.ts
@@ -1,23 +1,23 @@
 export {
-	BITRATE_VALUES_KBPS,
 	BITRATE_OPTIONS,
+	BITRATE_VALUES_KBPS,
 	DEFAULT_BITRATE_KBPS,
 } from './bitrate';
 
 export {
-	RECORDING_MODES,
 	RECORDING_MODE_OPTIONS,
+	RECORDING_MODES,
 	type RecordingMode,
 } from './recording-modes';
 
 export {
-	recordingStateSchema,
+	type CancelRecordingResult,
 	recorderStateToIcons,
+	recordingStateSchema,
+	type VadState,
 	vadStateSchema,
 	vadStateToIcons,
 	type WhisperingRecordingState,
-	type CancelRecordingResult,
-	type VadState,
 } from './recording-states';
 
 export {
diff --git a/apps/whispering/src/lib/constants/audio/recording-modes.ts b/apps/whispering/src/lib/constants/audio/recording-modes.ts
index 5010b5eb20..655eb46f04 100644
--- a/apps/whispering/src/lib/constants/audio/recording-modes.ts
+++ b/apps/whispering/src/lib/constants/audio/recording-modes.ts
@@ -12,14 +12,14 @@ export const RECORDING_MODES = [
 export type RecordingMode = (typeof RECORDING_MODES)[number];
 
 export const RECORDING_MODE_OPTIONS = [
-	{ label: 'Manual', value: 'manual', icon: '🎙️', desktopOnly: false },
-	{ label: 'Voice Activated', value: 'vad', icon: '🎤', desktopOnly: false },
-	{ label: 'Upload File', value: 'upload', icon: '📁', desktopOnly: false },
+	{ desktopOnly: false, icon: '🎙️', label: 'Manual', value: 'manual' },
+	{ desktopOnly: false, icon: '🎤', label: 'Voice Activated', value: 'vad' },
+	{ desktopOnly: false, icon: '📁', label: 'Upload File', value: 'upload' },
 	// { label: 'Live', value: 'live', icon: '🎬', desktopOnly: false },
 	// { label: 'CPAL', value: 'cpal', icon: '🔊', desktopOnly: true },
 ] as const satisfies {
+	desktopOnly: boolean;
+	icon: string;
 	label: string;
 	value: RecordingMode;
-	icon: string;
-	desktopOnly: boolean;
 }[];
diff --git a/apps/whispering/src/lib/constants/audio/recording-states.ts b/apps/whispering/src/lib/constants/audio/recording-states.ts
index 22045de626..b35b9b9b28 100644
--- a/apps/whispering/src/lib/constants/audio/recording-states.ts
+++ b/apps/whispering/src/lib/constants/audio/recording-states.ts
@@ -5,12 +5,12 @@ import { z } from 'zod';
 
 export const recordingStateSchema = z.enum(['IDLE', 'RECORDING']);
 
-export type WhisperingRecordingState = z.infer<typeof recordingStateSchema>;
-
 export type CancelRecordingResult =
 	| { status: 'cancelled' }
 	| { status: 'no-recording' };
 
+export type WhisperingRecordingState = z.infer<typeof recordingStateSchema>;
+
 export const recorderStateToIcons = {
 	IDLE: '🎙️',
 	RECORDING: '⏹️',
diff --git a/apps/whispering/src/lib/constants/database/transformation-types.ts b/apps/whispering/src/lib/constants/database/transformation-types.ts
index 9e7e571d7a..ee7f3fa04f 100644
--- a/apps/whispering/src/lib/constants/database/transformation-types.ts
+++ b/apps/whispering/src/lib/constants/database/transformation-types.ts
@@ -8,6 +8,6 @@ export const TRANSFORMATION_STEP_TYPES = [
 ] as const;
 
 export const TRANSFORMATION_STEP_TYPES_TO_LABELS = {
-	prompt_transform: 'Prompt Transform',
 	find_replace: 'Find Replace',
+	prompt_transform: 'Prompt Transform',
 } as const satisfies Record<(typeof TRANSFORMATION_STEP_TYPES)[number], string>;
diff --git a/apps/whispering/src/lib/constants/inference/anthropic-models.ts b/apps/whispering/src/lib/constants/inference/anthropic-models.ts
index a7243513ca..daa03d6ee7 100644
--- a/apps/whispering/src/lib/constants/inference/anthropic-models.ts
+++ b/apps/whispering/src/lib/constants/inference/anthropic-models.ts
@@ -11,7 +11,7 @@ export const ANTHROPIC_INFERENCE_MODELS = [
 
 export const ANTHROPIC_INFERENCE_MODEL_OPTIONS = ANTHROPIC_INFERENCE_MODELS.map(
 	(model) => ({
-		value: model,
 		label: model,
+		value: model,
 	}),
 );
diff --git a/apps/whispering/src/lib/constants/inference/google-models.ts b/apps/whispering/src/lib/constants/inference/google-models.ts
index d085293854..9754bd91e6 100644
--- a/apps/whispering/src/lib/constants/inference/google-models.ts
+++ b/apps/whispering/src/lib/constants/inference/google-models.ts
@@ -11,7 +11,7 @@ export const GOOGLE_INFERENCE_MODELS = [
 
 export const GOOGLE_INFERENCE_MODEL_OPTIONS = GOOGLE_INFERENCE_MODELS.map(
 	(model) => ({
-		value: model,
 		label: model,
+		value: model,
 	}),
 );
diff --git a/apps/whispering/src/lib/constants/inference/groq-models.ts b/apps/whispering/src/lib/constants/inference/groq-models.ts
index 3082d4eb73..cfb4239352 100644
--- a/apps/whispering/src/lib/constants/inference/groq-models.ts
+++ b/apps/whispering/src/lib/constants/inference/groq-models.ts
@@ -22,7 +22,7 @@ export const GROQ_INFERENCE_MODELS = [
 
 export const GROQ_INFERENCE_MODEL_OPTIONS = GROQ_INFERENCE_MODELS.map(
 	(model) => ({
-		value: model,
 		label: model,
+		value: model,
 	}),
 );
diff --git a/apps/whispering/src/lib/constants/inference/index.ts b/apps/whispering/src/lib/constants/inference/index.ts
index 15fcb2d1ce..327f7fca4d 100644
--- a/apps/whispering/src/lib/constants/inference/index.ts
+++ b/apps/whispering/src/lib/constants/inference/index.ts
@@ -1,21 +1,21 @@
-export { INFERENCE_PROVIDERS, INFERENCE_PROVIDER_OPTIONS } from './providers';
+export { INFERENCE_PROVIDER_OPTIONS, INFERENCE_PROVIDERS } from './providers';
 
 export {
-	OPENAI_INFERENCE_MODELS,
 	OPENAI_INFERENCE_MODEL_OPTIONS,
+	OPENAI_INFERENCE_MODELS,
 } from './openai-models';
 
 export {
-	GROQ_INFERENCE_MODELS,
 	GROQ_INFERENCE_MODEL_OPTIONS,
+	GROQ_INFERENCE_MODELS,
 } from './groq-models';
 
 export {
-	ANTHROPIC_INFERENCE_MODELS,
 	ANTHROPIC_INFERENCE_MODEL_OPTIONS,
+	ANTHROPIC_INFERENCE_MODELS,
 } from './anthropic-models';
 
 export {
-	GOOGLE_INFERENCE_MODELS,
 	GOOGLE_INFERENCE_MODEL_OPTIONS,
+	GOOGLE_INFERENCE_MODELS,
 } from './google-models';
diff --git a/apps/whispering/src/lib/constants/inference/openai-models.ts b/apps/whispering/src/lib/constants/inference/openai-models.ts
index ea0e63f0a5..cff4c10c4d 100644
--- a/apps/whispering/src/lib/constants/inference/openai-models.ts
+++ b/apps/whispering/src/lib/constants/inference/openai-models.ts
@@ -18,7 +18,7 @@ export const OPENAI_INFERENCE_MODELS = [
 
 export const OPENAI_INFERENCE_MODEL_OPTIONS = OPENAI_INFERENCE_MODELS.map(
 	(model) => ({
-		value: model,
 		label: model,
+		value: model,
 	}),
 );
diff --git a/apps/whispering/src/lib/constants/inference/providers.ts b/apps/whispering/src/lib/constants/inference/providers.ts
index aa2e5615b4..58f96a1223 100644
--- a/apps/whispering/src/lib/constants/inference/providers.ts
+++ b/apps/whispering/src/lib/constants/inference/providers.ts
@@ -11,7 +11,7 @@ export const INFERENCE_PROVIDERS = [
 
 export const INFERENCE_PROVIDER_OPTIONS = INFERENCE_PROVIDERS.map(
 	(provider) => ({
-		value: provider,
 		label: provider,
+		value: provider,
 	}),
 );
diff --git a/apps/whispering/src/lib/constants/keyboard/index.ts b/apps/whispering/src/lib/constants/keyboard/index.ts
index be879c3121..110ad2090b 100644
--- a/apps/whispering/src/lib/constants/keyboard/index.ts
+++ b/apps/whispering/src/lib/constants/keyboard/index.ts
@@ -1,19 +1,19 @@
 export type { AcceleratorPossibleKey } from './accelerator/possible-keys';
 
 export {
-	ACCELERATOR_SECTIONS,
-	ACCELERATOR_MODIFIER_KEYS,
 	ACCELERATOR_KEY_CODES,
-	type AcceleratorModifier,
+	ACCELERATOR_MODIFIER_KEYS,
+	ACCELERATOR_SECTIONS,
 	type AcceleratorKeyCode,
+	type AcceleratorModifier,
 } from './accelerator/supported-keys';
 
 export type { KeyboardEventPossibleKey } from './browser/possible-keys';
 
 export {
+	isSupportedKey,
 	KEYBOARD_EVENT_SUPPORTED_KEY_SECTIONS,
 	KEYBOARD_EVENT_SUPPORTED_KEYS,
-	isSupportedKey,
 	type KeyboardEventSupportedKey,
 } from './browser/supported-keys';
 
@@ -22,4 +22,4 @@ export {
 	OPTION_DEAD_KEYS,
 } from './macos-option-key-map';
 
-export { CommandOrControl, CommandOrAlt } from './modifiers';
+export { CommandOrAlt, CommandOrControl } from './modifiers';
diff --git a/apps/whispering/src/lib/constants/keyboard/macos-option-key-map.ts b/apps/whispering/src/lib/constants/keyboard/macos-option-key-map.ts
index 4299ea4711..030f76268a 100644
--- a/apps/whispering/src/lib/constants/keyboard/macos-option-key-map.ts
+++ b/apps/whispering/src/lib/constants/keyboard/macos-option-key-map.ts
@@ -7,46 +7,46 @@ import type { KeyboardEventPossibleKey } from './browser/possible-keys';
  * back to their original keys for consistent shortcut handling.
  */
 const OPTION_KEY_CHARACTER_MAP: Record<string, KeyboardEventPossibleKey> = {
-	// Option + Letters (A-Z)
-	å: 'a', // Option+A
-	'∫': 'b', // Option+B
-	ç: 'c', // Option+C
-	'∂': 'd', // Option+D
-	ƒ: 'f', // Option+F (E is accent modifier)
-	'©': 'g', // Option+G
+	'–': '-', // Option+- (en dash)
+	'¡': '1', // Option+1
+	// Option + Punctuation
+	'"': '[', // Option+[
+	"'": ']', // Option+]
+	'†': 't', // Option+T
+	'•': '8', // Option+8 (5,6,7 don't produce special chars)
 	'˙': 'h', // Option+H
-	'∆': 'j', // Option+J (I is accent modifier)
 	'˚': 'k', // Option+K
-	'¬': 'l', // Option+L
-	µ: 'm', // Option+M
-	ø: 'o', // Option+O (N is accent modifier)
-	π: 'p', // Option+P
-	œ: 'q', // Option+Q
+	'©': 'g', // Option+G
 	'®': 'r', // Option+R
-	ß: 's', // Option+S
-	'†': 't', // Option+T
-	'√': 'v', // Option+V (U is accent modifier)
+	'∂': 'd', // Option+D
+	'∆': 'j', // Option+J (I is accent modifier)
 	'∑': 'w', // Option+W
+	'÷': '/', // Option+/
+	'¬': 'l', // Option+L
+	'√': 'v', // Option+V (U is accent modifier)
+	'∫': 'b', // Option+B
 	'≈': 'x', // Option+X
-	'¥': 'y', // Option+Y
-	Ω: 'z', // Option+Z
+	'≤': ',', // Option+,
+	'≥': '.', // Option+.
+	'¢': '4', // Option+4
+	'£': '3', // Option+3
 
+	'¥': 'y', // Option+Y
+	ª: '9', // Option+9
+	// Option + Letters (A-Z)
+	å: 'a', // Option+A
+	ç: 'c', // Option+C
+	ƒ: 'f', // Option+F (E is accent modifier)
 	// Option + Numbers
 	º: '0', // Option+0
-	'¡': '1', // Option+1
-	'™': '2', // Option+2
-	'£': '3', // Option+3
-	'¢': '4', // Option+4
-	'•': '8', // Option+8 (5,6,7 don't produce special chars)
-	ª: '9', // Option+9
+	ø: 'o', // Option+O (N is accent modifier)
 
-	// Option + Punctuation
-	'"': '[', // Option+[
-	"'": ']', // Option+]
-	'–': '-', // Option+- (en dash)
-	'÷': '/', // Option+/
-	'≥': '.', // Option+.
-	'≤': ',', // Option+,
+	œ: 'q', // Option+Q
+	ß: 's', // Option+S
+	'™': '2', // Option+2
+	µ: 'm', // Option+M
+	π: 'p', // Option+P
+	Ω: 'z', // Option+Z
 };
 
 /**
@@ -79,4 +79,4 @@ export function normalizeOptionKeyCharacter(
  * These don't produce a character immediately but wait for the next key
  * to create accented characters (e.g., Option+E then A = "á").
  */
-export const OPTION_DEAD_KEYS = new Set(['e', 'i', 'n', 'u', '`']);
+export const OPTION_DEAD_KEYS = new Set(['`', 'e', 'i', 'n', 'u']);
diff --git a/apps/whispering/src/lib/constants/languages/supported-languages.ts b/apps/whispering/src/lib/constants/languages/supported-languages.ts
index 8f2c49df8d..4589e5971b 100644
--- a/apps/whispering/src/lib/constants/languages/supported-languages.ts
+++ b/apps/whispering/src/lib/constants/languages/supported-languages.ts
@@ -67,64 +67,64 @@ export const SUPPORTED_LANGUAGES = [
 export type SupportedLanguage = (typeof SUPPORTED_LANGUAGES)[number];
 
 const SUPPORTED_LANGUAGES_TO_LABEL = {
-	auto: 'Auto',
 	af: 'Afrikaans',
 	ar: 'Arabic',
-	hy: 'Armenian',
+	auto: 'Auto',
 	az: 'Azerbaijani',
 	be: 'Belarusian',
-	bs: 'Bosnian',
 	bg: 'Bulgarian',
+	bs: 'Bosnian',
 	ca: 'Catalan',
-	zh: 'Chinese',
-	hr: 'Croatian',
 	cs: 'Czech',
+	cy: 'Welsh',
 	da: 'Danish',
-	nl: 'Dutch',
+	de: 'German',
+	el: 'Greek',
 	en: 'English',
+	es: 'Spanish',
 	et: 'Estonian',
+	fa: 'Persian',
 	fi: 'Finnish',
 	fr: 'French',
 	gl: 'Galician',
-	de: 'German',
-	el: 'Greek',
 	he: 'Hebrew',
 	hi: 'Hindi',
+	hr: 'Croatian',
 	hu: 'Hungarian',
-	is: 'Icelandic',
+	hy: 'Armenian',
 	id: 'Indonesian',
+	is: 'Icelandic',
 	it: 'Italian',
 	ja: 'Japanese',
-	kn: 'Kannada',
 	kk: 'Kazakh',
+	kn: 'Kannada',
 	ko: 'Korean',
-	lv: 'Latvian',
 	lt: 'Lithuanian',
+	lv: 'Latvian',
+	mi: 'Maori',
 	mk: 'Macedonian',
-	ms: 'Malay',
 	mr: 'Marathi',
-	mi: 'Maori',
+	ms: 'Malay',
 	ne: 'Nepali',
+	nl: 'Dutch',
 	no: 'Norwegian',
-	fa: 'Persian',
 	pl: 'Polish',
 	pt: 'Portuguese',
 	ro: 'Romanian',
 	ru: 'Russian',
-	sr: 'Serbian',
 	sk: 'Slovak',
 	sl: 'Slovenian',
-	es: 'Spanish',
-	sw: 'Swahili',
+	sr: 'Serbian',
 	sv: 'Swedish',
-	tl: 'Tagalog',
+	sw: 'Swahili',
 	ta: 'Tamil',
 	th: 'Thai',
+	tl: 'Tagalog',
 	tr: 'Turkish',
 	uk: 'Ukrainian',
 	ur: 'Urdu',
 	vi: 'Vietnamese',
-	cy: 'Welsh',
+	zh: 'Chinese',
 } as const satisfies Record<SupportedLanguage, string>;
 
 export const SUPPORTED_LANGUAGES_OPTIONS = SUPPORTED_LANGUAGES.map(
diff --git a/apps/whispering/src/lib/constants/sounds/sound-names.ts b/apps/whispering/src/lib/constants/sounds/sound-names.ts
index abe76c9a4a..741cc96d26 100644
--- a/apps/whispering/src/lib/constants/sounds/sound-names.ts
+++ b/apps/whispering/src/lib/constants/sounds/sound-names.ts
@@ -3,11 +3,11 @@
  */
 
 export type WhisperingSoundNames =
+	| 'manual-cancel'
 	| 'manual-start'
 	| 'manual-stop'
-	| 'manual-cancel'
-	| 'vad-start'
-	| 'vad-capture'
-	| 'vad-stop'
 	| 'transcriptionComplete'
-	| 'transformationComplete';
+	| 'transformationComplete'
+	| 'vad-capture'
+	| 'vad-start'
+	| 'vad-stop';
diff --git a/apps/whispering/src/lib/constants/transcription/index.ts b/apps/whispering/src/lib/constants/transcription/index.ts
index 96e645e47a..e938c83cb0 100644
--- a/apps/whispering/src/lib/constants/transcription/index.ts
+++ b/apps/whispering/src/lib/constants/transcription/index.ts
@@ -17,7 +17,7 @@ export {
 
 export {
 	TRANSCRIPTION_SERVICE_IDS,
-	TRANSCRIPTION_SERVICES,
 	TRANSCRIPTION_SERVICE_OPTIONS,
+	TRANSCRIPTION_SERVICES,
 	type TranscriptionService,
 } from './transcription-services';
diff --git a/apps/whispering/src/lib/constants/transcription/transcription-services.ts b/apps/whispering/src/lib/constants/transcription/transcription-services.ts
index 5cc9a3333a..48deb2e952 100644
--- a/apps/whispering/src/lib/constants/transcription/transcription-services.ts
+++ b/apps/whispering/src/lib/constants/transcription/transcription-services.ts
@@ -3,13 +3,17 @@
  */
 import type { Settings } from '$lib/settings';
 
+import deepgramIcon from '$lib/constants/icons/deepgram.svg?raw';
+import elevenlabsIcon from '$lib/constants/icons/elevenlabs.svg?raw';
+import ggmlIcon from '$lib/constants/icons/ggml.svg?raw';
 // Import SVG icons as strings
 import groqIcon from '$lib/constants/icons/groq.svg?raw';
-import ggmlIcon from '$lib/constants/icons/ggml.svg?raw';
 import openaiIcon from '$lib/constants/icons/openai.svg?raw';
-import elevenlabsIcon from '$lib/constants/icons/elevenlabs.svg?raw';
 import speachesIcon from '$lib/constants/icons/speaches.svg?raw';
-import deepgramIcon from '$lib/constants/icons/deepgram.svg?raw';
+import {
+	DEEPGRAM_TRANSCRIPTION_MODELS,
+	type DeepgramModel,
+} from '$lib/services/transcription/deepgram';
 import {
 	ELEVENLABS_TRANSCRIPTION_MODELS,
 	type ElevenLabsModel,
@@ -19,16 +23,12 @@ import {
 	OPENAI_TRANSCRIPTION_MODELS,
 	type OpenAIModel,
 } from '$lib/services/transcription/openai';
-import {
-	DEEPGRAM_TRANSCRIPTION_MODELS,
-	type DeepgramModel,
-} from '$lib/services/transcription/deepgram';
 
 type TranscriptionModel =
-	| OpenAIModel
-	| GroqModel
+	| DeepgramModel
 	| ElevenLabsModel
-	| DeepgramModel;
+	| GroqModel
+	| OpenAIModel;
 
 export const TRANSCRIPTION_SERVICE_IDS = [
 	'whispercpp',
@@ -40,27 +40,20 @@ export const TRANSCRIPTION_SERVICE_IDS = [
 	// 'owhisper',
 ] as const;
 
-type TranscriptionServiceId = (typeof TRANSCRIPTION_SERVICE_IDS)[number];
-
 type BaseTranscriptionService = {
-	id: TranscriptionServiceId;
-	name: string;
+	description?: string;
 	icon: string; // SVG string
+	id: TranscriptionServiceId;
 	invertInDarkMode: boolean; // Whether to invert the icon in dark mode
-	description?: string;
+	name: string;
 };
 
 type CloudTranscriptionService = BaseTranscriptionService & {
+	apiKeyField: keyof Settings;
+	defaultModel: TranscriptionModel;
 	location: 'cloud';
 	models: readonly TranscriptionModel[];
-	defaultModel: TranscriptionModel;
 	modelSettingKey: string;
-	apiKeyField: keyof Settings;
-};
-
-type SelfHostedTranscriptionService = BaseTranscriptionService & {
-	location: 'self-hosted';
-	serverUrlField: keyof Settings;
 };
 
 type LocalTranscriptionService = BaseTranscriptionService & {
@@ -70,78 +63,85 @@ type LocalTranscriptionService = BaseTranscriptionService & {
 
 type SatisfiedTranscriptionService =
 	| CloudTranscriptionService
-	| SelfHostedTranscriptionService
-	| LocalTranscriptionService;
+	| LocalTranscriptionService
+	| SelfHostedTranscriptionService;
+
+type SelfHostedTranscriptionService = BaseTranscriptionService & {
+	location: 'self-hosted';
+	serverUrlField: keyof Settings;
+};
+
+type TranscriptionServiceId = (typeof TRANSCRIPTION_SERVICE_IDS)[number];
 
 export const TRANSCRIPTION_SERVICES = [
 	// Local services first (truly offline)
 	{
-		id: 'whispercpp',
-		name: 'Whisper C++',
+		description: 'Fast local transcription with no internet required',
 		icon: ggmlIcon,
+		id: 'whispercpp',
 		invertInDarkMode: true,
-		description: 'Fast local transcription with no internet required',
-		modelPathField: 'transcription.whispercpp.modelPath',
 		location: 'local',
+		modelPathField: 'transcription.whispercpp.modelPath',
+		name: 'Whisper C++',
 	},
 	// Cloud services (API-based)
 	{
-		id: 'Groq',
-		name: 'Groq',
+		description: 'Lightning-fast cloud transcription',
+		apiKeyField: 'apiKeys.groq',
+		defaultModel: GROQ_MODELS[2],
 		icon: groqIcon,
+		id: 'Groq',
 		invertInDarkMode: false, // Groq has a colored logo that works in both modes
-		description: 'Lightning-fast cloud transcription',
+		location: 'cloud',
 		models: GROQ_MODELS,
-		defaultModel: GROQ_MODELS[2],
 		modelSettingKey: 'transcription.groq.model',
-		apiKeyField: 'apiKeys.groq',
-		location: 'cloud',
+		name: 'Groq',
 	},
 	{
-		id: 'OpenAI',
-		name: 'OpenAI',
+		description: 'Industry-standard Whisper API',
+		apiKeyField: 'apiKeys.openai',
+		defaultModel: OPENAI_TRANSCRIPTION_MODELS[0],
 		icon: openaiIcon,
+		id: 'OpenAI',
 		invertInDarkMode: true,
-		description: 'Industry-standard Whisper API',
+		location: 'cloud',
 		models: OPENAI_TRANSCRIPTION_MODELS,
-		defaultModel: OPENAI_TRANSCRIPTION_MODELS[0],
 		modelSettingKey: 'transcription.openai.model',
-		apiKeyField: 'apiKeys.openai',
-		location: 'cloud',
+		name: 'OpenAI',
 	},
 	{
-		id: 'ElevenLabs',
-		name: 'ElevenLabs',
+		description: 'Voice AI platform with transcription',
+		apiKeyField: 'apiKeys.elevenlabs',
+		defaultModel: ELEVENLABS_TRANSCRIPTION_MODELS[0],
 		icon: elevenlabsIcon,
+		id: 'ElevenLabs',
 		invertInDarkMode: true,
-		description: 'Voice AI platform with transcription',
+		location: 'cloud',
 		models: ELEVENLABS_TRANSCRIPTION_MODELS,
-		defaultModel: ELEVENLABS_TRANSCRIPTION_MODELS[0],
 		modelSettingKey: 'transcription.elevenlabs.model',
-		apiKeyField: 'apiKeys.elevenlabs',
-		location: 'cloud',
+		name: 'ElevenLabs',
 	},
 	{
-		id: 'Deepgram',
-		name: 'Deepgram',
+		description: 'Real-time speech recognition API',
+		apiKeyField: 'apiKeys.deepgram',
+		defaultModel: DEEPGRAM_TRANSCRIPTION_MODELS[0],
 		icon: deepgramIcon,
+		id: 'Deepgram',
 		invertInDarkMode: true,
-		description: 'Real-time speech recognition API',
+		location: 'cloud',
 		models: DEEPGRAM_TRANSCRIPTION_MODELS,
-		defaultModel: DEEPGRAM_TRANSCRIPTION_MODELS[0],
 		modelSettingKey: 'transcription.deepgram.model',
-		apiKeyField: 'apiKeys.deepgram',
-		location: 'cloud',
+		name: 'Deepgram',
 	},
 	// Self-hosted services
 	{
-		id: 'speaches',
-		name: 'Speaches',
+		description: 'Self-hosted transcription server',
 		icon: speachesIcon,
+		id: 'speaches',
 		invertInDarkMode: false, // Speaches has a colored logo
-		description: 'Self-hosted transcription server',
-		serverUrlField: 'transcription.speaches.baseUrl',
 		location: 'self-hosted',
+		name: 'Speaches',
+		serverUrlField: 'transcription.speaches.baseUrl',
 	},
 	// {
 	// 	id: 'owhisper',
diff --git a/apps/whispering/src/lib/constants/ui/index.ts b/apps/whispering/src/lib/constants/ui/index.ts
index 585c96c2a5..cd54c97e55 100644
--- a/apps/whispering/src/lib/constants/ui/index.ts
+++ b/apps/whispering/src/lib/constants/ui/index.ts
@@ -1,4 +1,4 @@
-export { ALWAYS_ON_TOP_VALUES, ALWAYS_ON_TOP_OPTIONS } from './always-on-top';
+export { ALWAYS_ON_TOP_OPTIONS, ALWAYS_ON_TOP_VALUES } from './always-on-top';
 
 export {
 	recorderStateToIcons,
diff --git a/apps/whispering/src/lib/query/_client.ts b/apps/whispering/src/lib/query/_client.ts
index 47fa32bfca..c22dc9bf59 100644
--- a/apps/whispering/src/lib/query/_client.ts
+++ b/apps/whispering/src/lib/query/_client.ts
@@ -10,5 +10,5 @@ export const queryClient = new QueryClient({
 	},
 });
 
-export const { defineQuery, defineMutation } =
+export const { defineMutation, defineQuery } =
 	createQueryFactories(queryClient);
diff --git a/apps/whispering/src/lib/query/analytics.ts b/apps/whispering/src/lib/query/analytics.ts
index 6e99329315..bd5b4ff2dc 100644
--- a/apps/whispering/src/lib/query/analytics.ts
+++ b/apps/whispering/src/lib/query/analytics.ts
@@ -1,7 +1,9 @@
-import * as services from '$lib/services';
 import type { Event } from '$lib/services/analytics/types';
+
+import * as services from '$lib/services';
 import { settings } from '$lib/stores/settings.svelte';
 import { Ok, type Result } from 'wellcrafted/result';
+
 import { defineMutation } from './_client';
 
 const analyticsKeys = {
diff --git a/apps/whispering/src/lib/query/commands.ts b/apps/whispering/src/lib/query/commands.ts
index 8d1752bb84..6532f903ac 100644
--- a/apps/whispering/src/lib/query/commands.ts
+++ b/apps/whispering/src/lib/query/commands.ts
@@ -1,23 +1,91 @@
 import type { RecordingMode } from '$lib/constants/audio';
+import type { SupportedLanguage } from '$lib/constants/languages';
+
 import { fromTaggedErr, fromTaggedError, WhisperingErr } from '$lib/result';
 import { DbServiceErr } from '$lib/services/db';
 import { settings } from '$lib/stores/settings.svelte';
 import { nanoid } from 'nanoid/non-secure';
 import { Err, Ok } from 'wellcrafted/result';
+
+import { rpc } from './';
 import { defineMutation } from './_client';
 import { delivery } from './delivery';
-import { recorder } from './recorder';
 import { notify } from './notify';
+import { recorder } from './recorder';
 import { recordings } from './recordings';
 import { sound } from './sound';
 import { transcription } from './transcription';
 import { transformations } from './transformations';
 import { transformer } from './transformer';
 import { vadRecorder } from './vad-recorder';
-import { rpc } from './';
+
+// Helper function to get human-readable language labels
+const getLanguageLabel = (langCode: SupportedLanguage): string => {
+	const labels: Record<SupportedLanguage, string> = {
+		af: 'Afrikaans',
+		ar: 'Arabic',
+		auto: 'Auto',
+		az: 'Azerbaijani',
+		be: 'Belarusian',
+		bg: 'Bulgarian',
+		bs: 'Bosnian',
+		ca: 'Catalan',
+		cs: 'Czech',
+		cy: 'Welsh',
+		da: 'Danish',
+		de: 'German',
+		el: 'Greek',
+		en: 'English',
+		es: 'Spanish',
+		et: 'Estonian',
+		fa: 'Persian',
+		fi: 'Finnish',
+		fr: 'French',
+		gl: 'Galician',
+		he: 'Hebrew',
+		hi: 'Hindi',
+		hr: 'Croatian',
+		hu: 'Hungarian',
+		hy: 'Armenian',
+		id: 'Indonesian',
+		is: 'Icelandic',
+		it: 'Italian',
+		ja: 'Japanese',
+		kk: 'Kazakh',
+		kn: 'Kannada',
+		ko: 'Korean',
+		lt: 'Lithuanian',
+		lv: 'Latvian',
+		mi: 'Maori',
+		mk: 'Macedonian',
+		mr: 'Marathi',
+		ms: 'Malay',
+		ne: 'Nepali',
+		nl: 'Dutch',
+		no: 'Norwegian',
+		pl: 'Polish',
+		pt: 'Portuguese',
+		ro: 'Romanian',
+		ru: 'Russian',
+		sk: 'Slovak',
+		sl: 'Slovenian',
+		sr: 'Serbian',
+		sv: 'Swedish',
+		sw: 'Swahili',
+		ta: 'Tamil',
+		th: 'Thai',
+		tl: 'Tagalog',
+		tr: 'Turkish',
+		uk: 'Ukrainian',
+		ur: 'Urdu',
+		vi: 'Vietnamese',
+		zh: 'Chinese',
+	};
+	return labels[langCode] || langCode;
+};
 
 // Track manual recording start time for duration calculation
-let manualRecordingStartTime: number | null = null;
+let manualRecordingStartTime: null | number = null;
 
 // Internal mutations for manual recording
 const startManualRecording = defineMutation({
@@ -27,9 +95,9 @@ const startManualRecording = defineMutation({
 
 		const toastId = nanoid();
 		notify.loading.execute({
-			id: toastId,
 			title: '🎙️ Preparing to record...',
 			description: 'Setting up your recording environment...',
+			id: toastId,
 		});
 		const { data: deviceAcquisitionOutcome, error: startRecordingError } =
 			await recorder.startRecording.execute({ toastId });
@@ -42,9 +110,9 @@ const startManualRecording = defineMutation({
 		switch (deviceAcquisitionOutcome.outcome) {
 			case 'success': {
 				notify.success.execute({
-					id: toastId,
 					title: '🎙️ Whispering is recording...',
 					description: 'Speak now and stop recording when done',
+					id: toastId,
 				});
 				break;
 			}
@@ -56,29 +124,29 @@ const startManualRecording = defineMutation({
 				switch (deviceAcquisitionOutcome.reason) {
 					case 'no-device-selected': {
 						notify.info.execute({
-							id: toastId,
 							title: '🎙️ Switched to available microphone',
 							description:
 								'No microphone was selected, so we automatically connected to an available one. You can update your selection in settings.',
 							action: {
-								type: 'link',
-								label: 'Open Settings',
 								href: '/settings/recording',
+								label: 'Open Settings',
+								type: 'link',
 							},
+							id: toastId,
 						});
 						break;
 					}
 					case 'preferred-device-unavailable': {
 						notify.info.execute({
-							id: toastId,
 							title: '🎙️ Switched to different microphone',
 							description:
 								"Your previously selected microphone wasn't found, so we automatically connected to an available one.",
 							action: {
-								type: 'link',
-								label: 'Open Settings',
 								href: '/settings/recording',
+								label: 'Open Settings',
+								type: 'link',
 							},
+							id: toastId,
 						});
 						break;
 					}
@@ -98,9 +166,9 @@ const stopManualRecording = defineMutation({
 	resultMutationFn: async () => {
 		const toastId = nanoid();
 		notify.loading.execute({
-			id: toastId,
 			title: '⏸️ Stopping recording...',
 			description: 'Finalizing your audio capture...',
+			id: toastId,
 		});
 		const { data: blob, error: stopRecordingError } =
 			await recorder.stopRecording.execute({ toastId });
@@ -110,9 +178,9 @@ const stopManualRecording = defineMutation({
 		}
 
 		notify.success.execute({
-			id: toastId,
 			title: '🎙️ Recording stopped',
 			description: 'Your recording has been saved',
+			id: toastId,
 		});
 		console.info('Recording stopped');
 		sound.playSoundIfEnabled.execute('manual-stop');
@@ -124,16 +192,16 @@ const stopManualRecording = defineMutation({
 			manualRecordingStartTime = null; // Reset for next recording
 		}
 		rpc.analytics.logEvent.execute({
-			type: 'manual_recording_completed',
 			blob_size: blob.size,
 			duration,
+			type: 'manual_recording_completed',
 		});
 
 		await processRecordingPipeline({
 			blob,
-			toastId,
-			completionTitle: '✨ Recording Complete!',
 			completionDescription: 'Recording saved and session closed successfully',
+			completionTitle: '✨ Recording Complete!',
+			toastId,
 		});
 
 		return Ok(undefined);
@@ -149,41 +217,41 @@ const startVadRecording = defineMutation({
 		const toastId = nanoid();
 		console.info('Starting voice activated capture');
 		notify.loading.execute({
-			id: toastId,
 			title: '🎙️ Starting voice activated capture',
 			description: 'Your voice activated capture is starting...',
+			id: toastId,
 		});
 		const { data: deviceAcquisitionOutcome, error: startActiveListeningError } =
 			await vadRecorder.startActiveListening.execute({
-				onSpeechStart: () => {
-					notify.success.execute({
-						title: '🎙️ Speech started',
-						description: 'Recording started. Speak clearly and loudly.',
-					});
-				},
 				onSpeechEnd: async (blob) => {
 					const toastId = nanoid();
 					notify.success.execute({
-						id: toastId,
 						title: '🎙️ Voice activated speech captured',
 						description: 'Your voice activated speech has been captured.',
+						id: toastId,
 					});
 					console.info('Voice activated speech captured');
 					sound.playSoundIfEnabled.execute('vad-capture');
 
 					// Log VAD recording completion
 					rpc.analytics.logEvent.execute({
-						type: 'vad_recording_completed',
 						blob_size: blob.size,
+						type: 'vad_recording_completed',
 						// VAD doesn't track duration by default
 					});
 
 					await processRecordingPipeline({
 						blob,
-						toastId,
-						completionTitle: '✨ Voice activated capture complete!',
 						completionDescription:
 							'Voice activated capture complete! Ready for another take',
+						completionTitle: '✨ Voice activated capture complete!',
+						toastId,
+					});
+				},
+				onSpeechStart: () => {
+					notify.success.execute({
+						title: '🎙️ Speech started',
+						description: 'Recording started. Speak clearly and loudly.',
 					});
 				},
 			});
@@ -196,9 +264,9 @@ const startVadRecording = defineMutation({
 		switch (deviceAcquisitionOutcome.outcome) {
 			case 'success': {
 				notify.success.execute({
-					id: toastId,
 					title: '🎙️ Voice activated capture started',
 					description: 'Your voice activated capture has been started.',
+					id: toastId,
 				});
 				break;
 			}
@@ -210,29 +278,29 @@ const startVadRecording = defineMutation({
 				switch (deviceAcquisitionOutcome.reason) {
 					case 'no-device-selected': {
 						notify.info.execute({
-							id: toastId,
 							title: '🎙️ VAD started with available microphone',
 							description:
 								'No microphone was selected for VAD, so we automatically connected to an available one. You can update your selection in settings.',
 							action: {
-								type: 'link',
-								label: 'Open Settings',
 								href: '/settings/recording',
+								label: 'Open Settings',
+								type: 'link',
 							},
+							id: toastId,
 						});
 						break;
 					}
 					case 'preferred-device-unavailable': {
 						notify.info.execute({
-							id: toastId,
 							title: '🎙️ VAD switched to different microphone',
 							description:
 								"Your previously selected VAD microphone wasn't found, so we automatically connected to an available one.",
 							action: {
-								type: 'link',
-								label: 'Open Settings',
 								href: '/settings/recording',
+								label: 'Open Settings',
+								type: 'link',
 							},
+							id: toastId,
 						});
 						break;
 					}
@@ -251,9 +319,9 @@ const stopVadRecording = defineMutation({
 		const toastId = nanoid();
 		console.info('Stopping voice activated capture');
 		notify.loading.execute({
-			id: toastId,
 			title: '⏸️ Stopping voice activated capture...',
 			description: 'Finalizing your voice activated capture...',
+			id: toastId,
 		});
 		const { error: stopVadError } =
 			await vadRecorder.stopActiveListening.execute(undefined);
@@ -262,9 +330,9 @@ const stopVadRecording = defineMutation({
 			return Err(stopVadError);
 		}
 		notify.success.execute({
-			id: toastId,
 			title: '🎙️ Voice activated capture stopped',
 			description: 'Your voice activated capture has been stopped.',
+			id: toastId,
 		});
 		sound.playSoundIfEnabled.execute('vad-stop');
 		return Ok(undefined);
@@ -272,37 +340,15 @@ const stopVadRecording = defineMutation({
 });
 
 export const commands = {
-	startManualRecording,
-	stopManualRecording,
-	startVadRecording,
-	stopVadRecording,
-
-	// Toggle manual recording
-	toggleManualRecording: defineMutation({
-		mutationKey: ['commands', 'toggleManualRecording'] as const,
-		resultMutationFn: async () => {
-			const { data: currentRecordingId, error: getRecordingIdError } =
-				await recorder.getCurrentRecordingId.fetch();
-			if (getRecordingIdError) {
-				notify.error.execute(getRecordingIdError);
-				return Err(getRecordingIdError);
-			}
-			if (currentRecordingId) {
-				return await stopManualRecording.execute(undefined);
-			}
-			return await startManualRecording.execute(undefined);
-		},
-	}),
-
 	// Cancel manual recording
 	cancelManualRecording: defineMutation({
 		mutationKey: ['commands', 'cancelManualRecording'] as const,
 		resultMutationFn: async () => {
 			const toastId = nanoid();
 			notify.loading.execute({
-				id: toastId,
 				title: '⏸️ Canceling recording...',
 				description: 'Cleaning up recording session...',
+				id: toastId,
 			});
 			const { data: cancelRecordingResult, error: cancelRecordingError } =
 				await recorder.cancelRecording.execute({ toastId });
@@ -311,31 +357,103 @@ export const commands = {
 				return Err(cancelRecordingError);
 			}
 			switch (cancelRecordingResult.status) {
-				case 'no-recording': {
-					notify.info.execute({
-						id: toastId,
-						title: 'No active recording',
-						description: 'There is no recording in progress to cancel.',
-					});
-					break;
-				}
 				case 'cancelled': {
 					// Session cleanup is now handled internally by the recorder service
 					// Reset start time if recording was cancelled
 					manualRecordingStartTime = null;
 					notify.success.execute({
-						id: toastId,
 						title: '✅ All Done!',
 						description: 'Recording cancelled successfully',
+						id: toastId,
 					});
 					sound.playSoundIfEnabled.execute('manual-cancel');
 					console.info('Recording cancelled');
 					break;
 				}
+				case 'no-recording': {
+					notify.info.execute({
+						title: 'No active recording',
+						description: 'There is no recording in progress to cancel.',
+						id: toastId,
+					});
+					break;
+				}
 			}
 			return Ok(undefined);
 		},
 	}),
+	setOutputLanguageSlot: defineMutation({
+		mutationKey: ['commands', 'setOutputLanguageSlot'] as const,
+		resultMutationFn: async ({ slot }: { slot: 1 | 2 | 3 }) => {
+			const favoriteLanguages = settings.value['transcription.favoriteLanguages'] ?? ['en', 'ja', 'zh'];
+			const targetLanguage = favoriteLanguages[slot - 1];
+			
+			if (!targetLanguage) {
+				return Err(WhisperingErr({
+					title: '❌ Language slot not configured',
+					description: `Favorite language slot ${slot} is not set. Configure it in Settings → Transcription.`,
+					action: { href: '/settings/transcription', label: 'Open settings', type: 'link' },
+				}));
+			}
+			
+			settings.updateKey('transcription.outputLanguage', targetLanguage);
+			
+			await notify.success.execute({
+				title: `Switched to language slot ${slot}`,
+				description: `Now transcribing to: ${getLanguageLabel(targetLanguage)}`,
+			});
+			
+			return Ok(targetLanguage);
+		},
+	}),
+	startManualRecording,
+	startVadRecording,
+
+	stopManualRecording,
+
+	stopVadRecording,
+
+	// Toggle manual recording
+	toggleManualRecording: defineMutation({
+		mutationKey: ['commands', 'toggleManualRecording'] as const,
+		resultMutationFn: async () => {
+			const { data: currentRecordingId, error: getRecordingIdError } =
+				await recorder.getCurrentRecordingId.fetch();
+			if (getRecordingIdError) {
+				notify.error.execute(getRecordingIdError);
+				return Err(getRecordingIdError);
+			}
+			if (currentRecordingId) {
+				return await stopManualRecording.execute(undefined);
+			}
+			return await startManualRecording.execute(undefined);
+		},
+	}),
+
+	// Language toggle commands
+	toggleOutputLanguage: defineMutation({
+		mutationKey: ['commands', 'toggleOutputLanguage'] as const,
+		resultMutationFn: async () => {
+			const currentLanguage = settings.value['transcription.outputLanguage'];
+			const favoriteLanguages = settings.value['transcription.favoriteLanguages'] ?? ['en', 'ja', 'zh'];
+			
+			// Find current index and cycle to next
+			const currentIndex = favoriteLanguages.indexOf(currentLanguage);
+			const nextIndex = (currentIndex + 1) % favoriteLanguages.length;
+			const newLanguage = favoriteLanguages[nextIndex];
+			
+			// Update setting
+			settings.updateKey('transcription.outputLanguage', newLanguage);
+			
+			// Success notification with visual feedback
+			await notify.success.execute({
+				title: 'Output language changed',
+				description: `Now transcribing to: ${getLanguageLabel(newLanguage)}`,
+			});
+			
+			return Ok(newLanguage);
+		},
+	}),
 
 	// Toggle VAD recording
 	toggleVadRecording: defineMutation({
@@ -354,9 +472,9 @@ export const commands = {
 		mutationKey: ['recordings', 'uploadRecordings'] as const,
 		resultMutationFn: async ({ files }: { files: File[] }) => {
 			// Partition files into valid and invalid in a single pass
-			const { valid: validFiles, invalid: invalidFiles } = files.reduce<{
-				valid: File[];
+			const { invalid: invalidFiles, valid: validFiles } = files.reduce<{
 				invalid: File[];
+				valid: File[];
 			}>(
 				(acc, file) => {
 					const isValid =
@@ -364,14 +482,14 @@ export const commands = {
 					acc[isValid ? 'valid' : 'invalid'].push(file);
 					return acc;
 				},
-				{ valid: [], invalid: [] },
+				{ invalid: [], valid: [] },
 			);
 
 			if (validFiles.length === 0) {
 				return DbServiceErr({
-					message: 'No valid audio or video files found.',
-					context: { providedFiles: files.length },
 					cause: undefined,
+					context: { providedFiles: files.length },
+					message: 'No valid audio or video files found.',
 				});
 			}
 
@@ -390,17 +508,17 @@ export const commands = {
 					
 					// Log file upload event
 					rpc.analytics.logEvent.execute({
-						type: 'file_uploaded',
 						blob_size: audioBlob.size,
+						type: 'file_uploaded',
 					});
 
 					// Each file gets its own toast notification
 					const toastId = nanoid();
 					await processRecordingPipeline({
 						blob: audioBlob,
-						toastId,
-						completionTitle: '📁 File uploaded successfully!',
 						completionDescription: file.name,
+						completionTitle: '📁 File uploaded successfully!',
+						toastId,
 					});
 				}),
 			);
@@ -425,53 +543,53 @@ export const commands = {
  */
 async function processRecordingPipeline({
 	blob,
-	toastId,
-	completionTitle,
 	completionDescription,
+	completionTitle,
+	toastId,
 }: {
 	blob: Blob;
-	toastId: string;
-	completionTitle: string;
 	completionDescription: string;
+	completionTitle: string;
+	toastId: string;
 }) {
 	const now = new Date().toISOString();
 	const newRecordingId = nanoid();
 
 	const { data: createdRecording, error: createRecordingError } =
 		await recordings.createRecording.execute({
-			id: newRecordingId,
 			title: '',
-			subtitle: '',
+			blob,
 			createdAt: now,
-			updatedAt: now,
+			id: newRecordingId,
+			subtitle: '',
 			timestamp: now,
 			transcribedText: '',
-			blob,
 			transcriptionStatus: 'UNPROCESSED',
+			updatedAt: now,
 		});
 
 	if (createRecordingError) {
 		notify.error.execute({
-			id: toastId,
 			title:
 				'❌ Your recording was captured but could not be saved to the database.',
 			description: createRecordingError.message,
-			action: { type: 'more-details', error: createRecordingError },
+			action: { error: createRecordingError, type: 'more-details' },
+			id: toastId,
 		});
 		return;
 	}
 
 	notify.success.execute({
-		id: toastId,
 		title: completionTitle,
 		description: completionDescription,
+		id: toastId,
 	});
 
 	const transcribeToastId = nanoid();
 	notify.loading.execute({
-		id: transcribeToastId,
 		title: '📋 Transcribing...',
 		description: 'Your recording is being transcribed...',
+		id: transcribeToastId,
 	});
 
 	const { data: transcribedText, error: transcribeError } =
@@ -483,10 +601,10 @@ async function processRecordingPipeline({
 			return;
 		}
 		notify.error.execute({
-			id: transcribeToastId,
 			title: '❌ Failed to transcribe recording',
 			description: 'Your recording could not be transcribed.',
-			action: { type: 'more-details', error: transcribeError },
+			action: { error: transcribeError, type: 'more-details' },
+			id: transcribeToastId,
 		});
 		return;
 	}
@@ -515,7 +633,7 @@ async function processRecordingPipeline({
 		notify.error.execute(
 			fromTaggedError(getTransformationError, {
 				title: '❌ Failed to get transformation',
-				action: { type: 'more-details', error: getTransformationError },
+				action: { error: getTransformationError, type: 'more-details' },
 			}),
 		);
 		return;
@@ -528,9 +646,9 @@ async function processRecordingPipeline({
 			description:
 				'No matching transformation found. Please select a different transformation.',
 			action: {
-				type: 'link',
-				label: 'Select a different transformation',
 				href: '/transformations',
+				label: 'Select a different transformation',
+				type: 'link',
 			},
 		});
 		return;
@@ -538,10 +656,10 @@ async function processRecordingPipeline({
 
 	const transformToastId = nanoid();
 	notify.loading.execute({
-		id: transformToastId,
 		title: '🔄 Running transformation...',
 		description:
 			'Applying your selected transformation to the transcribed text...',
+		id: transformToastId,
 	});
 	const { data: transformationRun, error: transformError } =
 		await transformer.transformRecording.execute({
@@ -555,10 +673,10 @@ async function processRecordingPipeline({
 
 	if (transformationRun.status === 'failed') {
 		notify.error.execute({
-			id: transformToastId,
 			title: '⚠️ Transformation error',
 			description: transformationRun.error,
-			action: { type: 'more-details', error: transformationRun.error },
+			action: { error: transformationRun.error, type: 'more-details' },
+			id: transformToastId,
 		});
 		return;
 	}
diff --git a/apps/whispering/src/lib/query/delivery.ts b/apps/whispering/src/lib/query/delivery.ts
index 13a5ac7855..1451134e40 100644
--- a/apps/whispering/src/lib/query/delivery.ts
+++ b/apps/whispering/src/lib/query/delivery.ts
@@ -1,10 +1,12 @@
+import type { WhisperingError } from '$lib/result';
+import type { TextServiceError } from '$lib/services/text';
+
 import { WHISPERING_RECORDINGS_PATHNAME } from '$lib/constants/app';
 import { settings } from '$lib/stores/settings.svelte';
 import { Ok } from 'wellcrafted/result';
+
 import { defineMutation } from './_client';
 import { rpc } from './index';
-import type { TextServiceError } from '$lib/services/text';
-import type { WhisperingError } from '$lib/result';
 
 export const delivery = {
 	/**
@@ -49,11 +51,9 @@ export const delivery = {
 			// Shows transcription result and offers manual copy action
 			const offerManualCopy = () =>
 				rpc.notify.success.execute({
-					id: toastId,
 					title: '📝 Recording transcribed!',
 					description: text,
 					action: {
-						type: 'button',
 						label: 'Copy to clipboard',
 						onClick: async () => {
 							const { error } = await rpc.text.copyToClipboard.execute({
@@ -64,18 +64,20 @@ export const delivery = {
 								rpc.notify.error.execute({
 									title: 'Error copying transcribed text to clipboard',
 									description: error.message,
-									action: { type: 'more-details', error },
+									action: { error, type: 'more-details' },
 								});
 								return;
 							}
 							// Confirm manual copy succeeded
 							rpc.notify.success.execute({
-								id: toastId,
 								title: 'Copied transcribed text to clipboard!',
 								description: text,
+								id: toastId,
 							});
 						},
+						type: 'button',
 					},
+					id: toastId,
 				});
 
 			// Warns that automatic copy failed
@@ -83,7 +85,7 @@ export const delivery = {
 				rpc.notify.warning.execute({
 					title: "Couldn't copy to clipboard",
 					description: error.message,
-					action: { type: 'more-details', error },
+					action: { error, type: 'more-details' },
 				});
 			};
 
@@ -95,7 +97,7 @@ export const delivery = {
 					rpc.notify.warning.execute({
 						title: 'Unable to write to cursor automatically',
 						description: error.message,
-						action: { type: 'more-details', error },
+						action: { error, type: 'more-details' },
 					});
 					return;
 				}
@@ -110,38 +112,38 @@ export const delivery = {
 				if (copied && written) {
 					// Both operations succeeded
 					rpc.notify.success.execute({
-						id: toastId,
 						title: '📝 Recording transcribed, copied to clipboard, and written to cursor!',
 						description: text,
 						action: {
-							type: 'link',
-							label: 'Go to recordings',
 							href: WHISPERING_RECORDINGS_PATHNAME,
+							label: 'Go to recordings',
+							type: 'link',
 						},
+						id: toastId,
 					});
 				} else if (copied) {
 					// Only copy succeeded
 					rpc.notify.success.execute({
-						id: toastId,
 						title: '📝 Recording transcribed and copied to clipboard!',
 						description: text,
 						action: {
-							type: 'link',
-							label: 'Go to recordings',
 							href: WHISPERING_RECORDINGS_PATHNAME,
+							label: 'Go to recordings',
+							type: 'link',
 						},
+						id: toastId,
 					});
 				} else if (written) {
 					// Only write succeeded
 					rpc.notify.success.execute({
-						id: toastId,
 						title: '📝 Recording transcribed and written to cursor!',
 						description: text,
 						action: {
-							type: 'link',
-							label: 'Go to recordings',
 							href: WHISPERING_RECORDINGS_PATHNAME,
+							label: 'Go to recordings',
+							type: 'link',
 						},
+						id: toastId,
 					});
 				} else {
 					// Neither succeeded, offer manual copy
@@ -224,11 +226,9 @@ export const delivery = {
 			// Shows transformation result and offers manual copy action
 			const offerManualCopy = () =>
 				rpc.notify.success.execute({
-					id: toastId,
 					title: '🔄 Transformation complete!',
 					description: text,
 					action: {
-						type: 'button',
 						label: 'Copy to clipboard',
 						onClick: async () => {
 							const { error } = await rpc.text.copyToClipboard.execute({
@@ -239,18 +239,20 @@ export const delivery = {
 								rpc.notify.error.execute({
 									title: 'Error copying transformed text to clipboard',
 									description: error.message,
-									action: { type: 'more-details', error },
+									action: { error, type: 'more-details' },
 								});
 								return;
 							}
 							// Confirm manual copy succeeded
 							rpc.notify.success.execute({
-								id: toastId,
 								title: 'Copied transformed text to clipboard!',
 								description: text,
+								id: toastId,
 							});
 						},
+						type: 'button',
 					},
+					id: toastId,
 				});
 
 			// Warns that automatic copy failed
@@ -258,7 +260,7 @@ export const delivery = {
 				rpc.notify.warning.execute({
 					title: "Couldn't copy to clipboard",
 					description: error.message,
-					action: { type: 'more-details', error },
+					action: { error, type: 'more-details' },
 				});
 			};
 
@@ -270,7 +272,7 @@ export const delivery = {
 					rpc.notify.error.execute({
 						title: 'Error writing transformed text to cursor',
 						description: error.message,
-						action: { type: 'more-details', error },
+						action: { error, type: 'more-details' },
 					});
 					return;
 				}
@@ -285,38 +287,38 @@ export const delivery = {
 				if (copied && written) {
 					// Both operations succeeded
 					rpc.notify.success.execute({
-						id: toastId,
 						title: '🔄 Transformation complete, copied to clipboard, and written to cursor!',
 						description: text,
 						action: {
-							type: 'link',
-							label: 'Go to recordings',
 							href: WHISPERING_RECORDINGS_PATHNAME,
+							label: 'Go to recordings',
+							type: 'link',
 						},
+						id: toastId,
 					});
 				} else if (copied) {
 					// Only copy succeeded
 					rpc.notify.success.execute({
-						id: toastId,
 						title: '🔄 Transformation complete and copied to clipboard!',
 						description: text,
 						action: {
-							type: 'link',
-							label: 'Go to recordings',
 							href: WHISPERING_RECORDINGS_PATHNAME,
+							label: 'Go to recordings',
+							type: 'link',
 						},
+						id: toastId,
 					});
 				} else if (written) {
 					// Only write succeeded
 					rpc.notify.success.execute({
-						id: toastId,
 						title: '🔄 Transformation complete and written to cursor!',
 						description: text,
 						action: {
-							type: 'link',
-							label: 'Go to recordings',
 							href: WHISPERING_RECORDINGS_PATHNAME,
+							label: 'Go to recordings',
+							type: 'link',
 						},
+						id: toastId,
 					});
 				} else {
 					// Neither succeeded, offer manual copy
diff --git a/apps/whispering/src/lib/query/download.ts b/apps/whispering/src/lib/query/download.ts
index 37d83608aa..973b791ed6 100644
--- a/apps/whispering/src/lib/query/download.ts
+++ b/apps/whispering/src/lib/query/download.ts
@@ -1,8 +1,10 @@
-import { WhisperingErr, type WhisperingError } from '$lib/result';
-import * as services from '$lib/services';
 import type { Recording } from '$lib/services/db';
 import type { DownloadServiceError } from '$lib/services/download';
 import type { Result } from 'wellcrafted/result';
+
+import { WhisperingErr, type WhisperingError } from '$lib/result';
+import * as services from '$lib/services';
+
 import { defineMutation } from './_client';
 
 export const download = {
@@ -10,7 +12,7 @@ export const download = {
 		mutationKey: ['download', 'downloadRecording'] as const,
 		resultMutationFn: async (
 			recording: Recording,
-		): Promise<Result<void, WhisperingError | DownloadServiceError>> => {
+		): Promise<Result<void, DownloadServiceError | WhisperingError>> => {
 			if (!recording.blob) {
 				return WhisperingErr({
 					title: '⚠️ Recording blob not found',
@@ -19,8 +21,8 @@ export const download = {
 			}
 
 			return await services.download.downloadBlob({
-				name: `whispering_recording_${recording.id}`,
 				blob: recording.blob,
+				name: `whispering_recording_${recording.id}`,
 			});
 		},
 	}),
diff --git a/apps/whispering/src/lib/query/ffmpeg.ts b/apps/whispering/src/lib/query/ffmpeg.ts
index c98094f9a5..eadc732ad8 100644
--- a/apps/whispering/src/lib/query/ffmpeg.ts
+++ b/apps/whispering/src/lib/query/ffmpeg.ts
@@ -1,6 +1,7 @@
 import { fromTaggedErr } from '$lib/result';
 import * as services from '$lib/services';
 import { Ok } from 'wellcrafted/result';
+
 import { defineQuery } from './_client';
 
 export const ffmpeg = {
diff --git a/apps/whispering/src/lib/query/index.ts b/apps/whispering/src/lib/query/index.ts
index 185f9e9f76..08d6d40703 100644
--- a/apps/whispering/src/lib/query/index.ts
+++ b/apps/whispering/src/lib/query/index.ts
@@ -24,21 +24,21 @@ import { vadRecorder } from './vad-recorder';
  */
 export const rpc = {
 	analytics,
-	text,
 	commands,
+	delivery,
 	download,
 	ffmpeg,
+	notify,
 	recorder,
-	vadRecorder,
 	recordings,
-	tray,
+	settings,
 	shortcuts,
 	sound,
+	text,
 	transcription,
-	transformations,
 	transformationRuns,
+	transformations,
 	transformer,
-	notify,
-	delivery,
-	settings,
+	tray,
+	vadRecorder,
 };
diff --git a/apps/whispering/src/lib/query/notify.ts b/apps/whispering/src/lib/query/notify.ts
index 8b26a64b21..0fd0cd0352 100644
--- a/apps/whispering/src/lib/query/notify.ts
+++ b/apps/whispering/src/lib/query/notify.ts
@@ -1,8 +1,10 @@
+import type { UnifiedNotificationOptions } from '$lib/services/notifications/types';
+
 import { dev } from '$app/environment';
 import { notificationLog } from '$lib/components/NotificationLog.svelte';
 import * as services from '$lib/services';
-import type { UnifiedNotificationOptions } from '$lib/services/notifications/types';
 import { Ok } from 'wellcrafted/result';
+
 import { defineMutation } from './_client';
 
 // Create a mutation for a specific variant
@@ -22,9 +24,6 @@ const createNotifyMutation = (
 					case 'error':
 						console.error('[Notify]', fullOptions);
 						break;
-					case 'warning':
-						console.warn('[Notify]', fullOptions);
-						break;
 					case 'info':
 						console.info('[Notify]', fullOptions);
 						break;
@@ -34,6 +33,9 @@ const createNotifyMutation = (
 					case 'success':
 						console.log('[Notify]', fullOptions);
 						break;
+					case 'warning':
+						console.warn('[Notify]', fullOptions);
+						break;
 				}
 			}
 
@@ -118,13 +120,13 @@ const createNotifyMutation = (
  */
 // Export the notify API
 export const notify = {
-	// Variant-specific methods
-	success: createNotifyMutation('success'),
+	// Dismiss method
+	dismiss: (id?: number | string) => services.toast.dismiss(id),
 	error: createNotifyMutation('error'),
-	warning: createNotifyMutation('warning'),
 	info: createNotifyMutation('info'),
 	loading: createNotifyMutation('loading'),
+	// Variant-specific methods
+	success: createNotifyMutation('success'),
 
-	// Dismiss method
-	dismiss: (id?: string | number) => services.toast.dismiss(id),
+	warning: createNotifyMutation('warning'),
 };
diff --git a/apps/whispering/src/lib/query/recorder.ts b/apps/whispering/src/lib/query/recorder.ts
index 36323544f3..4625067574 100644
--- a/apps/whispering/src/lib/query/recorder.ts
+++ b/apps/whispering/src/lib/query/recorder.ts
@@ -1,24 +1,47 @@
 import type { WhisperingRecordingState } from '$lib/constants/audio';
+
 import { fromTaggedErr } from '$lib/result';
 import * as services from '$lib/services';
 import { settings } from '$lib/stores/settings.svelte';
+import { nanoid } from 'nanoid/non-secure';
 import { Ok, resolve } from 'wellcrafted/result';
+
 import { defineMutation, defineQuery, queryClient } from './_client';
 import { notify } from './notify';
-import { nanoid } from 'nanoid/non-secure';
 
 const recorderKeys = {
+	cancelRecording: ['recorder', 'cancelRecording'] as const,
 	currentRecordingId: ['recorder', 'currentRecordingId'] as const,
 	devices: ['recorder', 'devices'] as const,
 	startRecording: ['recorder', 'startRecording'] as const,
 	stopRecording: ['recorder', 'stopRecording'] as const,
-	cancelRecording: ['recorder', 'cancelRecording'] as const,
 } as const;
 
 const invalidateRecorderState = () =>
 	queryClient.invalidateQueries({ queryKey: recorderKeys.currentRecordingId });
 
 export const recorder = {
+	cancelRecording: defineMutation({
+		mutationKey: recorderKeys.cancelRecording,
+		onSettled: invalidateRecorderState,
+		resultMutationFn: async ({ toastId }: { toastId: string }) => {
+			const { data: cancelResult, error: cancelRecordingError } =
+				await recorderService().cancelRecording({
+					sendStatus: (options) =>
+						notify.loading.execute({ id: toastId, ...options }),
+				});
+
+			if (cancelRecordingError) {
+				return fromTaggedErr(cancelRecordingError, {
+					title: '❌ Failed to cancel recording',
+					action: { error: cancelRecordingError, type: 'more-details' },
+				});
+			}
+
+			return Ok(cancelResult);
+		},
+	}),
+
 	// Query that enumerates available recording devices with labels
 	enumerateDevices: defineQuery({
 		queryKey: recorderKeys.devices,
@@ -27,7 +50,7 @@ export const recorder = {
 			if (error) {
 				return fromTaggedErr(error, {
 					title: '❌ Failed to enumerate devices',
-					action: { type: 'more-details', error },
+					action: { error, type: 'more-details' },
 				});
 			}
 			return Ok(data);
@@ -36,6 +59,7 @@ export const recorder = {
 
 	// Query that returns the raw recording ID (null if not recording)
 	getCurrentRecordingId: defineQuery({
+		initialData: null as null | string,
 		queryKey: recorderKeys.currentRecordingId,
 		resultQueryFn: async () => {
 			const { data: recordingId, error: getRecordingIdError } =
@@ -43,16 +67,16 @@ export const recorder = {
 			if (getRecordingIdError) {
 				return fromTaggedErr(getRecordingIdError, {
 					title: '❌ Failed to get current recording',
-					action: { type: 'more-details', error: getRecordingIdError },
+					action: { error: getRecordingIdError, type: 'more-details' },
 				});
 			}
 			return Ok(recordingId);
 		},
-		initialData: null as string | null,
 	}),
 
 	// Query that transforms recording ID to state (RECORDING or IDLE)
 	getRecorderState: defineQuery({
+		initialData: null as null | string,
 		queryKey: recorderKeys.currentRecordingId, // Same key as getCurrentRecordingId!
 		resultQueryFn: async () => {
 			const { data: recordingId, error: getRecordingIdError } =
@@ -60,18 +84,18 @@ export const recorder = {
 			if (getRecordingIdError) {
 				return fromTaggedErr(getRecordingIdError, {
 					title: '❌ Failed to get recorder state',
-					action: { type: 'more-details', error: getRecordingIdError },
+					action: { error: getRecordingIdError, type: 'more-details' },
 				});
 			}
 			return Ok(recordingId);
 		},
 		select: (state): WhisperingRecordingState =>
 			resolve(state) ? 'RECORDING' : 'IDLE',
-		initialData: null as string | null,
 	}),
 
 	startRecording: defineMutation({
 		mutationKey: recorderKeys.startRecording,
+		onSettled: invalidateRecorderState,
 		resultMutationFn: async ({ toastId }: { toastId: string }) => {
 			// Generate a unique recording ID that will serve as the file name
 			const recordingId = nanoid();
@@ -82,16 +106,16 @@ export const recorder = {
 
 			// Prepare recording parameters based on which backend we're using
 			const params = {
-				selectedDeviceId: settings.value['recording.manual.selectedDeviceId'],
 				recordingId,
+				selectedDeviceId: settings.value['recording.manual.selectedDeviceId'],
 				...(isUsingBrowserBackend
 					? {
-							platform: 'web' as const,
 							bitrateKbps: settings.value['recording.navigator.bitrateKbps'],
+							platform: 'web' as const,
 						}
 					: {
-							platform: 'desktop' as const,
 							outputFolder: settings.value['recording.desktop.outputFolder'],
+							platform: 'desktop' as const,
 							sampleRate: settings.value['recording.desktop.sampleRate'],
 						}),
 			};
@@ -105,16 +129,16 @@ export const recorder = {
 			if (startRecordingError) {
 				return fromTaggedErr(startRecordingError, {
 					title: '❌ Failed to start recording',
-					action: { type: 'more-details', error: startRecordingError },
+					action: { error: startRecordingError, type: 'more-details' },
 				});
 			}
 			return Ok(deviceAcquisitionOutcome);
 		},
-		onSettled: invalidateRecorderState,
 	}),
 
 	stopRecording: defineMutation({
 		mutationKey: recorderKeys.stopRecording,
+		onSettled: invalidateRecorderState,
 		resultMutationFn: async ({ toastId }: { toastId: string }) => {
 			const { data: blob, error: stopRecordingError } =
 				await recorderService().stopRecording({
@@ -125,34 +149,12 @@ export const recorder = {
 			if (stopRecordingError) {
 				return fromTaggedErr(stopRecordingError, {
 					title: '❌ Failed to stop recording',
-					action: { type: 'more-details', error: stopRecordingError },
+					action: { error: stopRecordingError, type: 'more-details' },
 				});
 			}
 
 			return Ok(blob);
 		},
-		onSettled: invalidateRecorderState,
-	}),
-
-	cancelRecording: defineMutation({
-		mutationKey: recorderKeys.cancelRecording,
-		resultMutationFn: async ({ toastId }: { toastId: string }) => {
-			const { data: cancelResult, error: cancelRecordingError } =
-				await recorderService().cancelRecording({
-					sendStatus: (options) =>
-						notify.loading.execute({ id: toastId, ...options }),
-				});
-
-			if (cancelRecordingError) {
-				return fromTaggedErr(cancelRecordingError, {
-					title: '❌ Failed to cancel recording',
-					action: { type: 'more-details', error: cancelRecordingError },
-				});
-			}
-
-			return Ok(cancelResult);
-		},
-		onSettled: invalidateRecorderState,
 	}),
 };
 
diff --git a/apps/whispering/src/lib/query/recordings.ts b/apps/whispering/src/lib/query/recordings.ts
index 3bffa46c0d..bc01b297ed 100644
--- a/apps/whispering/src/lib/query/recordings.ts
+++ b/apps/whispering/src/lib/query/recordings.ts
@@ -1,47 +1,18 @@
-import * as services from '$lib/services';
 import type { Recording } from '$lib/services/db';
 import type { Accessor } from '@tanstack/svelte-query';
+
+import * as services from '$lib/services';
 import { Err, Ok } from 'wellcrafted/result';
+
 import { defineMutation, defineQuery, queryClient } from './_client';
 
 const recordingKeys = {
 	all: ['recordings'] as const,
-	latest: ['recordings', 'latest'] as const,
 	byId: (id: Accessor<string>) => [...recordingKeys.all, id()] as const,
+	latest: ['recordings', 'latest'] as const,
 };
 
 export const recordings = {
-	getAllRecordings: defineQuery({
-		queryKey: recordingKeys.all,
-		resultQueryFn: () => services.db.getAllRecordings(),
-	}),
-
-	getLatestRecording: defineQuery({
-		queryKey: recordingKeys.latest,
-		resultQueryFn: () => services.db.getLatestRecording(),
-		initialData: () =>
-			queryClient
-				.getQueryData<Recording[]>(recordingKeys.all)
-				?.toSorted(
-					(a, b) =>
-						new Date(b.timestamp).getTime() - new Date(a.timestamp).getTime(),
-				)[0] ?? null,
-		initialDataUpdatedAt: () =>
-			queryClient.getQueryState(recordingKeys.all)?.dataUpdatedAt,
-	}),
-
-	getRecordingById: (id: Accessor<string>) =>
-		defineQuery({
-			queryKey: recordingKeys.byId(id),
-			resultQueryFn: () => services.db.getRecordingById(id()),
-			initialData: () =>
-				queryClient
-					.getQueryData<Recording[]>(recordingKeys.all)
-					?.find((r) => r.id === id()) ?? null,
-			initialDataUpdatedAt: () =>
-				queryClient.getQueryState(recordingKeys.all)?.dataUpdatedAt,
-		}),
-
 	createRecording: defineMutation({
 		mutationKey: ['recordings', 'createRecording'] as const,
 		resultMutationFn: async (recording: Recording) => {
@@ -64,30 +35,6 @@ export const recordings = {
 		},
 	}),
 
-	updateRecording: defineMutation({
-		mutationKey: ['recordings', 'updateRecording'] as const,
-		resultMutationFn: async (recording: Recording) => {
-			const { data, error } = await services.db.updateRecording(recording);
-			if (error) return Err(error);
-
-			queryClient.setQueryData<Recording[]>(recordingKeys.all, (oldData) => {
-				if (!oldData) return [recording];
-				return oldData.map((item) =>
-					item.id === recording.id ? recording : item,
-				);
-			});
-			queryClient.setQueryData<Recording>(
-				recordingKeys.byId(() => recording.id),
-				recording,
-			);
-			queryClient.invalidateQueries({
-				queryKey: recordingKeys.latest,
-			});
-
-			return Ok(data);
-		},
-	}),
-
 	deleteRecording: defineMutation({
 		mutationKey: ['recordings', 'deleteRecording'] as const,
 		resultMutationFn: async (recording: Recording) => {
@@ -132,4 +79,59 @@ export const recordings = {
 			return Ok(undefined);
 		},
 	}),
+
+	getAllRecordings: defineQuery({
+		queryKey: recordingKeys.all,
+		resultQueryFn: () => services.db.getAllRecordings(),
+	}),
+
+	getLatestRecording: defineQuery({
+		initialData: () =>
+			queryClient
+				.getQueryData<Recording[]>(recordingKeys.all)
+				?.toSorted(
+					(a, b) =>
+						new Date(b.timestamp).getTime() - new Date(a.timestamp).getTime(),
+				)[0] ?? null,
+		initialDataUpdatedAt: () =>
+			queryClient.getQueryState(recordingKeys.all)?.dataUpdatedAt,
+		queryKey: recordingKeys.latest,
+		resultQueryFn: () => services.db.getLatestRecording(),
+	}),
+
+	getRecordingById: (id: Accessor<string>) =>
+		defineQuery({
+			initialData: () =>
+				queryClient
+					.getQueryData<Recording[]>(recordingKeys.all)
+					?.find((r) => r.id === id()) ?? null,
+			initialDataUpdatedAt: () =>
+				queryClient.getQueryState(recordingKeys.all)?.dataUpdatedAt,
+			queryKey: recordingKeys.byId(id),
+			resultQueryFn: () => services.db.getRecordingById(id()),
+		}),
+
+	updateRecording: defineMutation({
+		mutationKey: ['recordings', 'updateRecording'] as const,
+		resultMutationFn: async (recording: Recording) => {
+			const { data, error } = await services.db.updateRecording(recording);
+			if (error) return Err(error);
+
+			queryClient.setQueryData<Recording[]>(recordingKeys.all, (oldData) => {
+				if (!oldData) return [recording];
+				return oldData.map((item) =>
+					item.id === recording.id ? recording : item,
+				);
+			});
+			queryClient.setQueryData<Recording>(
+				recordingKeys.byId(() => recording.id),
+				recording,
+			);
+			queryClient.invalidateQueries({
+				queryKey: recordingKeys.latest,
+			});
+
+			return Ok(data);
+		},
+	}),
 };
diff --git a/apps/whispering/src/lib/query/settings.ts b/apps/whispering/src/lib/query/settings.ts
index 19b98f6ef9..96363fe47d 100644
--- a/apps/whispering/src/lib/query/settings.ts
+++ b/apps/whispering/src/lib/query/settings.ts
@@ -1,11 +1,13 @@
 import type { RecordingMode } from '$lib/constants/audio';
-import { rpc } from '$lib/query';
-import * as services from '$lib/services';
 import type { RecorderServiceError } from '$lib/services/recorder';
 import type { VadRecorderServiceError } from '$lib/services/vad-recorder';
+
+import { rpc } from '$lib/query';
+import * as services from '$lib/services';
 import { settings as settingsStore } from '$lib/stores/settings.svelte';
 import { nanoid } from 'nanoid/non-secure';
-import { Ok, type Result, partitionResults } from 'wellcrafted/result';
+import { Ok, partitionResults, type Result } from 'wellcrafted/result';
+
 import { defineMutation } from './_client';
 import { recorderService } from './recorder';
 
@@ -40,10 +42,10 @@ export const settings = {
 				// Even if stopping fails, we should still switch modes
 				console.error('Failed to stop active recordings:', errs);
 				rpc.notify.warning.execute({
-					id: toastId,
 					title: '⚠️ Recording may still be active',
 					description:
 						'Previous recording could not be stopped automatically. Please stop it manually.',
+					id: toastId,
 				});
 			}
 
@@ -53,9 +55,9 @@ export const settings = {
 
 				// Show success notification
 				rpc.notify.success.execute({
-					id: toastId,
 					title: '✅ Recording mode switched',
 					description: `Switched to ${newMode} recording mode`,
+					id: toastId,
 				});
 			}
 
@@ -76,16 +78,16 @@ async function stopAllRecordingModesExcept(modeToKeep: RecordingMode) {
 	// Each recording mode with its check and stop logic
 	const recordingModes = [
 		{
-			mode: 'manual' as const,
 			isActive: () => currentRecordingId === 'RECORDING',
+			mode: 'manual' as const,
 			stop: () =>
 				recorderService().stopRecording({
 					sendStatus: () => {}, // Silent cancel - no UI notifications
 				}),
 		},
 		{
-			mode: 'vad' as const,
 			isActive: () => services.vad.getVadState() !== 'IDLE',
+			mode: 'vad' as const,
 			stop: () => services.vad.stopActiveListening(),
 		},
 		// {
@@ -98,8 +100,8 @@ async function stopAllRecordingModesExcept(modeToKeep: RecordingMode) {
 		// 		}),
 		// },
 	] satisfies {
-		mode: RecordingMode;
 		isActive: () => boolean;
+		mode: RecordingMode;
 		stop: () => Promise<unknown>;
 	}[];
 
diff --git a/apps/whispering/src/lib/query/shortcuts.ts b/apps/whispering/src/lib/query/shortcuts.ts
index 20ac89a21e..c1f9939b79 100644
--- a/apps/whispering/src/lib/query/shortcuts.ts
+++ b/apps/whispering/src/lib/query/shortcuts.ts
@@ -1,45 +1,24 @@
-import { type Command, commandCallbacks } from '$lib/commands';
 import type { KeyboardEventSupportedKey } from '$lib/constants/keyboard';
-import { IS_MACOS } from '$lib/constants/platform';
-import * as services from '$lib/services';
 import type { Accelerator } from '$lib/services/global-shortcut-manager';
 import type { CommandId } from '$lib/services/local-shortcut-manager';
-import { defineMutation } from './_client';
 
-export const shortcuts = {
-	registerCommandLocally: defineMutation({
-		mutationKey: ['shortcuts', 'registerCommandLocally'] as const,
-		resultMutationFn: ({
-			command,
-			keyCombination,
-		}: {
-			command: Command;
-			keyCombination: KeyboardEventSupportedKey[];
-		}) =>
-			services.localShortcutManager.register({
-				id: command.id as CommandId,
-				keyCombination,
-				callback: commandCallbacks[command.id],
-				on: command.on,
-			}),
-	}),
+import { type Command, commandCallbacks } from '$lib/commands';
+import { IS_MACOS } from '$lib/constants/platform';
+import * as services from '$lib/services';
 
-	unregisterCommandLocally: defineMutation({
-		mutationKey: ['shortcuts', 'unregisterCommandLocally'] as const,
-		resultMutationFn: async ({ commandId }: { commandId: CommandId }) =>
-			services.localShortcutManager.unregister(commandId),
-	}),
+import { defineMutation } from './_client';
 
+export const shortcuts = {
 	registerCommandGlobally: defineMutation({
 		mutationKey: ['shortcuts', 'registerCommandGlobally'] as const,
 		resultMutationFn: ({
-			command,
 			// Parameter renamed to indicate it may contain legacy "CommandOrControl" syntax
 			// Legacy format: "CommandOrControl+Shift+R" → Modern format: "Command+Shift+R" (macOS) or "Control+Shift+R" (Windows/Linux)
 			accelerator: legacyAcceleratorString,
+			command,
 		}: {
-			command: Command;
 			accelerator: Accelerator;
+			command: Command;
 		}) => {
 			// Convert legacy "CommandOrControl" syntax to platform-specific modifiers for backwards compatibility
 			// This ensures users with old settings don't need to manually update their shortcuts
@@ -55,10 +34,33 @@ export const shortcuts = {
 		},
 	}),
 
+	registerCommandLocally: defineMutation({
+		mutationKey: ['shortcuts', 'registerCommandLocally'] as const,
+		resultMutationFn: ({
+			command,
+			keyCombination,
+		}: {
+			command: Command;
+			keyCombination: KeyboardEventSupportedKey[];
+		}) =>
+			services.localShortcutManager.register({
+				callback: commandCallbacks[command.id],
+				id: command.id as CommandId,
+				keyCombination,
+				on: command.on,
+			}),
+	}),
+
 	unregisterCommandGlobally: defineMutation({
 		mutationKey: ['shortcuts', 'unregisterCommandGlobally'] as const,
 		resultMutationFn: async ({ accelerator }: { accelerator: Accelerator }) => {
 			return await services.globalShortcutManager.unregister(accelerator);
 		},
 	}),
+
+	unregisterCommandLocally: defineMutation({
+		mutationKey: ['shortcuts', 'unregisterCommandLocally'] as const,
+		resultMutationFn: async ({ commandId }: { commandId: CommandId }) =>
+			services.localShortcutManager.unregister(commandId),
+	}),
 };
diff --git a/apps/whispering/src/lib/query/sound.ts b/apps/whispering/src/lib/query/sound.ts
index c41d4b7bd1..f638efd386 100644
--- a/apps/whispering/src/lib/query/sound.ts
+++ b/apps/whispering/src/lib/query/sound.ts
@@ -1,8 +1,10 @@
 import type { WhisperingSoundNames } from '$lib/constants/sounds';
-import * as services from '$lib/services';
 import type { PlaySoundServiceError } from '$lib/services/sound';
+
+import * as services from '$lib/services';
 import { settings } from '$lib/stores/settings.svelte';
 import { Ok, type Result } from 'wellcrafted/result';
+
 import { defineMutation } from './_client';
 
 const soundKeys = {
diff --git a/apps/whispering/src/lib/query/text.ts b/apps/whispering/src/lib/query/text.ts
index d0571c06c1..ccd974e1b7 100644
--- a/apps/whispering/src/lib/query/text.ts
+++ b/apps/whispering/src/lib/query/text.ts
@@ -1,4 +1,5 @@
 import * as services from '$lib/services';
+
 import { defineMutation } from './_client';
 
 export const text = {
diff --git a/apps/whispering/src/lib/query/transcription.ts b/apps/whispering/src/lib/query/transcription.ts
index 829c5227c5..9233eb1896 100644
--- a/apps/whispering/src/lib/query/transcription.ts
+++ b/apps/whispering/src/lib/query/transcription.ts
@@ -1,12 +1,14 @@
+import type { Recording } from '$lib/services/db';
+
 import { WhisperingErr, type WhisperingError } from '$lib/result';
 import * as services from '$lib/services';
-import type { Recording } from '$lib/services/db';
 import { settings } from '$lib/stores/settings.svelte';
-import { Err, Ok, type Result, partitionResults } from 'wellcrafted/result';
+import { Err, Ok, partitionResults, type Result } from 'wellcrafted/result';
+
+import { rpc } from './';
 import { defineMutation, queryClient } from './_client';
 import { notify } from './notify';
 import { recordings } from './recordings';
-import { rpc } from './';
 
 const transcriptionKeys = {
 	isTranscribing: ['transcription', 'isTranscribing'] as const,
@@ -42,8 +44,8 @@ export const transcription = {
 						'⚠️ Unable to set recording transcription status to transcribing',
 					description: 'Continuing with the transcription process...',
 					action: {
-						type: 'more-details',
 						error: setRecordingTranscribingError,
+						type: 'more-details',
 					},
 				});
 			}
@@ -61,8 +63,8 @@ export const transcription = {
 						description:
 							"Transcription failed but unable to update recording's transcription status in database",
 						action: {
-							type: 'more-details',
 							error: setRecordingTranscribingError,
+							type: 'more-details',
 						},
 					});
 				}
@@ -81,8 +83,8 @@ export const transcription = {
 					description:
 						"Transcription completed but unable to update recording's transcribed text and status in database",
 					action: {
-						type: 'more-details',
 						error: setRecordingTranscribedTextError,
+						type: 'more-details',
 					},
 				});
 			}
@@ -119,59 +121,59 @@ async function transcribeBlob(
 	// Log transcription request
 	const startTime = Date.now();
 	rpc.analytics.logEvent.execute({
-		type: 'transcription_requested',
 		provider: selectedService,
+		type: 'transcription_requested',
 	});
 
 	const transcriptionResult: Result<string, WhisperingError> =
 		await (async () => {
 			switch (selectedService) {
-				case 'OpenAI':
-					return await services.transcriptions.openai.transcribe(blob, {
+				case 'Deepgram':
+					return await services.transcriptions.deepgram.transcribe(blob, {
+						apiKey: settings.value['apiKeys.deepgram'],
+						modelName: settings.value['transcription.deepgram.model'],
 						outputLanguage: settings.value['transcription.outputLanguage'],
 						prompt: settings.value['transcription.prompt'],
 						temperature: settings.value['transcription.temperature'],
-						apiKey: settings.value['apiKeys.openai'],
-						modelName: settings.value['transcription.openai.model'],
 					});
-				case 'Groq':
-					return await services.transcriptions.groq.transcribe(blob, {
+				case 'ElevenLabs':
+					return await services.transcriptions.elevenlabs.transcribe(blob, {
+						apiKey: settings.value['apiKeys.elevenlabs'],
+						modelName: settings.value['transcription.elevenlabs.model'],
 						outputLanguage: settings.value['transcription.outputLanguage'],
 						prompt: settings.value['transcription.prompt'],
 						temperature: settings.value['transcription.temperature'],
+					});
+				case 'Groq':
+					return await services.transcriptions.groq.transcribe(blob, {
 						apiKey: settings.value['apiKeys.groq'],
 						modelName: settings.value['transcription.groq.model'],
-					});
-				case 'speaches':
-					return await services.transcriptions.speaches.transcribe(blob, {
 						outputLanguage: settings.value['transcription.outputLanguage'],
 						prompt: settings.value['transcription.prompt'],
 						temperature: settings.value['transcription.temperature'],
-						modelId: settings.value['transcription.speaches.modelId'],
-						baseUrl: settings.value['transcription.speaches.baseUrl'],
 					});
-				case 'ElevenLabs':
-					return await services.transcriptions.elevenlabs.transcribe(blob, {
+				case 'OpenAI':
+					return await services.transcriptions.openai.transcribe(blob, {
+						apiKey: settings.value['apiKeys.openai'],
+						modelName: settings.value['transcription.openai.model'],
 						outputLanguage: settings.value['transcription.outputLanguage'],
 						prompt: settings.value['transcription.prompt'],
 						temperature: settings.value['transcription.temperature'],
-						apiKey: settings.value['apiKeys.elevenlabs'],
-						modelName: settings.value['transcription.elevenlabs.model'],
 					});
-				case 'Deepgram':
-					return await services.transcriptions.deepgram.transcribe(blob, {
+				case 'speaches':
+					return await services.transcriptions.speaches.transcribe(blob, {
+						baseUrl: settings.value['transcription.speaches.baseUrl'],
+						modelId: settings.value['transcription.speaches.modelId'],
 						outputLanguage: settings.value['transcription.outputLanguage'],
 						prompt: settings.value['transcription.prompt'],
 						temperature: settings.value['transcription.temperature'],
-						apiKey: settings.value['apiKeys.deepgram'],
-						modelName: settings.value['transcription.deepgram.model'],
 					});
 				case 'whispercpp':
 					return await services.transcriptions.whispercpp.transcribe(blob, {
+						modelPath: settings.value['transcription.whispercpp.modelPath'],
 						outputLanguage: settings.value['transcription.outputLanguage'],
 						prompt: settings.value['transcription.prompt'],
 						temperature: settings.value['transcription.temperature'],
-						modelPath: settings.value['transcription.whispercpp.modelPath'],
 						useGpu: settings.value['transcription.whispercpp.useGpu'],
 					});
 				default:
@@ -186,16 +188,16 @@ async function transcribeBlob(
 	const duration = Date.now() - startTime;
 	if (transcriptionResult.error) {
 		rpc.analytics.logEvent.execute({
-			type: 'transcription_failed',
-			provider: selectedService,
-			error_title: transcriptionResult.error.title,
 			error_description: transcriptionResult.error.description,
+			error_title: transcriptionResult.error.title,
+			provider: selectedService,
+			type: 'transcription_failed',
 		});
 	} else {
 		rpc.analytics.logEvent.execute({
-			type: 'transcription_completed',
-			provider: selectedService,
 			duration,
+			provider: selectedService,
+			type: 'transcription_completed',
 		});
 	}
 
diff --git a/apps/whispering/src/lib/query/transformation-runs.ts b/apps/whispering/src/lib/query/transformation-runs.ts
index 22e53bab5a..fe1eff85f9 100644
--- a/apps/whispering/src/lib/query/transformation-runs.ts
+++ b/apps/whispering/src/lib/query/transformation-runs.ts
@@ -1,22 +1,25 @@
-import * as services from '$lib/services';
 import type { Accessor } from '@tanstack/svelte-query';
+
+import * as services from '$lib/services';
+
 import { defineQuery } from './_client';
 
 // Define the query key as a constant array
 export const transformationRunKeys = {
 	all: ['transformationRuns'] as const,
-	runsByTransformationId: (id: string) =>
-		['transformationRuns', 'transformationId', id] as const,
 	runsByRecordingId: (recordingId: string) =>
 		['transformationRuns', 'recordingId', recordingId] as const,
+	runsByTransformationId: (id: string) =>
+		['transformationRuns', 'transformationId', id] as const,
 };
 
 export const transformationRuns = {
-	getTransformationRunsByTransformationId: (id: Accessor<string>) =>
+	getLatestTransformationRunByRecordingId: (recordingId: Accessor<string>) =>
 		defineQuery({
-			queryKey: transformationRunKeys.runsByTransformationId(id()),
+			queryKey: transformationRunKeys.runsByRecordingId(recordingId()),
 			resultQueryFn: () =>
-				services.db.getTransformationRunsByTransformationId(id()),
+				services.db.getTransformationRunsByRecordingId(recordingId()),
+			select: (data) => data.at(0),
 		}),
 	getTransformationRunsByRecordingId: (recordingId: Accessor<string>) =>
 		defineQuery({
@@ -24,11 +27,10 @@ export const transformationRuns = {
 			resultQueryFn: () =>
 				services.db.getTransformationRunsByRecordingId(recordingId()),
 		}),
-	getLatestTransformationRunByRecordingId: (recordingId: Accessor<string>) =>
+	getTransformationRunsByTransformationId: (id: Accessor<string>) =>
 		defineQuery({
-			queryKey: transformationRunKeys.runsByRecordingId(recordingId()),
+			queryKey: transformationRunKeys.runsByTransformationId(id()),
 			resultQueryFn: () =>
-				services.db.getTransformationRunsByRecordingId(recordingId()),
-			select: (data) => data.at(0),
+				services.db.getTransformationRunsByTransformationId(id()),
 		}),
 };
diff --git a/apps/whispering/src/lib/query/transformations.ts b/apps/whispering/src/lib/query/transformations.ts
index 271272fd45..938e028b57 100644
--- a/apps/whispering/src/lib/query/transformations.ts
+++ b/apps/whispering/src/lib/query/transformations.ts
@@ -1,8 +1,10 @@
-import * as services from '$lib/services';
 import type { Transformation } from '$lib/services/db/models';
-import { settings } from '$lib/stores/settings.svelte';
 import type { Accessor } from '@tanstack/svelte-query';
+
+import * as services from '$lib/services';
+import { settings } from '$lib/stores/settings.svelte';
 import { Err, Ok } from 'wellcrafted/result';
+
 import { defineMutation, defineQuery, queryClient } from './_client';
 
 // Define the query key as a constant array
@@ -12,24 +14,6 @@ export const transformationsKeys = {
 };
 
 export const transformations = {
-	queries: {
-		getAllTransformations: defineQuery({
-			queryKey: transformationsKeys.all,
-			resultQueryFn: () => services.db.getAllTransformations(),
-		}),
-		getTransformationById: (id: Accessor<string>) =>
-			defineQuery({
-				queryKey: transformationsKeys.byId(id()),
-				resultQueryFn: () => services.db.getTransformationById(id()),
-				initialData: () =>
-					queryClient
-						.getQueryData<Transformation[]>(transformationsKeys.all)
-						?.find((t) => t.id === id()),
-				initialDataUpdatedAt: () =>
-					queryClient.getQueryState(transformationsKeys.byId(id()))
-						?.dataUpdatedAt,
-			}),
-	},
 	mutations: {
 		createTransformation: defineMutation({
 			mutationKey: ['transformations', 'createTransformation'] as const,
@@ -53,30 +37,6 @@ export const transformations = {
 				return Ok(data);
 			},
 		}),
-		updateTransformation: defineMutation({
-			mutationKey: ['transformations', 'updateTransformation'] as const,
-			resultMutationFn: async (transformation: Transformation) => {
-				const { data, error } =
-					await services.db.updateTransformation(transformation);
-				if (error) return Err(error);
-
-				queryClient.setQueryData<Transformation[]>(
-					transformationsKeys.all,
-					(oldData) => {
-						if (!oldData) return [transformation];
-						return oldData.map((item) =>
-							item.id === transformation.id ? transformation : item,
-						);
-					},
-				);
-				queryClient.setQueryData<Transformation>(
-					transformationsKeys.byId(transformation.id),
-					transformation,
-				);
-
-				return Ok(data);
-			},
-		}),
 		deleteTransformation: defineMutation({
 			mutationKey: ['transformations', 'deleteTransformation'] as const,
 			resultMutationFn: async (transformation: Transformation) => {
@@ -139,5 +99,47 @@ export const transformations = {
 				return Ok(undefined);
 			},
 		}),
+		updateTransformation: defineMutation({
+			mutationKey: ['transformations', 'updateTransformation'] as const,
+			resultMutationFn: async (transformation: Transformation) => {
+				const { data, error } =
+					await services.db.updateTransformation(transformation);
+				if (error) return Err(error);
+
+				queryClient.setQueryData<Transformation[]>(
+					transformationsKeys.all,
+					(oldData) => {
+						if (!oldData) return [transformation];
+						return oldData.map((item) =>
+							item.id === transformation.id ? transformation : item,
+						);
+					},
+				);
+				queryClient.setQueryData<Transformation>(
+					transformationsKeys.byId(transformation.id),
+					transformation,
+				);
+
+				return Ok(data);
+			},
+		}),
+	},
+	queries: {
+		getAllTransformations: defineQuery({
+			queryKey: transformationsKeys.all,
+			resultQueryFn: () => services.db.getAllTransformations(),
+		}),
+		getTransformationById: (id: Accessor<string>) =>
+			defineQuery({
+				initialData: () =>
+					queryClient
+						.getQueryData<Transformation[]>(transformationsKeys.all)
+						?.find((t) => t.id === id()),
+				initialDataUpdatedAt: () =>
+					queryClient.getQueryState(transformationsKeys.byId(id()))
+						?.dataUpdatedAt,
+				queryKey: transformationsKeys.byId(id()),
+				resultQueryFn: () => services.db.getTransformationById(id()),
+			}),
 	},
 };
diff --git a/apps/whispering/src/lib/query/transformer.ts b/apps/whispering/src/lib/query/transformer.ts
index c724354c83..0c6204a97e 100644
--- a/apps/whispering/src/lib/query/transformer.ts
+++ b/apps/whispering/src/lib/query/transformer.ts
@@ -1,24 +1,26 @@
-import {
-	WhisperingErr,
-	fromTaggedErr,
-	type WhisperingError,
-	type WhisperingResult,
-} from '$lib/result';
-import * as services from '$lib/services';
 import type {
 	Transformation,
 	TransformationRunCompleted,
 	TransformationRunFailed,
 	TransformationStep,
 } from '$lib/services/db';
+
+import {
+	fromTaggedErr,
+	WhisperingErr,
+	type WhisperingError,
+	type WhisperingResult,
+} from '$lib/result';
+import * as services from '$lib/services';
 import { settings } from '$lib/stores/settings.svelte';
 import { createTaggedError, extractErrorMessage } from 'wellcrafted/error';
-import { Err, Ok, type Result, isErr } from 'wellcrafted/result';
+import { Err, isErr, Ok, type Result } from 'wellcrafted/result';
+
 import { defineMutation, queryClient } from './_client';
 import { transformationRunKeys } from './transformation-runs';
 import { transformationsKeys } from './transformations';
 
-const { TransformServiceError, TransformServiceErr } = createTaggedError(
+const { TransformServiceErr, TransformServiceError } = createTaggedError(
 	'TransformServiceError',
 );
 type TransformServiceError = ReturnType<typeof TransformServiceError>;
@@ -44,21 +46,21 @@ export const transformer = {
 				const { data: transformationRun, error: transformationRunError } =
 					await runTransformation({
 						input,
-						transformation,
 						recordingId: null,
+						transformation,
 					});
 
 				if (transformationRunError)
 					return fromTaggedErr(transformationRunError, {
 						title: '⚠️ Transformation failed',
-						action: { type: 'more-details', error: transformationRunError },
+						action: { error: transformationRunError, type: 'more-details' },
 					});
 
 				if (transformationRun.status === 'failed') {
 					return WhisperingErr({
 						title: '⚠️ Transformation failed',
 						description: transformationRun.error,
-						action: { type: 'more-details', error: transformationRun.error },
+						action: { error: transformationRun.error, type: 'more-details' },
 					});
 				}
 
@@ -115,14 +117,14 @@ export const transformer = {
 			const { data: transformationRun, error: transformationRunError } =
 				await runTransformation({
 					input: recording.transcribedText,
-					transformation,
 					recordingId,
+					transformation,
 				});
 
 			if (transformationRunError)
 				return fromTaggedErr(transformationRunError, {
 					title: '⚠️ Transformation failed',
-					action: { type: 'more-details', error: transformationRunError },
+					action: { error: transformationRunError, type: 'more-details' },
 				});
 
 			queryClient.invalidateQueries({
@@ -178,13 +180,14 @@ async function handleStep({
 			);
 
 			switch (provider) {
-				case 'OpenAI': {
+				case 'Anthropic': {
 					const { data: completionResponse, error: completionError } =
-						await services.completions.openai.complete({
-							apiKey: settings.value['apiKeys.openai'],
+						await services.completions.anthropic.complete({
+							apiKey: settings.value['apiKeys.anthropic'],
+							model:
+								step['prompt_transform.inference.provider.Anthropic.model'],
 							systemPrompt,
 							userPrompt,
-							model: step['prompt_transform.inference.provider.OpenAI.model'],
 						});
 
 					if (completionError) {
@@ -194,12 +197,11 @@ async function handleStep({
 					return Ok(completionResponse);
 				}
 
-				case 'Groq': {
-					const model = step['prompt_transform.inference.provider.Groq.model'];
-					const { data: completionResponse, error: completionError } =
-						await services.completions.groq.complete({
-							apiKey: settings.value['apiKeys.groq'],
-							model,
+				case 'Google': {
+					const { data: completion, error: completionError } =
+						await services.completions.google.complete({
+							apiKey: settings.value['apiKeys.google'],
+							model: step['prompt_transform.inference.provider.Google.model'],
 							systemPrompt,
 							userPrompt,
 						});
@@ -208,15 +210,15 @@ async function handleStep({
 						return Err(completionError.message);
 					}
 
-					return Ok(completionResponse);
+					return Ok(completion);
 				}
 
-				case 'Anthropic': {
+				case 'Groq': {
+					const model = step['prompt_transform.inference.provider.Groq.model'];
 					const { data: completionResponse, error: completionError } =
-						await services.completions.anthropic.complete({
-							apiKey: settings.value['apiKeys.anthropic'],
-							model:
-								step['prompt_transform.inference.provider.Anthropic.model'],
+						await services.completions.groq.complete({
+							apiKey: settings.value['apiKeys.groq'],
+							model,
 							systemPrompt,
 							userPrompt,
 						});
@@ -228,11 +230,11 @@ async function handleStep({
 					return Ok(completionResponse);
 				}
 
-				case 'Google': {
-					const { data: completion, error: completionError } =
-						await services.completions.google.complete({
-							apiKey: settings.value['apiKeys.google'],
-							model: step['prompt_transform.inference.provider.Google.model'],
+				case 'OpenAI': {
+					const { data: completionResponse, error: completionError } =
+						await services.completions.openai.complete({
+							apiKey: settings.value['apiKeys.openai'],
+							model: step['prompt_transform.inference.provider.OpenAI.model'],
 							systemPrompt,
 							userPrompt,
 						});
@@ -241,7 +243,7 @@ async function handleStep({
 						return Err(completionError.message);
 					}
 
-					return Ok(completion);
+					return Ok(completionResponse);
 				}
 
 				default:
@@ -256,12 +258,12 @@ async function handleStep({
 
 async function runTransformation({
 	input,
-	transformation,
 	recordingId,
+	transformation,
 }: {
 	input: string;
+	recordingId: null | string;
 	transformation: Transformation;
-	recordingId: string | null;
 }): Promise<
 	Result<
 		TransformationRunCompleted | TransformationRunFailed,
@@ -270,38 +272,38 @@ async function runTransformation({
 > {
 	if (!input.trim()) {
 		return TransformServiceErr({
-			message: 'Empty input. Please enter some text to transform',
 			cause: undefined,
 			context: { input, transformationId: transformation.id },
+			message: 'Empty input. Please enter some text to transform',
 		});
 	}
 
 	if (transformation.steps.length === 0) {
 		return TransformServiceErr({
-			message:
-				'No steps configured. Please add at least one transformation step',
 			cause: undefined,
 			context: { transformation },
+			message:
+				'No steps configured. Please add at least one transformation step',
 		});
 	}
 
 	const { data: transformationRun, error: createTransformationRunError } =
 		await services.db.createTransformationRun({
-			transformationId: transformation.id,
-			recordingId,
 			input,
+			recordingId,
+			transformationId: transformation.id,
 		});
 
 	if (createTransformationRunError)
 		return TransformServiceErr({
-			message: 'Unable to start transformation run',
 			cause: createTransformationRunError,
 			context: {
-				transformationId: transformation.id,
-				recordingId,
-				input,
 				createTransformationRunError,
+				input,
+				recordingId,
+				transformationId: transformation.id,
 			},
+			message: 'Unable to start transformation run',
 		});
 
 	let currentInput = input;
@@ -320,14 +322,14 @@ async function runTransformation({
 
 		if (addTransformationStepRunError)
 			return TransformServiceErr({
-				message: 'Unable to initialize transformation step',
 				cause: addTransformationStepRunError,
 				context: {
-					transformationRun,
-					stepId: step.id,
-					input: currentInput,
 					addTransformationStepRunError,
+					input: currentInput,
+					stepId: step.id,
+					transformationRun,
 				},
+				message: 'Unable to initialize transformation step',
 			});
 
 		const handleStepResult = await handleStep({
@@ -340,20 +342,20 @@ async function runTransformation({
 				data: markedFailedTransformationRun,
 				error: markTransformationRunAndRunStepAsFailedError,
 			} = await services.db.failTransformationAtStepRun({
+				error: handleStepResult.error,
 				run: transformationRun,
 				stepRunId: newTransformationStepRun.id,
-				error: handleStepResult.error,
 			});
 			if (markTransformationRunAndRunStepAsFailedError)
 				return TransformServiceErr({
-					message: 'Unable to save failed transformation step result',
 					cause: markTransformationRunAndRunStepAsFailedError,
 					context: {
-						transformationRun,
-						stepId: newTransformationStepRun.id,
 						error: handleStepResult.error,
 						markTransformationRunAndRunStepAsFailedError,
+						stepId: newTransformationStepRun.id,
+						transformationRun,
 					},
+					message: 'Unable to save failed transformation step result',
 				});
 			return Ok(markedFailedTransformationRun);
 		}
@@ -362,21 +364,21 @@ async function runTransformation({
 
 		const { error: markTransformationRunStepAsCompletedError } =
 			await services.db.completeTransformationStepRun({
+				output: handleStepOutput,
 				run: transformationRun,
 				stepRunId: newTransformationStepRun.id,
-				output: handleStepOutput,
 			});
 
 		if (markTransformationRunStepAsCompletedError)
 			return TransformServiceErr({
-				message: 'Unable to save completed transformation step result',
 				cause: markTransformationRunStepAsCompletedError,
 				context: {
-					transformationRun,
-					stepRunId: newTransformationStepRun.id,
-					output: handleStepOutput,
 					markTransformationRunStepAsCompletedError,
+					output: handleStepOutput,
+					stepRunId: newTransformationStepRun.id,
+					transformationRun,
 				},
+				message: 'Unable to save completed transformation step result',
 			});
 
 		currentInput = handleStepOutput;
@@ -386,19 +388,19 @@ async function runTransformation({
 		data: markedCompletedTransformationRun,
 		error: markTransformationRunAsCompletedError,
 	} = await services.db.completeTransformation({
-		run: transformationRun,
 		output: currentInput,
+		run: transformationRun,
 	});
 
 	if (markTransformationRunAsCompletedError)
 		return TransformServiceErr({
-			message: 'Unable to save completed transformation run',
 			cause: markTransformationRunAsCompletedError,
 			context: {
-				transformationRun,
-				output: currentInput,
 				markTransformationRunAsCompletedError,
+				output: currentInput,
+				transformationRun,
 			},
+			message: 'Unable to save completed transformation run',
 		});
 	return Ok(markedCompletedTransformationRun);
 }
diff --git a/apps/whispering/src/lib/query/tray.ts b/apps/whispering/src/lib/query/tray.ts
index 531e42a58b..a4afdd0107 100644
--- a/apps/whispering/src/lib/query/tray.ts
+++ b/apps/whispering/src/lib/query/tray.ts
@@ -1,7 +1,9 @@
 import type { WhisperingRecordingState } from '$lib/constants/audio';
+
 import { fromTaggedErr, type WhisperingError } from '$lib/result';
 import * as services from '$lib/services';
 import { Ok, type Result } from 'wellcrafted/result';
+
 import { defineMutation } from './_client';
 
 const setTrayIconKeys = {
@@ -21,7 +23,7 @@ export const tray = {
 			if (error) {
 				return fromTaggedErr(error, {
 					title: '⚠️ Failed to set tray icon',
-					action: { type: 'more-details', error },
+					action: { error, type: 'more-details' },
 				});
 			}
 
diff --git a/apps/whispering/src/lib/query/vad-recorder.ts b/apps/whispering/src/lib/query/vad-recorder.ts
index 3e7b197b51..ecdc65895e 100644
--- a/apps/whispering/src/lib/query/vad-recorder.ts
+++ b/apps/whispering/src/lib/query/vad-recorder.ts
@@ -1,30 +1,23 @@
 import type { VadState } from '$lib/constants/audio';
+
 import { fromTaggedErr } from '$lib/result';
 import * as services from '$lib/services';
 import { enumerateDevices } from '$lib/services/device-stream';
 import { settings } from '$lib/stores/settings.svelte';
 import { Ok } from 'wellcrafted/result';
+
 import { defineMutation, defineQuery, queryClient } from './_client';
 
 const vadRecorderKeys = {
 	all: ['vadRecorder'] as const,
-	state: ['vadRecorder', 'state'] as const,
 	devices: ['vadRecorder', 'devices'] as const,
+	state: ['vadRecorder', 'state'] as const,
 } as const;
 
 const invalidateVadState = () =>
 	queryClient.invalidateQueries({ queryKey: vadRecorderKeys.state });
 
 export const vadRecorder = {
-	getVadState: defineQuery({
-		queryKey: vadRecorderKeys.state,
-		resultQueryFn: () => {
-			const vadState = services.vad.getVadState();
-			return Ok(vadState);
-		},
-		initialData: 'IDLE' as VadState,
-	}),
-
 	enumerateDevices: defineQuery({
 		queryKey: vadRecorderKeys.devices,
 		resultQueryFn: async () => {
@@ -32,37 +25,46 @@ export const vadRecorder = {
 			if (error) {
 				return fromTaggedErr(error, {
 					title: '❌ Failed to enumerate devices',
-					action: { type: 'more-details', error },
+					action: { error, type: 'more-details' },
 				});
 			}
 			return Ok(data);
 		},
 	}),
 
+	getVadState: defineQuery({
+		initialData: 'IDLE' as VadState,
+		queryKey: vadRecorderKeys.state,
+		resultQueryFn: () => {
+			const vadState = services.vad.getVadState();
+			return Ok(vadState);
+		},
+	}),
+
 	startActiveListening: defineMutation({
 		mutationKey: ['vadRecorder', 'startActiveListening'] as const,
 		resultMutationFn: async ({
-			onSpeechStart,
 			onSpeechEnd,
+			onSpeechStart,
 		}: {
-			onSpeechStart: () => void;
 			onSpeechEnd: (blob: Blob) => void;
+			onSpeechStart: () => void;
 		}) => {
 			const { data: deviceOutcome, error: startListeningError } =
 				await services.vad.startActiveListening({
 					deviceId: settings.value['recording.vad.selectedDeviceId'],
-					onSpeechStart: () => {
-						invalidateVadState();
-						onSpeechStart();
-					},
 					onSpeechEnd: (blob) => {
 						invalidateVadState();
 						onSpeechEnd(blob);
 					},
-					onVADMisfire: () => {
+					onSpeechRealStart: () => {
 						invalidateVadState();
 					},
-					onSpeechRealStart: () => {
+					onSpeechStart: () => {
+						invalidateVadState();
+						onSpeechStart();
+					},
+					onVADMisfire: () => {
 						invalidateVadState();
 					},
 				});
@@ -70,7 +72,7 @@ export const vadRecorder = {
 			if (startListeningError) {
 				return fromTaggedErr(startListeningError, {
 					title: '❌ Failed to start voice activity detection',
-					action: { type: 'more-details', error: startListeningError },
+					action: { error: startListeningError, type: 'more-details' },
 				});
 			}
 
@@ -88,7 +90,7 @@ export const vadRecorder = {
 			if (stopListeningError) {
 				return fromTaggedErr(stopListeningError, {
 					title: '❌ Failed to stop voice activity detection',
-					action: { type: 'more-details', error: stopListeningError },
+					action: { error: stopListeningError, type: 'more-details' },
 				});
 			}
 
diff --git a/apps/whispering/src/lib/result.ts b/apps/whispering/src/lib/result.ts
index efc274aa97..939e75461d 100644
--- a/apps/whispering/src/lib/result.ts
+++ b/apps/whispering/src/lib/result.ts
@@ -1,5 +1,6 @@
 import type { UnifiedNotificationOptions } from '$lib/services/notifications/types';
 import type { TaggedError } from 'wellcrafted/error';
+
 import { Err, type Ok } from 'wellcrafted/result';
 
 /**
@@ -9,7 +10,7 @@ import { Err, type Ok } from 'wellcrafted/result';
  */
 export type WhisperingError = Omit<
 	TaggedError<'WhisperingError'>,
-	'message' | 'cause' | 'context'
+	'cause' | 'context' | 'message'
 > &
 	Omit<UnifiedNotificationOptions, 'variant'> & {
 		severity: 'error' | 'warning';
@@ -49,20 +50,20 @@ export const WhisperingWarningErr = (
 ) => Err(WhisperingWarning(args));
 
 /**
- * Result type for Whispering operations that can fail.
- * Follows the Result pattern where operations return either Ok<T> or Err<WhisperingError>.
+ * Utility type for values that may or may not be wrapped in a Promise.
+ * Useful for functions that can be either synchronous or asynchronous.
  *
- * @template T - The type of the success value
+ * @template T - The type that may or may not be wrapped in a Promise
  */
-export type WhisperingResult<T> = Ok<T> | Err<WhisperingError>;
+export type MaybePromise<T> = Promise<T> | T;
 
 /**
- * Utility type for values that may or may not be wrapped in a Promise.
- * Useful for functions that can be either synchronous or asynchronous.
+ * Result type for Whispering operations that can fail.
+ * Follows the Result pattern where operations return either Ok<T> or Err<WhisperingError>.
  *
- * @template T - The type that may or may not be wrapped in a Promise
+ * @template T - The type of the success value
  */
-export type MaybePromise<T> = T | Promise<T>;
+export type WhisperingResult<T> = Err<WhisperingError> | Ok<T>;
 
 /**
  * Adapts a TaggedError from lower-level libraries into a WhisperingError for user-facing notifications.
diff --git a/apps/whispering/src/lib/services/_shortcut-trigger-state.ts b/apps/whispering/src/lib/services/_shortcut-trigger-state.ts
index 912584c52c..af8fab220b 100644
--- a/apps/whispering/src/lib/services/_shortcut-trigger-state.ts
+++ b/apps/whispering/src/lib/services/_shortcut-trigger-state.ts
@@ -1 +1 @@
-export type ShortcutTriggerState = 'Pressed' | 'Released' | 'Both';
+export type ShortcutTriggerState = 'Both' | 'Pressed' | 'Released';
diff --git a/apps/whispering/src/lib/services/analytics/desktop.ts b/apps/whispering/src/lib/services/analytics/desktop.ts
index 4d8c622c87..c478258d40 100644
--- a/apps/whispering/src/lib/services/analytics/desktop.ts
+++ b/apps/whispering/src/lib/services/analytics/desktop.ts
@@ -1,12 +1,20 @@
 import { invoke } from '@tauri-apps/api/core';
 import { tryAsync } from 'wellcrafted/result';
+
 import type { AnalyticsService } from './types';
+
 import { AnalyticsServiceErr } from './types';
 
 export function createAnalyticsServiceDesktop(): AnalyticsService {
 	return {
 		logEvent: async (event) =>
 			tryAsync({
+				mapErr: (error) =>
+					AnalyticsServiceErr({
+						cause: error,
+						context: { event },
+						message: 'Failed to log analytics event via Tauri',
+					}),
 				try: async () => {
 					const { type, ...properties } = event;
 					await invoke<void>('plugin:aptabase|track_event', {
@@ -14,12 +22,6 @@ export function createAnalyticsServiceDesktop(): AnalyticsService {
 						props: properties,
 					});
 				},
-				mapErr: (error) =>
-					AnalyticsServiceErr({
-						message: 'Failed to log analytics event via Tauri',
-						context: { event },
-						cause: error,
-					}),
 			}),
 	};
 }
diff --git a/apps/whispering/src/lib/services/analytics/types.ts b/apps/whispering/src/lib/services/analytics/types.ts
index 5a561dc959..53427758e5 100644
--- a/apps/whispering/src/lib/services/analytics/types.ts
+++ b/apps/whispering/src/lib/services/analytics/types.ts
@@ -1,25 +1,24 @@
 import type { TRANSCRIPTION_SERVICE_IDS } from '$lib/constants/transcription';
-import { createTaggedError } from 'wellcrafted/error';
 import type { Result } from 'wellcrafted/result';
 
-const { AnalyticsServiceError, AnalyticsServiceErr } = createTaggedError(
+import { createTaggedError } from 'wellcrafted/error';
+
+const { AnalyticsServiceErr, AnalyticsServiceError } = createTaggedError(
 	'AnalyticsServiceError',
 );
-type AnalyticsServiceError = ReturnType<typeof AnalyticsServiceError>;
+/**
+ * Analytics service interface that provides utilities for event logging.
+ * Both desktop and web implementations must conform to this interface.
+ */
+export type AnalyticsService = {
+	/**
+	 * Send an event to the analytics provider.
+	 * Events are typed and validated at compile time.
+	 */
+	logEvent: (event: Event) => Promise<Result<void, AnalyticsServiceError>>;
+};
 export { AnalyticsServiceErr, AnalyticsServiceError };
 
-// Use the TranscriptionServiceId type directly
-type TranscriptionServiceId = (typeof TRANSCRIPTION_SERVICE_IDS)[number];
-
-// Settings sections that can be logged
-type SettingsSection =
-	| 'transcription'
-	| 'shortcuts'
-	| 'audio'
-	| 'appearance'
-	| 'analytics'
-	| 'recording';
-
 /**
  * Discriminated union of all loggable events.
  * Each event has a 'type' field and optional additional properties.
@@ -27,35 +26,37 @@ type SettingsSection =
  */
 export type Event =
 	// Application lifecycle
-	| { type: 'app_started' }
+	| { blob_size: number; duration?: number; type: 'manual_recording_completed'; }
 	// Recording completion events - always include blob_size, duration when available
-	| { type: 'manual_recording_completed'; blob_size: number; duration?: number }
-	| { type: 'vad_recording_completed'; blob_size: number; duration?: number }
-	| { type: 'file_uploaded'; blob_size: number }
-	// Transcription events
-	| { type: 'transcription_requested'; provider: TranscriptionServiceId }
+	| { blob_size: number; duration?: number; type: 'vad_recording_completed'; }
+	| { blob_size: number; type: 'file_uploaded'; }
 	| {
-			type: 'transcription_completed';
-			provider: TranscriptionServiceId;
 			duration: number;
+			provider: TranscriptionServiceId;
+			type: 'transcription_completed';
 	  }
+	// Transcription events
 	| {
-			type: 'transcription_failed';
-			provider: TranscriptionServiceId;
-			error_title: string;
 			error_description?: string;
+			error_title: string;
+			provider: TranscriptionServiceId;
+			type: 'transcription_failed';
 	  }
+	| { provider: TranscriptionServiceId; type: 'transcription_requested'; }
+	| { section: SettingsSection; type: 'settings_changed'; }
 	// Settings events
-	| { type: 'settings_changed'; section: SettingsSection };
+	| { type: 'app_started' };
 
-/**
- * Analytics service interface that provides utilities for event logging.
- * Both desktop and web implementations must conform to this interface.
- */
-export type AnalyticsService = {
-	/**
-	 * Send an event to the analytics provider.
-	 * Events are typed and validated at compile time.
-	 */
-	logEvent: (event: Event) => Promise<Result<void, AnalyticsServiceError>>;
-};
\ No newline at end of file
+type AnalyticsServiceError = ReturnType<typeof AnalyticsServiceError>;
+
+// Settings sections that can be logged
+type SettingsSection =
+	| 'analytics'
+	| 'appearance'
+	| 'audio'
+	| 'recording'
+	| 'shortcuts'
+	| 'transcription';
+
+// Use the TranscriptionServiceId type directly
+type TranscriptionServiceId = (typeof TRANSCRIPTION_SERVICE_IDS)[number];
\ No newline at end of file
diff --git a/apps/whispering/src/lib/services/analytics/web.ts b/apps/whispering/src/lib/services/analytics/web.ts
index 9ff415c680..aac4487ad8 100644
--- a/apps/whispering/src/lib/services/analytics/web.ts
+++ b/apps/whispering/src/lib/services/analytics/web.ts
@@ -1,6 +1,8 @@
 import { init, trackEvent } from '@aptabase/web';
 import { tryAsync } from 'wellcrafted/result';
+
 import type { AnalyticsService } from './types';
+
 import { AnalyticsServiceErr } from './types';
 
 init('A-US-5744332458');
@@ -9,16 +11,16 @@ export function createAnalyticsServiceWeb(): AnalyticsService {
 	return {
 		logEvent: async (event) =>
 			tryAsync({
-				try: async () => {
-					const { type, ...properties } = event;
-					await trackEvent(type, properties);
-				},
 				mapErr: (error) =>
 					AnalyticsServiceErr({
-						message: 'Failed to log analytics event',
-						context: { event },
 						cause: error,
+						context: { event },
+						message: 'Failed to log analytics event',
 					}),
+				try: async () => {
+					const { type, ...properties } = event;
+					await trackEvent(type, properties);
+				},
 			}),
 	};
 }
diff --git a/apps/whispering/src/lib/services/completion/anthropic.ts b/apps/whispering/src/lib/services/completion/anthropic.ts
index 7ecee59c2b..f5130b24f6 100644
--- a/apps/whispering/src/lib/services/completion/anthropic.ts
+++ b/apps/whispering/src/lib/services/completion/anthropic.ts
@@ -1,8 +1,14 @@
 import Anthropic from '@anthropic-ai/sdk';
 import { Err, Ok, tryAsync } from 'wellcrafted/result';
+
 import type { CompletionService } from './types';
+
 import { CompletionServiceErr } from './types';
 
+export type AnthropicCompletionService = ReturnType<
+	typeof createAnthropicCompletionService
+>;
+
 export function createAnthropicCompletionService(): CompletionService {
 	return {
 		async complete({ apiKey, model, systemPrompt, userPrompt }) {
@@ -13,13 +19,6 @@ export function createAnthropicCompletionService(): CompletionService {
 			});
 			// Call Anthropic API
 			const { data: completion, error: anthropicApiError } = await tryAsync({
-				try: () =>
-					client.messages.create({
-						model,
-						system: systemPrompt,
-						messages: [{ role: 'user', content: userPrompt }],
-						max_tokens: 1024,
-					}),
 				mapErr: (error) => {
 					// Check if it's NOT an Anthropic API error
 					if (!(error instanceof Anthropic.APIError)) {
@@ -29,103 +28,110 @@ export function createAnthropicCompletionService(): CompletionService {
 					// Return the error directly
 					return Err(error);
 				},
+				try: () =>
+					client.messages.create({
+						max_tokens: 1024,
+						messages: [{ content: userPrompt, role: 'user' }],
+						model,
+						system: systemPrompt,
+					}),
 			});
 
 			if (anthropicApiError) {
 				// Error handling follows https://www.npmjs.com/package/@anthropic-ai/sdk#error-handling
-				const { status, name, message, error } = anthropicApiError;
+				const { message, error, name, status } = anthropicApiError;
 
 				// 400 - BadRequestError
 				if (status === 400) {
 					return CompletionServiceErr({
+						cause: anthropicApiError,
+						context: { name, status },
 						message:
 							message ??
 							`Invalid request to Anthropic API. ${error?.message ?? ''}`.trim(),
-						context: { status, name },
-						cause: anthropicApiError,
 					});
 				}
 
 				// 401 - AuthenticationError
 				if (status === 401) {
 					return CompletionServiceErr({
+						cause: anthropicApiError,
+						context: { name, status },
 						message:
 							message ??
 							'Your API key appears to be invalid or expired. Please update your API key in settings.',
-						context: { status, name },
-						cause: anthropicApiError,
 					});
 				}
 
 				// 403 - PermissionDeniedError
 				if (status === 403) {
 					return CompletionServiceErr({
+						cause: anthropicApiError,
+						context: { name, status },
 						message:
 							message ??
 							"Your account doesn't have access to this model or feature.",
-						context: { status, name },
-						cause: anthropicApiError,
 					});
 				}
 
 				// 404 - NotFoundError
 				if (status === 404) {
 					return CompletionServiceErr({
+						cause: anthropicApiError,
+						context: { name, status },
 						message:
 							message ??
 							'The requested model was not found. Please check the model name.',
-						context: { status, name },
-						cause: anthropicApiError,
 					});
 				}
 
 				// 422 - UnprocessableEntityError
 				if (status === 422) {
 					return CompletionServiceErr({
+						cause: anthropicApiError,
+						context: { name, status },
 						message:
 							message ??
 							'The request was valid but the server cannot process it. Please check your parameters.',
-						context: { status, name },
-						cause: anthropicApiError,
 					});
 				}
 
 				// 429 - RateLimitError
 				if (status === 429) {
 					return CompletionServiceErr({
-						message: message ?? 'Too many requests. Please try again later.',
-						context: { status, name },
 						cause: anthropicApiError,
+						context: { name, status },
+						message: message ?? 'Too many requests. Please try again later.',
 					});
 				}
 
 				// >=500 - InternalServerError
 				if (status && status >= 500) {
 					return CompletionServiceErr({
+						cause: anthropicApiError,
+						context: { name, status },
 						message:
 							message ??
 							`The Anthropic service is temporarily unavailable (Error ${status}). Please try again in a few minutes.`,
-						context: { status, name },
-						cause: anthropicApiError,
 					});
 				}
 
 				// Handle APIConnectionError (no status code)
 				if (!status && name === 'APIConnectionError') {
 					return CompletionServiceErr({
+						cause: anthropicApiError,
+						context: { name },
 						message:
 							message ??
 							'Unable to connect to the Anthropic service. This could be a network issue or temporary service interruption.',
-						context: { name },
-						cause: anthropicApiError,
 					});
 				}
 
 				// Catch-all for unexpected errors
 				return CompletionServiceErr({
-					message: message ?? 'An unexpected error occurred. Please try again.',
-					context: { status, name },
 					cause: anthropicApiError,
+					context: { name, status },
+					message: message ?? 'An unexpected error occurred. Please try again.',
 				});
 			}
 
@@ -137,9 +143,9 @@ export function createAnthropicCompletionService(): CompletionService {
 
 			if (!responseText) {
 				return CompletionServiceErr({
-					message: 'Anthropic API returned an empty response',
-					context: { model, completion },
 					cause: undefined,
+					context: { completion, model },
+					message: 'Anthropic API returned an empty response',
 				});
 			}
 
@@ -148,9 +154,5 @@ export function createAnthropicCompletionService(): CompletionService {
 	};
 }
 
-export type AnthropicCompletionService = ReturnType<
-	typeof createAnthropicCompletionService
->;
-
 export const AnthropicCompletionServiceLive =
 	createAnthropicCompletionService();
diff --git a/apps/whispering/src/lib/services/completion/google.ts b/apps/whispering/src/lib/services/completion/google.ts
index d2d18a48f6..34804efa0c 100644
--- a/apps/whispering/src/lib/services/completion/google.ts
+++ b/apps/whispering/src/lib/services/completion/google.ts
@@ -1,9 +1,15 @@
 import { GoogleGenerativeAI } from '@google/generative-ai';
 import { extractErrorMessage } from 'wellcrafted/error';
 import { Err, Ok, tryAsync } from 'wellcrafted/result';
+
 import type { CompletionService } from './types';
+
 import { CompletionServiceErr } from './types';
 
+export type GoogleCompletionService = ReturnType<
+	typeof createGoogleCompletionService
+>;
+
 export function createGoogleCompletionService(): CompletionService {
 	return {
 		complete: async ({
@@ -14,32 +20,32 @@ export function createGoogleCompletionService(): CompletionService {
 		}) => {
 			const combinedPrompt = `${systemPrompt}\n${userPrompt}`;
 			const { data: completion, error: completionError } = await tryAsync({
+				mapErr: (error) =>
+					CompletionServiceErr({
+						cause: error,
+						context: { model: modelName, systemPrompt, userPrompt },
+						message: `Google API Error: ${extractErrorMessage(error)}`,
+					}),
 				try: async () => {
 					const genAI = new GoogleGenerativeAI(apiKey);
 
 					const model = genAI.getGenerativeModel({
-						model: modelName,
 						// TODO: Add temperature to step settings
 						generationConfig: { temperature: 0 },
+						model: modelName,
 					});
 					const { response } = await model.generateContent(combinedPrompt);
 					return response.text();
 				},
-				mapErr: (error) =>
-					CompletionServiceErr({
-						message: `Google API Error: ${extractErrorMessage(error)}`,
-						context: { model: modelName, systemPrompt, userPrompt },
-						cause: error,
-					}),
 			});
 
 			if (completionError) return Err(completionError);
 
 			if (!completion) {
 				return CompletionServiceErr({
-					message: 'Google API returned an empty response',
-					context: { model: modelName, systemPrompt, userPrompt },
 					cause: completionError,
+					context: { model: modelName, systemPrompt, userPrompt },
+					message: 'Google API returned an empty response',
 				});
 			}
 
@@ -48,8 +54,4 @@ export function createGoogleCompletionService(): CompletionService {
 	};
 }
 
-export type GoogleCompletionService = ReturnType<
-	typeof createGoogleCompletionService
->;
-
 export const GoogleCompletionServiceLive = createGoogleCompletionService();
diff --git a/apps/whispering/src/lib/services/completion/groq.ts b/apps/whispering/src/lib/services/completion/groq.ts
index 390d6a499d..48796df124 100644
--- a/apps/whispering/src/lib/services/completion/groq.ts
+++ b/apps/whispering/src/lib/services/completion/groq.ts
@@ -1,22 +1,20 @@
 import Groq from 'groq-sdk';
 import { Err, Ok, tryAsync } from 'wellcrafted/result';
+
 import type { CompletionService } from './types';
+
 import { CompletionServiceErr } from './types';
 
+export type GroqCompletionService = ReturnType<
+	typeof createGroqCompletionService
+>;
+
 export function createGroqCompletionService(): CompletionService {
 	return {
 		async complete({ apiKey, model, systemPrompt, userPrompt }) {
 			const client = new Groq({ apiKey, dangerouslyAllowBrowser: true });
 			// Call Groq API
 			const { data: completion, error: groqApiError } = await tryAsync({
-				try: () =>
-					client.chat.completions.create({
-						model,
-						messages: [
-							{ role: 'system', content: systemPrompt },
-							{ role: 'user', content: userPrompt },
-						],
-					}),
 				mapErr: (error) => {
 					// Check if it's NOT a Groq API error
 					if (!(error instanceof Groq.APIError)) {
@@ -26,103 +24,111 @@ export function createGroqCompletionService(): CompletionService {
 					// Return the error directly
 					return Err(error);
 				},
+				try: () =>
+					client.chat.completions.create({
+						messages: [
+							{ content: systemPrompt, role: 'system' },
+							{ content: userPrompt, role: 'user' },
+						],
+						model,
+					}),
 			});
 
 			if (groqApiError) {
 				// Error handling follows https://www.npmjs.com/package/groq-sdk#error-handling
-				const { status, name, message, error } = groqApiError;
+				const { message, error, name, status } = groqApiError;
 
 				// 400 - BadRequestError
 				if (status === 400) {
 					return CompletionServiceErr({
+						cause: groqApiError,
+						context: { name, status },
 						message:
 							message ??
 							`Invalid request to Groq API. ${error?.message ?? ''}`.trim(),
-						context: { status, name },
-						cause: groqApiError,
 					});
 				}
 
 				// 401 - AuthenticationError
 				if (status === 401) {
 					return CompletionServiceErr({
+						cause: groqApiError,
+						context: { name, status },
 						message:
 							message ??
 							'Your API key appears to be invalid or expired. Please update your API key in settings.',
-						context: { status, name },
-						cause: groqApiError,
 					});
 				}
 
 				// 403 - PermissionDeniedError
 				if (status === 403) {
 					return CompletionServiceErr({
+						cause: groqApiError,
+						context: { name, status },
 						message:
 							message ??
 							"Your account doesn't have access to this model or feature.",
-						context: { status, name },
-						cause: groqApiError,
 					});
 				}
 
 				// 404 - NotFoundError
 				if (status === 404) {
 					return CompletionServiceErr({
+						cause: groqApiError,
+						context: { name, status },
 						message:
 							message ??
 							'The requested model was not found. Please check the model name.',
-						context: { status, name },
-						cause: groqApiError,
 					});
 				}
 
 				// 422 - UnprocessableEntityError
 				if (status === 422) {
 					return CompletionServiceErr({
+						cause: groqApiError,
+						context: { name, status },
 						message:
 							message ??
 							'The request was valid but the server cannot process it. Please check your parameters.',
-						context: { status, name },
-						cause: groqApiError,
 					});
 				}
 
 				// 429 - RateLimitError
 				if (status === 429) {
 					return CompletionServiceErr({
-						message: message ?? 'Too many requests. Please try again later.',
-						context: { status, name },
 						cause: groqApiError,
+						context: { name, status },
+						message: message ?? 'Too many requests. Please try again later.',
 					});
 				}
 
 				// >=500 - InternalServerError
 				if (status && status >= 500) {
 					return CompletionServiceErr({
+						cause: groqApiError,
+						context: { name, status },
 						message:
 							message ??
 							`The Groq service is temporarily unavailable (Error ${status}). Please try again in a few minutes.`,
-						context: { status, name },
-						cause: groqApiError,
 					});
 				}
 
 				// Handle APIConnectionError (no status code)
 				if (!status && name === 'APIConnectionError') {
 					return CompletionServiceErr({
+						cause: groqApiError,
+						context: { name },
 						message:
 							message ??
 							'Unable to connect to the Groq service. This could be a network issue or temporary service interruption.',
-						context: { name },
-						cause: groqApiError,
 					});
 				}
 
 				// Catch-all for unexpected errors
 				return CompletionServiceErr({
-					message: message ?? 'An unexpected error occurred. Please try again.',
-					context: { status, name },
 					cause: groqApiError,
+					context: { name, status },
+					message: message ?? 'An unexpected error occurred. Please try again.',
 				});
 			}
 
@@ -130,9 +136,9 @@ export function createGroqCompletionService(): CompletionService {
 			const responseText = completion.choices[0]?.message?.content;
 			if (!responseText) {
 				return CompletionServiceErr({
-					message: 'Groq API returned an empty response',
-					context: { model, completion },
 					cause: undefined,
+					context: { completion, model },
+					message: 'Groq API returned an empty response',
 				});
 			}
 
@@ -141,8 +147,4 @@ export function createGroqCompletionService(): CompletionService {
 	};
 }
 
-export type GroqCompletionService = ReturnType<
-	typeof createGroqCompletionService
->;
-
 export const GroqCompletionServiceLive = createGroqCompletionService();
diff --git a/apps/whispering/src/lib/services/completion/openai.ts b/apps/whispering/src/lib/services/completion/openai.ts
index c0695025b8..94e6f2fad8 100644
--- a/apps/whispering/src/lib/services/completion/openai.ts
+++ b/apps/whispering/src/lib/services/completion/openai.ts
@@ -1,22 +1,20 @@
 import OpenAI from 'openai';
 import { Err, Ok, tryAsync } from 'wellcrafted/result';
+
 import type { CompletionService } from './types';
+
 import { CompletionServiceErr } from './types';
 
+export type OpenaiCompletionService = ReturnType<
+	typeof createOpenAiCompletionService
+>;
+
 export function createOpenAiCompletionService(): CompletionService {
 	return {
 		async complete({ apiKey, model, systemPrompt, userPrompt }) {
 			const client = new OpenAI({ apiKey, dangerouslyAllowBrowser: true });
 			// Call OpenAI API
 			const { data: completion, error: openaiApiError } = await tryAsync({
-				try: () =>
-					client.chat.completions.create({
-						model,
-						messages: [
-							{ role: 'system', content: systemPrompt },
-							{ role: 'user', content: userPrompt },
-						],
-					}),
 				mapErr: (error) => {
 					// Check if it's NOT an OpenAI API error
 					if (!(error instanceof OpenAI.APIError)) {
@@ -26,103 +24,111 @@ export function createOpenAiCompletionService(): CompletionService {
 					// Return the error directly
 					return Err(error);
 				},
+				try: () =>
+					client.chat.completions.create({
+						messages: [
+							{ content: systemPrompt, role: 'system' },
+							{ content: userPrompt, role: 'user' },
+						],
+						model,
+					}),
 			});
 
 			if (openaiApiError) {
 				// Error handling follows https://www.npmjs.com/package/openai#error-handling
-				const { status, name, message, error } = openaiApiError;
+				const { message, error, name, status } = openaiApiError;
 
 				// 400 - BadRequestError
 				if (status === 400) {
 					return CompletionServiceErr({
+						cause: openaiApiError,
+						context: { name, status },
 						message:
 							message ??
 							`Invalid request to OpenAI API. ${error?.message ?? ''}`.trim(),
-						context: { status, name },
-						cause: openaiApiError,
 					});
 				}
 
 				// 401 - AuthenticationError
 				if (status === 401) {
 					return CompletionServiceErr({
+						cause: openaiApiError,
+						context: { name, status },
 						message:
 							message ??
 							'Your API key appears to be invalid or expired. Please update your API key in settings.',
-						context: { status, name },
-						cause: openaiApiError,
 					});
 				}
 
 				// 403 - PermissionDeniedError
 				if (status === 403) {
 					return CompletionServiceErr({
+						cause: openaiApiError,
+						context: { name, status },
 						message:
 							message ??
 							"Your account doesn't have access to this model or feature.",
-						context: { status, name },
-						cause: openaiApiError,
 					});
 				}
 
 				// 404 - NotFoundError
 				if (status === 404) {
 					return CompletionServiceErr({
+						cause: openaiApiError,
+						context: { name, status },
 						message:
 							message ??
 							'The requested model was not found. Please check the model name.',
-						context: { status, name },
-						cause: openaiApiError,
 					});
 				}
 
 				// 422 - UnprocessableEntityError
 				if (status === 422) {
 					return CompletionServiceErr({
+						cause: openaiApiError,
+						context: { name, status },
 						message:
 							message ??
 							'The request was valid but the server cannot process it. Please check your parameters.',
-						context: { status, name },
-						cause: openaiApiError,
 					});
 				}
 
 				// 429 - RateLimitError
 				if (status === 429) {
 					return CompletionServiceErr({
-						message: message ?? 'Too many requests. Please try again later.',
-						context: { status, name },
 						cause: openaiApiError,
+						context: { name, status },
+						message: message ?? 'Too many requests. Please try again later.',
 					});
 				}
 
 				// >=500 - InternalServerError
 				if (status && status >= 500) {
 					return CompletionServiceErr({
+						cause: openaiApiError,
+						context: { name, status },
 						message:
 							message ??
 							`The OpenAI service is temporarily unavailable (Error ${status}). Please try again in a few minutes.`,
-						context: { status, name },
-						cause: openaiApiError,
 					});
 				}
 
 				// Handle APIConnectionError (no status code)
 				if (!status && name === 'APIConnectionError') {
 					return CompletionServiceErr({
+						cause: openaiApiError,
+						context: { name },
 						message:
 							message ??
 							'Unable to connect to the OpenAI service. This could be a network issue or temporary service interruption.',
-						context: { name },
-						cause: openaiApiError,
 					});
 				}
 
 				// Catch-all for unexpected errors
 				return CompletionServiceErr({
-					message: message ?? 'An unexpected error occurred. Please try again.',
-					context: { status, name },
 					cause: openaiApiError,
+					context: { name, status },
+					message: message ?? 'An unexpected error occurred. Please try again.',
 				});
 			}
 
@@ -130,9 +136,9 @@ export function createOpenAiCompletionService(): CompletionService {
 			const responseText = completion.choices[0]?.message?.content;
 			if (!responseText) {
 				return CompletionServiceErr({
-					message: 'OpenAI API returned an empty response',
-					context: { model, completion },
 					cause: undefined,
+					context: { completion, model },
+					message: 'OpenAI API returned an empty response',
 				});
 			}
 
@@ -141,8 +147,4 @@ export function createOpenAiCompletionService(): CompletionService {
 	};
 }
 
-export type OpenaiCompletionService = ReturnType<
-	typeof createOpenAiCompletionService
->;
-
 export const OpenaiCompletionServiceLive = createOpenAiCompletionService();
diff --git a/apps/whispering/src/lib/services/completion/types.ts b/apps/whispering/src/lib/services/completion/types.ts
index 26d940cc69..2a2da067fe 100644
--- a/apps/whispering/src/lib/services/completion/types.ts
+++ b/apps/whispering/src/lib/services/completion/types.ts
@@ -1,10 +1,9 @@
-import { createTaggedError } from 'wellcrafted/error';
 import type { Result } from 'wellcrafted/result';
 
-export const { CompletionServiceError, CompletionServiceErr } =
-	createTaggedError('CompletionServiceError');
-export type CompletionServiceError = ReturnType<typeof CompletionServiceError>;
+import { createTaggedError } from 'wellcrafted/error';
 
+export const { CompletionServiceErr, CompletionServiceError } =
+	createTaggedError('CompletionServiceError');
 export type CompletionService = {
 	complete: (opts: {
 		apiKey: string;
@@ -13,3 +12,5 @@ export type CompletionService = {
 		userPrompt: string;
 	}) => Promise<Result<string, CompletionServiceError>>;
 };
+
+export type CompletionServiceError = ReturnType<typeof CompletionServiceError>;
diff --git a/apps/whispering/src/lib/services/db/dexie.ts b/apps/whispering/src/lib/services/db/dexie.ts
index f4b305a615..df24bdcfe4 100644
--- a/apps/whispering/src/lib/services/db/dexie.ts
+++ b/apps/whispering/src/lib/services/db/dexie.ts
@@ -1,11 +1,13 @@
-import { moreDetailsDialog } from '$lib/components/MoreDetailsDialog.svelte';
-import { rpc } from '$lib/query';
 import type { DownloadService } from '$lib/services/download';
 import type { Settings } from '$lib/settings';
+
+import { moreDetailsDialog } from '$lib/components/MoreDetailsDialog.svelte';
+import { rpc } from '$lib/query';
 import Dexie, { type Transaction } from 'dexie';
 import { nanoid } from 'nanoid/non-secure';
 import { createTaggedError, extractErrorMessage } from 'wellcrafted/error';
 import { Err, Ok, type Result, tryAsync } from 'wellcrafted/result';
+
 import type {
 	Recording,
 	RecordingsDbSchemaV1,
@@ -24,7 +26,7 @@ import type {
 	TransformationStepRunRunning,
 } from './models';
 
-export const { DbServiceError, DbServiceErr } =
+export const { DbServiceErr, DbServiceError } =
 	createTaggedError('DbServiceError');
 export type DbServiceError = ReturnType<typeof DbServiceError>;
 
@@ -32,20 +34,20 @@ const DB_NAME = 'RecordingDB';
 
 class WhisperingDatabase extends Dexie {
 	recordings!: Dexie.Table<RecordingsDbSchemaV5['recordings'], string>;
-	transformations!: Dexie.Table<Transformation, string>;
 	transformationRuns!: Dexie.Table<TransformationRun, string>;
+	transformations!: Dexie.Table<Transformation, string>;
 
 	constructor({ DownloadService }: { DownloadService: DownloadService }) {
 		super(DB_NAME);
 
 		const wrapUpgradeWithErrorHandling = async ({
 			tx,
-			version,
 			upgrade,
+			version,
 		}: {
 			tx: Transaction;
-			version: number;
 			upgrade: (tx: Transaction) => Promise<void>;
+			version: number;
 		}) => {
 			try {
 				await upgrade(tx);
@@ -70,10 +72,10 @@ class WhisperingDatabase extends Dexie {
 				);
 
 				const dumpState = {
-					version,
 					tables: Object.fromEntries(
 						DUMP_TABLE_NAMES.map((name, i) => [name, dumps[i]]),
 					),
+					version,
 				};
 
 				const dumpString = JSON.stringify(dumpState, null, 2);
@@ -82,7 +84,6 @@ class WhisperingDatabase extends Dexie {
 					title: `Failed to upgrade IndexedDb Database to version ${version}`,
 					description:
 						'Please download the database dump and delete the database to start fresh.',
-					content: dumpString,
 					buttons: [
 						{
 							label: 'Download Database Dump',
@@ -92,14 +93,14 @@ class WhisperingDatabase extends Dexie {
 								});
 								const { error: downloadError } =
 									await DownloadService.downloadBlob({
-										name: 'recording-db-dump.json',
 										blob,
+										name: 'recording-db-dump.json',
 									});
 								if (downloadError) {
 									rpc.notify.error.execute({
 										title: 'Failed to download IndexedDB dump!',
 										description: 'Your IndexedDB dump could not be downloaded.',
-										action: { type: 'more-details', error: downloadError },
+										action: { error: downloadError, type: 'more-details' },
 									});
 								} else {
 									rpc.notify.success.execute({
@@ -111,7 +112,6 @@ class WhisperingDatabase extends Dexie {
 						},
 						{
 							label: 'Delete Database and Reload',
-							variant: 'destructive',
 							onClick: async () => {
 								try {
 									// Delete the database
@@ -121,11 +121,11 @@ class WhisperingDatabase extends Dexie {
 										description:
 											'The database has been successfully deleted. Please refresh the page.',
 										action: {
-											type: 'button',
 											label: 'Refresh',
 											onClick: () => {
 												window.location.reload();
 											},
+											type: 'button',
 										},
 									});
 								} catch (err) {
@@ -136,14 +136,16 @@ class WhisperingDatabase extends Dexie {
 										description:
 											'There was an error deleting the database. Please try again.',
 										action: {
-											type: 'more-details',
 											error,
+											type: 'more-details',
 										},
 									});
 								}
 							},
+							variant: 'destructive',
 						},
 					],
+					content: dumpString,
 				});
 
 				throw error; // Re-throw to trigger rollback
@@ -156,14 +158,13 @@ class WhisperingDatabase extends Dexie {
 		// V2: Split into metadata and blobs
 		this.version(0.2)
 			.stores({
-				recordings: null,
-				recordingMetadata: '&id',
 				recordingBlobs: '&id',
+				recordingMetadata: '&id',
+				recordings: null,
 			})
 			.upgrade(async (tx) => {
 				await wrapUpgradeWithErrorHandling({
 					tx,
-					version: 0.2,
 					upgrade: async (tx) => {
 						// Migrate data from recordings to split tables
 						const oldRecordings = await tx
@@ -174,7 +175,7 @@ class WhisperingDatabase extends Dexie {
 						const metadata = oldRecordings.map(
 							({ blob, ...recording }) => recording,
 						);
-						const blobs = oldRecordings.map(({ id, blob }) => ({ id, blob }));
+						const blobs = oldRecordings.map(({ blob, id }) => ({ blob, id }));
 
 						await tx
 							.table<RecordingsDbSchemaV2['recordingMetadata']>(
@@ -185,20 +186,20 @@ class WhisperingDatabase extends Dexie {
 							.table<RecordingsDbSchemaV2['recordingBlobs']>('recordingBlobs')
 							.bulkAdd(blobs);
 					},
+					version: 0.2,
 				});
 			});
 
 		// V3: Back to single recordings table
 		this.version(0.3)
 			.stores({
-				recordings: '&id, timestamp',
-				recordingMetadata: null,
 				recordingBlobs: null,
+				recordingMetadata: null,
+				recordings: '&id, timestamp',
 			})
 			.upgrade(async (tx) => {
 				await wrapUpgradeWithErrorHandling({
 					tx,
-					version: 0.3,
 					upgrade: async (tx) => {
 						// Get data from both tables
 						const metadata = await tx
@@ -220,6 +221,7 @@ class WhisperingDatabase extends Dexie {
 							.table<RecordingsDbSchemaV3['recordings']>('recordings')
 							.bulkAdd(mergedRecordings);
 					},
+					version: 0.3,
 				});
 			});
 
@@ -228,13 +230,12 @@ class WhisperingDatabase extends Dexie {
 		this.version(0.4)
 			.stores({
 				recordings: '&id, timestamp, createdAt, updatedAt',
-				transformations: '&id, createdAt, updatedAt',
 				transformationRuns: '&id, transformationId, recordingId, startedAt',
+				transformations: '&id, createdAt, updatedAt',
 			})
 			.upgrade(async (tx) => {
 				await wrapUpgradeWithErrorHandling({
 					tx,
-					version: 0.4,
 					upgrade: async (tx) => {
 						const oldRecordings = await tx
 							.table<RecordingsDbSchemaV3['recordings']>('recordings')
@@ -249,6 +250,7 @@ class WhisperingDatabase extends Dexie {
 						await tx.table('recordings').clear();
 						await tx.table('recordings').bulkAdd(newRecordings);
 					},
+					version: 0.4,
 				});
 			});
 
@@ -256,13 +258,12 @@ class WhisperingDatabase extends Dexie {
 		this.version(0.5)
 			.stores({
 				recordings: '&id, timestamp, createdAt, updatedAt',
-				transformations: '&id, createdAt, updatedAt',
 				transformationRuns: '&id, transformationId, recordingId, startedAt',
+				transformations: '&id, createdAt, updatedAt',
 			})
 			.upgrade(async (tx) => {
 				await wrapUpgradeWithErrorHandling({
 					tx,
-					version: 0.5,
 					upgrade: async (tx) => {
 						const oldRecordings = await tx
 							.table<RecordingsDbSchemaV4['recordings']>('recordings')
@@ -281,6 +282,7 @@ class WhisperingDatabase extends Dexie {
 						await Dexie.waitFor(tx.table('recordings').clear());
 						await Dexie.waitFor(tx.table('recordings').bulkAdd(newRecordings));
 					},
+					version: 0.5,
 				});
 			});
 
@@ -338,6 +340,8 @@ const recordingWithSerializedAudioToRecording = (
 	return { ...rest, blob };
 };
 
+export type DbService = ReturnType<typeof createDbServiceDexie>;
+
 export function createDbServiceDexie({
 	DownloadService,
 }: {
@@ -345,172 +349,44 @@ export function createDbServiceDexie({
 }) {
 	const db = new WhisperingDatabase({ DownloadService });
 	return {
-		async getAllRecordings(): Promise<Result<Recording[], DbServiceError>> {
-			return tryAsync({
-				try: async () => {
-					const recordings = await db.recordings
-						.orderBy('timestamp')
-						.reverse()
-						.toArray();
-					return Dexie.waitFor(
-						Promise.all(
-							recordings.map(recordingWithSerializedAudioToRecording),
-						),
-					);
-				},
-				mapErr: (error) =>
-					DbServiceErr({
-						message: 'Error getting all recordings from Dexie',
-						cause: error,
-					}),
-			});
-		},
-
-		async getLatestRecording(): Promise<
-			Result<Recording | null, DbServiceError>
-		> {
-			return tryAsync({
-				try: async () => {
-					const latestRecording = await db.recordings
-						.orderBy('timestamp')
-						.reverse()
-						.first();
-					if (!latestRecording) return null;
-					return recordingWithSerializedAudioToRecording(latestRecording);
-				},
-				mapErr: (error) =>
-					DbServiceErr({
-						message: 'Error getting latest recording from Dexie',
-						cause: error,
-					}),
-			});
-		},
-
-		async getTranscribingRecordingIds(): Promise<
-			Result<string[], DbServiceError>
-		> {
-			return tryAsync({
-				try: () =>
-					db.recordings
-						.where('transcriptionStatus')
-						.equals('TRANSCRIBING' satisfies Recording['transcriptionStatus'])
-						.primaryKeys(),
-				mapErr: (error) =>
-					DbServiceErr({
-						message: 'Error getting transcribing recording ids from Dexie',
-						cause: error,
-					}),
-			});
-		},
-
-		async getRecordingById(
-			id: string,
-		): Promise<Result<Recording | null, DbServiceError>> {
-			return tryAsync({
-				try: async () => {
-					const maybeRecording = await db.recordings.get(id);
-					if (!maybeRecording) return null;
-					return recordingWithSerializedAudioToRecording(maybeRecording);
-				},
-				mapErr: (error) =>
-					DbServiceErr({
-						message: 'Error getting recording by id from Dexie',
-						context: { id },
-						cause: error,
-					}),
-			});
-		},
-
-		async createRecording(
-			recording: Recording,
-		): Promise<Result<Recording, DbServiceError>> {
-			const now = new Date().toISOString();
-			const recordingWithTimestamps = {
-				...recording,
-				createdAt: now,
-				updatedAt: now,
-			} satisfies Recording;
-
-			const dbRecording = await recordingToRecordingWithSerializedAudio(
-				recordingWithTimestamps,
-			);
-
-			const { error: createRecordingError } = await tryAsync({
-				try: async () => {
-					await db.recordings.add(dbRecording);
-				},
-				mapErr: (error) =>
-					DbServiceErr({
-						message: 'Error adding recording to Dexie',
-						context: { recording },
-						cause: error,
-					}),
-			});
-			if (createRecordingError) return Err(createRecordingError);
-			return Ok(recordingWithTimestamps);
-		},
-
-		async updateRecording(
-			recording: Recording,
-		): Promise<Result<Recording, DbServiceError>> {
+		async addTransformationStep({
+			run,
+			step,
+		}: {
+			run: TransformationRun;
+			step: {
+				id: string;
+				input: string;
+			};
+		}): Promise<Result<TransformationStepRun, DbServiceError>> {
 			const now = new Date().toISOString();
-			const recordingWithTimestamp = {
-				...recording,
-				updatedAt: now,
-			} satisfies Recording;
-
-			const dbRecording = await recordingToRecordingWithSerializedAudio(
-				recordingWithTimestamp,
-			);
+			const newTransformationStepRun = {
+				completedAt: null,
+				id: nanoid(),
+				input: step.input,
+				startedAt: now,
+				status: 'running',
+				stepId: step.id,
+			} satisfies TransformationStepRunRunning;
 
-			const { error: updateRecordingError } = await tryAsync({
-				try: async () => {
-					await db.recordings.put(dbRecording);
-				},
-				mapErr: (error) =>
-					DbServiceErr({
-						message: 'Error updating recording in Dexie',
-						context: { recording },
-						cause: error,
-					}),
-			});
-			if (updateRecordingError) return Err(updateRecordingError);
-			return Ok(recordingWithTimestamp);
-		},
+			const updatedRun: TransformationRun = {
+				...run,
+				stepRuns: [...run.stepRuns, newTransformationStepRun],
+			};
 
-		async deleteRecording(
-			recording: Recording,
-		): Promise<Result<void, DbServiceError>> {
-			const { error: deleteRecordingError } = await tryAsync({
-				try: async () => {
-					await db.recordings.delete(recording.id);
-				},
+			const { error: addStepRunToTransformationRunError } = await tryAsync({
 				mapErr: (error) =>
 					DbServiceErr({
-						message: 'Error deleting recording from Dexie',
-						context: { recording },
 						cause: error,
+						context: { run, step },
+						message: 'Error adding step run to transformation run in Dexie',
 					}),
+				try: () => db.transformationRuns.put(updatedRun),
 			});
-			if (deleteRecordingError) return Err(deleteRecordingError);
-			return Ok(undefined);
-		},
+			if (addStepRunToTransformationRunError)
+				return Err(addStepRunToTransformationRunError);
 
-		async deleteRecordings(
-			recordingsToDelete: Recording[],
-		): Promise<Result<void, DbServiceError>> {
-			const ids = recordingsToDelete.map((r) => r.id);
-			const { error: deleteRecordingsError } = await tryAsync({
-				try: () => db.recordings.bulkDelete(ids),
-				mapErr: (error) =>
-					DbServiceErr({
-						message: 'Error deleting recordings from Dexie',
-						context: { recordingsToDelete },
-						cause: error,
-					}),
-			});
-			if (deleteRecordingsError) return Err(deleteRecordingsError);
-			return Ok(undefined);
+			return Ok(newTransformationStepRun);
 		},
 
 		/**
@@ -521,11 +397,11 @@ export function createDbServiceDexie({
 		 * 3. When retention settings change
 		 */
 		async cleanupExpiredRecordings({
-			recordingRetentionStrategy,
 			maxRecordingCount,
+			recordingRetentionStrategy,
 		}: {
-			recordingRetentionStrategy: Settings['database.recordingRetentionStrategy'];
 			maxRecordingCount: Settings['database.maxRecordingCount'];
+			recordingRetentionStrategy: Settings['database.recordingRetentionStrategy'];
 		}): Promise<Result<void, DbServiceError>> {
 			switch (recordingRetentionStrategy) {
 				case 'keep-forever': {
@@ -533,14 +409,14 @@ export function createDbServiceDexie({
 				}
 				case 'limit-count': {
 					const { data: count, error: countError } = await tryAsync({
-						try: () => db.recordings.count(),
 						mapErr: (error) =>
 							DbServiceErr({
+								cause: error,
+								context: { maxRecordingCount, recordingRetentionStrategy },
 								message:
 									'Unable to get recording count while cleaning up old recordings',
-								context: { maxRecordingCount, recordingRetentionStrategy },
-								cause: error,
 							}),
+						try: () => db.recordings.count(),
 					});
 					if (countError) return Err(countError);
 					if (count === 0) return Ok(undefined);
@@ -550,6 +426,12 @@ export function createDbServiceDexie({
 					if (count <= maxCount) return Ok(undefined);
 
 					return tryAsync({
+						mapErr: (error) =>
+							DbServiceErr({
+								cause: error,
+								context: { count, maxCount, recordingRetentionStrategy },
+								message: 'Unable to clean up old recordings',
+							}),
 						try: async () => {
 							const idsToDelete = await db.recordings
 								.orderBy('createdAt')
@@ -557,286 +439,256 @@ export function createDbServiceDexie({
 								.primaryKeys();
 							await db.recordings.bulkDelete(idsToDelete);
 						},
-						mapErr: (error) =>
-							DbServiceErr({
-								message: 'Unable to clean up old recordings',
-								context: { count, maxCount, recordingRetentionStrategy },
-								cause: error,
-							}),
 					});
 				}
 			}
 		},
-		async getAllTransformations(): Promise<
-			Result<Transformation[], DbServiceError>
-		> {
-			return tryAsync({
-				try: () => db.transformations.toArray(),
+
+		async completeTransformation({
+			output,
+			run,
+		}: {
+			output: string;
+			run: TransformationRun;
+		}): Promise<Result<TransformationRunCompleted, DbServiceError>> {
+			const now = new Date().toISOString();
+
+			// Create the completed transformation run
+			const completedRun: TransformationRunCompleted = {
+				...run,
+				completedAt: now,
+				output,
+				status: 'completed',
+			};
+
+			const { error: updateTransformationStepRunError } = await tryAsync({
 				mapErr: (error) =>
 					DbServiceErr({
-						message: 'Error getting all transformations from Dexie',
 						cause: error,
+						context: { output, run },
+						message: 'Error updating transformation run as completed in Dexie',
 					}),
+				try: () => db.transformationRuns.put(completedRun),
 			});
+			if (updateTransformationStepRunError)
+				return Err(updateTransformationStepRunError);
+
+			return Ok(completedRun);
 		},
 
-		async getTransformationById(
-			id: string,
-		): Promise<Result<Transformation | null, DbServiceError>> {
-			return tryAsync({
-				try: async () => {
-					const maybeTransformation =
-						(await db.transformations.get(id)) ?? null;
-					return maybeTransformation;
-				},
+		async completeTransformationStepRun({
+			output,
+			run,
+			stepRunId,
+		}: {
+			output: string;
+			run: TransformationRun;
+			stepRunId: string;
+		}): Promise<Result<TransformationRun, DbServiceError>> {
+			const now = new Date().toISOString();
+
+			// Create updated transformation run with the new step runs
+			const updatedRun: TransformationRun = {
+				...run,
+				stepRuns: run.stepRuns.map((stepRun) => {
+					if (stepRun.id === stepRunId) {
+						const completedStepRun: TransformationStepRunCompleted = {
+							...stepRun,
+							completedAt: now,
+							output,
+							status: 'completed',
+						};
+						return completedStepRun;
+					}
+					return stepRun;
+				}),
+			};
+
+			const { error: updateTransformationStepRunError } = await tryAsync({
+				mapErr: (error) =>
+					DbServiceErr({
+						cause: error,
+						context: { output, run, stepId: stepRunId },
+						message: 'Error updating transformation step run status in Dexie',
+					}),
+				try: () => db.transformationRuns.put(updatedRun),
+			});
+			if (updateTransformationStepRunError)
+				return Err(updateTransformationStepRunError);
+
+			return Ok(updatedRun);
+		},
+
+		async createRecording(
+			recording: Recording,
+		): Promise<Result<Recording, DbServiceError>> {
+			const now = new Date().toISOString();
+			const recordingWithTimestamps = {
+				...recording,
+				createdAt: now,
+				updatedAt: now,
+			} satisfies Recording;
+
+			const dbRecording = await recordingToRecordingWithSerializedAudio(
+				recordingWithTimestamps,
+			);
+
+			const { error: createRecordingError } = await tryAsync({
 				mapErr: (error) =>
 					DbServiceErr({
-						message: 'Error getting transformation by id from Dexie',
-						context: { id },
 						cause: error,
+						context: { recording },
+						message: 'Error adding recording to Dexie',
 					}),
+				try: async () => {
+					await db.recordings.add(dbRecording);
+				},
 			});
+			if (createRecordingError) return Err(createRecordingError);
+			return Ok(recordingWithTimestamps);
 		},
 
 		async createTransformation(
 			transformation: Transformation,
 		): Promise<Result<Transformation, DbServiceError>> {
 			const { error: createTransformationError } = await tryAsync({
-				try: () => db.transformations.add(transformation),
 				mapErr: (error) =>
 					DbServiceErr({
-						message: 'Error adding transformation to Dexie',
-						context: { transformation },
 						cause: error,
+						context: { transformation },
+						message: 'Error adding transformation to Dexie',
 					}),
+				try: () => db.transformations.add(transformation),
 			});
 			if (createTransformationError) return Err(createTransformationError);
 			return Ok(transformation);
 		},
 
-		async updateTransformation(
-			transformation: Transformation,
-		): Promise<Result<Transformation, DbServiceError>> {
+		async createTransformationRun({
+			input,
+			recordingId,
+			transformationId,
+		}: {
+			input: string;
+			recordingId: null | string;
+			transformationId: string;
+		}): Promise<Result<TransformationRun, DbServiceError>> {
 			const now = new Date().toISOString();
-			const transformationWithTimestamp = {
-				...transformation,
-				updatedAt: now,
-			} satisfies Transformation;
-			const { error: updateTransformationError } = await tryAsync({
-				try: () => db.transformations.put(transformationWithTimestamp),
+			const transformationRunWithTimestamps = {
+				completedAt: null,
+				id: nanoid(),
+				input,
+				recordingId,
+				startedAt: now,
+				status: 'running',
+				stepRuns: [],
+				transformationId,
+			} satisfies TransformationRunRunning;
+			const { error: createTransformationRunError } = await tryAsync({
 				mapErr: (error) =>
 					DbServiceErr({
-						message: 'Error updating transformation in Dexie',
-						context: { transformation },
 						cause: error,
+						context: { input, recordingId, transformationId },
+						message: 'Error adding transformation run to Dexie',
 					}),
+				try: () => db.transformationRuns.add(transformationRunWithTimestamps),
 			});
-			if (updateTransformationError) return Err(updateTransformationError);
-			return Ok(transformationWithTimestamp);
+			if (createTransformationRunError)
+				return Err(createTransformationRunError);
+			return Ok(transformationRunWithTimestamps);
 		},
 
-		async deleteTransformation(
-			transformation: Transformation,
+		async deleteRecording(
+			recording: Recording,
 		): Promise<Result<void, DbServiceError>> {
-			const { error: deleteTransformationError } = await tryAsync({
-				try: () => db.transformations.delete(transformation.id),
+			const { error: deleteRecordingError } = await tryAsync({
 				mapErr: (error) =>
 					DbServiceErr({
-						message: 'Error deleting transformation from Dexie',
-						context: { transformation },
 						cause: error,
+						context: { recording },
+						message: 'Error deleting recording from Dexie',
 					}),
+				try: async () => {
+					await db.recordings.delete(recording.id);
+				},
 			});
-			if (deleteTransformationError) return Err(deleteTransformationError);
+			if (deleteRecordingError) return Err(deleteRecordingError);
 			return Ok(undefined);
 		},
 
-		async deleteTransformations(
-			transformations: Transformation[],
+		async deleteRecordings(
+			recordingsToDelete: Recording[],
 		): Promise<Result<void, DbServiceError>> {
-			const ids = transformations.map((t) => t.id);
-			const { error: deleteTransformationsError } = await tryAsync({
-				try: () => db.transformations.bulkDelete(ids),
+			const ids = recordingsToDelete.map((r) => r.id);
+			const { error: deleteRecordingsError } = await tryAsync({
 				mapErr: (error) =>
 					DbServiceErr({
-						message: 'Error deleting transformations from Dexie',
-						context: { transformations },
 						cause: error,
+						context: { recordingsToDelete },
+						message: 'Error deleting recordings from Dexie',
 					}),
+				try: () => db.recordings.bulkDelete(ids),
 			});
-			if (deleteTransformationsError) return Err(deleteTransformationsError);
+			if (deleteRecordingsError) return Err(deleteRecordingsError);
 			return Ok(undefined);
 		},
-
-		async getTransformationRunById(
-			id: string,
-		): Promise<Result<TransformationRun | null, DbServiceError>> {
-			const { data: transformationRun, error: getTransformationRunByIdError } =
-				await tryAsync({
-					try: () => db.transformationRuns.where('id').equals(id).first(),
-					mapErr: (error) =>
-						DbServiceErr({
-							message: 'Error getting transformation run by id from Dexie',
-							context: { id },
-							cause: error,
-						}),
-				});
-			if (getTransformationRunByIdError)
-				return Err(getTransformationRunByIdError);
-			return Ok(transformationRun ?? null);
-		},
-
-		async getTransformationRunsByTransformationId(
-			transformationId: string,
-		): Promise<Result<TransformationRun[], DbServiceError>> {
-			return tryAsync({
-				try: () =>
-					db.transformationRuns
-						.where('transformationId')
-						.equals(transformationId)
-						.reverse()
-						.toArray()
-						.then((runs) =>
-							runs.sort(
-								(a, b) =>
-									new Date(b.startedAt).getTime() -
-									new Date(a.startedAt).getTime(),
-							),
-						),
+		async deleteTransformation(
+			transformation: Transformation,
+		): Promise<Result<void, DbServiceError>> {
+			const { error: deleteTransformationError } = await tryAsync({
 				mapErr: (error) =>
 					DbServiceErr({
-						message:
-							'Error getting transformation runs by transformation id from Dexie',
-						context: { transformationId },
 						cause: error,
+						context: { transformation },
+						message: 'Error deleting transformation from Dexie',
 					}),
+				try: () => db.transformations.delete(transformation.id),
 			});
+			if (deleteTransformationError) return Err(deleteTransformationError);
+			return Ok(undefined);
 		},
 
-		async getTransformationRunsByRecordingId(
-			recordingId: string,
-		): Promise<Result<TransformationRun[], DbServiceError>> {
-			return tryAsync({
-				try: () =>
-					db.transformationRuns
-						.where('recordingId')
-						.equals(recordingId)
-						.toArray()
-						.then((runs) =>
-							runs.sort(
-								(a, b) =>
-									new Date(b.startedAt).getTime() -
-									new Date(a.startedAt).getTime(),
-							),
-						),
+		async deleteTransformations(
+			transformations: Transformation[],
+		): Promise<Result<void, DbServiceError>> {
+			const ids = transformations.map((t) => t.id);
+			const { error: deleteTransformationsError } = await tryAsync({
 				mapErr: (error) =>
 					DbServiceErr({
-						message:
-							'Error getting transformation runs by recording id from Dexie',
-						context: { recordingId },
 						cause: error,
+						context: { transformations },
+						message: 'Error deleting transformations from Dexie',
 					}),
+				try: () => db.transformations.bulkDelete(ids),
 			});
-		},
-
-		async createTransformationRun({
-			transformationId,
-			recordingId,
-			input,
-		}: {
-			transformationId: string;
-			recordingId: string | null;
-			input: string;
-		}): Promise<Result<TransformationRun, DbServiceError>> {
-			const now = new Date().toISOString();
-			const transformationRunWithTimestamps = {
-				id: nanoid(),
-				transformationId,
-				recordingId,
-				input,
-				startedAt: now,
-				completedAt: null,
-				status: 'running',
-				stepRuns: [],
-			} satisfies TransformationRunRunning;
-			const { error: createTransformationRunError } = await tryAsync({
-				try: () => db.transformationRuns.add(transformationRunWithTimestamps),
-				mapErr: (error) =>
-					DbServiceErr({
-						message: 'Error adding transformation run to Dexie',
-						context: { transformationId, recordingId, input },
-						cause: error,
-					}),
-			});
-			if (createTransformationRunError)
-				return Err(createTransformationRunError);
-			return Ok(transformationRunWithTimestamps);
-		},
-
-		async addTransformationStep({
-			run,
-			step,
-		}: {
-			run: TransformationRun;
-			step: {
-				id: string;
-				input: string;
-			};
-		}): Promise<Result<TransformationStepRun, DbServiceError>> {
-			const now = new Date().toISOString();
-			const newTransformationStepRun = {
-				id: nanoid(),
-				stepId: step.id,
-				input: step.input,
-				startedAt: now,
-				completedAt: null,
-				status: 'running',
-			} satisfies TransformationStepRunRunning;
-
-			const updatedRun: TransformationRun = {
-				...run,
-				stepRuns: [...run.stepRuns, newTransformationStepRun],
-			};
-
-			const { error: addStepRunToTransformationRunError } = await tryAsync({
-				try: () => db.transformationRuns.put(updatedRun),
-				mapErr: (error) =>
-					DbServiceErr({
-						message: 'Error adding step run to transformation run in Dexie',
-						context: { run, step },
-						cause: error,
-					}),
-			});
-			if (addStepRunToTransformationRunError)
-				return Err(addStepRunToTransformationRunError);
-
-			return Ok(newTransformationStepRun);
+			if (deleteTransformationsError) return Err(deleteTransformationsError);
+			return Ok(undefined);
 		},
 
 		async failTransformationAtStepRun({
+			error,
 			run,
 			stepRunId,
-			error,
 		}: {
+			error: string;
 			run: TransformationRun;
 			stepRunId: string;
-			error: string;
 		}): Promise<Result<TransformationRunFailed, DbServiceError>> {
 			const now = new Date().toISOString();
 
 			// Create the failed transformation run
 			const failedRun: TransformationRunFailed = {
 				...run,
-				status: 'failed',
 				completedAt: now,
 				error,
+				status: 'failed',
 				stepRuns: run.stepRuns.map((stepRun) => {
 					if (stepRun.id === stepRunId) {
 						const failedStepRun: TransformationStepRunFailed = {
 							...stepRun,
-							status: 'failed',
 							completedAt: now,
 							error,
+							status: 'failed',
 						};
 						return failedStepRun;
 					}
@@ -845,13 +697,13 @@ export function createDbServiceDexie({
 			};
 
 			const { error: updateTransformationStepRunError } = await tryAsync({
-				try: () => db.transformationRuns.put(failedRun),
 				mapErr: (error) =>
 					DbServiceErr({
-						message: 'Error updating transformation run as failed in Dexie',
-						context: { run, stepId: stepRunId, error },
 						cause: error,
+						context: { error, run, stepId: stepRunId },
+						message: 'Error updating transformation run as failed in Dexie',
 					}),
+				try: () => db.transformationRuns.put(failedRun),
 			});
 			if (updateTransformationStepRunError)
 				return Err(updateTransformationStepRunError);
@@ -859,81 +711,231 @@ export function createDbServiceDexie({
 			return Ok(failedRun);
 		},
 
-		async completeTransformationStepRun({
-			run,
-			stepRunId,
-			output,
-		}: {
-			run: TransformationRun;
-			stepRunId: string;
-			output: string;
-		}): Promise<Result<TransformationRun, DbServiceError>> {
-			const now = new Date().toISOString();
+		async getAllRecordings(): Promise<Result<Recording[], DbServiceError>> {
+			return tryAsync({
+				mapErr: (error) =>
+					DbServiceErr({
+						cause: error,
+						message: 'Error getting all recordings from Dexie',
+					}),
+				try: async () => {
+					const recordings = await db.recordings
+						.orderBy('timestamp')
+						.reverse()
+						.toArray();
+					return Dexie.waitFor(
+						Promise.all(
+							recordings.map(recordingWithSerializedAudioToRecording),
+						),
+					);
+				},
+			});
+		},
 
-			// Create updated transformation run with the new step runs
-			const updatedRun: TransformationRun = {
-				...run,
-				stepRuns: run.stepRuns.map((stepRun) => {
-					if (stepRun.id === stepRunId) {
-						const completedStepRun: TransformationStepRunCompleted = {
-							...stepRun,
-							status: 'completed',
-							completedAt: now,
-							output,
-						};
-						return completedStepRun;
-					}
-					return stepRun;
-				}),
-			};
+		async getAllTransformations(): Promise<
+			Result<Transformation[], DbServiceError>
+		> {
+			return tryAsync({
+				mapErr: (error) =>
+					DbServiceErr({
+						cause: error,
+						message: 'Error getting all transformations from Dexie',
+					}),
+				try: () => db.transformations.toArray(),
+			});
+		},
 
-			const { error: updateTransformationStepRunError } = await tryAsync({
-				try: () => db.transformationRuns.put(updatedRun),
+		async getLatestRecording(): Promise<
+			Result<null | Recording, DbServiceError>
+		> {
+			return tryAsync({
 				mapErr: (error) =>
 					DbServiceErr({
-						message: 'Error updating transformation step run status in Dexie',
-						context: { run, stepId: stepRunId, output },
 						cause: error,
+						message: 'Error getting latest recording from Dexie',
 					}),
+				try: async () => {
+					const latestRecording = await db.recordings
+						.orderBy('timestamp')
+						.reverse()
+						.first();
+					if (!latestRecording) return null;
+					return recordingWithSerializedAudioToRecording(latestRecording);
+				},
 			});
-			if (updateTransformationStepRunError)
-				return Err(updateTransformationStepRunError);
+		},
 
-			return Ok(updatedRun);
+		async getRecordingById(
+			id: string,
+		): Promise<Result<null | Recording, DbServiceError>> {
+			return tryAsync({
+				mapErr: (error) =>
+					DbServiceErr({
+						cause: error,
+						context: { id },
+						message: 'Error getting recording by id from Dexie',
+					}),
+				try: async () => {
+					const maybeRecording = await db.recordings.get(id);
+					if (!maybeRecording) return null;
+					return recordingWithSerializedAudioToRecording(maybeRecording);
+				},
+			});
 		},
 
-		async completeTransformation({
-			run,
-			output,
-		}: {
-			run: TransformationRun;
-			output: string;
-		}): Promise<Result<TransformationRunCompleted, DbServiceError>> {
+		async getTranscribingRecordingIds(): Promise<
+			Result<string[], DbServiceError>
+		> {
+			return tryAsync({
+				mapErr: (error) =>
+					DbServiceErr({
+						cause: error,
+						message: 'Error getting transcribing recording ids from Dexie',
+					}),
+				try: () =>
+					db.recordings
+						.where('transcriptionStatus')
+						.equals('TRANSCRIBING' satisfies Recording['transcriptionStatus'])
+						.primaryKeys(),
+			});
+		},
+
+		async getTransformationById(
+			id: string,
+		): Promise<Result<null | Transformation, DbServiceError>> {
+			return tryAsync({
+				mapErr: (error) =>
+					DbServiceErr({
+						cause: error,
+						context: { id },
+						message: 'Error getting transformation by id from Dexie',
+					}),
+				try: async () => {
+					const maybeTransformation =
+						(await db.transformations.get(id)) ?? null;
+					return maybeTransformation;
+				},
+			});
+		},
+
+		async getTransformationRunById(
+			id: string,
+		): Promise<Result<null | TransformationRun, DbServiceError>> {
+			const { data: transformationRun, error: getTransformationRunByIdError } =
+				await tryAsync({
+					mapErr: (error) =>
+						DbServiceErr({
+							cause: error,
+							context: { id },
+							message: 'Error getting transformation run by id from Dexie',
+						}),
+					try: () => db.transformationRuns.where('id').equals(id).first(),
+				});
+			if (getTransformationRunByIdError)
+				return Err(getTransformationRunByIdError);
+			return Ok(transformationRun ?? null);
+		},
+
+		async getTransformationRunsByRecordingId(
+			recordingId: string,
+		): Promise<Result<TransformationRun[], DbServiceError>> {
+			return tryAsync({
+				mapErr: (error) =>
+					DbServiceErr({
+						cause: error,
+						context: { recordingId },
+						message:
+							'Error getting transformation runs by recording id from Dexie',
+					}),
+				try: () =>
+					db.transformationRuns
+						.where('recordingId')
+						.equals(recordingId)
+						.toArray()
+						.then((runs) =>
+							runs.sort(
+								(a, b) =>
+									new Date(b.startedAt).getTime() -
+									new Date(a.startedAt).getTime(),
+							),
+						),
+			});
+		},
+
+		async getTransformationRunsByTransformationId(
+			transformationId: string,
+		): Promise<Result<TransformationRun[], DbServiceError>> {
+			return tryAsync({
+				mapErr: (error) =>
+					DbServiceErr({
+						cause: error,
+						context: { transformationId },
+						message:
+							'Error getting transformation runs by transformation id from Dexie',
+					}),
+				try: () =>
+					db.transformationRuns
+						.where('transformationId')
+						.equals(transformationId)
+						.reverse()
+						.toArray()
+						.then((runs) =>
+							runs.sort(
+								(a, b) =>
+									new Date(b.startedAt).getTime() -
+									new Date(a.startedAt).getTime(),
+							),
+						),
+			});
+		},
+
+		async updateRecording(
+			recording: Recording,
+		): Promise<Result<Recording, DbServiceError>> {
 			const now = new Date().toISOString();
+			const recordingWithTimestamp = {
+				...recording,
+				updatedAt: now,
+			} satisfies Recording;
 
-			// Create the completed transformation run
-			const completedRun: TransformationRunCompleted = {
-				...run,
-				status: 'completed',
-				completedAt: now,
-				output,
-			};
+			const dbRecording = await recordingToRecordingWithSerializedAudio(
+				recordingWithTimestamp,
+			);
 
-			const { error: updateTransformationStepRunError } = await tryAsync({
-				try: () => db.transformationRuns.put(completedRun),
+			const { error: updateRecordingError } = await tryAsync({
 				mapErr: (error) =>
 					DbServiceErr({
-						message: 'Error updating transformation run as completed in Dexie',
-						context: { run, output },
 						cause: error,
+						context: { recording },
+						message: 'Error updating recording in Dexie',
 					}),
+				try: async () => {
+					await db.recordings.put(dbRecording);
+				},
 			});
-			if (updateTransformationStepRunError)
-				return Err(updateTransformationStepRunError);
+			if (updateRecordingError) return Err(updateRecordingError);
+			return Ok(recordingWithTimestamp);
+		},
 
-			return Ok(completedRun);
+		async updateTransformation(
+			transformation: Transformation,
+		): Promise<Result<Transformation, DbServiceError>> {
+			const now = new Date().toISOString();
+			const transformationWithTimestamp = {
+				...transformation,
+				updatedAt: now,
+			} satisfies Transformation;
+			const { error: updateTransformationError } = await tryAsync({
+				mapErr: (error) =>
+					DbServiceErr({
+						cause: error,
+						context: { transformation },
+						message: 'Error updating transformation in Dexie',
+					}),
+				try: () => db.transformations.put(transformationWithTimestamp),
+			});
+			if (updateTransformationError) return Err(updateTransformationError);
+			return Ok(transformationWithTimestamp);
 		},
 	};
 }
-
-export type DbService = ReturnType<typeof createDbServiceDexie>;
diff --git a/apps/whispering/src/lib/services/db/models/index.ts b/apps/whispering/src/lib/services/db/models/index.ts
index 50e48cedc8..4035db1168 100644
--- a/apps/whispering/src/lib/services/db/models/index.ts
+++ b/apps/whispering/src/lib/services/db/models/index.ts
@@ -16,9 +16,9 @@ export {
 	TRANSFORMATION_STEP_TYPES_TO_LABELS,
 } from './transformations';
 export type {
+	InsertTransformationStep,
 	Transformation,
 	TransformationStep,
-	InsertTransformationStep,
 } from './transformations';
 
 // Transformation Runs
diff --git a/apps/whispering/src/lib/services/db/models/recordings.ts b/apps/whispering/src/lib/services/db/models/recordings.ts
index 842705e9c3..af1ba35217 100644
--- a/apps/whispering/src/lib/services/db/models/recordings.ts
+++ b/apps/whispering/src/lib/services/db/models/recordings.ts
@@ -1,12 +1,11 @@
 export type Recording = {
+	blob: Blob | undefined;
+	createdAt: string;
 	id: string;
-	title: string;
 	subtitle: string;
 	timestamp: string;
-	createdAt: string;
-	updatedAt: string;
+	title: string;
 	transcribedText: string;
-	blob: Blob | undefined;
 	/**
 	 * A recording
 	 * 1. Begins in an 'UNPROCESSED' state
@@ -14,36 +13,18 @@ export type Recording = {
 	 * 3. Finally is marked as 'DONE' when the transcription is complete.
 	 * 4. If the transcription fails, it is marked as 'FAILED'
 	 */
-	transcriptionStatus: 'UNPROCESSED' | 'TRANSCRIBING' | 'DONE' | 'FAILED';
-};
-
-export type RecordingsDbSchemaV5 = {
-	recordings: Omit<Recording, 'blob'> & {
-		serializedAudio: { arrayBuffer: ArrayBuffer; blobType: string } | undefined;
-	};
-};
-
-export type RecordingsDbSchemaV4 = {
-	recordings: Recording;
-};
-
-export type RecordingsDbSchemaV3 = {
-	recordings: RecordingsDbSchemaV1['recordings'];
-};
-
-export type RecordingsDbSchemaV2 = {
-	recordingMetadata: Omit<RecordingsDbSchemaV1['recordings'], 'blob'>;
-	recordingBlobs: { id: string; blob: Blob | undefined };
+	transcriptionStatus: 'DONE' | 'FAILED' | 'TRANSCRIBING' | 'UNPROCESSED';
+	updatedAt: string;
 };
 
 export type RecordingsDbSchemaV1 = {
 	recordings: {
+		blob: Blob | undefined;
 		id: string;
-		title: string;
 		subtitle: string;
 		timestamp: string;
+		title: string;
 		transcribedText: string;
-		blob: Blob | undefined;
 		/**
 		 * A recording
 		 * 1. Begins in an 'UNPROCESSED' state
@@ -51,6 +32,25 @@ export type RecordingsDbSchemaV1 = {
 		 * 3. Finally is marked as 'DONE' when the transcription is complete.
 		 * 4. If the transcription fails, it is marked as 'FAILED'
 		 */
-		transcriptionStatus: 'UNPROCESSED' | 'TRANSCRIBING' | 'DONE' | 'FAILED';
+		transcriptionStatus: 'DONE' | 'FAILED' | 'TRANSCRIBING' | 'UNPROCESSED';
+	};
+};
+
+export type RecordingsDbSchemaV2 = {
+	recordingBlobs: { blob: Blob | undefined; id: string; };
+	recordingMetadata: Omit<RecordingsDbSchemaV1['recordings'], 'blob'>;
+};
+
+export type RecordingsDbSchemaV3 = {
+	recordings: RecordingsDbSchemaV1['recordings'];
+};
+
+export type RecordingsDbSchemaV4 = {
+	recordings: Recording;
+};
+
+export type RecordingsDbSchemaV5 = {
+	recordings: Omit<Recording, 'blob'> & {
+		serializedAudio: undefined | { arrayBuffer: ArrayBuffer; blobType: string };
 	};
 };
diff --git a/apps/whispering/src/lib/services/db/models/transformation-runs.ts b/apps/whispering/src/lib/services/db/models/transformation-runs.ts
index 3782a7bccf..84f9a29fac 100644
--- a/apps/whispering/src/lib/services/db/models/transformation-runs.ts
+++ b/apps/whispering/src/lib/services/db/models/transformation-runs.ts
@@ -1,32 +1,44 @@
 /**
- * Base properties shared by all transformation step run variants.
+ * Represents an execution of a transformation, which can be run on either
+ * a recording's transcribed text or arbitrary input text.
  */
-type BaseTransformationStepRun = {
-	id: string;
-	stepId: string;
-	startedAt: string;
-	completedAt: string | null;
-	input: string;
+export type TransformationRun =
+	| TransformationRunCompleted
+	| TransformationRunFailed
+	| TransformationRunRunning;
+
+export type TransformationRunCompleted = BaseTransformationRun & {
+	output: string;
+	status: 'completed';
 };
 
-export type TransformationStepRunRunning = BaseTransformationStepRun & {
+export type TransformationRunFailed = BaseTransformationRun & {
+	error: string;
+	status: 'failed';
+};
+
+export type TransformationRunRunning = BaseTransformationRun & {
 	status: 'running';
 };
 
+export type TransformationStepRun =
+	| TransformationStepRunCompleted
+	| TransformationStepRunFailed
+	| TransformationStepRunRunning;
+
 export type TransformationStepRunCompleted = BaseTransformationStepRun & {
-	status: 'completed';
 	output: string;
+	status: 'completed';
 };
 
 export type TransformationStepRunFailed = BaseTransformationStepRun & {
-	status: 'failed';
 	error: string;
+	status: 'failed';
 };
 
-export type TransformationStepRun =
-	| TransformationStepRunRunning
-	| TransformationStepRunCompleted
-	| TransformationStepRunFailed;
+export type TransformationStepRunRunning = BaseTransformationStepRun & {
+	status: 'running';
+};
 
 /**
  * Base properties shared by all transformation run variants.
@@ -37,45 +49,33 @@ export type TransformationStepRun =
  * 3. 'failed' - If any step fails or an error occurs
  */
 type BaseTransformationRun = {
+	completedAt: null | string;
 	id: string;
-	transformationId: string;
-	/**
-	 * Recording id if the transformation is invoked on a recording.
-	 * Null if the transformation is invoked on arbitrary text input.
-	 */
-	recordingId: string | null;
-	startedAt: string;
-	completedAt: string | null;
 	/**
 	 * Because the recording's transcribedText can change after invoking,
 	 * we store a snapshot of the transcribedText at the time of invoking.
 	 */
 	input: string;
+	/**
+	 * Recording id if the transformation is invoked on a recording.
+	 * Null if the transformation is invoked on arbitrary text input.
+	 */
+	recordingId: null | string;
+	startedAt: string;
 	stepRuns: TransformationStepRun[];
-};
-
-export type TransformationRunRunning = BaseTransformationRun & {
-	status: 'running';
-};
-
-export type TransformationRunCompleted = BaseTransformationRun & {
-	status: 'completed';
-	output: string;
-};
-
-export type TransformationRunFailed = BaseTransformationRun & {
-	status: 'failed';
-	error: string;
+	transformationId: string;
 };
 
 /**
- * Represents an execution of a transformation, which can be run on either
- * a recording's transcribed text or arbitrary input text.
+ * Base properties shared by all transformation step run variants.
  */
-export type TransformationRun =
-	| TransformationRunRunning
-	| TransformationRunCompleted
-	| TransformationRunFailed;
+type BaseTransformationStepRun = {
+	completedAt: null | string;
+	id: string;
+	input: string;
+	startedAt: string;
+	stepId: string;
+};
 
 // Type guards for TransformationRun
 export function isTransformationRunCompleted(
diff --git a/apps/whispering/src/lib/services/db/models/transformations.ts b/apps/whispering/src/lib/services/db/models/transformations.ts
index c8438a5d19..8cffe11d2e 100644
--- a/apps/whispering/src/lib/services/db/models/transformations.ts
+++ b/apps/whispering/src/lib/services/db/models/transformations.ts
@@ -5,6 +5,7 @@ import type {
 	INFERENCE_PROVIDERS,
 	OPENAI_INFERENCE_MODELS,
 } from '$lib/constants/inference';
+
 import { nanoid } from 'nanoid/non-secure';
 
 export const TRANSFORMATION_STEP_TYPES = [
@@ -13,74 +14,74 @@ export const TRANSFORMATION_STEP_TYPES = [
 ] as const;
 
 export const TRANSFORMATION_STEP_TYPES_TO_LABELS = {
-	prompt_transform: 'Prompt Transform',
 	find_replace: 'Find Replace',
+	prompt_transform: 'Prompt Transform',
 } as const satisfies Record<(typeof TRANSFORMATION_STEP_TYPES)[number], string>;
 
+export type InsertTransformationStep = Omit<
+	TransformationStep,
+	'createdAt' | 'updatedAt'
+>;
+
 export type Transformation = {
-	id: string;
-	title: string;
-	description: string;
 	createdAt: string;
-	updatedAt: string;
+	description: string;
+	id: string;
 	/**
 	 * It can be one of several types of text transformations:
 	 * - find_replace: Replace text patterns with new text
 	 * - prompt_transform: Use AI to transform text based on prompts
 	 */
 	steps: {
-		id: string;
-		// For now, steps don't need titles or descriptions. They can be computed from the type as "Find and Replace" or "Prompt Transform"
-		type: (typeof TRANSFORMATION_STEP_TYPES)[number];
+		'find_replace.findText': string;
+		'find_replace.replaceText': string;
 
+		'find_replace.useRegex': boolean;
+		id: string;
 		'prompt_transform.inference.provider': (typeof INFERENCE_PROVIDERS)[number];
-		'prompt_transform.inference.provider.OpenAI.model': (typeof OPENAI_INFERENCE_MODELS)[number];
-		'prompt_transform.inference.provider.Groq.model': (typeof GROQ_INFERENCE_MODELS)[number];
 		'prompt_transform.inference.provider.Anthropic.model': (typeof ANTHROPIC_INFERENCE_MODELS)[number];
 		'prompt_transform.inference.provider.Google.model': (typeof GOOGLE_INFERENCE_MODELS)[number];
 
+		'prompt_transform.inference.provider.Groq.model': (typeof GROQ_INFERENCE_MODELS)[number];
+		'prompt_transform.inference.provider.OpenAI.model': (typeof OPENAI_INFERENCE_MODELS)[number];
+
 		'prompt_transform.systemPromptTemplate': string;
 		'prompt_transform.userPromptTemplate': string;
-
-		'find_replace.findText': string;
-		'find_replace.replaceText': string;
-		'find_replace.useRegex': boolean;
+		// For now, steps don't need titles or descriptions. They can be computed from the type as "Find and Replace" or "Prompt Transform"
+		type: (typeof TRANSFORMATION_STEP_TYPES)[number];
 	}[];
+	title: string;
+	updatedAt: string;
 };
-
 export type TransformationStep = Transformation['steps'][number];
-export type InsertTransformationStep = Omit<
-	TransformationStep,
-	'createdAt' | 'updatedAt'
->;
 
 export function generateDefaultTransformation(): Transformation {
 	const now = new Date().toISOString();
 	return {
-		id: nanoid(),
 		title: '',
 		description: '',
-		steps: [],
 		createdAt: now,
+		id: nanoid(),
+		steps: [],
 		updatedAt: now,
 	};
 }
 
 export function generateDefaultTransformationStep(): TransformationStep {
 	return {
+		'find_replace.findText': '',
+		'find_replace.replaceText': '',
+		'find_replace.useRegex': false,
 		id: nanoid(),
-		type: 'prompt_transform',
 		'prompt_transform.inference.provider': 'Google',
-		'prompt_transform.inference.provider.OpenAI.model': 'gpt-4o',
-		'prompt_transform.inference.provider.Groq.model': 'llama-3.3-70b-versatile',
 		'prompt_transform.inference.provider.Anthropic.model': 'claude-sonnet-4-0',
 		'prompt_transform.inference.provider.Google.model': 'gemini-2.5-flash',
 
+		'prompt_transform.inference.provider.Groq.model': 'llama-3.3-70b-versatile',
+		'prompt_transform.inference.provider.OpenAI.model': 'gpt-4o',
+
 		'prompt_transform.systemPromptTemplate': '',
 		'prompt_transform.userPromptTemplate': '',
-
-		'find_replace.findText': '',
-		'find_replace.replaceText': '',
-		'find_replace.useRegex': false,
+		type: 'prompt_transform',
 	};
 }
diff --git a/apps/whispering/src/lib/services/device-stream.ts b/apps/whispering/src/lib/services/device-stream.ts
index 36a7e3b3f7..0b0eedfdc1 100644
--- a/apps/whispering/src/lib/services/device-stream.ts
+++ b/apps/whispering/src/lib/services/device-stream.ts
@@ -1,46 +1,25 @@
 import { WHISPER_RECOMMENDED_MEDIA_TRACK_CONSTRAINTS } from '$lib/constants/audio';
 import { createTaggedError } from 'wellcrafted/error';
 import { Err, isOk, Ok, type Result, tryAsync } from 'wellcrafted/result';
+
 import type {
 	Device,
-	DeviceIdentifier,
 	DeviceAcquisitionOutcome,
+	DeviceIdentifier,
 	UpdateStatusMessageFn,
 } from './types';
+
 import { asDeviceIdentifier } from './types';
 
-const { DeviceStreamServiceError, DeviceStreamServiceErr } = createTaggedError(
+const { DeviceStreamServiceErr, DeviceStreamServiceError } = createTaggedError(
 	'DeviceStreamServiceError',
 );
 type DeviceStreamServiceError = ReturnType<typeof DeviceStreamServiceError>;
 
-/**
- * Check if we already have microphone permissions granted.
- * Uses Permissions API if available, otherwise returns false to trigger proper permission flow.
- */
-async function hasExistingAudioPermission(): Promise<boolean> {
-	// Try the Permissions API first (not all browsers support it)
-	if ('permissions' in navigator) {
-		const { data: permissionStatus, error } = await tryAsync({
-			try: async () => {
-				const permissionStatus = await navigator.permissions.query({
-					name: 'microphone',
-				});
-				return permissionStatus;
-			},
-			mapErr: (error) =>
-				DeviceStreamServiceErr({
-					message:
-						'We need permission to see your microphones. Check your browser settings and try again.',
-					cause: error,
-				}),
-		});
-		if (!error) return permissionStatus.state === 'granted';
+export function cleanupRecordingStream(stream: MediaStream) {
+	for (const track of stream.getTracks()) {
+		track.stop();
 	}
-
-	// Return false to let the actual getUserMedia call handle permissions
-	// This avoids unnecessary stream creation just for checking
-	return false;
 }
 
 export async function enumerateDevices(): Promise<
@@ -51,6 +30,12 @@ export async function enumerateDevices(): Promise<
 		// extension.openWhisperingTab({});
 	}
 	return tryAsync({
+		mapErr: (error) =>
+			DeviceStreamServiceErr({
+				cause: error,
+				message:
+					'We need permission to see your microphones. Check your browser settings and try again.',
+			}),
 		try: async () => {
 			const allAudioDevicesStream = await navigator.mediaDevices.getUserMedia({
 				audio: WHISPER_RECOMMENDED_MEDIA_TRACK_CONSTRAINTS,
@@ -68,49 +53,6 @@ export async function enumerateDevices(): Promise<
 				label: device.label,
 			}));
 		},
-		mapErr: (error) =>
-			DeviceStreamServiceErr({
-				message:
-					'We need permission to see your microphones. Check your browser settings and try again.',
-				cause: error,
-			}),
-	});
-}
-
-/**
- * Get a media stream for a specific device identifier
- * @param deviceIdentifier - The device identifier
- *   - On Web: This is the deviceId (unique identifier)
- *   - On Desktop: This is the device name
- */
-async function getStreamForDeviceIdentifier(
-	deviceIdentifier: DeviceIdentifier,
-) {
-	const hasPermission = await hasExistingAudioPermission();
-	if (!hasPermission) {
-		// extension.openWhisperingTab({});
-	}
-	return tryAsync({
-		try: async () => {
-			// On Web: deviceIdentifier IS the deviceId, use it directly
-			const stream = await navigator.mediaDevices.getUserMedia({
-				audio: {
-					...WHISPER_RECOMMENDED_MEDIA_TRACK_CONSTRAINTS,
-					deviceId: { exact: deviceIdentifier },
-				},
-			});
-			return stream;
-		},
-		mapErr: (error) =>
-			DeviceStreamServiceErr({
-				message:
-					'Unable to connect to the selected microphone. This could be because the device is already in use by another application, has been disconnected, or lacks proper permissions. Please check that your microphone is connected, not being used elsewhere, and that you have granted microphone permissions.',
-				context: {
-					deviceIdentifier,
-					hasPermission,
-				},
-				cause: error,
-			}),
 	});
 }
 
@@ -122,7 +64,7 @@ export async function getRecordingStream({
 	sendStatus: UpdateStatusMessageFn;
 }): Promise<
 	Result<
-		{ stream: MediaStream; deviceOutcome: DeviceAcquisitionOutcome },
+		{ deviceOutcome: DeviceAcquisitionOutcome; stream: MediaStream; },
 		DeviceStreamServiceError
 	>
 > {
@@ -146,8 +88,8 @@ export async function getRecordingStream({
 
 		if (!getPreferredStreamError) {
 			return Ok({
-				stream: preferredStream,
 				deviceOutcome: { outcome: 'success' },
+				stream: preferredStream,
 			});
 		}
 
@@ -162,7 +104,7 @@ export async function getRecordingStream({
 	// Try to get any available device as fallback
 	const getFirstAvailableStream = async (): Promise<
 		Result<
-			{ stream: MediaStream; deviceId: DeviceIdentifier },
+			{ deviceId: DeviceIdentifier; stream: MediaStream; },
 			DeviceStreamServiceError
 		>
 	> => {
@@ -170,9 +112,9 @@ export async function getRecordingStream({
 			await enumerateDevices();
 		if (enumerateDevicesError)
 			return DeviceStreamServiceErr({
+				cause: enumerateDevicesError,
 				message:
 					'Error enumerating recording devices and acquiring first available stream. Please make sure you have given permission to access your audio devices',
-				cause: enumerateDevicesError,
 			});
 
 		for (const device of devices) {
@@ -180,14 +122,14 @@ export async function getRecordingStream({
 				device.id,
 			);
 			if (!error) {
-				return Ok({ stream, deviceId: device.id });
+				return Ok({ deviceId: device.id, stream });
 			}
 		}
 
 		return DeviceStreamServiceErr({
-			message: 'Unable to connect to any available microphone',
-			context: { devices },
 			cause: undefined,
+			context: { devices },
+			message: 'Unable to connect to any available microphone',
 		});
 	};
 
@@ -199,35 +141,95 @@ export async function getRecordingStream({
 			? "We couldn't connect to any microphones. Make sure they're plugged in and try again!"
 			: "Hmm... We couldn't find any microphones to use. Check your connections and try again!";
 		return DeviceStreamServiceErr({
-			message: errorMessage,
-			context: { selectedDeviceId },
 			cause: getFallbackStreamError,
+			context: { selectedDeviceId },
+			message: errorMessage,
 		});
 	}
 
 	// Return the stream with appropriate device outcome
 	if (!selectedDeviceId) {
 		return Ok({
-			stream: fallbackStreamData.stream,
 			deviceOutcome: {
+				fallbackDeviceId: fallbackStreamData.deviceId,
 				outcome: 'fallback',
 				reason: 'no-device-selected',
-				fallbackDeviceId: fallbackStreamData.deviceId,
 			},
+			stream: fallbackStreamData.stream,
 		});
 	}
 	return Ok({
-		stream: fallbackStreamData.stream,
 		deviceOutcome: {
+			fallbackDeviceId: fallbackStreamData.deviceId,
 			outcome: 'fallback',
 			reason: 'preferred-device-unavailable',
-			fallbackDeviceId: fallbackStreamData.deviceId,
 		},
+		stream: fallbackStreamData.stream,
 	});
 }
 
-export function cleanupRecordingStream(stream: MediaStream) {
-	for (const track of stream.getTracks()) {
-		track.stop();
+/**
+ * Get a media stream for a specific device identifier
+ * @param deviceIdentifier - The device identifier
+ *   - On Web: This is the deviceId (unique identifier)
+ *   - On Desktop: This is the device name
+ */
+async function getStreamForDeviceIdentifier(
+	deviceIdentifier: DeviceIdentifier,
+) {
+	const hasPermission = await hasExistingAudioPermission();
+	if (!hasPermission) {
+		// extension.openWhisperingTab({});
+	}
+	return tryAsync({
+		mapErr: (error) =>
+			DeviceStreamServiceErr({
+				cause: error,
+				context: {
+					deviceIdentifier,
+					hasPermission,
+				},
+				message:
+					'Unable to connect to the selected microphone. This could be because the device is already in use by another application, has been disconnected, or lacks proper permissions. Please check that your microphone is connected, not being used elsewhere, and that you have granted microphone permissions.',
+			}),
+		try: async () => {
+			// On Web: deviceIdentifier IS the deviceId, use it directly
+			const stream = await navigator.mediaDevices.getUserMedia({
+				audio: {
+					...WHISPER_RECOMMENDED_MEDIA_TRACK_CONSTRAINTS,
+					deviceId: { exact: deviceIdentifier },
+				},
+			});
+			return stream;
+		},
+	});
+}
+
+/**
+ * Check if we already have microphone permissions granted.
+ * Uses Permissions API if available, otherwise returns false to trigger proper permission flow.
+ */
+async function hasExistingAudioPermission(): Promise<boolean> {
+	// Try the Permissions API first (not all browsers support it)
+	if ('permissions' in navigator) {
+		const { data: permissionStatus, error } = await tryAsync({
+			mapErr: (error) =>
+				DeviceStreamServiceErr({
+					cause: error,
+					message:
+						'We need permission to see your microphones. Check your browser settings and try again.',
+				}),
+			try: async () => {
+				const permissionStatus = await navigator.permissions.query({
+					name: 'microphone',
+				});
+				return permissionStatus;
+			},
+		});
+		if (!error) return permissionStatus.state === 'granted';
 	}
+
+	// Return false to let the actual getUserMedia call handle permissions
+	// This avoids unnecessary stream creation just for checking
+	return false;
 }
diff --git a/apps/whispering/src/lib/services/download/desktop.ts b/apps/whispering/src/lib/services/download/desktop.ts
index 515394c411..e5846c3d2e 100644
--- a/apps/whispering/src/lib/services/download/desktop.ts
+++ b/apps/whispering/src/lib/services/download/desktop.ts
@@ -2,48 +2,50 @@ import { getExtensionFromAudioBlob } from '$lib/services/_utils';
 import { save } from '@tauri-apps/plugin-dialog';
 import { writeFile } from '@tauri-apps/plugin-fs';
 import { Err, Ok, tryAsync } from 'wellcrafted/result';
+
 import type { DownloadService } from '.';
+
 import { DownloadServiceErr } from './types';
 
 export function createDownloadServiceDesktop(): DownloadService {
 	return {
-		downloadBlob: async ({ name, blob }) => {
+		downloadBlob: async ({ blob, name }) => {
 			const extension = getExtensionFromAudioBlob(blob);
 			const { data: path, error: saveError } = await tryAsync({
-				try: async () => {
-					const path = await save({
-						filters: [{ name, extensions: [extension] }],
-					});
-					return path;
-				},
 				mapErr: (error) =>
 					DownloadServiceErr({
+						cause: error,
+						context: { blob, name },
 						message:
 							'There was an error saving the recording using the Tauri Filesystem API. Please try again.',
-						context: { name, blob },
-						cause: error,
 					}),
+				try: async () => {
+					const path = await save({
+						filters: [{ extensions: [extension], name }],
+					});
+					return path;
+				},
 			});
 			if (saveError) return Err(saveError);
 			if (path === null) {
 				return DownloadServiceErr({
-					message: 'Please specify a path to save the recording.',
-					context: { name, blob },
 					cause: undefined,
+					context: { blob, name },
+					message: 'Please specify a path to save the recording.',
 				});
 			}
 			const { error: writeError } = await tryAsync({
-				try: async () => {
-					const contents = new Uint8Array(await blob.arrayBuffer());
-					await writeFile(path, contents);
-				},
 				mapErr: (error) =>
 					DownloadServiceErr({
+						cause: error,
+						context: { blob, name, path },
 						message:
 							'There was an error saving the recording using the Tauri Filesystem API. Please try again.',
-						context: { name, blob, path },
-						cause: error,
 					}),
+				try: async () => {
+					const contents = new Uint8Array(await blob.arrayBuffer());
+					await writeFile(path, contents);
+				},
 			});
 			if (writeError) return Err(writeError);
 			return Ok(undefined);
diff --git a/apps/whispering/src/lib/services/download/types.ts b/apps/whispering/src/lib/services/download/types.ts
index d28586ca0f..f4c44e3823 100644
--- a/apps/whispering/src/lib/services/download/types.ts
+++ b/apps/whispering/src/lib/services/download/types.ts
@@ -1,14 +1,15 @@
-import { createTaggedError } from 'wellcrafted/error';
 import type { Result } from 'wellcrafted/result';
 
-export const { DownloadServiceError, DownloadServiceErr } = createTaggedError(
+import { createTaggedError } from 'wellcrafted/error';
+
+export const { DownloadServiceErr, DownloadServiceError } = createTaggedError(
 	'DownloadServiceError',
 );
-type DownloadServiceError = ReturnType<typeof DownloadServiceError>;
-
 export type DownloadService = {
 	downloadBlob: (args: {
-		name: string;
 		blob: Blob;
+		name: string;
 	}) => Promise<Result<void, DownloadServiceError>>;
 };
+
+type DownloadServiceError = ReturnType<typeof DownloadServiceError>;
diff --git a/apps/whispering/src/lib/services/download/web.ts b/apps/whispering/src/lib/services/download/web.ts
index c722f68df8..53e62777b8 100644
--- a/apps/whispering/src/lib/services/download/web.ts
+++ b/apps/whispering/src/lib/services/download/web.ts
@@ -1,11 +1,20 @@
 import { tryAsync } from 'wellcrafted/result';
+
 import type { DownloadService } from '.';
+
 import { DownloadServiceErr } from './types';
 
 export function createDownloadServiceWeb(): DownloadService {
 	return {
-		downloadBlob: ({ name, blob }) =>
+		downloadBlob: ({ blob, name }) =>
 			tryAsync({
+				mapErr: (error) =>
+					DownloadServiceErr({
+						cause: error,
+						context: { blob, name },
+						message:
+							'There was an error saving the recording in your browser. Please try again.',
+					}),
 				try: async () => {
 					const file = new File([blob], name, { type: blob.type });
 					const url = URL.createObjectURL(file);
@@ -17,13 +26,6 @@ export function createDownloadServiceWeb(): DownloadService {
 					document.body.removeChild(a);
 					URL.revokeObjectURL(url);
 				},
-				mapErr: (error) =>
-					DownloadServiceErr({
-						message:
-							'There was an error saving the recording in your browser. Please try again.',
-						context: { name, blob },
-						cause: error,
-					}),
 			}),
 	};
 }
diff --git a/apps/whispering/src/lib/services/ffmpeg/desktop.ts b/apps/whispering/src/lib/services/ffmpeg/desktop.ts
index 6e76f656bf..8ba68b42d2 100644
--- a/apps/whispering/src/lib/services/ffmpeg/desktop.ts
+++ b/apps/whispering/src/lib/services/ffmpeg/desktop.ts
@@ -1,6 +1,7 @@
 import { IS_WINDOWS } from '$lib/constants/platform';
 import { extractErrorMessage } from 'wellcrafted/error';
 import { Err, Ok, tryAsync } from 'wellcrafted/result';
+
 import { type FfmpegService, FfmpegServiceErr } from './types';
 
 export function createFfmpegService(): FfmpegService {
@@ -8,6 +9,11 @@ export function createFfmpegService(): FfmpegService {
 		async checkInstalled() {
 			const { data: shellFfmpegProcess, error: shellFfmpegError } =
 				await tryAsync({
+					mapErr: (error) =>
+						FfmpegServiceErr({
+							cause: error,
+							message: `Unable to determine if FFmpeg is installed through shell. ${extractErrorMessage(error)}`,
+						}),
 					try: async () => {
 						const { Command } = await import('@tauri-apps/plugin-shell');
 						const output = await (IS_WINDOWS
@@ -16,11 +22,6 @@ export function createFfmpegService(): FfmpegService {
 						).execute();
 						return output;
 					},
-					mapErr: (error) =>
-						FfmpegServiceErr({
-							message: `Unable to determine if FFmpeg is installed through shell. ${extractErrorMessage(error)}`,
-							cause: error,
-						}),
 				});
 
 			if (shellFfmpegError) return Err(shellFfmpegError);
diff --git a/apps/whispering/src/lib/services/ffmpeg/types.ts b/apps/whispering/src/lib/services/ffmpeg/types.ts
index 5ac3e7b123..f439148ac1 100644
--- a/apps/whispering/src/lib/services/ffmpeg/types.ts
+++ b/apps/whispering/src/lib/services/ffmpeg/types.ts
@@ -1,10 +1,9 @@
-import { createTaggedError } from 'wellcrafted/error';
 import type { Result } from 'wellcrafted/result';
+
+import { createTaggedError } from 'wellcrafted/error';
 export const { FfmpegServiceErr, FfmpegServiceError } =
 	createTaggedError('FfmpegServiceError');
 
-type FfmpegServiceError = ReturnType<typeof FfmpegServiceError>;
-
 export type FfmpegService = {
 	/**
 	 * Checks if FFmpeg is installed on the system.
@@ -12,3 +11,5 @@ export type FfmpegService = {
 	 */
 	checkInstalled(): Promise<Result<boolean, FfmpegServiceError>>;
 };
+
+type FfmpegServiceError = ReturnType<typeof FfmpegServiceError>;
diff --git a/apps/whispering/src/lib/services/ffmpeg/web.ts b/apps/whispering/src/lib/services/ffmpeg/web.ts
index 1ce88cb28b..92dd0e60e3 100644
--- a/apps/whispering/src/lib/services/ffmpeg/web.ts
+++ b/apps/whispering/src/lib/services/ffmpeg/web.ts
@@ -1,5 +1,7 @@
-import { Ok, type Result } from 'wellcrafted/result';
 import type { WhisperingError } from '$lib/result';
+
+import { Ok, type Result } from 'wellcrafted/result';
+
 import type { FfmpegService } from './types';
 
 export function createFfmpegServiceWeb(): FfmpegService {
diff --git a/apps/whispering/src/lib/services/global-shortcut-manager.ts b/apps/whispering/src/lib/services/global-shortcut-manager.ts
index 63bbd5bd0a..5632f1ee14 100644
--- a/apps/whispering/src/lib/services/global-shortcut-manager.ts
+++ b/apps/whispering/src/lib/services/global-shortcut-manager.ts
@@ -1,3 +1,5 @@
+import type { Brand } from 'wellcrafted/brand';
+
 import {
 	ACCELERATOR_KEY_CODES,
 	ACCELERATOR_MODIFIER_KEYS,
@@ -12,19 +14,17 @@ import {
 	unregisterAll as tauriUnregisterAll,
 } from '@tauri-apps/plugin-global-shortcut';
 import * as os from '@tauri-apps/plugin-os';
-import type { Brand } from 'wellcrafted/brand';
 import { createTaggedError, extractErrorMessage } from 'wellcrafted/error';
 import { Err, Ok, type Result, tryAsync } from 'wellcrafted/result';
+
 import type { ShortcutTriggerState } from './_shortcut-trigger-state';
 
-const { InvalidAcceleratorError, InvalidAcceleratorErr } = createTaggedError(
+const { InvalidAcceleratorErr, InvalidAcceleratorError } = createTaggedError(
 	'InvalidAcceleratorError',
 );
 type InvalidAcceleratorError = ReturnType<typeof InvalidAcceleratorError>;
-const { GlobalShortcutServiceError, GlobalShortcutServiceErr } =
+const { GlobalShortcutServiceErr, GlobalShortcutServiceError } =
 	createTaggedError('GlobalShortcutServiceError');
-type GlobalShortcutServiceError = ReturnType<typeof GlobalShortcutServiceError>;
-
 /**
  * A type that represents a global shortcut accelerator.
  *
@@ -35,7 +35,9 @@ type GlobalShortcutServiceError = ReturnType<typeof GlobalShortcutServiceError>;
  *
  * @see https://www.electronjs.org/docs/latest/api/accelerator
  */
-export type Accelerator = string & Brand<'Accelerator'>;
+export type Accelerator = Brand<'Accelerator'> & string;
+
+type GlobalShortcutServiceError = ReturnType<typeof GlobalShortcutServiceError>;
 
 export function createGlobalShortcutManager() {
 	return {
@@ -48,20 +50,26 @@ export function createGlobalShortcutManager() {
 			callback: () => void;
 			on: ShortcutTriggerState;
 		}): Promise<
-			Result<void, InvalidAcceleratorError | GlobalShortcutServiceError>
+			Result<void, GlobalShortcutServiceError | InvalidAcceleratorError>
 		> {
 			const { error: unregisterError } = await this.unregister(accelerator);
 			if (unregisterError) return Err(unregisterError);
 
 			if (!isValidElectronAccelerator(accelerator)) {
 				return InvalidAcceleratorErr({
-					message: `Invalid accelerator format: '${accelerator}'. Must follow Electron accelerator specification.`,
-					context: { accelerator },
 					cause: undefined,
+					context: { accelerator },
+					message: `Invalid accelerator format: '${accelerator}'. Must follow Electron accelerator specification.`,
 				});
 			}
 
 			const { error: registerError } = await tryAsync({
+				mapErr: (error) =>
+					GlobalShortcutServiceErr({
+						cause: error,
+						context: { accelerator, error },
+						message: `Failed to register global shortcut '${accelerator}': ${extractErrorMessage(error)}`,
+					}),
 				try: () =>
 					tauriRegister(accelerator, (event) => {
 						if (on === 'Both') {
@@ -77,12 +85,6 @@ export function createGlobalShortcutManager() {
 							return;
 						}
 					}),
-				mapErr: (error) =>
-					GlobalShortcutServiceErr({
-						message: `Failed to register global shortcut '${accelerator}': ${extractErrorMessage(error)}`,
-						context: { accelerator, error },
-						cause: error,
-					}),
 			});
 			/**
 			 * NOTE: We often get "RegisterEventHotKey failed for <key>" errors when
@@ -109,16 +111,16 @@ export function createGlobalShortcutManager() {
 			if (!isRegistered) return Ok(undefined);
 
 			const { error: unregisterError } = await tryAsync({
-				try: () => tauriUnregister(accelerator),
 				mapErr: (error) =>
 					GlobalShortcutServiceErr({
-						message: `Failed to unregister global shortcut '${accelerator}': ${extractErrorMessage(error)}`,
+						cause: error,
 						context: {
 							accelerator,
 							originalError: error,
 						},
-						cause: error,
+						message: `Failed to unregister global shortcut '${accelerator}': ${extractErrorMessage(error)}`,
 					}),
+				try: () => tauriUnregister(accelerator),
 			});
 			if (unregisterError) return Err(unregisterError);
 			return Ok(undefined);
@@ -131,13 +133,13 @@ export function createGlobalShortcutManager() {
 		 */
 		async unregisterAll(): Promise<Result<void, GlobalShortcutServiceError>> {
 			const { error: unregisterAllError } = await tryAsync({
-				try: () => tauriUnregisterAll(),
 				mapErr: (error) =>
 					GlobalShortcutServiceErr({
-						message: `Failed to unregister all global shortcuts: ${extractErrorMessage(error)}`,
-						context: { error },
 						cause: error,
+						context: { error },
+						message: `Failed to unregister all global shortcuts: ${extractErrorMessage(error)}`,
 					}),
+				try: () => tauriUnregisterAll(),
 			});
 			if (unregisterAllError) return Err(unregisterAllError);
 			return Ok(undefined);
@@ -199,16 +201,16 @@ export function pressedKeysToTauriAccelerator(
 	// Must have exactly one key code
 	if (keyCodes.length === 0) {
 		return InvalidAcceleratorErr({
-			message: 'No valid key code found in pressed keys',
-			context: { pressedKeys },
 			cause: undefined,
+			context: { pressedKeys },
+			message: 'No valid key code found in pressed keys',
 		});
 	}
 	if (keyCodes.length > 1) {
 		return InvalidAcceleratorErr({
-			message: 'Multiple key codes not allowed in accelerator',
-			context: { pressedKeys, keyCodes },
 			cause: undefined,
+			context: { keyCodes, pressedKeys },
+			message: 'Multiple key codes not allowed in accelerator',
 		});
 	}
 
@@ -223,84 +225,15 @@ export function pressedKeysToTauriAccelerator(
 	// Final validation
 	if (!isValidElectronAccelerator(accelerator)) {
 		return InvalidAcceleratorErr({
-			message: `Generated invalid accelerator: ${accelerator}`,
-			context: { pressedKeys, accelerator },
 			cause: undefined,
+			context: { accelerator, pressedKeys },
+			message: `Generated invalid accelerator: ${accelerator}`,
 		});
 	}
 
 	return Ok(accelerator);
 }
 
-/**
- * Converts a browser KeyboardEvent.key value (lowercase) to an Electron Accelerator modifier.
- *
- * This function handles platform-specific differences in how modifier keys are represented:
- * - Browser normalizes platform keys (e.g., Command key → "meta", Option key → "alt")
- * - Electron expects platform-specific modifiers (e.g., "Command" on macOS, "Super" on Windows/Linux)
- *
- * @param key - The lowercase key value from a KeyboardEvent (e.g., "control", "alt", "meta")
- * @returns The corresponding Electron Accelerator modifier, or null if the key is not a modifier
- *
- * @example
- * // On macOS
- * convertToModifier('meta') // Returns 'Command'
- * convertToModifier('alt')  // Returns 'Option'
- *
- * @example
- * // On Windows/Linux
- * convertToModifier('meta') // Returns 'Super'
- * convertToModifier('alt')  // Returns 'Alt'
- *
- * @example
- * // Cross-platform
- * convertToModifier('control') // Returns 'Control' on all platforms
- * convertToModifier('shift')   // Returns 'Shift' on all platforms
- * convertToModifier('space')   // Returns null (not a modifier)
- */
-function convertToModifier(
-	key: KeyboardEventSupportedKey,
-): AcceleratorModifier | null {
-	const platform = os.type();
-
-	switch (key) {
-		case 'control':
-			// Control key is consistent across all platforms
-			return 'Control';
-
-		case 'shift':
-			// Shift key is consistent across all platforms
-			return 'Shift';
-
-		case 'alt':
-			// Alt key is called "Option" on macOS in Electron accelerators
-			return platform === 'macos' ? 'Option' : 'Alt';
-
-		case 'meta':
-			// Meta key maps differently based on platform:
-			// - macOS: Command key (reported as "meta" by browser)
-			// - Windows/Linux: Windows/Super key (reported as "meta" by browser)
-			return platform === 'macos' ? 'Command' : 'Super';
-
-		case 'altgraph':
-			// AltGr is not available on macOS
-			return platform === 'macos' ? null : 'AltGr';
-
-		// These keys might be reported by browsers but aren't standard Electron modifiers
-		case 'super':
-			// "super" as a key value (different from Meta) maps to Super modifier
-			return 'Super';
-
-		case 'fn':
-			// These are not supported as Electron accelerator modifiers
-			return null;
-
-		default:
-			// Any other key is not a modifier
-			return null;
-	}
-}
-
 /**
  * Convert a key to an Electron key code (returns null if invalid)
  */
@@ -324,41 +257,41 @@ function convertToKeyCode(
 
 	// Special key mappings
 	const keyMappings: Record<string, AcceleratorKeyCode> = {
-		// Arrow keys
-		arrowup: 'Up',
+		// Whitespace
+		' ': 'Space',
 		arrowdown: 'Down',
 		arrowleft: 'Left',
 		arrowright: 'Right',
 
-		// Whitespace
-		' ': 'Space',
-		enter: 'Enter',
-		tab: 'Tab',
+		// Arrow keys
+		arrowup: 'Up',
+		backspace: 'Backspace',
+		// Lock keys (when used as regular keys, not modifiers)
+		capslock: 'Capslock',
 
+		delete: 'Delete',
+		end: 'End',
+		enter: 'Enter',
 		// Special keys
 		escape: 'Escape',
-		backspace: 'Backspace',
-		delete: 'Delete',
-		insert: 'Insert',
 		home: 'Home',
-		end: 'End',
-		pageup: 'PageUp',
-		pagedown: 'PageDown',
-		printscreen: 'PrintScreen',
-
-		// Media keys
-		volumeup: 'VolumeUp',
-		volumedown: 'VolumeDown',
-		volumemute: 'VolumeMute',
+		insert: 'Insert',
 		mediaplaypause: 'MediaPlayPause',
 		mediastop: 'MediaStop',
 		mediatracknext: 'MediaNextTrack',
-		mediatrackprevious: 'MediaPreviousTrack',
 
-		// Lock keys (when used as regular keys, not modifiers)
-		capslock: 'Capslock',
+		mediatrackprevious: 'MediaPreviousTrack',
 		numlock: 'Numlock',
+		pagedown: 'PageDown',
+		pageup: 'PageUp',
+		printscreen: 'PrintScreen',
 		scrolllock: 'Scrolllock',
+		tab: 'Tab',
+
+		volumedown: 'VolumeDown',
+		volumemute: 'VolumeMute',
+		// Media keys
+		volumeup: 'VolumeUp',
 	};
 
 	if (keyMappings[key]) {
@@ -409,6 +342,75 @@ function convertToKeyCode(
 	return null;
 }
 
+/**
+ * Converts a browser KeyboardEvent.key value (lowercase) to an Electron Accelerator modifier.
+ *
+ * This function handles platform-specific differences in how modifier keys are represented:
+ * - Browser normalizes platform keys (e.g., Command key → "meta", Option key → "alt")
+ * - Electron expects platform-specific modifiers (e.g., "Command" on macOS, "Super" on Windows/Linux)
+ *
+ * @param key - The lowercase key value from a KeyboardEvent (e.g., "control", "alt", "meta")
+ * @returns The corresponding Electron Accelerator modifier, or null if the key is not a modifier
+ *
+ * @example
+ * // On macOS
+ * convertToModifier('meta') // Returns 'Command'
+ * convertToModifier('alt')  // Returns 'Option'
+ *
+ * @example
+ * // On Windows/Linux
+ * convertToModifier('meta') // Returns 'Super'
+ * convertToModifier('alt')  // Returns 'Alt'
+ *
+ * @example
+ * // Cross-platform
+ * convertToModifier('control') // Returns 'Control' on all platforms
+ * convertToModifier('shift')   // Returns 'Shift' on all platforms
+ * convertToModifier('space')   // Returns null (not a modifier)
+ */
+function convertToModifier(
+	key: KeyboardEventSupportedKey,
+): AcceleratorModifier | null {
+	const platform = os.type();
+
+	switch (key) {
+		case 'alt':
+			// Alt key is called "Option" on macOS in Electron accelerators
+			return platform === 'macos' ? 'Option' : 'Alt';
+
+		case 'altgraph':
+			// AltGr is not available on macOS
+			return platform === 'macos' ? null : 'AltGr';
+
+		case 'control':
+			// Control key is consistent across all platforms
+			return 'Control';
+
+		case 'fn':
+			// These are not supported as Electron accelerator modifiers
+			return null;
+
+		case 'meta':
+			// Meta key maps differently based on platform:
+			// - macOS: Command key (reported as "meta" by browser)
+			// - Windows/Linux: Windows/Super key (reported as "meta" by browser)
+			return platform === 'macos' ? 'Command' : 'Super';
+
+		case 'shift':
+			// Shift key is consistent across all platforms
+			return 'Shift';
+
+		// These keys might be reported by browsers but aren't standard Electron modifiers
+		case 'super':
+			// "super" as a key value (different from Meta) maps to Super modifier
+			return 'Super';
+
+		default:
+			// Any other key is not a modifier
+			return null;
+	}
+}
+
 /**
  * Sort modifiers in a standard order for consistency
  * Order: CommandOrControl/Ctrl, Alt, Shift, Meta (if separate)
@@ -417,16 +419,16 @@ function sortModifiers(
 	modifiers: AcceleratorModifier[],
 ): AcceleratorModifier[] {
 	const order: Record<AcceleratorModifier, number> = {
-		Command: 1,
+		Alt: 2,
+		AltGr: 3,
 		Cmd: 1,
+		Command: 1,
 		Control: 1,
 		Ctrl: 1,
-		Alt: 2,
+		Meta: 5,
 		Option: 2,
-		AltGr: 3,
 		Shift: 4,
 		Super: 5,
-		Meta: 5,
 	};
 
 	return modifiers.sort((a, b) => {
diff --git a/apps/whispering/src/lib/services/http/desktop.ts b/apps/whispering/src/lib/services/http/desktop.ts
index e420a82563..d1c9305446 100644
--- a/apps/whispering/src/lib/services/http/desktop.ts
+++ b/apps/whispering/src/lib/services/http/desktop.ts
@@ -1,48 +1,50 @@
 import { fetch } from '@tauri-apps/plugin-http';
 import { extractErrorMessage } from 'wellcrafted/error';
 import { Err, tryAsync } from 'wellcrafted/result';
+
 import type { HttpService } from '.';
+
 import { ConnectionErr, ParseErr, ResponseErr } from './types';
 
 export function createHttpServiceDesktop(): HttpService {
 	return {
-		async post({ body, url, schema, headers }) {
+		async post({ body, headers, schema, url }) {
 			const { data: response, error: responseError } = await tryAsync({
+				mapErr: (error) =>
+					ConnectionErr({
+						cause: error,
+						context: { body, headers, url },
+						message: 'Failed to establish connection',
+					}),
 				try: () =>
 					fetch(url, {
-						method: 'POST',
 						body,
 						headers: headers,
-					}),
-				mapErr: (error) =>
-					ConnectionErr({
-						message: 'Failed to establish connection',
-						context: { url, body, headers },
-						cause: error,
+						method: 'POST',
 					}),
 			});
 			if (responseError) return Err(responseError);
 
 			if (!response.ok) {
 				return ResponseErr({
-					status: response.status,
-					message: extractErrorMessage(await response.json()),
-					context: { url, body, headers },
 					cause: responseError,
+					context: { body, headers, url },
+					message: extractErrorMessage(await response.json()),
+					status: response.status,
 				});
 			}
 
 			const parseResult = await tryAsync({
-				try: async () => {
-					const json = await response.json();
-					return schema.parse(json);
-				},
 				mapErr: (error) =>
 					ParseErr({
-						message: 'Failed to parse response',
-						context: { url, body, headers },
 						cause: error,
+						context: { body, headers, url },
+						message: 'Failed to parse response',
 					}),
+				try: async () => {
+					const json = await response.json();
+					return schema.parse(json);
+				},
 			});
 			return parseResult;
 		},
diff --git a/apps/whispering/src/lib/services/http/index.ts b/apps/whispering/src/lib/services/http/index.ts
index a43d1f8322..cd136aa272 100644
--- a/apps/whispering/src/lib/services/http/index.ts
+++ b/apps/whispering/src/lib/services/http/index.ts
@@ -6,12 +6,12 @@ export type { HttpService, HttpServiceError } from './types';
 // Re-export both types and factory functions
 export type { ConnectionError, ParseError, ResponseError } from './types';
 export {
-	ConnectionError,
 	ConnectionErr,
-	ResponseError,
-	ResponseErr,
-	ParseError,
+	ConnectionError,
 	ParseErr,
+	ParseError,
+	ResponseErr,
+	ResponseError,
 } from './types';
 
 export const HttpServiceLive = window.__TAURI_INTERNALS__
diff --git a/apps/whispering/src/lib/services/http/types.ts b/apps/whispering/src/lib/services/http/types.ts
index a76e9008fb..113367f524 100644
--- a/apps/whispering/src/lib/services/http/types.ts
+++ b/apps/whispering/src/lib/services/http/types.ts
@@ -1,7 +1,8 @@
-import { createTaggedError } from 'wellcrafted/error';
 import type { Result } from 'wellcrafted/result';
 import type { z } from 'zod';
 
+import { createTaggedError } from 'wellcrafted/error';
+
 /**
  * Network-level connection failure that prevents the HTTP request from reaching the server.
  *
@@ -15,7 +16,7 @@ import type { z } from 'zod';
  * // Result: ConnectionError
  * ```
  */
-export const { ConnectionError, ConnectionErr } =
+export const { ConnectionErr, ConnectionError } =
 	createTaggedError('ConnectionError');
 type ConnectionError = ReturnType<typeof ConnectionError>;
 
@@ -32,7 +33,7 @@ type ConnectionError = ReturnType<typeof ConnectionError>;
  * // Result: ResponseError with status: 401, 404, 500, etc.
  * ```
  */
-const { ResponseError: ResponseErrorBase, ResponseErr: ResponseErrBase } =
+const { ResponseErr: ResponseErrBase, ResponseError: ResponseErrorBase } =
 	createTaggedError('ResponseError');
 export type ResponseError = ReturnType<typeof ResponseErrorBase> & {
 	/** HTTP status code (e.g., 400, 401, 404, 500) */
@@ -60,11 +61,7 @@ export const ResponseErr = (args: Omit<ResponseError, 'name'>) => ({
  * // Result: ParseError
  * ```
  */
-export const { ParseError, ParseErr } = createTaggedError('ParseError');
-export type ParseError = ReturnType<typeof ParseError>;
-
-export type HttpServiceError = ConnectionError | ResponseError | ParseError;
-
+export const { ParseErr, ParseError } = createTaggedError('ParseError');
 export type HttpService = {
 	/**
 	 * Makes a POST request with automatic JSON parsing and schema validation.
@@ -75,9 +72,13 @@ export type HttpService = {
 	 * 3. **Parse Phase:** Validates JSON structure and schema (ParseError)
 	 */
 	post: <TSchema extends z.ZodTypeAny>(config: {
-		url: string;
 		body: BodyInit | FormData;
-		schema: TSchema;
 		headers?: Record<string, string>;
+		schema: TSchema;
+		url: string;
 	}) => Promise<Result<z.infer<TSchema>, HttpServiceError>>;
 };
+
+export type HttpServiceError = ConnectionError | ParseError | ResponseError;
+
+export type ParseError = ReturnType<typeof ParseError>;
diff --git a/apps/whispering/src/lib/services/http/web.ts b/apps/whispering/src/lib/services/http/web.ts
index 93f12e469a..f97c4bd004 100644
--- a/apps/whispering/src/lib/services/http/web.ts
+++ b/apps/whispering/src/lib/services/http/web.ts
@@ -1,47 +1,49 @@
 import { extractErrorMessage } from 'wellcrafted/error';
 import { Err, tryAsync } from 'wellcrafted/result';
+
 import type { HttpService } from '.';
+
 import { ConnectionErr, ParseErr, ResponseErr } from './types';
 
 export function createHttpServiceWeb(): HttpService {
 	return {
-		async post({ body, url, schema, headers }) {
+		async post({ body, headers, schema, url }) {
 			const { data: response, error: responseError } = await tryAsync({
+				mapErr: (error) =>
+					ConnectionErr({
+						cause: error,
+						context: { body, headers, url },
+						message: 'Failed to establish connection',
+					}),
 				try: () =>
 					window.fetch(url, {
-						method: 'POST',
 						body,
 						headers,
-					}),
-				mapErr: (error) =>
-					ConnectionErr({
-						message: 'Failed to establish connection',
-						context: { url, body, headers },
-						cause: error,
+						method: 'POST',
 					}),
 			});
 			if (responseError) return Err(responseError);
 
 			if (!response.ok) {
 				return ResponseErr({
-					status: response.status,
-					message: extractErrorMessage(await response.json()),
-					context: { url, body, headers },
 					cause: responseError,
+					context: { body, headers, url },
+					message: extractErrorMessage(await response.json()),
+					status: response.status,
 				});
 			}
 
 			const parseResult = await tryAsync({
-				try: async () => {
-					const json = await response.json();
-					return schema.parse(json);
-				},
 				mapErr: (error) =>
 					ParseErr({
-						message: 'Failed to parse response',
-						context: { url, body, headers },
 						cause: error,
+						context: { body, headers, url },
+						message: 'Failed to parse response',
 					}),
+				try: async () => {
+					const json = await response.json();
+					return schema.parse(json);
+				},
 			});
 			return parseResult;
 		},
diff --git a/apps/whispering/src/lib/services/index.ts b/apps/whispering/src/lib/services/index.ts
index 128dbfbfaa..5365905a57 100644
--- a/apps/whispering/src/lib/services/index.ts
+++ b/apps/whispering/src/lib/services/index.ts
@@ -9,8 +9,8 @@ import { NotificationServiceLive } from './notifications';
 import { OsServiceLive } from './os';
 import { PermissionsServiceLive } from './permissions';
 import {
-	NativeRecorderServiceLive,
 	BrowserRecorderServiceLive,
+	NativeRecorderServiceLive,
 } from './recorder';
 import { PlaySoundServiceLive } from './sound';
 import { TextServiceLive } from './text';
@@ -24,21 +24,21 @@ import { VadServiceLive } from './vad-recorder';
  */
 export {
 	AnalyticsServiceLive as analytics,
-	TextServiceLive as text,
+	BrowserRecorderServiceLive as browserRecorder,
 	completions,
-	TrayIconServiceLive as tray,
 	DbServiceLive as db,
 	DownloadServiceLive as download,
 	FfmpegServiceLive as ffmpeg,
 	GlobalShortcutManagerLive as globalShortcutManager,
 	LocalShortcutManagerLive as localShortcutManager,
-	NotificationServiceLive as notification,
 	NativeRecorderServiceLive as nativeRecorder,
-	BrowserRecorderServiceLive as browserRecorder,
-	PermissionsServiceLive as permissions,
-	ToastServiceLive as toast,
+	NotificationServiceLive as notification,
 	OsServiceLive as os,
+	PermissionsServiceLive as permissions,
 	PlaySoundServiceLive as sound,
+	TextServiceLive as text,
+	ToastServiceLive as toast,
 	transcriptions,
+	TrayIconServiceLive as tray,
 	VadServiceLive as vad,
 };
diff --git a/apps/whispering/src/lib/services/local-shortcut-manager.ts b/apps/whispering/src/lib/services/local-shortcut-manager.ts
index 7a7f47a66a..66a28e90fc 100644
--- a/apps/whispering/src/lib/services/local-shortcut-manager.ts
+++ b/apps/whispering/src/lib/services/local-shortcut-manager.ts
@@ -1,14 +1,16 @@
+import type { Brand } from 'wellcrafted/brand';
+
 import {
+	isSupportedKey,
 	type KeyboardEventPossibleKey,
 	type KeyboardEventSupportedKey,
-	isSupportedKey,
 	normalizeOptionKeyCharacter,
 } from '$lib/constants/keyboard';
 import { IS_MACOS } from '$lib/constants/platform';
 import { on } from 'svelte/events';
-import type { Brand } from 'wellcrafted/brand';
 import { createTaggedError } from 'wellcrafted/error';
 import { Ok, type Result } from 'wellcrafted/result';
+
 import type { ShortcutTriggerState } from './_shortcut-trigger-state';
 
 /**
@@ -17,19 +19,45 @@ import type { ShortcutTriggerState } from './_shortcut-trigger-state';
  * local shortcut operations fail. Uses a tagged error pattern for type safety
  * and better error discrimination in Result types.
  */
-const { LocalShortcutServiceError, LocalShortcutServiceErr } =
+const { LocalShortcutServiceErr, LocalShortcutServiceError } =
 	createTaggedError('LocalShortcutServiceError');
+export type CommandId = Brand<'CommandId'> & string;
+
+/**
+ * Type representing the local shortcut manager instance.
+ * Provides methods to:
+ * - Listen for keyboard events and trigger registered shortcuts
+ * - Register new keyboard shortcuts with specific key combinations
+ * - Unregister individual shortcuts or all shortcuts at once
+ *
+ * The manager handles the complexity of tracking pressed keys, matching
+ * key combinations, and managing shortcut lifecycles.
+ *
+ * @see {@link createLocalShortcutManager} Factory function to create instances
+ */
+export type LocalShortcutManager = ReturnType<
+	typeof createLocalShortcutManager
+>;
+
 type LocalShortcutServiceError = ReturnType<typeof LocalShortcutServiceError>;
 
-export type CommandId = string & Brand<'CommandId'>;
+/**
+ * Join an array of keys into a shortcut string
+ * @example ["ctrl", "shift", "a"] → "ctrl+shift+a"
+ */
+export function arrayToShortcutString(
+	keys: KeyboardEventSupportedKey[],
+): string {
+	return keys.map((key) => key.toLowerCase()).join('+');
+}
 
 export function createLocalShortcutManager() {
 	const shortcuts = new Map<
 		CommandId,
 		{
-			on: ShortcutTriggerState;
-			keyCombination: KeyboardEventSupportedKey[];
 			callback: () => void;
+			keyCombination: KeyboardEventSupportedKey[];
+			on: ShortcutTriggerState;
 		}
 	>();
 
@@ -196,17 +224,17 @@ export function createLocalShortcutManager() {
 			};
 		},
 		async register({
+			callback,
 			id,
 			keyCombination,
-			callback,
 			on,
 		}: {
+			callback: () => void;
 			id: CommandId;
 			keyCombination: KeyboardEventSupportedKey[];
-			callback: () => void;
 			on: ShortcutTriggerState;
 		}): Promise<Result<void, LocalShortcutServiceError>> {
-			shortcuts.set(id, { keyCombination, callback, on });
+			shortcuts.set(id, { callback, keyCombination, on });
 			return Ok(undefined);
 		},
 
@@ -235,20 +263,16 @@ export function createLocalShortcutManager() {
 }
 
 /**
- * Type representing the local shortcut manager instance.
- * Provides methods to:
- * - Listen for keyboard events and trigger registered shortcuts
- * - Register new keyboard shortcuts with specific key combinations
- * - Unregister individual shortcuts or all shortcuts at once
- *
- * The manager handles the complexity of tracking pressed keys, matching
- * key combinations, and managing shortcut lifecycles.
- *
- * @see {@link createLocalShortcutManager} Factory function to create instances
+ * Convert a shortcut string to an array of keys
+ * @example "ctrl+shift+a" → ["ctrl", "shift", "a"]
  */
-export type LocalShortcutManager = ReturnType<
-	typeof createLocalShortcutManager
->;
+export function shortcutStringToArray(
+	shortcut: string,
+): KeyboardEventSupportedKey[] {
+	return shortcut
+		.split('+')
+		.map((key) => key.toLowerCase() as KeyboardEventSupportedKey);
+}
 
 /**
  * Checks if two arrays contain the same elements, regardless of order.
@@ -309,26 +333,4 @@ function isTypingInInput(): boolean {
 	return false;
 }
 
-/**
- * Convert a shortcut string to an array of keys
- * @example "ctrl+shift+a" → ["ctrl", "shift", "a"]
- */
-export function shortcutStringToArray(
-	shortcut: string,
-): KeyboardEventSupportedKey[] {
-	return shortcut
-		.split('+')
-		.map((key) => key.toLowerCase() as KeyboardEventSupportedKey);
-}
-
-/**
- * Join an array of keys into a shortcut string
- * @example ["ctrl", "shift", "a"] → "ctrl+shift+a"
- */
-export function arrayToShortcutString(
-	keys: KeyboardEventSupportedKey[],
-): string {
-	return keys.map((key) => key.toLowerCase()).join('+');
-}
-
 export const LocalShortcutManagerLive = createLocalShortcutManager();
diff --git a/apps/whispering/src/lib/services/notifications/desktop.ts b/apps/whispering/src/lib/services/notifications/desktop.ts
index 1615df6a64..5248f8b27f 100644
--- a/apps/whispering/src/lib/services/notifications/desktop.ts
+++ b/apps/whispering/src/lib/services/notifications/desktop.ts
@@ -7,11 +7,13 @@ import {
 } from '@tauri-apps/plugin-notification';
 import { nanoid } from 'nanoid/non-secure';
 import { Err, Ok, type Result, tryAsync } from 'wellcrafted/result';
+
 import type { NotificationService, UnifiedNotificationOptions } from './types';
+
 import {
-	type NotificationServiceError,
-	NotificationServiceErr,
 	hashNanoidToNumber,
+	NotificationServiceErr,
+	type NotificationServiceError,
 	toTauriNotification,
 } from './types';
 
@@ -21,13 +23,13 @@ export function createNotificationServiceDesktop(): NotificationService {
 	): Promise<Result<void, NotificationServiceError>> => {
 		const { data: activeNotifications, error: activeNotificationsError } =
 			await tryAsync({
-				try: async () => await active(),
 				mapErr: (error) =>
 					NotificationServiceErr({
-						message: 'Unable to retrieve active desktop notifications.',
-						context: { id },
 						cause: error,
+						context: { id },
+						message: 'Unable to retrieve active desktop notifications.',
 					}),
+				try: async () => await active(),
 			});
 		if (activeNotificationsError) return Err(activeNotificationsError);
 		const matchingActiveNotification = activeNotifications.find(
@@ -35,13 +37,13 @@ export function createNotificationServiceDesktop(): NotificationService {
 		);
 		if (matchingActiveNotification) {
 			const { error: removeActiveError } = await tryAsync({
-				try: async () => await removeActive([matchingActiveNotification]),
 				mapErr: (error) =>
 					NotificationServiceErr({
-						message: `Unable to remove notification with id ${id}.`,
-						context: { id, matchingActiveNotification },
 						cause: error,
+						context: { id, matchingActiveNotification },
+						message: `Unable to remove notification with id ${id}.`,
 					}),
+				try: async () => await removeActive([matchingActiveNotification]),
 			});
 			if (removeActiveError) return Err(removeActiveError);
 		}
@@ -49,6 +51,12 @@ export function createNotificationServiceDesktop(): NotificationService {
 	};
 
 	return {
+		clear: async (idStringified) => {
+			const removeNotificationResult = await removeNotificationById(
+				hashNanoidToNumber(idStringified),
+			);
+			return removeNotificationResult;
+		},
 		async notify(options: UnifiedNotificationOptions) {
 			const idStringified = options.id ?? nanoid();
 			const id = hashNanoidToNumber(idStringified);
@@ -56,6 +64,16 @@ export function createNotificationServiceDesktop(): NotificationService {
 			await removeNotificationById(id);
 
 			const { error: notifyError } = await tryAsync({
+				mapErr: (error) =>
+					NotificationServiceErr({
+						cause: error,
+						context: {
+							title: options.title,
+							description: options.description,
+							idStringified,
+						},
+						message: 'Could not send notification',
+					}),
 				try: async () => {
 					let permissionGranted = await isPermissionGranted();
 					if (!permissionGranted) {
@@ -70,25 +88,9 @@ export function createNotificationServiceDesktop(): NotificationService {
 						});
 					}
 				},
-				mapErr: (error) =>
-					NotificationServiceErr({
-						message: 'Could not send notification',
-						context: {
-							idStringified,
-							title: options.title,
-							description: options.description,
-						},
-						cause: error,
-					}),
 			});
 			if (notifyError) return Err(notifyError);
 			return Ok(idStringified);
 		},
-		clear: async (idStringified) => {
-			const removeNotificationResult = await removeNotificationById(
-				hashNanoidToNumber(idStringified),
-			);
-			return removeNotificationResult;
-		},
 	};
 }
diff --git a/apps/whispering/src/lib/services/notifications/types.ts b/apps/whispering/src/lib/services/notifications/types.ts
index 0d6c1d160f..af56dc4753 100644
--- a/apps/whispering/src/lib/services/notifications/types.ts
+++ b/apps/whispering/src/lib/services/notifications/types.ts
@@ -1,7 +1,8 @@
 import type { Options as TauriNotificationOptions } from '@tauri-apps/plugin-notification';
-import { createTaggedError } from 'wellcrafted/error';
 import type { Result } from 'wellcrafted/result';
 
+import { createTaggedError } from 'wellcrafted/error';
+
 /**
  * Platform-Specific Notification Transformations
  *
@@ -15,56 +16,28 @@ import type { Result } from 'wellcrafted/result';
  * - Extension (Future): Chrome extension API, full action support
  */
 
-export const { NotificationServiceError, NotificationServiceErr } =
+export const { NotificationServiceErr, NotificationServiceError } =
 	createTaggedError('NotificationServiceError');
+export type NotificationService = {
+	clear: (id: string) => Promise<Result<void, NotificationServiceError>>;
+	notify: (
+		options: UnifiedNotificationOptions,
+	) => Promise<Result<string, NotificationServiceError>>;
+};
+
 export type NotificationServiceError = ReturnType<
 	typeof NotificationServiceError
 >;
 
-/**
- * Link action for internal navigation
- * @note The href must be a local path within the app, not an external URL
- */
-type LinkAction = {
-	type: 'link';
-	label: string;
-	href: `/${string}`; // Must be a local path like '/settings' or '/recordings/123'
-};
-
-/**
- * Button action for custom callbacks
- */
-type ButtonAction = {
-	type: 'button';
-	label: string;
-	onClick: () => void | Promise<void>;
-};
-
-/**
- * More details action for showing additional information (e.g., error details)
- */
-type MoreDetailsAction = {
-	type: 'more-details';
-	error: unknown; // Can be Error object or any error data
-};
-
-type NotificationAction = LinkAction | ButtonAction | MoreDetailsAction;
-
 export type UnifiedNotificationOptions = {
 	/**
-	 * Unique identifier
-	 * @toast Maps to ExternalToast.id
-	 * @browser Maps to tag
-	 * @extension Used as notificationId
-	 * @tauri Maps to Options.id (as number)
-	 */
-	id?: string;
-
-	/**
-	 * Main notification title
-	 * @all Supported on all platforms
+	 * Interactive action
+	 * @toast Full support via ExternalToast.action (single action only)
+	 * @browser Maps to actions[0] (Service Worker only)
+	 * @extension Maps to buttons[0]
+	 * @tauri Not supported on desktop
 	 */
-	title: string;
+	action?: NotificationAction;
 
 	/**
 	 * Notification body text
@@ -84,6 +57,22 @@ export type UnifiedNotificationOptions = {
 	 */
 	icon?: string;
 
+	/**
+	 * Unique identifier
+	 * @toast Maps to ExternalToast.id
+	 * @browser Maps to tag
+	 * @extension Used as notificationId
+	 * @tauri Maps to Options.id (as number)
+	 */
+	id?: string;
+
+	/**
+	 * Keep toast visible indefinitely until manually dismissed
+	 * @toast Uses Infinity duration in Sonner
+	 * @note Only applies to toast notifications, not OS notifications
+	 */
+	persist?: boolean;
+
 	/**
 	 * Keep notification visible until dismissed
 	 * @toast Not applicable
@@ -103,57 +92,82 @@ export type UnifiedNotificationOptions = {
 	silent?: boolean;
 
 	/**
-	 * Interactive action
-	 * @toast Full support via ExternalToast.action (single action only)
-	 * @browser Maps to actions[0] (Service Worker only)
-	 * @extension Maps to buttons[0]
-	 * @tauri Not supported on desktop
+	 * Main notification title
+	 * @all Supported on all platforms
 	 */
-	action?: NotificationAction;
+	title: string;
 
 	/**
 	 * Toast-specific variant
 	 * @toast Maps to type via toast[variant]() methods
 	 * @others Ignored
 	 */
-	variant: 'success' | 'error' | 'warning' | 'info' | 'loading';
+	variant: 'error' | 'info' | 'loading' | 'success' | 'warning';
+};
 
-	/**
-	 * Keep toast visible indefinitely until manually dismissed
-	 * @toast Uses Infinity duration in Sonner
-	 * @note Only applies to toast notifications, not OS notifications
-	 */
-	persist?: boolean;
+/**
+ * Button action for custom callbacks
+ */
+type ButtonAction = {
+	label: string;
+	onClick: () => Promise<void> | void;
+	type: 'button';
 };
 
-export type NotificationService = {
-	notify: (
-		options: UnifiedNotificationOptions,
-	) => Promise<Result<string, NotificationServiceError>>;
-	clear: (id: string) => Promise<Result<void, NotificationServiceError>>;
+/**
+ * Chrome extension notification options type
+ * @future This type will be properly imported when extension support is added
+ */
+type ChromeNotificationOptions = {
+	buttons?: Array<{ title: string }>;
+	iconUrl: string;
+	message: string;
+	priority?: -2 | -1 | 0 | 1 | 2;
+	requireInteraction?: boolean;
+	title: string;
+	type: 'basic' | 'image' | 'list' | 'progress';
 };
 
 /**
- * Transform UnifiedNotificationOptions to Tauri notification options
+ * Link action for internal navigation
+ * @note The href must be a local path within the app, not an external URL
+ */
+type LinkAction = {
+	href: `/${string}`; // Must be a local path like '/settings' or '/recordings/123'
+	label: string;
+	type: 'link';
+};
+
+/**
+ * More details action for showing additional information (e.g., error details)
+ */
+type MoreDetailsAction = {
+	error: unknown; // Can be Error object or any error data
+	type: 'more-details';
+};
+
+type NotificationAction = ButtonAction | LinkAction | MoreDetailsAction;
+
+/**
+ * Converts a nanoid string to a numeric ID for Tauri notifications.
  *
- * Mappings:
- * - id: String → Number (via hash function)
- * - description → body
- * - requireInteraction → autoCancel (inverted)
- * - actions: Not supported on desktop
- * - variant: Ignored (only for toasts)
+ * This function takes a nanoid (alphanumeric random string like "V1StGXR8_Z5jdHi6B-myT")
+ * and converts it to a numeric hash. This is necessary because Tauri's notification
+ * API requires numeric IDs, while we use nanoid strings for consistency with web APIs.
+ *
+ * Note: This is NOT parsing a stringified number - it's hashing an alphanumeric string.
+ *
+ * @param str - A nanoid string (e.g., "V1StGXR8_Z5jdHi6B-myT")
+ * @returns A positive integer hash of the string
  */
-export function toTauriNotification(
-	options: UnifiedNotificationOptions,
-): TauriNotificationOptions {
-	return {
-		id: options.id ? hashNanoidToNumber(options.id) : undefined,
-		title: options.title,
-		body: options.description,
-		icon: options.icon,
-		silent: options.silent,
-		autoCancel: !options.requireInteraction,
-	};
+export function hashNanoidToNumber(str: string): number {
+	let hash = 0;
+	for (let i = 0; i < str.length; i++) {
+		const char = str.charCodeAt(i);
+		hash = (hash << 5) - hash + char;
+		hash = hash & hash;
+	}
+	return Math.abs(hash);
 }
 
 /**
@@ -172,9 +186,9 @@ export function toBrowserNotification(
 	return {
 		body: options.description,
 		icon: options.icon,
-		tag: options.id,
 		requireInteraction: options.requireInteraction,
 		silent: options.silent,
+		tag: options.id,
 	};
 }
 
@@ -194,51 +208,38 @@ export function toExtensionNotification(
 	options: UnifiedNotificationOptions,
 ): ChromeNotificationOptions {
 	return {
-		type: 'basic',
 		title: options.title,
 		message: options.description,
-		iconUrl: options.icon || '/icon-192.png',
-		requireInteraction: options.requireInteraction,
-		priority: options.silent ? -2 : 0,
 		buttons:
 			options.action && options.action.type !== 'more-details'
 				? [{ title: options.action.label }]
 				: undefined,
+		iconUrl: options.icon || '/icon-192.png',
+		priority: options.silent ? -2 : 0,
+		requireInteraction: options.requireInteraction,
+		type: 'basic',
 	};
 }
 
 /**
- * Chrome extension notification options type
- * @future This type will be properly imported when extension support is added
- */
-type ChromeNotificationOptions = {
-	type: 'basic' | 'image' | 'list' | 'progress';
-	title: string;
-	message: string;
-	iconUrl: string;
-	requireInteraction?: boolean;
-	priority?: -2 | -1 | 0 | 1 | 2;
-	buttons?: Array<{ title: string }>;
-};
-
-/**
- * Converts a nanoid string to a numeric ID for Tauri notifications.
- *
- * This function takes a nanoid (alphanumeric random string like "V1StGXR8_Z5jdHi6B-myT")
- * and converts it to a numeric hash. This is necessary because Tauri's notification
- * API requires numeric IDs, while we use nanoid strings for consistency with web APIs.
- *
- * Note: This is NOT parsing a stringified number - it's hashing an alphanumeric string.
+ * Transform UnifiedNotificationOptions to Tauri notification options
  *
- * @param str - A nanoid string (e.g., "V1StGXR8_Z5jdHi6B-myT")
- * @returns A positive integer hash of the string
+ * Mappings:
+ * - id: String → Number (via hash function)
+ * - description → body
+ * - requireInteraction → autoCancel (inverted)
+ * - actions: Not supported on desktop
+ * - variant: Ignored (only for toasts)
  */
-export function hashNanoidToNumber(str: string): number {
-	let hash = 0;
-	for (let i = 0; i < str.length; i++) {
-		const char = str.charCodeAt(i);
-		hash = (hash << 5) - hash + char;
-		hash = hash & hash;
-	}
-	return Math.abs(hash);
+export function toTauriNotification(
+	options: UnifiedNotificationOptions,
+): TauriNotificationOptions {
+	return {
+		title: options.title,
+		autoCancel: !options.requireInteraction,
+		body: options.description,
+		icon: options.icon,
+		id: options.id ? hashNanoidToNumber(options.id) : undefined,
+		silent: options.silent,
+	};
 }
diff --git a/apps/whispering/src/lib/services/notifications/web.ts b/apps/whispering/src/lib/services/notifications/web.ts
index 21253955de..adfd655831 100644
--- a/apps/whispering/src/lib/services/notifications/web.ts
+++ b/apps/whispering/src/lib/services/notifications/web.ts
@@ -1,6 +1,8 @@
 import { nanoid } from 'nanoid/non-secure';
 import { Err, Ok, tryAsync } from 'wellcrafted/result';
+
 import type { NotificationService, UnifiedNotificationOptions } from './types';
+
 import {
 	NotificationServiceErr,
 	toBrowserNotification,
@@ -25,6 +27,17 @@ export function createNotificationServiceWeb(): NotificationService {
 	};
 
 	return {
+		async clear(id: string) {
+			// Browser notifications don't have a direct clear API
+			// They auto-dismiss or require service worker control
+			// For future extension support:
+			// if (await detectExtension()) {
+			//   const { error } = await extension.clearNotification({ notificationId: id });
+			//   if (error) return Err(error);
+			// }
+			return Ok(undefined);
+		},
+
 		async notify(options: UnifiedNotificationOptions) {
 			const notificationId = options.id ?? nanoid();
 
@@ -50,6 +63,12 @@ export function createNotificationServiceWeb(): NotificationService {
 
 			// Browser notification fallback
 			const { error } = await tryAsync({
+				mapErr: (error) =>
+					NotificationServiceErr({
+						cause: error,
+						context: { title: options.title, notificationId },
+						message: 'Failed to send browser notification',
+					}),
 				try: async () => {
 					// Check if browser supports notifications
 					const isNotificationsSupported = 'Notification' in window;
@@ -80,27 +99,10 @@ export function createNotificationServiceWeb(): NotificationService {
 						};
 					}
 				},
-				mapErr: (error) =>
-					NotificationServiceErr({
-						message: 'Failed to send browser notification',
-						context: { notificationId, title: options.title },
-						cause: error,
-					}),
 			});
 
 			if (error) return Err(error);
 			return Ok(notificationId);
 		},
-
-		async clear(id: string) {
-			// Browser notifications don't have a direct clear API
-			// They auto-dismiss or require service worker control
-			// For future extension support:
-			// if (await detectExtension()) {
-			//   const { error } = await extension.clearNotification({ notificationId: id });
-			//   if (error) return Err(error);
-			// }
-			return Ok(undefined);
-		},
 	};
 }
diff --git a/apps/whispering/src/lib/services/os/desktop.ts b/apps/whispering/src/lib/services/os/desktop.ts
index 13ceccc77f..8471164629 100644
--- a/apps/whispering/src/lib/services/os/desktop.ts
+++ b/apps/whispering/src/lib/services/os/desktop.ts
@@ -1,4 +1,5 @@
 import * as os from '@tauri-apps/plugin-os';
+
 import type { OsService } from '.';
 
 export function createOsServiceDesktop(): OsService {
diff --git a/apps/whispering/src/lib/services/os/types.ts b/apps/whispering/src/lib/services/os/types.ts
index 7f29250917..bc431893d2 100644
--- a/apps/whispering/src/lib/services/os/types.ts
+++ b/apps/whispering/src/lib/services/os/types.ts
@@ -1,7 +1,8 @@
 import type { OsType } from '@tauri-apps/plugin-os';
+
 import { createTaggedError } from 'wellcrafted/error';
 
-export const { OsServiceError, OsServiceErr } =
+export const { OsServiceErr, OsServiceError } =
 	createTaggedError('OsServiceError');
 
 export type OsService = {
diff --git a/apps/whispering/src/lib/services/os/web.ts b/apps/whispering/src/lib/services/os/web.ts
index 037b20bc5f..4fa41e7384 100644
--- a/apps/whispering/src/lib/services/os/web.ts
+++ b/apps/whispering/src/lib/services/os/web.ts
@@ -1,15 +1,17 @@
 import type { OsType } from '@tauri-apps/plugin-os';
+
 import { type } from 'arktype';
+
 import type { OsService } from '.';
 
 const UserAgentData = type({ platform: 'string' });
-type UserAgentData = typeof UserAgentData.infer;
-
 // Type for navigator with userAgentData support
 type NavigatorWithUAData = Navigator & {
 	userAgentData: UserAgentData;
 };
 
+type UserAgentData = typeof UserAgentData.infer;
+
 export function createOsServiceWeb(): OsService {
 	return {
 		type(): OsType {
@@ -25,34 +27,22 @@ export function createOsServiceWeb(): OsService {
 	};
 }
 
-/**
- * Type guard to check if navigator supports User-Agent Client Hints
- */
-function hasUserAgentData(
-	navigator: Navigator,
-): navigator is NavigatorWithUAData {
-	return (
-		'userAgentData' in navigator &&
-		UserAgentData.allows(navigator.userAgentData)
-	);
-}
-
 /**
  * Attempts to detect platform using modern User-Agent Client Hints API
  * @returns OsType if detected, null otherwise
  */
 function getPlatformFromClientHints(
 	navigator: NavigatorWithUAData,
-): OsType | null {
+): null | OsType {
 	const platform = navigator.userAgentData.platform.toLowerCase();
 
 	// Direct mapping from client hints to OsType
 	const platformMap: Record<string, OsType> = {
-		windows: 'windows',
-		macos: 'macos',
-		linux: 'linux',
 		android: 'android',
 		ios: 'ios',
+		linux: 'linux',
+		macos: 'macos',
+		windows: 'windows',
 	};
 
 	return platformMap[platform] ?? null;
@@ -93,3 +83,15 @@ function getPlatformFromUserAgent(navigator: Navigator): OsType {
 	// Linux detection (default for Unix-like systems)
 	return 'linux';
 }
+
+/**
+ * Type guard to check if navigator supports User-Agent Client Hints
+ */
+function hasUserAgentData(
+	navigator: Navigator,
+): navigator is NavigatorWithUAData {
+	return (
+		'userAgentData' in navigator &&
+		UserAgentData.allows(navigator.userAgentData)
+	);
+}
diff --git a/apps/whispering/src/lib/services/permissions/index.ts b/apps/whispering/src/lib/services/permissions/index.ts
index ee156d95d4..bd913c171d 100644
--- a/apps/whispering/src/lib/services/permissions/index.ts
+++ b/apps/whispering/src/lib/services/permissions/index.ts
@@ -1,14 +1,11 @@
+import type { Result } from 'wellcrafted/result';
+
 import { IS_MACOS } from '$lib/constants/platform';
 import { createTaggedError, extractErrorMessage } from 'wellcrafted/error';
-import type { Result } from 'wellcrafted/result';
 import { Ok, tryAsync } from 'wellcrafted/result';
 
-export const { PermissionsServiceError, PermissionsServiceErr } =
+export const { PermissionsServiceErr, PermissionsServiceError } =
 	createTaggedError('PermissionsServiceError');
-export type PermissionsServiceError = ReturnType<
-	typeof PermissionsServiceError
->;
-
 export type PermissionsService = {
 	accessibility: {
 		check: () => Promise<Result<boolean, PermissionsServiceError>>;
@@ -20,6 +17,10 @@ export type PermissionsService = {
 	};
 };
 
+export type PermissionsServiceError = ReturnType<
+	typeof PermissionsServiceError
+>;
+
 function createPermissionsService(): PermissionsService {
 	return {
 		accessibility: {
@@ -27,17 +28,17 @@ function createPermissionsService(): PermissionsService {
 				if (!IS_MACOS) return Ok(true);
 
 				return tryAsync({
+					mapErr: (error) =>
+						PermissionsServiceErr({
+							cause: error,
+							message: `Failed to check accessibility permissions: ${extractErrorMessage(error)}`,
+						}),
 					try: async () => {
 						const { checkAccessibilityPermission } = await import(
 							'tauri-plugin-macos-permissions-api'
 						);
 						return await checkAccessibilityPermission();
 					},
-					mapErr: (error) =>
-						PermissionsServiceErr({
-							message: `Failed to check accessibility permissions: ${extractErrorMessage(error)}`,
-							cause: error,
-						}),
 				});
 			},
 
@@ -45,17 +46,17 @@ function createPermissionsService(): PermissionsService {
 				if (!IS_MACOS) return Ok(true);
 
 				return tryAsync({
+					mapErr: (error) =>
+						PermissionsServiceErr({
+							cause: error,
+							message: `Failed to request accessibility permissions: ${extractErrorMessage(error)}`,
+						}),
 					try: async () => {
 						const { requestAccessibilityPermission } = await import(
 							'tauri-plugin-macos-permissions-api'
 						);
 						return await requestAccessibilityPermission();
 					},
-					mapErr: (error) =>
-						PermissionsServiceErr({
-							message: `Failed to request accessibility permissions: ${extractErrorMessage(error)}`,
-							cause: error,
-						}),
 				});
 			},
 		},
@@ -65,17 +66,17 @@ function createPermissionsService(): PermissionsService {
 				if (!IS_MACOS) return Ok(true);
 
 				return tryAsync({
+					mapErr: (error) =>
+						PermissionsServiceErr({
+							cause: error,
+							message: `Failed to check microphone permissions: ${extractErrorMessage(error)}`,
+						}),
 					try: async () => {
 						const { checkMicrophonePermission } = await import(
 							'tauri-plugin-macos-permissions-api'
 						);
 						return await checkMicrophonePermission();
 					},
-					mapErr: (error) =>
-						PermissionsServiceErr({
-							message: `Failed to check microphone permissions: ${extractErrorMessage(error)}`,
-							cause: error,
-						}),
 				});
 			},
 
@@ -83,17 +84,17 @@ function createPermissionsService(): PermissionsService {
 				if (!IS_MACOS) return Ok(true);
 
 				return tryAsync({
+					mapErr: (error) =>
+						PermissionsServiceErr({
+							cause: error,
+							message: `Failed to request microphone permissions: ${extractErrorMessage(error)}`,
+						}),
 					try: async () => {
 						const { requestMicrophonePermission } = await import(
 							'tauri-plugin-macos-permissions-api'
 						);
 						return await requestMicrophonePermission();
 					},
-					mapErr: (error) =>
-						PermissionsServiceErr({
-							message: `Failed to request microphone permissions: ${extractErrorMessage(error)}`,
-							cause: error,
-						}),
 				});
 			},
 		},
diff --git a/apps/whispering/src/lib/services/recorder/desktop.ts b/apps/whispering/src/lib/services/recorder/desktop.ts
index c086645030..b269cc0ab8 100644
--- a/apps/whispering/src/lib/services/recorder/desktop.ts
+++ b/apps/whispering/src/lib/services/recorder/desktop.ts
@@ -1,25 +1,28 @@
 import type { CancelRecordingResult } from '$lib/constants/audio';
+
 import { invoke as tauriInvoke } from '@tauri-apps/api/core';
+import { readFile } from '@tauri-apps/plugin-fs';
+import { remove } from '@tauri-apps/plugin-fs';
 import { Err, Ok, type Result, tryAsync } from 'wellcrafted/result';
+
 import type { Device, DeviceAcquisitionOutcome } from '../types';
-import { asDeviceIdentifier } from '../types';
 import type {
 	RecorderService,
 	RecorderServiceError,
 	StartRecordingParams,
 } from './types';
+
+import { asDeviceIdentifier } from '../types';
 import { RecorderServiceErr } from './types';
-import { readFile } from '@tauri-apps/plugin-fs';
-import { remove } from '@tauri-apps/plugin-fs';
 
 /**
  * Audio recording data returned from the Rust backend
  */
 type AudioRecording = {
-	sampleRate: number;
 	channels: number;
 	durationSeconds: number;
 	filePath?: string;
+	sampleRate: number;
 };
 
 export function createDesktopRecorderService(): RecorderService {
@@ -30,8 +33,8 @@ export function createDesktopRecorderService(): RecorderService {
 			await invoke<string[]>('enumerate_recording_devices');
 		if (enumerateRecordingDevicesError) {
 			return RecorderServiceErr({
-				message: 'Failed to enumerate recording devices',
 				cause: enumerateRecordingDevicesError,
+				message: 'Failed to enumerate recording devices',
 			});
 		}
 		// On desktop, device names serve as both ID and label
@@ -44,24 +47,90 @@ export function createDesktopRecorderService(): RecorderService {
 	};
 
 	return {
+		cancelRecording: async ({
+			sendStatus,
+		}): Promise<Result<CancelRecordingResult, RecorderServiceError>> => {
+			// Check current state first
+			const { data: recordingId, error: getRecordingIdError } = await invoke<
+				null | string
+			>('get_current_recording_id');
+			if (getRecordingIdError) {
+				return RecorderServiceErr({
+					cause: getRecordingIdError,
+					context: { operation: 'cancelRecording' },
+					message:
+						'Unable to check recording state. Please try closing the app and starting again.',
+				});
+			}
+
+			if (!recordingId) {
+				return Ok({ status: 'no-recording' });
+			}
+
+			sendStatus({
+				title: '🛑 Cancelling',
+				description:
+					'Safely stopping your recording and cleaning up resources...',
+			});
+
+			// First get the recording data to know if there's a file to delete
+			const { data: audioRecording } =
+				await invoke<AudioRecording>('stop_recording');
+
+			// If there's a file path, delete the file using Tauri FS plugin
+			if (audioRecording?.filePath) {
+				const { filePath } = audioRecording;
+				const { error: removeError } = await tryAsync({
+					mapErr: (error) =>
+						RecorderServiceErr({
+							cause: error,
+							context: { audioRecording },
+							message: 'Failed to delete recording file.',
+						}),
+					try: () => remove(filePath),
+				});
+				if (removeError)
+					sendStatus({
+						title: '❌ Error Deleting Recording File',
+						description:
+							"We couldn't delete the recording file. Continuing with the cancellation process...",
+					});
+			}
+
+			// Close the recording session after cancelling
+			sendStatus({
+				title: '🔄 Closing Session',
+				description: 'Cleaning up recording resources...',
+			});
+			const { error: closeError } = await invoke<void>(
+				'close_recording_session',
+			);
+			if (closeError) {
+				// Log but don't fail the cancel operation
+				console.error('Failed to close recording session:', closeError);
+			}
+
+			return Ok({ status: 'cancelled' });
+		},
+
+		enumerateDevices,
+
 		getCurrentRecordingId: async (): Promise<
-			Result<string | null, RecorderServiceError>
+			Result<null | string, RecorderServiceError>
 		> => {
 			const { data: recordingId, error: getCurrentRecordingIdError } =
-				await invoke<string | null>('get_current_recording_id');
+				await invoke<null | string>('get_current_recording_id');
 			if (getCurrentRecordingIdError)
 				return RecorderServiceErr({
+					cause: getCurrentRecordingIdError,
+					context: { error: getCurrentRecordingIdError },
 					message:
 						'We encountered an issue while getting the current recording. This could be because your microphone is being used by another app, your microphone permissions are denied, or the selected recording device is disconnected',
-					context: { error: getCurrentRecordingIdError },
-					cause: getCurrentRecordingIdError,
 				});
 
 			return Ok(recordingId);
 		},
 
-		enumerateDevices,
-
 		startRecording: async (
 			params: StartRecordingParams,
 			{ sendStatus },
@@ -69,13 +138,13 @@ export function createDesktopRecorderService(): RecorderService {
 			// Desktop implementation only handles desktop params
 			if (params.platform !== 'desktop') {
 				return RecorderServiceErr({
-					message: 'Desktop recorder received non-desktop parameters',
-					context: { params },
 					cause: undefined,
+					context: { params },
+					message: 'Desktop recorder received non-desktop parameters',
 				});
 			}
 
-			const { selectedDeviceId, recordingId, outputFolder, sampleRate } =
+			const { outputFolder, recordingId, sampleRate, selectedDeviceId } =
 				params;
 			const { data: devices, error: enumerateError } = await enumerateDevices();
 			if (enumerateError) return Err(enumerateError);
@@ -88,11 +157,11 @@ export function createDesktopRecorderService(): RecorderService {
 				const fallbackDeviceId = deviceIds.at(0);
 				if (!fallbackDeviceId) {
 					return RecorderServiceErr({
+						cause: undefined,
+						context: { deviceIds, selectedDeviceId },
 						message: selectedDeviceId
 							? "We couldn't find the selected microphone. Make sure it's connected and try again!"
 							: "We couldn't find any microphones. Make sure they're connected and try again!",
-						context: { selectedDeviceId, deviceIds },
-						cause: undefined,
 					});
 				}
 
@@ -103,9 +172,9 @@ export function createDesktopRecorderService(): RecorderService {
 							"No worries! We'll find the best microphone for you automatically...",
 					});
 					return Ok({
+						fallbackDeviceId,
 						outcome: 'fallback',
 						reason: 'no-device-selected',
-						fallbackDeviceId,
 					});
 				}
 
@@ -121,9 +190,9 @@ export function createDesktopRecorderService(): RecorderService {
 				});
 
 				return Ok({
+					fallbackDeviceId,
 					outcome: 'fallback',
 					reason: 'preferred-device-unavailable',
-					fallbackDeviceId,
 				});
 			};
 
@@ -153,20 +222,20 @@ export function createDesktopRecorderService(): RecorderService {
 				'init_recording_session',
 				{
 					deviceIdentifier,
-					recordingId,
 					outputFolder: outputFolder || undefined,
+					recordingId,
 					sampleRate: sampleRateNum,
 				},
 			);
 			if (initRecordingSessionError)
 				return RecorderServiceErr({
-					message:
-						'We encountered an issue while setting up your recording session. This could be because your microphone is being used by another app, your microphone permissions are denied, or the selected recording device is disconnected',
+					cause: initRecordingSessionError,
 					context: {
-						selectedDeviceId,
 						deviceIdentifier,
+						selectedDeviceId,
 					},
-					cause: initRecordingSessionError,
+					message:
+						'We encountered an issue while setting up your recording session. This could be because your microphone is being used by another app, your microphone permissions are denied, or the selected recording device is disconnected',
 				});
 
 			sendStatus({
@@ -178,10 +247,10 @@ export function createDesktopRecorderService(): RecorderService {
 				await invoke<void>('start_recording');
 			if (startRecordingError)
 				return RecorderServiceErr({
+					cause: startRecordingError,
+					context: { deviceIdentifier, deviceOutcome },
 					message:
 						'Unable to start recording. Please check your microphone and try again.',
-					context: { deviceIdentifier, deviceOutcome },
-					cause: startRecordingError,
 				});
 
 			return Ok(deviceOutcome);
@@ -194,9 +263,9 @@ export function createDesktopRecorderService(): RecorderService {
 				await invoke<AudioRecording>('stop_recording');
 			if (stopRecordingError) {
 				return RecorderServiceErr({
-					message: 'Unable to save your recording. Please try again.',
-					context: { operation: 'stopRecording' },
 					cause: stopRecordingError,
+					context: { operation: 'stopRecording' },
+					message: 'Unable to save your recording. Please try again.',
 				});
 			}
 
@@ -204,12 +273,12 @@ export function createDesktopRecorderService(): RecorderService {
 			// Desktop recorder should always write to a file
 			if (!filePath) {
 				return RecorderServiceErr({
-					message: 'Recording file path not provided by backend.',
+					cause: undefined,
 					context: {
-						operation: 'stopRecording',
 						audioRecording,
+						operation: 'stopRecording',
 					},
-					cause: undefined,
+					message: 'Recording file path not provided by backend.',
 				});
 			}
 			// audioRecording is now AudioRecordingWithFile
@@ -221,16 +290,16 @@ export function createDesktopRecorderService(): RecorderService {
 			});
 
 			const { data: blob, error: readRecordingFileError } = await tryAsync({
-				try: async () => {
-					const fileBytes = await readFile(filePath);
-					return new Blob([fileBytes], { type: 'audio/wav' });
-				},
 				mapErr: (error) =>
 					RecorderServiceErr({
-						message: 'Unable to read recording file. Please try again.',
-						context: { audioRecording },
 						cause: error,
+						context: { audioRecording },
+						message: 'Unable to read recording file. Please try again.',
 					}),
+				try: async () => {
+					const fileBytes = await readFile(filePath);
+					return new Blob([fileBytes], { type: 'audio/wav' });
+				},
 			});
 			if (readRecordingFileError) return Err(readRecordingFileError);
 
@@ -249,79 +318,13 @@ export function createDesktopRecorderService(): RecorderService {
 
 			return Ok(blob);
 		},
-
-		cancelRecording: async ({
-			sendStatus,
-		}): Promise<Result<CancelRecordingResult, RecorderServiceError>> => {
-			// Check current state first
-			const { data: recordingId, error: getRecordingIdError } = await invoke<
-				string | null
-			>('get_current_recording_id');
-			if (getRecordingIdError) {
-				return RecorderServiceErr({
-					message:
-						'Unable to check recording state. Please try closing the app and starting again.',
-					context: { operation: 'cancelRecording' },
-					cause: getRecordingIdError,
-				});
-			}
-
-			if (!recordingId) {
-				return Ok({ status: 'no-recording' });
-			}
-
-			sendStatus({
-				title: '🛑 Cancelling',
-				description:
-					'Safely stopping your recording and cleaning up resources...',
-			});
-
-			// First get the recording data to know if there's a file to delete
-			const { data: audioRecording } =
-				await invoke<AudioRecording>('stop_recording');
-
-			// If there's a file path, delete the file using Tauri FS plugin
-			if (audioRecording?.filePath) {
-				const { filePath } = audioRecording;
-				const { error: removeError } = await tryAsync({
-					try: () => remove(filePath),
-					mapErr: (error) =>
-						RecorderServiceErr({
-							message: 'Failed to delete recording file.',
-							context: { audioRecording },
-							cause: error,
-						}),
-				});
-				if (removeError)
-					sendStatus({
-						title: '❌ Error Deleting Recording File',
-						description:
-							"We couldn't delete the recording file. Continuing with the cancellation process...",
-					});
-			}
-
-			// Close the recording session after cancelling
-			sendStatus({
-				title: '🔄 Closing Session',
-				description: 'Cleaning up recording resources...',
-			});
-			const { error: closeError } = await invoke<void>(
-				'close_recording_session',
-			);
-			if (closeError) {
-				// Log but don't fail the cancel operation
-				console.error('Failed to close recording session:', closeError);
-			}
-
-			return Ok({ status: 'cancelled' });
-		},
 	};
 }
 
 async function invoke<T>(command: string, args?: Record<string, unknown>) {
 	return tryAsync({
-		try: async () => await tauriInvoke<T>(command, args),
 		mapErr: (error) =>
-			Err({ name: 'TauriInvokeError', command, error } as const),
+			Err({ command, error, name: 'TauriInvokeError' } as const),
+		try: async () => await tauriInvoke<T>(command, args),
 	});
 }
diff --git a/apps/whispering/src/lib/services/recorder/types.ts b/apps/whispering/src/lib/services/recorder/types.ts
index 375b2c13f4..901447b2b5 100644
--- a/apps/whispering/src/lib/services/recorder/types.ts
+++ b/apps/whispering/src/lib/services/recorder/types.ts
@@ -1,60 +1,40 @@
 import type { CancelRecordingResult } from '$lib/constants/audio';
-import { createTaggedError } from 'wellcrafted/error';
 import type { Result } from 'wellcrafted/result';
+
+import { createTaggedError } from 'wellcrafted/error';
+
 import type {
 	Device,
-	DeviceIdentifier,
 	DeviceAcquisitionOutcome,
+	DeviceIdentifier,
 	UpdateStatusMessageFn,
 } from '../types';
 
 /**
  * Base error type for recorder services
  */
-export const { RecorderServiceError, RecorderServiceErr } = createTaggedError(
+export const { RecorderServiceErr, RecorderServiceError } = createTaggedError(
 	'RecorderServiceError',
 );
-export type RecorderServiceError = ReturnType<typeof RecorderServiceError>;
-
-/**
- * Base parameters shared across all platforms
- */
-type BaseRecordingParams = {
-	selectedDeviceId: DeviceIdentifier | null;
-	recordingId: string;
-};
-
 /**
  * Desktop-specific recording parameters
  */
 export type DesktopRecordingParams = BaseRecordingParams & {
+	outputFolder: null | string;
 	platform: 'desktop';
-	outputFolder: string | null;
 	sampleRate: string;
 };
 
-/**
- * Web-specific recording parameters
- */
-export type WebRecordingParams = BaseRecordingParams & {
-	platform: 'web';
-	bitrateKbps: string;
-};
-
-/**
- * Discriminated union for recording parameters based on platform
- */
-export type StartRecordingParams = DesktopRecordingParams | WebRecordingParams;
-
 /**
  * Unified recorder service interface that both desktop and web implementations must satisfy
  */
 export type RecorderService = {
 	/**
-	 * Get the current recording ID if a recording is in progress
-	 * Returns null if no recording is active
+	 * Cancel the current recording without saving
 	 */
-	getCurrentRecordingId(): Promise<Result<string | null, RecorderServiceError>>;
+	cancelRecording(callbacks: {
+		sendStatus: UpdateStatusMessageFn;
+	}): Promise<Result<CancelRecordingResult, RecorderServiceError>>;
 
 	/**
 	 * Enumerate available recording devices with their labels and identifiers
@@ -63,6 +43,12 @@ export type RecorderService = {
 		Result<Device[], RecorderServiceError>
 	>;
 
+	/**
+	 * Get the current recording ID if a recording is in progress
+	 * Returns null if no recording is active
+	 */
+	getCurrentRecordingId(): Promise<Result<null | string, RecorderServiceError>>;
+
 	/**
 	 * Start a new recording session
 	 */
@@ -79,11 +65,27 @@ export type RecorderService = {
 	stopRecording(callbacks: {
 		sendStatus: UpdateStatusMessageFn;
 	}): Promise<Result<Blob, RecorderServiceError>>;
+};
 
-	/**
-	 * Cancel the current recording without saving
-	 */
-	cancelRecording(callbacks: {
-		sendStatus: UpdateStatusMessageFn;
-	}): Promise<Result<CancelRecordingResult, RecorderServiceError>>;
+export type RecorderServiceError = ReturnType<typeof RecorderServiceError>;
+
+/**
+ * Discriminated union for recording parameters based on platform
+ */
+export type StartRecordingParams = DesktopRecordingParams | WebRecordingParams;
+
+/**
+ * Web-specific recording parameters
+ */
+export type WebRecordingParams = BaseRecordingParams & {
+	bitrateKbps: string;
+	platform: 'web';
+};
+
+/**
+ * Base parameters shared across all platforms
+ */
+type BaseRecordingParams = {
+	recordingId: string;
+	selectedDeviceId: DeviceIdentifier | null;
 };
diff --git a/apps/whispering/src/lib/services/recorder/web.ts b/apps/whispering/src/lib/services/recorder/web.ts
index c36a2fd507..a61d38b0fb 100644
--- a/apps/whispering/src/lib/services/recorder/web.ts
+++ b/apps/whispering/src/lib/services/recorder/web.ts
@@ -1,54 +1,86 @@
+import type { CancelRecordingResult } from '$lib/constants/audio';
+
 import { TIMESLICE_MS } from '$lib/constants/audio';
 import { Err, Ok, type Result, tryAsync, trySync } from 'wellcrafted/result';
-import {
-	cleanupRecordingStream,
-	enumerateDevices,
-	getRecordingStream,
-} from '../device-stream';
+
+import type {
+	DeviceAcquisitionOutcome,
+	DeviceIdentifier,
+	UpdateStatusMessageFn,
+} from '../types';
 import type {
 	RecorderService,
 	RecorderServiceError,
 	StartRecordingParams,
 } from './types';
+
+import {
+	cleanupRecordingStream,
+	enumerateDevices,
+	getRecordingStream,
+} from '../device-stream';
 import { RecorderServiceErr } from './types';
-import type { CancelRecordingResult } from '$lib/constants/audio';
-import type {
-	DeviceIdentifier,
-	DeviceAcquisitionOutcome,
-	UpdateStatusMessageFn,
-} from '../types';
 
 type ActiveRecording = {
-	recordingId: string;
-	selectedDeviceId: DeviceIdentifier | null;
 	bitrateKbps: string;
-	stream: MediaStream;
 	mediaRecorder: MediaRecorder;
 	recordedChunks: Blob[];
+	recordingId: string;
+	selectedDeviceId: DeviceIdentifier | null;
+	stream: MediaStream;
 };
 
 export function createWebRecorderService(): RecorderService {
 	let activeRecording: ActiveRecording | null = null;
 
 	return {
-		getCurrentRecordingId: async (): Promise<
-			Result<string | null, RecorderServiceError>
-		> => {
-			return Ok(activeRecording?.recordingId || null);
+		cancelRecording: async ({
+			sendStatus,
+		}): Promise<Result<CancelRecordingResult, RecorderServiceError>> => {
+			if (!activeRecording) {
+				return Ok({ status: 'no-recording' });
+			}
+
+			const recording = activeRecording;
+			activeRecording = null; // Clear immediately
+
+			sendStatus({
+				title: '🛑 Cancelling',
+				description: 'Discarding your recording...',
+			});
+
+			// Stop the recorder
+			recording.mediaRecorder.stop();
+
+			// Clean up the stream
+			cleanupRecordingStream(recording.stream);
+
+			sendStatus({
+				title: '✨ Cancelled',
+				description: 'Recording discarded successfully!',
+			});
+
+			return Ok({ status: 'cancelled' });
 		},
 
 		enumerateDevices: async () => {
 			const { data: devices, error } = await enumerateDevices();
 			if (error) {
 				return RecorderServiceErr({
-					message: error.message,
-					context: error.context,
 					cause: error,
+					context: error.context,
+					message: error.message,
 				});
 			}
 			return Ok(devices);
 		},
 
+		getCurrentRecordingId: async (): Promise<
+			Result<null | string, RecorderServiceError>
+		> => {
+			return Ok(activeRecording?.recordingId || null);
+		},
+
 		startRecording: async (
 			params: StartRecordingParams,
 			{ sendStatus },
@@ -56,20 +88,20 @@ export function createWebRecorderService(): RecorderService {
 			// Web implementation only handles web params
 			if (params.platform !== 'web') {
 				return RecorderServiceErr({
-					message: 'Web recorder received non-web parameters',
-					context: { params },
 					cause: undefined,
+					context: { params },
+					message: 'Web recorder received non-web parameters',
 				});
 			}
 
-			const { selectedDeviceId, recordingId, bitrateKbps } = params;
+			const { bitrateKbps, recordingId, selectedDeviceId } = params;
 			// Ensure we're not already recording
 			if (activeRecording) {
 				return RecorderServiceErr({
+					cause: undefined,
+					context: { activeRecording },
 					message:
 						'A recording is already in progress. Please stop the current recording before starting a new one.',
-					context: { activeRecording },
-					cause: undefined,
 				});
 			}
 
@@ -83,25 +115,25 @@ export function createWebRecorderService(): RecorderService {
 				await getRecordingStream({ selectedDeviceId, sendStatus });
 			if (acquireStreamError) {
 				return RecorderServiceErr({
-					message: acquireStreamError.message,
-					context: acquireStreamError.context,
 					cause: acquireStreamError,
+					context: acquireStreamError.context,
+					message: acquireStreamError.message,
 				});
 			}
 
-			const { stream, deviceOutcome } = streamResult;
+			const { deviceOutcome, stream } = streamResult;
 
 			const { data: mediaRecorder, error: recorderError } = trySync({
-				try: () =>
-					new MediaRecorder(stream, {
-						bitsPerSecond: Number(bitrateKbps) * 1000,
-					}),
 				mapErr: (error) =>
 					RecorderServiceErr({
+						cause: error,
+						context: { bitrateKbps, selectedDeviceId },
 						message:
 							'Failed to initialize the audio recorder. This could be due to unsupported audio settings, microphone conflicts, or browser limitations. Please check your microphone is working and try adjusting your audio settings.',
-						context: { selectedDeviceId, bitrateKbps },
-						cause: error,
+					}),
+				try: () =>
+					new MediaRecorder(stream, {
+						bitsPerSecond: Number(bitrateKbps) * 1000,
 					}),
 			});
 
@@ -116,12 +148,12 @@ export function createWebRecorderService(): RecorderService {
 
 			// Store active recording state
 			activeRecording = {
-				recordingId,
-				selectedDeviceId,
 				bitrateKbps,
-				stream,
 				mediaRecorder,
 				recordedChunks,
+				recordingId,
+				selectedDeviceId,
+				stream,
 			};
 
 			// Set up event handlers
@@ -141,10 +173,10 @@ export function createWebRecorderService(): RecorderService {
 		}): Promise<Result<Blob, RecorderServiceError>> => {
 			if (!activeRecording) {
 				return RecorderServiceErr({
+					cause: undefined,
+					context: { activeRecording },
 					message:
 						'Cannot stop recording because no active recording session was found. Make sure you have started recording before attempting to stop it.',
-					context: { activeRecording },
-					cause: undefined,
 				});
 			}
 
@@ -158,6 +190,17 @@ export function createWebRecorderService(): RecorderService {
 
 			// Stop the recorder and wait for the final data
 			const { data: blob, error: stopError } = await tryAsync({
+				mapErr: (error) =>
+					RecorderServiceErr({
+						cause: error,
+						context: {
+							chunksCount: recording.recordedChunks.length,
+							mimeType: recording.mediaRecorder.mimeType,
+							state: recording.mediaRecorder.state,
+						},
+						message:
+							'Failed to properly stop and save the recording. This might be due to corrupted audio data, insufficient storage space, or a browser issue. Your recording data may be lost.',
+					}),
 				try: () =>
 					new Promise<Blob>((resolve) => {
 						recording.mediaRecorder.addEventListener('stop', () => {
@@ -168,17 +211,6 @@ export function createWebRecorderService(): RecorderService {
 						});
 						recording.mediaRecorder.stop();
 					}),
-				mapErr: (error) =>
-					RecorderServiceErr({
-						message:
-							'Failed to properly stop and save the recording. This might be due to corrupted audio data, insufficient storage space, or a browser issue. Your recording data may be lost.',
-						context: {
-							chunksCount: recording.recordedChunks.length,
-							mimeType: recording.mediaRecorder.mimeType,
-							state: recording.mediaRecorder.state,
-						},
-						cause: error,
-					}),
 			});
 
 			// Always clean up the stream
@@ -192,34 +224,5 @@ export function createWebRecorderService(): RecorderService {
 			});
 			return Ok(blob);
 		},
-
-		cancelRecording: async ({
-			sendStatus,
-		}): Promise<Result<CancelRecordingResult, RecorderServiceError>> => {
-			if (!activeRecording) {
-				return Ok({ status: 'no-recording' });
-			}
-
-			const recording = activeRecording;
-			activeRecording = null; // Clear immediately
-
-			sendStatus({
-				title: '🛑 Cancelling',
-				description: 'Discarding your recording...',
-			});
-
-			// Stop the recorder
-			recording.mediaRecorder.stop();
-
-			// Clean up the stream
-			cleanupRecordingStream(recording.stream);
-
-			sendStatus({
-				title: '✨ Cancelled',
-				description: 'Recording discarded successfully!',
-			});
-
-			return Ok({ status: 'cancelled' });
-		},
 	};
 }
diff --git a/apps/whispering/src/lib/services/sound/assets/index.ts b/apps/whispering/src/lib/services/sound/assets/index.ts
index 9f0f2b9f39..2e63ed81a2 100644
--- a/apps/whispering/src/lib/services/sound/assets/index.ts
+++ b/apps/whispering/src/lib/services/sound/assets/index.ts
@@ -1,4 +1,5 @@
 import type { WhisperingSoundNames } from '$lib/constants/sounds';
+
 import {
 	default as captureVadSoundSrc,
 	default as stopManualSoundSrc,
@@ -11,12 +12,12 @@ import transformationCompleteSoundSrc from './zapsplat_multimedia_notification_a
 import transcriptionCompleteSoundSrc from './zapsplat_multimedia_ui_notification_classic_bell_synth_success_107505.mp3';
 
 export const audioElements = {
-	'manual-start': new Audio(startManualSoundSrc),
 	'manual-cancel': new Audio(cancelSoundSrc),
+	'manual-start': new Audio(startManualSoundSrc),
 	'manual-stop': new Audio(stopManualSoundSrc),
-	'vad-start': new Audio(startVadSoundSrc),
-	'vad-capture': new Audio(captureVadSoundSrc),
-	'vad-stop': new Audio(stopVadSoundSrc),
 	transcriptionComplete: new Audio(transcriptionCompleteSoundSrc),
 	transformationComplete: new Audio(transformationCompleteSoundSrc),
+	'vad-capture': new Audio(captureVadSoundSrc),
+	'vad-start': new Audio(startVadSoundSrc),
+	'vad-stop': new Audio(stopVadSoundSrc),
 } satisfies Record<WhisperingSoundNames, HTMLAudioElement>;
diff --git a/apps/whispering/src/lib/services/sound/desktop.ts b/apps/whispering/src/lib/services/sound/desktop.ts
index 19937c9050..04a9f20890 100644
--- a/apps/whispering/src/lib/services/sound/desktop.ts
+++ b/apps/whispering/src/lib/services/sound/desktop.ts
@@ -1,5 +1,7 @@
 import { tryAsync } from 'wellcrafted/result';
+
 import type { PlaySoundService } from '.';
+
 import { audioElements } from './assets';
 import { PlaySoundServiceErr } from './types';
 
@@ -7,15 +9,15 @@ export function createPlaySoundServiceDesktop(): PlaySoundService {
 	return {
 		playSound: async (soundName) =>
 			tryAsync({
-				try: async () => {
-					await audioElements[soundName].play();
-				},
 				mapErr: (error) =>
 					PlaySoundServiceErr({
-						message: 'Failed to play sound',
-						context: { soundName },
 						cause: error,
+						context: { soundName },
+						message: 'Failed to play sound',
 					}),
+				try: async () => {
+					await audioElements[soundName].play();
+				},
 			}),
 	};
 }
diff --git a/apps/whispering/src/lib/services/sound/types.ts b/apps/whispering/src/lib/services/sound/types.ts
index 380af6419a..7a48fe0847 100644
--- a/apps/whispering/src/lib/services/sound/types.ts
+++ b/apps/whispering/src/lib/services/sound/types.ts
@@ -1,14 +1,15 @@
 import type { WhisperingSoundNames } from '$lib/constants/sounds';
-import { createTaggedError } from 'wellcrafted/error';
 import type { Result } from 'wellcrafted/result';
 
-export const { PlaySoundServiceError, PlaySoundServiceErr } = createTaggedError(
+import { createTaggedError } from 'wellcrafted/error';
+
+export const { PlaySoundServiceErr, PlaySoundServiceError } = createTaggedError(
 	'PlaySoundServiceError',
 );
-export type PlaySoundServiceError = ReturnType<typeof PlaySoundServiceError>;
-
 export type PlaySoundService = {
 	playSound: (
 		soundName: WhisperingSoundNames,
 	) => Promise<Result<void, PlaySoundServiceError>>;
 };
+
+export type PlaySoundServiceError = ReturnType<typeof PlaySoundServiceError>;
diff --git a/apps/whispering/src/lib/services/sound/web.ts b/apps/whispering/src/lib/services/sound/web.ts
index 3fbd760cbb..1314825685 100644
--- a/apps/whispering/src/lib/services/sound/web.ts
+++ b/apps/whispering/src/lib/services/sound/web.ts
@@ -1,6 +1,8 @@
 import { Ok } from 'wellcrafted/result';
+
 // import { extension } from '@repo/extension';
 import type { PlaySoundService } from '.';
+
 import { audioElements } from './assets';
 
 export function createPlaySoundServiceWeb(): PlaySoundService {
diff --git a/apps/whispering/src/lib/services/text/desktop.ts b/apps/whispering/src/lib/services/text/desktop.ts
index 5da4862a95..3741cbd85c 100644
--- a/apps/whispering/src/lib/services/text/desktop.ts
+++ b/apps/whispering/src/lib/services/text/desktop.ts
@@ -3,33 +3,35 @@ import { invoke } from '@tauri-apps/api/core';
 import { writeText } from '@tauri-apps/plugin-clipboard-manager';
 import { type } from '@tauri-apps/plugin-os';
 import { Err, Ok, tryAsync } from 'wellcrafted/result';
+
 import type { TextService } from './types';
+
 import { TextServiceErr } from './types';
 
 export function createTextServiceDesktop(): TextService {
 	return {
 		copyToClipboard: (text) =>
 			tryAsync({
-				try: () => writeText(text),
 				mapErr: (error) =>
 					TextServiceErr({
+						cause: error,
+						context: { text },
 						message:
 							'There was an error copying to the clipboard using the Tauri Clipboard Manager API. Please try again.',
-						context: { text },
-						cause: error,
 					}),
+				try: () => writeText(text),
 			}),
 
 		writeToCursor: async (text) =>
 			tryAsync({
-				try: () => invoke<void>('write_text', { text }),
 				mapErr: (error) =>
 					TextServiceErr({
+						cause: error,
+						context: { text },
 						message:
 							'There was an error writing the text. Please try pasting manually with Cmd/Ctrl+V.',
-						context: { text },
-						cause: error,
 					}),
+				try: () => invoke<void>('write_text', { text }),
 			}),
 	};
 }
\ No newline at end of file
diff --git a/apps/whispering/src/lib/services/text/extension.ts b/apps/whispering/src/lib/services/text/extension.ts
index 67c5a98bf7..da3a1b9625 100644
--- a/apps/whispering/src/lib/services/text/extension.ts
+++ b/apps/whispering/src/lib/services/text/extension.ts
@@ -1,61 +1,48 @@
 import { tryAsync } from 'wellcrafted/result';
+
 import { type TextService, TextServiceErr } from './types';
 
 export function createTextServiceExtension(): TextService {
 	return {
 		copyToClipboard: (text) =>
 			tryAsync({
-				try: () => navigator.clipboard.writeText(text),
 				mapErr: (error) =>
 					TextServiceErr({
-						message: 'Unable to copy to clipboard',
-						context: { text },
 						cause: error,
+						context: { text },
+						message: 'Unable to copy to clipboard',
 					}),
+				try: () => navigator.clipboard.writeText(text),
 			}),
 
 		writeToCursor: (text) =>
 			tryAsync({
+				mapErr: (error) =>
+					TextServiceErr({
+						cause: error,
+						context: { text },
+						message: 'Unable to write text at cursor position',
+					}),
 				try: async () => {
 					// Copy to clipboard and insert at cursor
 					await navigator.clipboard.writeText(text);
 					return writeTextToCursor(text);
 				},
-				mapErr: (error) =>
-					TextServiceErr({
-						message: 'Unable to write text at cursor position',
-						context: { text },
-						cause: error,
-					}),
 			}),
 	};
 }
 
 /**
- * Insert the provided text at the cursor position in the currently active input element or append it
- * to the non-input active element.
+ * Handle the appending of text for non-input and non-textarea elements.
  *
- * @param text - The text to be inserted.
+ * @param element - The non-input element.
+ * @param text - The text to be appended.
  */
-function writeTextToCursor(text: string): void {
-	const activeElement = document.activeElement;
-	if (!isHTMLElement(activeElement)) return;
-
-	if (isInputOrTextareaElement(activeElement)) {
-		insertTextInInputElement(activeElement, text);
-	} else if (activeElement.isContentEditable) {
-		appendTextToContentEditableElement(activeElement, text);
-	}
-}
-
-function isHTMLElement(element: unknown): element is HTMLElement {
-	return element instanceof HTMLElement;
-}
-
-function isInputOrTextareaElement(
+function appendTextToContentEditableElement(
 	element: HTMLElement,
-): element is HTMLInputElement | HTMLTextAreaElement {
-	return element.tagName === 'INPUT' || element.tagName === 'TEXTAREA';
+	text: string,
+): void {
+	element.innerHTML += text;
 }
 
 /**
@@ -80,15 +67,29 @@ function insertTextInInputElement(
 	inputElement.dispatchEvent(new Event('input', { bubbles: true }));
 }
 
+function isHTMLElement(element: unknown): element is HTMLElement {
+	return element instanceof HTMLElement;
+}
+
+function isInputOrTextareaElement(
+	element: HTMLElement,
+): element is HTMLInputElement | HTMLTextAreaElement {
+	return element.tagName === 'INPUT' || element.tagName === 'TEXTAREA';
+}
+
 /**
- * Handle the appending of text for non-input and non-textarea elements.
+ * Insert the provided text at the cursor position in the currently active input element or append it
+ * to the non-input active element.
  *
- * @param element - The non-input element.
- * @param text - The text to be appended.
+ * @param text - The text to be inserted.
  */
-function appendTextToContentEditableElement(
-	element: HTMLElement,
-	text: string,
-): void {
-	element.innerHTML += text;
+function writeTextToCursor(text: string): void {
+	const activeElement = document.activeElement;
+	if (!isHTMLElement(activeElement)) return;
+
+	if (isInputOrTextareaElement(activeElement)) {
+		insertTextInInputElement(activeElement, text);
+	} else if (activeElement.isContentEditable) {
+		appendTextToContentEditableElement(activeElement, text);
+	}
 }
\ No newline at end of file
diff --git a/apps/whispering/src/lib/services/text/types.ts b/apps/whispering/src/lib/services/text/types.ts
index 3e932176e2..6ab7e38aed 100644
--- a/apps/whispering/src/lib/services/text/types.ts
+++ b/apps/whispering/src/lib/services/text/types.ts
@@ -1,13 +1,11 @@
 import type { MaybePromise, WhisperingError } from '$lib/result';
-import { createTaggedError } from 'wellcrafted/error';
 import type { Result } from 'wellcrafted/result';
 
-const { TextServiceError, TextServiceErr } = createTaggedError(
+import { createTaggedError } from 'wellcrafted/error';
+
+const { TextServiceErr, TextServiceError } = createTaggedError(
 	'TextServiceError',
 );
-type TextServiceError = ReturnType<typeof TextServiceError>;
-export { TextServiceErr, TextServiceError };
-
 export type TextService = {
 	/**
 	 * Copies text to the system clipboard.
@@ -32,4 +30,7 @@ export type TextService = {
 	writeToCursor: (
 		text: string,
 	) => MaybePromise<Result<void, TextServiceError | WhisperingError>>;
-};
\ No newline at end of file
+};
+export { TextServiceErr, TextServiceError };
+
+type TextServiceError = ReturnType<typeof TextServiceError>;
\ No newline at end of file
diff --git a/apps/whispering/src/lib/services/text/web.ts b/apps/whispering/src/lib/services/text/web.ts
index 6f4ea38e1b..c0d6a0f22d 100644
--- a/apps/whispering/src/lib/services/text/web.ts
+++ b/apps/whispering/src/lib/services/text/web.ts
@@ -1,19 +1,21 @@
 import { Ok, tryAsync } from 'wellcrafted/result';
+
 import type { TextService } from './types';
+
 import { TextServiceErr } from './types';
 
 export function createTextServiceWeb(): TextService {
 	return {
 		copyToClipboard: async (text) => {
 			const { error: copyError } = await tryAsync({
-				try: () => navigator.clipboard.writeText(text),
 				mapErr: (error) =>
 					TextServiceErr({
+						cause: error,
+						context: { text },
 						message:
 							'There was an error copying to the clipboard using the browser Clipboard API. Please try again.',
-						context: { text },
-						cause: error,
 					}),
+				try: () => navigator.clipboard.writeText(text),
 			});
 
 			if (copyError) {
@@ -29,10 +31,10 @@ export function createTextServiceWeb(): TextService {
 			// We can copy the text to clipboard but the user must manually paste with Cmd/Ctrl+V
 			await navigator.clipboard.writeText(text);
 			return TextServiceErr({
+				cause: undefined,
+				context: { text },
 				message:
 					'Text copied to clipboard. Automatic paste is not supported in web browsers for security reasons. Please paste manually using Cmd/Ctrl+V.',
-				context: { text },
-				cause: undefined,
 			});
 		},
 	};
diff --git a/apps/whispering/src/lib/services/toast.ts b/apps/whispering/src/lib/services/toast.ts
index 7542308f8e..077868b3fe 100644
--- a/apps/whispering/src/lib/services/toast.ts
+++ b/apps/whispering/src/lib/services/toast.ts
@@ -2,6 +2,7 @@ import { goto } from '$app/navigation';
 import { moreDetailsDialog } from '$lib/components/MoreDetailsDialog.svelte';
 import { nanoid } from 'nanoid/non-secure';
 import { toast as sonnerToast } from 'svelte-sonner';
+
 import type { UnifiedNotificationOptions } from './notifications/types';
 
 /**
@@ -14,6 +15,13 @@ import type { UnifiedNotificationOptions } from './notifications/types';
  * - In-place updates using the same ID
  */
 export const ToastServiceLive = {
+	/**
+	 * Dismiss a specific toast or all toasts
+	 */
+	dismiss(id?: number | string): void {
+		sonnerToast.dismiss(id);
+	},
+
 	/**
 	 * Show a toast with the specified options
 	 */
@@ -22,50 +30,34 @@ export const ToastServiceLive = {
 
 		// Use the appropriate Sonner method based on variant
 		sonnerToast[options.variant](options.title, {
-			id: toastId,
 			description: options.description,
+			action: convertActionToSonner(options.action),
 			descriptionClass: 'line-clamp-6',
 			duration: getDuration(options),
-			action: convertActionToSonner(options.action),
+			id: toastId,
 		});
 
 		return toastId;
 	},
-
-	/**
-	 * Dismiss a specific toast or all toasts
-	 */
-	dismiss(id?: string | number): void {
-		sonnerToast.dismiss(id);
-	},
 };
 
-// Helper to determine toast duration
-function getDuration(options: UnifiedNotificationOptions): number {
-	// Persistent toasts use Infinity duration
-	if (options.persist) return Number.POSITIVE_INFINITY;
-
-	if (options.variant === 'loading') return 5000;
-	if (options.variant === 'error' || options.variant === 'warning') return 5000;
-	if (options.action) return 4000;
-	return 3000;
-}
+export type ToastService = typeof ToastServiceLive;
 
 // Helper to convert action to Sonner format
 function convertActionToSonner(action: UnifiedNotificationOptions['action']) {
 	if (!action) return undefined;
 
 	switch (action.type) {
-		case 'link':
+		case 'button':
 			return {
 				label: action.label,
-				onClick: () => goto(action.href),
+				onClick: action.onClick,
 			};
 
-		case 'button':
+		case 'link':
 			return {
 				label: action.label,
-				onClick: action.onClick,
+				onClick: () => goto(action.href),
 			};
 
 		case 'more-details':
@@ -81,4 +73,13 @@ function convertActionToSonner(action: UnifiedNotificationOptions['action']) {
 	}
 }
 
-export type ToastService = typeof ToastServiceLive;
+// Helper to determine toast duration
+function getDuration(options: UnifiedNotificationOptions): number {
+	// Persistent toasts use Infinity duration
+	if (options.persist) return Number.POSITIVE_INFINITY;
+
+	if (options.variant === 'loading') return 5000;
+	if (options.variant === 'error' || options.variant === 'warning') return 5000;
+	if (options.action) return 4000;
+	return 3000;
+}
diff --git a/apps/whispering/src/lib/services/transcription/deepgram.ts b/apps/whispering/src/lib/services/transcription/deepgram.ts
index 57e4c921d0..ed00744bfd 100644
--- a/apps/whispering/src/lib/services/transcription/deepgram.ts
+++ b/apps/whispering/src/lib/services/transcription/deepgram.ts
@@ -1,45 +1,46 @@
-import { WhisperingErr, type WhisperingError } from '$lib/result';
-import type { Settings } from '$lib/settings';
 import type { HttpService } from '$lib/services/http';
+import type { Settings } from '$lib/settings';
+
+import { WhisperingErr, type WhisperingError } from '$lib/result';
+import { HttpServiceLive } from '$lib/services/http';
 import { Err, Ok, type Result } from 'wellcrafted/result';
 import { z } from 'zod';
-import { HttpServiceLive } from '$lib/services/http';
 
 export const DEEPGRAM_TRANSCRIPTION_MODELS = [
      {
-        name: 'nova-3',
         description:
             "Deepgram's most advanced speech-to-text model with superior accuracy and speed. Best for high-quality transcription needs.",
         cost: '$0.0043/minute',
+        name: 'nova-3',
     },
     {
-        name: 'nova-2',
         description:
             "Deepgram's previous best speech-to-text model.",
         cost: '$0.0043/minute',
+        name: 'nova-2',
     },
     {
-        name: 'nova',
         description:
             'Deepgram Nova model with excellent accuracy and performance. Good balance of speed and quality.',
         cost: '$0.0043/minute',
+        name: 'nova',
     },
     {
-        name: 'enhanced',
         description:
             'Enhanced general-purpose model with good accuracy for most use cases. Cost-effective option.',
         cost: '$0.0025/minute',
+        name: 'enhanced',
     },
     {
-        name: 'base',
         description:
             'Base model for standard transcription needs. Most cost-effective option with reasonable accuracy.',
         cost: '$0.0020/minute',
+        name: 'base',
     },
 ] as const satisfies {
-    name: string;
-    description: string;
     cost: string;
+    description: string;
+    name: string;
 }[];
 
 export type DeepgramModel = (typeof DEEPGRAM_TRANSCRIPTION_MODELS)[number];
@@ -51,13 +52,17 @@ const deepgramResponseSchema = z.object({
     results: z.object({
         channels: z.array(z.object({
             alternatives: z.array(z.object({
-                transcript: z.string(),
                 confidence: z.number().optional(),
+                transcript: z.string(),
             })),
         })),
     }),
 });
 
+export type DeepgramTranscriptionService = ReturnType<
+    typeof createDeepgramTranscriptionService
+>;
+
 export function createDeepgramTranscriptionService({
     HttpService,
 }: {
@@ -67,11 +72,11 @@ export function createDeepgramTranscriptionService({
         async transcribe(
             audioBlob: Blob,
             options: {
+                apiKey: string;
+                modelName: DeepgramModel['name'] | (string & {});
+                outputLanguage: Settings['transcription.outputLanguage'];
                 prompt: string;
                 temperature: string;
-                outputLanguage: Settings['transcription.outputLanguage'];
-                apiKey: string;
-                modelName: (string & {}) | DeepgramModel['name'];
             },
         ): Promise<Result<string, WhisperingError>> {
             // Pre-validation: Check API key
@@ -81,9 +86,9 @@ export function createDeepgramTranscriptionService({
                     description:
                         'Please enter your Deepgram API key in settings to use Deepgram transcription.',
                     action: {
-                        type: 'link',
-                        label: 'Add API key',
                         href: '/settings/transcription',
+                        label: 'Add API key',
+                        type: 'link',
                     },
                 });
             }
@@ -100,9 +105,9 @@ export function createDeepgramTranscriptionService({
             // Build query parameters
             const params = new URLSearchParams({
                 model: options.modelName,
-                smart_format: 'true',
-                punctuate: 'true',
                 paragraphs: 'true',
+                punctuate: 'true',
+                smart_format: 'true',
             });
 
             if (options.outputLanguage !== 'auto') {
@@ -115,13 +120,13 @@ export function createDeepgramTranscriptionService({
 
             // Send raw audio data directly as recommended by Deepgram docs
             const { data: deepgramResponse, error: postError } = await HttpService.post({
-                url: `https://api.deepgram.com/v1/listen?${params.toString()}`,
                 body: audioBlob, // Send raw audio blob directly
                 headers: {
                     'Authorization': `Token ${options.apiKey}`,
                     'Content-Type': audioBlob.type || 'audio/*', // Use the blob's mime type or fallback to audio/*
                 },
                 schema: deepgramResponseSchema,
+                url: `https://api.deepgram.com/v1/listen?${params.toString()}`,
             });
 
             if (postError) {
@@ -131,19 +136,27 @@ export function createDeepgramTranscriptionService({
                             title: '🌐 Connection Issue',
                             description:
                                 'Unable to connect to Deepgram service. Please check your internet connection.',
-                            action: { type: 'more-details', error: postError.cause },
+                            action: { error: postError.cause, type: 'more-details' },
                         });
                     }
 
+                    case 'ParseError':
+                        return WhisperingErr({
+                            title: '🔍 Response Error',
+                            description:
+                                'Received an unexpected response from Deepgram service. Please try again.',
+                            action: { error: postError.cause, type: 'more-details' },
+                        });
+
                     case 'ResponseError': {
-                        const { status, message } = postError;
+                        const { message, status } = postError;
 
                         if (status === 400) {
                             return WhisperingErr({
                                 title: '❌ Bad Request',
                                 description:
                                     message || 'Invalid request parameters. Please check your audio file and settings.',
-                                action: { type: 'more-details', error: postError.cause },
+                                action: { error: postError.cause, type: 'more-details' },
                             });
                         }
 
@@ -153,9 +166,9 @@ export function createDeepgramTranscriptionService({
                                 description:
                                     'Your Deepgram API key is invalid or expired. Please update your API key in settings.',
                                 action: {
-                                    type: 'link',
-                                    label: 'Update API key',
                                     href: '/settings/transcription',
+                                    label: 'Update API key',
+                                    type: 'link',
                                 },
                             });
                         }
@@ -165,7 +178,7 @@ export function createDeepgramTranscriptionService({
                                 title: '⛔ Access Denied',
                                 description:
                                     message || 'Your account does not have access to this feature or model.',
-                                action: { type: 'more-details', error: postError.cause },
+                                action: { error: postError.cause, type: 'more-details' },
                             });
                         }
 
@@ -174,7 +187,7 @@ export function createDeepgramTranscriptionService({
                                 title: '📦 Audio File Too Large',
                                 description:
                                     'Your audio file exceeds the maximum size limit. Try splitting it into smaller segments.',
-                                action: { type: 'more-details', error: postError.cause },
+                                action: { error: postError.cause, type: 'more-details' },
                             });
                         }
 
@@ -183,7 +196,7 @@ export function createDeepgramTranscriptionService({
                                 title: '🎵 Unsupported Format',
                                 description:
                                     "This audio format isn't supported. Please convert your file to a supported format.",
-                                action: { type: 'more-details', error: postError.cause },
+                                action: { error: postError.cause, type: 'more-details' },
                             });
                         }
 
@@ -192,7 +205,7 @@ export function createDeepgramTranscriptionService({
                                 title: '⏱️ Rate Limit Reached',
                                 description:
                                     'Too many requests. Please wait before trying again.',
-                                action: { type: 'more-details', error: postError.cause },
+                                action: { error: postError.cause, type: 'more-details' },
                             });
                         }
 
@@ -201,7 +214,7 @@ export function createDeepgramTranscriptionService({
                                 title: '🔧 Service Unavailable',
                                 description:
                                     `The Deepgram service is temporarily unavailable (Error ${status}). Please try again later.`,
-                                action: { type: 'more-details', error: postError.cause },
+                                action: { error: postError.cause, type: 'more-details' },
                             });
                         }
 
@@ -209,24 +222,16 @@ export function createDeepgramTranscriptionService({
                             title: '❌ Transcription Failed',
                             description:
                                 message || 'An unexpected error occurred during transcription. Please try again.',
-                            action: { type: 'more-details', error: postError.cause },
+                            action: { error: postError.cause, type: 'more-details' },
                         });
                     }
 
-                    case 'ParseError':
-                        return WhisperingErr({
-                            title: '🔍 Response Error',
-                            description:
-                                'Received an unexpected response from Deepgram service. Please try again.',
-                            action: { type: 'more-details', error: postError.cause },
-                        });
-
                     default:
                         return WhisperingErr({
                             title: '❓ Unexpected Error',
                             description:
                                 'An unexpected error occurred during transcription. Please try again.',
-                            action: { type: 'more-details', error: postError },
+                            action: { error: postError, type: 'more-details' },
                         });
                 }
             }
@@ -246,10 +251,6 @@ export function createDeepgramTranscriptionService({
     };
 }
 
-export type DeepgramTranscriptionService = ReturnType<
-    typeof createDeepgramTranscriptionService
->;
-
 
 export const DeepgramTranscriptionServiceLive =
     createDeepgramTranscriptionService({
diff --git a/apps/whispering/src/lib/services/transcription/elevenlabs.ts b/apps/whispering/src/lib/services/transcription/elevenlabs.ts
index a97750d4cc..27e2552173 100644
--- a/apps/whispering/src/lib/services/transcription/elevenlabs.ts
+++ b/apps/whispering/src/lib/services/transcription/elevenlabs.ts
@@ -1,35 +1,40 @@
-import { WhisperingErr, type WhisperingError } from '$lib/result';
 import type { Settings } from '$lib/settings';
+
+import { WhisperingErr, type WhisperingError } from '$lib/result';
 import { ElevenLabsClient } from 'elevenlabs';
 import { Ok, type Result } from 'wellcrafted/result';
 
 export const ELEVENLABS_TRANSCRIPTION_MODELS = [
 	{
-		name: 'scribe_v1',
 		description:
 			"World's most accurate transcription model with 96.7% accuracy for English. Supports 99 languages with word-level timestamps and speaker diarization.",
 		cost: '$0.40/hour',
+		name: 'scribe_v1',
 	},
 	{
-		name: 'scribe_v1_experimental',
 		description:
 			'Experimental version of Scribe with latest features and improvements. May include cutting-edge capabilities but with potential instability.',
 		cost: '$0.40/hour',
+		name: 'scribe_v1_experimental',
 	},
 ] as const;
 
 export type ElevenLabsModel = (typeof ELEVENLABS_TRANSCRIPTION_MODELS)[number];
 
+export type ElevenLabsTranscriptionService = ReturnType<
+	typeof createElevenLabsTranscriptionService
+>;
+
 export function createElevenLabsTranscriptionService() {
 	return {
 		transcribe: async (
 			audioBlob: Blob,
 			options: {
+				apiKey: string;
+				modelName: ElevenLabsModel['name'] | (string & {});
+				outputLanguage: Settings['transcription.outputLanguage'];
 				prompt: string;
 				temperature: string;
-				outputLanguage: Settings['transcription.outputLanguage'];
-				apiKey: string;
-				modelName: (string & {}) | ElevenLabsModel['name'];
 			},
 		): Promise<Result<string, WhisperingError>> => {
 			if (!options.apiKey) {
@@ -38,9 +43,9 @@ export function createElevenLabsTranscriptionService() {
 					description:
 						'Please enter your ElevenLabs API key in settings to use speech-to-text transcription.',
 					action: {
-						type: 'link',
-						label: 'Add API key',
 						href: '/settings/transcription',
+						label: 'Add API key',
+						type: 'link',
 					},
 				});
 			}
@@ -63,15 +68,15 @@ export function createElevenLabsTranscriptionService() {
 
 				// Use the client's speechToText functionality
 				const transcription = await client.speechToText.convert({
+					diarize: true,
 					file: audioBlob,
-					model_id: options.modelName,
 					// Map outputLanguage if not set to 'auto'
 					language_code:
 						options.outputLanguage !== 'auto'
 							? options.outputLanguage
 							: undefined,
+					model_id: options.modelName,
 					tag_audio_events: false,
-					diarize: true,
 				});
 
 				// Return the transcribed text
@@ -81,16 +86,12 @@ export function createElevenLabsTranscriptionService() {
 					title: '🔧 Transcription Failed',
 					description:
 						'Unable to complete the transcription using ElevenLabs. This may be due to a service issue or unsupported audio format. Please try again.',
-					action: { type: 'more-details', error },
+					action: { error, type: 'more-details' },
 				});
 			}
 		},
 	};
 }
 
-export type ElevenLabsTranscriptionService = ReturnType<
-	typeof createElevenLabsTranscriptionService
->;
-
 export const ElevenlabsTranscriptionServiceLive =
 	createElevenLabsTranscriptionService();
diff --git a/apps/whispering/src/lib/services/transcription/groq.ts b/apps/whispering/src/lib/services/transcription/groq.ts
index 797706598c..a7e3fc2902 100644
--- a/apps/whispering/src/lib/services/transcription/groq.ts
+++ b/apps/whispering/src/lib/services/transcription/groq.ts
@@ -1,28 +1,28 @@
-import { WhisperingErr, type WhisperingError } from '$lib/result';
 import type { Settings } from '$lib/settings';
-import { getExtensionFromAudioBlob } from '$lib/services/_utils';
-import { Err, Ok, type Result, tryAsync, trySync } from 'wellcrafted/result';
 
+import { WhisperingErr, type WhisperingError } from '$lib/result';
+import { getExtensionFromAudioBlob } from '$lib/services/_utils';
 import Groq from 'groq-sdk';
+import { Err, Ok, type Result, tryAsync, trySync } from 'wellcrafted/result';
 
 export const GROQ_MODELS = [
 	{
-		name: 'whisper-large-v3',
 		description:
 			'Best accuracy (10.3% WER) and full multilingual support, including translation. Recommended for error-sensitive applications requiring multilingual support.',
 		cost: '$0.111/hour',
+		name: 'whisper-large-v3',
 	},
 	{
-		name: 'whisper-large-v3-turbo',
 		description:
 			'Fast multilingual model with good accuracy (12% WER). Best price-to-performance ratio for multilingual applications.',
 		cost: '$0.04/hour',
+		name: 'whisper-large-v3-turbo',
 	},
 	{
-		name: 'distil-whisper-large-v3-en',
 		description:
 			'Fastest and most cost-effective model, but English-only. Recommended for English transcription where speed and cost are priorities.',
 		cost: '$0.02/hour',
+		name: 'distil-whisper-large-v3-en',
 	},
 ] as const;
 
@@ -30,16 +30,20 @@ export type GroqModel = (typeof GROQ_MODELS)[number];
 
 const MAX_FILE_SIZE_MB = 25 as const;
 
+export type GroqTranscriptionService = ReturnType<
+	typeof createGroqTranscriptionService
+>;
+
 export function createGroqTranscriptionService() {
 	return {
 		async transcribe(
 			audioBlob: Blob,
 			options: {
+				apiKey: string;
+				modelName: GroqModel['name'] | (string & {});
+				outputLanguage: Settings['transcription.outputLanguage'];
 				prompt: string;
 				temperature: string;
-				outputLanguage: Settings['transcription.outputLanguage'];
-				apiKey: string;
-				modelName: (string & {}) | GroqModel['name'];
 			},
 		): Promise<Result<string, WhisperingError>> {
 			// Pre-validate API key
@@ -48,9 +52,9 @@ export function createGroqTranscriptionService() {
 					title: '🔑 API Key Required',
 					description: 'Please enter your Groq API key in settings.',
 					action: {
-						type: 'link',
-						label: 'Add API key',
 						href: '/settings/transcription',
+						label: 'Add API key',
+						type: 'link',
 					},
 				});
 			}
@@ -61,9 +65,9 @@ export function createGroqTranscriptionService() {
 					description:
 						'Your Groq API key should start with "gsk_" or "xai-". Please check and update your API key.',
 					action: {
-						type: 'link',
-						label: 'Update API key',
 						href: '/settings/transcription',
+						label: 'Update API key',
+						type: 'link',
 					},
 				});
 			}
@@ -79,55 +83,55 @@ export function createGroqTranscriptionService() {
 
 			// Create file from blob
 			const { data: file, error: fileError } = trySync({
-				try: () =>
-					new File(
-						[audioBlob],
-						`recording.${getExtensionFromAudioBlob(audioBlob)}`,
-						{ type: audioBlob.type },
-					),
 				mapErr: (error) =>
 					WhisperingErr({
 						title: '📄 File Creation Failed',
 						description:
 							'Failed to create audio file for transcription. Please try again.',
-						action: { type: 'more-details', error },
+						action: { error, type: 'more-details' },
 					}),
+				try: () =>
+					new File(
+						[audioBlob],
+						`recording.${getExtensionFromAudioBlob(audioBlob)}`,
+						{ type: audioBlob.type },
+					),
 			});
 
 			if (fileError) return Err(fileError);
 
 			// Make the transcription request
 			const { data: transcription, error: groqApiError } = await tryAsync({
+				mapErr: (error) => {
+					// Check if it's NOT a Groq API error
+					if (!(error instanceof Groq.APIError)) {
+						// This is an unexpected error type
+						throw error;
+					}
+					// Return the error directly
+					return Err(error);
+				},
 				try: () =>
 					new Groq({
 						apiKey: options.apiKey,
 						dangerouslyAllowBrowser: true,
 					}).audio.transcriptions.create({
 						file,
-						model: options.modelName,
 						language:
 							options.outputLanguage === 'auto'
 								? undefined
 								: options.outputLanguage,
+						model: options.modelName,
 						prompt: options.prompt ? options.prompt : undefined,
 						temperature: options.temperature
 							? Number.parseFloat(options.temperature)
 							: undefined,
 					}),
-				mapErr: (error) => {
-					// Check if it's NOT a Groq API error
-					if (!(error instanceof Groq.APIError)) {
-						// This is an unexpected error type
-						throw error;
-					}
-					// Return the error directly
-					return Err(error);
-				},
 			});
 
 			if (groqApiError) {
 				// Error handling follows https://www.npmjs.com/package/groq-sdk#error-handling
-				const { status, name, message, error } = groqApiError;
+				const { message, error, name, status } = groqApiError;
 
 				// 400 - BadRequestError
 				if (status === 400) {
@@ -136,7 +140,7 @@ export function createGroqTranscriptionService() {
 						description:
 							message ??
 							`Invalid request to Groq API. ${error?.message ?? ''}`.trim(),
-						action: { type: 'more-details', error: groqApiError },
+						action: { error: groqApiError, type: 'more-details' },
 					});
 				}
 
@@ -148,9 +152,9 @@ export function createGroqTranscriptionService() {
 							message ??
 							'Your API key appears to be invalid or expired. Please update your API key in settings to continue transcribing.',
 						action: {
-							type: 'link',
-							label: 'Update API key',
 							href: '/settings/transcription',
+							label: 'Update API key',
+							type: 'link',
 						},
 					});
 				}
@@ -162,7 +166,7 @@ export function createGroqTranscriptionService() {
 						description:
 							message ??
 							"Your account doesn't have access to this feature. This may be due to plan limitations or account restrictions.",
-						action: { type: 'more-details', error: groqApiError },
+						action: { error: groqApiError, type: 'more-details' },
 					});
 				}
 
@@ -173,7 +177,7 @@ export function createGroqTranscriptionService() {
 						description:
 							message ??
 							'The requested resource was not found. This might indicate an issue with the model or API endpoint.',
-						action: { type: 'more-details', error: groqApiError },
+						action: { error: groqApiError, type: 'more-details' },
 					});
 				}
 
@@ -185,9 +189,9 @@ export function createGroqTranscriptionService() {
 							message ??
 							'The request was valid but the server cannot process it. Please check your audio file and parameters.',
 						action: {
-							type: 'link',
-							label: 'Update API key',
 							href: '/settings/transcription',
+							label: 'Update API key',
+							type: 'link',
 						},
 					});
 				}
@@ -199,9 +203,9 @@ export function createGroqTranscriptionService() {
 						description:
 							message ?? 'Too many requests. Please try again later.',
 						action: {
-							type: 'link',
-							label: 'Update API key',
 							href: '/settings/transcription',
+							label: 'Update API key',
+							type: 'link',
 						},
 					});
 				}
@@ -213,7 +217,7 @@ export function createGroqTranscriptionService() {
 						description:
 							message ??
 							`The transcription service is temporarily unavailable (Error ${status}). Please try again in a few minutes.`,
-						action: { type: 'more-details', error: groqApiError },
+						action: { error: groqApiError, type: 'more-details' },
 					});
 				}
 
@@ -224,7 +228,7 @@ export function createGroqTranscriptionService() {
 						description:
 							message ??
 							'Unable to connect to the Groq service. This could be a network issue or temporary service interruption.',
-						action: { type: 'more-details', error: groqApiError },
+						action: { error: groqApiError, type: 'more-details' },
 					});
 				}
 
@@ -233,7 +237,7 @@ export function createGroqTranscriptionService() {
 					title: '❌ Unexpected Error',
 					description:
 						message ?? 'An unexpected error occurred. Please try again.',
-					action: { type: 'more-details', error: groqApiError },
+					action: { error: groqApiError, type: 'more-details' },
 				});
 			}
 
@@ -242,8 +246,4 @@ export function createGroqTranscriptionService() {
 	};
 }
 
-export type GroqTranscriptionService = ReturnType<
-	typeof createGroqTranscriptionService
->;
-
 export const GroqTranscriptionServiceLive = createGroqTranscriptionService();
diff --git a/apps/whispering/src/lib/services/transcription/index.ts b/apps/whispering/src/lib/services/transcription/index.ts
index b703fc8975..9e1ef25125 100644
--- a/apps/whispering/src/lib/services/transcription/index.ts
+++ b/apps/whispering/src/lib/services/transcription/index.ts
@@ -6,11 +6,11 @@ import { SpeachesTranscriptionServiceLive } from './speaches';
 import { WhisperCppTranscriptionServiceLive } from './whispercpp';
 
 export {
+	DeepgramTranscriptionServiceLive as deepgram,
 	ElevenlabsTranscriptionServiceLive as elevenlabs,
 	GroqTranscriptionServiceLive as groq,
 	OpenaiTranscriptionServiceLive as openai,
 	SpeachesTranscriptionServiceLive as speaches,
-	DeepgramTranscriptionServiceLive as deepgram,
 	WhisperCppTranscriptionServiceLive as whispercpp,
 };
 
diff --git a/apps/whispering/src/lib/services/transcription/openai.ts b/apps/whispering/src/lib/services/transcription/openai.ts
index 6cbced77f9..0f64716792 100644
--- a/apps/whispering/src/lib/services/transcription/openai.ts
+++ b/apps/whispering/src/lib/services/transcription/openai.ts
@@ -1,48 +1,53 @@
-import { WhisperingErr, type WhisperingError } from '$lib/result';
 import type { Settings } from '$lib/settings';
+
+import { WhisperingErr, type WhisperingError } from '$lib/result';
 import { getExtensionFromAudioBlob } from '$lib/services/_utils';
 import OpenAI from 'openai';
 import { Err, Ok, type Result, tryAsync, trySync } from 'wellcrafted/result';
 
 export const OPENAI_TRANSCRIPTION_MODELS = [
 	{
-		name: 'whisper-1',
 		description:
 			"OpenAI's flagship speech-to-text model with multilingual support. Reliable and accurate transcription for a wide variety of use cases.",
 		cost: '$0.36/hour',
+		name: 'whisper-1',
 	},
 	{
-		name: 'gpt-4o-transcribe',
 		description:
 			'GPT-4o powered transcription with enhanced understanding and context. Best for complex audio requiring deep comprehension.',
 		cost: '$0.36/hour',
+		name: 'gpt-4o-transcribe',
 	},
 	{
-		name: 'gpt-4o-mini-transcribe',
 		description:
 			'Cost-effective GPT-4o mini transcription model. Good balance of performance and cost for standard transcription needs.',
 		cost: '$0.18/hour',
+		name: 'gpt-4o-mini-transcribe',
 	},
 ] as const satisfies {
-	name: OpenAI.Audio.AudioModel;
-	description: string;
 	cost: string;
+	description: string;
+	name: OpenAI.Audio.AudioModel;
 }[];
 
 export type OpenAIModel = (typeof OPENAI_TRANSCRIPTION_MODELS)[number];
 
 const MAX_FILE_SIZE_MB = 25 as const;
 
+export type OpenaiTranscriptionService = ReturnType<
+	typeof createOpenaiTranscriptionService
+>;
+
 export function createOpenaiTranscriptionService() {
 	return {
 		async transcribe(
 			audioBlob: Blob,
 			options: {
+				apiKey: string;
+				modelName: OpenAIModel['name'] | (string & {});
+				outputLanguage: Settings['transcription.outputLanguage'];
 				prompt: string;
 				temperature: string;
-				outputLanguage: Settings['transcription.outputLanguage'];
-				apiKey: string;
-				modelName: (string & {}) | OpenAIModel['name'];
 			},
 		): Promise<Result<string, WhisperingError>> {
 			// Pre-validation: Check API key
@@ -52,9 +57,9 @@ export function createOpenaiTranscriptionService() {
 					description:
 						'Please enter your OpenAI API key in settings to use Whisper transcription.',
 					action: {
-						type: 'link',
-						label: 'Add API key',
 						href: '/settings/transcription',
+						label: 'Add API key',
+						type: 'link',
 					},
 				});
 			}
@@ -65,9 +70,9 @@ export function createOpenaiTranscriptionService() {
 					description:
 						'Your OpenAI API key should start with "sk-". Please check and update your API key.',
 					action: {
-						type: 'link',
-						label: 'Update API key',
 						href: '/settings/transcription',
+						label: 'Update API key',
+						type: 'link',
 					},
 				});
 			}
@@ -83,54 +88,54 @@ export function createOpenaiTranscriptionService() {
 
 			// Create File object from blob
 			const { data: file, error: fileError } = trySync({
-				try: () =>
-					new File(
-						[audioBlob],
-						`recording.${getExtensionFromAudioBlob(audioBlob)}`,
-						{ type: audioBlob.type },
-					),
 				mapErr: (error) =>
 					WhisperingErr({
 						title: '📁 File Creation Failed',
 						description:
 							'Failed to create audio file for transcription. Please try again.',
 					}),
+				try: () =>
+					new File(
+						[audioBlob],
+						`recording.${getExtensionFromAudioBlob(audioBlob)}`,
+						{ type: audioBlob.type },
+					),
 			});
 
 			if (fileError) return Err(fileError);
 
 			// Call OpenAI API
 			const { data: transcription, error: openaiApiError } = await tryAsync({
+				mapErr: (error) => {
+					// Check if it's NOT an OpenAI API error
+					if (!(error instanceof OpenAI.APIError)) {
+						// This is an unexpected error type
+						throw error;
+					}
+					// Return the error directly
+					return Err(error);
+				},
 				try: () =>
 					new OpenAI({
 						apiKey: options.apiKey,
 						dangerouslyAllowBrowser: true,
 					}).audio.transcriptions.create({
 						file,
-						model: options.modelName,
 						language:
 							options.outputLanguage !== 'auto'
 								? options.outputLanguage
 								: undefined,
+						model: options.modelName,
 						prompt: options.prompt || undefined,
 						temperature: options.temperature
 							? Number.parseFloat(options.temperature)
 							: undefined,
 					}),
-				mapErr: (error) => {
-					// Check if it's NOT an OpenAI API error
-					if (!(error instanceof OpenAI.APIError)) {
-						// This is an unexpected error type
-						throw error;
-					}
-					// Return the error directly
-					return Err(error);
-				},
 			});
 
 			if (openaiApiError) {
 				// Error handling follows https://www.npmjs.com/package/openai#error-handling
-				const { status, name, message, error } = openaiApiError;
+				const { message, error, name, status } = openaiApiError;
 
 				// 400 - BadRequestError
 				if (status === 400) {
@@ -139,7 +144,7 @@ export function createOpenaiTranscriptionService() {
 						description:
 							message ??
 							`Invalid request to OpenAI API. ${error?.message ?? ''}`.trim(),
-						action: { type: 'more-details', error: openaiApiError },
+						action: { error: openaiApiError, type: 'more-details' },
 					});
 				}
 
@@ -151,9 +156,9 @@ export function createOpenaiTranscriptionService() {
 							message ??
 							'Your API key appears to be invalid or expired. Please update your API key in settings to continue transcribing.',
 						action: {
-							type: 'link',
-							label: 'Update API key',
 							href: '/settings/transcription',
+							label: 'Update API key',
+							type: 'link',
 						},
 					});
 				}
@@ -165,7 +170,7 @@ export function createOpenaiTranscriptionService() {
 						description:
 							message ??
 							"Your account doesn't have access to this feature. This may be due to plan limitations or account restrictions.",
-						action: { type: 'more-details', error: openaiApiError },
+						action: { error: openaiApiError, type: 'more-details' },
 					});
 				}
 
@@ -176,7 +181,7 @@ export function createOpenaiTranscriptionService() {
 						description:
 							message ??
 							'The requested resource was not found. This might indicate an issue with the model or API endpoint.',
-						action: { type: 'more-details', error: openaiApiError },
+						action: { error: openaiApiError, type: 'more-details' },
 					});
 				}
 
@@ -187,7 +192,7 @@ export function createOpenaiTranscriptionService() {
 						description:
 							message ??
 							'Your audio file exceeds the maximum size limit (25MB). Try splitting it into smaller segments or reducing the audio quality.',
-						action: { type: 'more-details', error: openaiApiError },
+						action: { error: openaiApiError, type: 'more-details' },
 					});
 				}
 
@@ -198,7 +203,7 @@ export function createOpenaiTranscriptionService() {
 						description:
 							message ??
 							"This audio format isn't supported. Please convert your file to MP3, WAV, M4A, or another common audio format.",
-						action: { type: 'more-details', error: openaiApiError },
+						action: { error: openaiApiError, type: 'more-details' },
 					});
 				}
 
@@ -209,7 +214,7 @@ export function createOpenaiTranscriptionService() {
 						description:
 							message ??
 							'The request was valid but the server cannot process it. Please check your audio file and parameters.',
-						action: { type: 'more-details', error: openaiApiError },
+						action: { error: openaiApiError, type: 'more-details' },
 					});
 				}
 
@@ -220,9 +225,9 @@ export function createOpenaiTranscriptionService() {
 						description:
 							message ?? 'Too many requests. Please try again later.',
 						action: {
-							type: 'link',
-							label: 'Update API key',
 							href: '/settings/transcription',
+							label: 'Update API key',
+							type: 'link',
 						},
 					});
 				}
@@ -234,7 +239,7 @@ export function createOpenaiTranscriptionService() {
 						description:
 							message ??
 							`The transcription service is temporarily unavailable (Error ${status}). Please try again in a few minutes.`,
-						action: { type: 'more-details', error: openaiApiError },
+						action: { error: openaiApiError, type: 'more-details' },
 					});
 				}
 
@@ -245,7 +250,7 @@ export function createOpenaiTranscriptionService() {
 						description:
 							message ??
 							'Unable to connect to the OpenAI service. This could be a network issue or temporary service interruption.',
-						action: { type: 'more-details', error: openaiApiError },
+						action: { error: openaiApiError, type: 'more-details' },
 					});
 				}
 
@@ -254,7 +259,7 @@ export function createOpenaiTranscriptionService() {
 					title: '❌ Unexpected Error',
 					description:
 						message ?? 'An unexpected error occurred. Please try again.',
-					action: { type: 'more-details', error: openaiApiError },
+					action: { error: openaiApiError, type: 'more-details' },
 				});
 			}
 
@@ -264,9 +269,5 @@ export function createOpenaiTranscriptionService() {
 	};
 }
 
-export type OpenaiTranscriptionService = ReturnType<
-	typeof createOpenaiTranscriptionService
->;
-
 export const OpenaiTranscriptionServiceLive =
 	createOpenaiTranscriptionService();
diff --git a/apps/whispering/src/lib/services/transcription/speaches.ts b/apps/whispering/src/lib/services/transcription/speaches.ts
index 9f0089ac7d..c3491cc2f7 100644
--- a/apps/whispering/src/lib/services/transcription/speaches.ts
+++ b/apps/whispering/src/lib/services/transcription/speaches.ts
@@ -1,6 +1,7 @@
-import { WhisperingErr, type WhisperingError } from '$lib/result';
 import type { HttpService } from '$lib/services/http';
 import type { Settings } from '$lib/settings';
+
+import { WhisperingErr, type WhisperingError } from '$lib/result';
 import { getExtensionFromAudioBlob } from '$lib/services/_utils';
 import { Ok, type Result } from 'wellcrafted/result';
 import { z } from 'zod';
@@ -10,6 +11,10 @@ const whisperApiResponseSchema = z.union([
 	z.object({ error: z.object({ message: z.string() }) }),
 ]);
 
+export type SpeachesTranscriptionService = ReturnType<
+	typeof createSpeachesTranscriptionService
+>;
+
 export function createSpeachesTranscriptionService({
 	HttpService,
 }: {
@@ -19,11 +24,11 @@ export function createSpeachesTranscriptionService({
 		transcribe: async (
 			audioBlob: Blob,
 			options: {
+				baseUrl: string;
+				modelId: string;
+				outputLanguage: Settings['transcription.outputLanguage'];
 				prompt: string;
 				temperature: string;
-				outputLanguage: Settings['transcription.outputLanguage'];
-				modelId: string;
-				baseUrl: string;
 			},
 		): Promise<Result<string, WhisperingError>> => {
 			const formData = new FormData();
@@ -45,10 +50,10 @@ export function createSpeachesTranscriptionService({
 
 			const { data: whisperApiResponse, error: postError } =
 				await HttpService.post({
-					url: `${options.baseUrl}/v1/audio/transcriptions`,
 					body: formData,
 					headers: undefined, // No headers needed for Speaches
 					schema: whisperApiResponseSchema,
+					url: `${options.baseUrl}/v1/audio/transcriptions`,
 				});
 
 			if (postError) {
@@ -58,12 +63,20 @@ export function createSpeachesTranscriptionService({
 							title: '🌐 Connection Issue',
 							description:
 								'Unable to connect to the transcription service. This could be a network issue or temporary service interruption. Please try again in a moment.',
-							action: { type: 'more-details', error: postError.cause },
+							action: { error: postError.cause, type: 'more-details' },
 						});
 					}
 
+					case 'ParseError':
+						return WhisperingErr({
+							title: '🔍 Response Error',
+							description:
+								'Received an unexpected response from the transcription service. This is usually temporary - please try again.',
+							action: { error: postError.cause, type: 'more-details' },
+						});
+
 					case 'ResponseError': {
-						const { status, message } = postError;
+						const { message, status } = postError;
 
 						if (status === 401) {
 							return WhisperingErr({
@@ -71,9 +84,9 @@ export function createSpeachesTranscriptionService({
 								description:
 									'Your API key appears to be invalid or expired. Please update your API key in settings to continue transcribing.',
 								action: {
-									type: 'link',
-									label: 'Update API key',
 									href: '/settings/transcription',
+									label: 'Update API key',
+									type: 'link',
 								},
 							});
 						}
@@ -83,7 +96,7 @@ export function createSpeachesTranscriptionService({
 								title: '⛔ Access Restricted',
 								description:
 									"Your account doesn't have access to this feature. This may be due to plan limitations or account restrictions. Please check your account status.",
-								action: { type: 'more-details', error: postError.cause },
+								action: { error: postError.cause, type: 'more-details' },
 							});
 						}
 
@@ -92,7 +105,7 @@ export function createSpeachesTranscriptionService({
 								title: '📦 Audio File Too Large',
 								description:
 									'Your audio file exceeds the maximum size limit (typically 25MB). Try splitting it into smaller segments or reducing the audio quality.',
-								action: { type: 'more-details', error: postError.cause },
+								action: { error: postError.cause, type: 'more-details' },
 							});
 						}
 
@@ -101,7 +114,7 @@ export function createSpeachesTranscriptionService({
 								title: '🎵 Unsupported Format',
 								description:
 									"This audio format isn't supported. Please convert your file to MP3, WAV, M4A, or another common audio format.",
-								action: { type: 'more-details', error: postError.cause },
+								action: { error: postError.cause, type: 'more-details' },
 							});
 						}
 
@@ -111,9 +124,9 @@ export function createSpeachesTranscriptionService({
 								title: '⏱️ Rate Limit Reached',
 								description: message,
 								action: {
-									type: 'link',
-									label: 'Update API key',
 									href: '/settings/transcription',
+									label: 'Update API key',
+									type: 'link',
 								},
 							});
 						}
@@ -122,31 +135,23 @@ export function createSpeachesTranscriptionService({
 							return WhisperingErr({
 								title: '🔧 Service Unavailable',
 								description: `The transcription service is temporarily unavailable (Error ${status}). Please try again in a few minutes.`,
-								action: { type: 'more-details', error: postError.cause },
+								action: { error: postError.cause, type: 'more-details' },
 							});
 						}
 
 						return WhisperingErr({
 							title: '❌ Request Failed',
 							description: `The request failed with error ${status}. This may be temporary - please try again. If the problem persists, please contact support.`,
-							action: { type: 'more-details', error: postError.cause },
+							action: { error: postError.cause, type: 'more-details' },
 						});
 					}
 
-					case 'ParseError':
-						return WhisperingErr({
-							title: '🔍 Response Error',
-							description:
-								'Received an unexpected response from the transcription service. This is usually temporary - please try again.',
-							action: { type: 'more-details', error: postError.cause },
-						});
-
 					default:
 						return WhisperingErr({
 							title: '❓ Unexpected Error',
 							description:
 								'An unexpected error occurred during transcription. Please try again, and contact support if the issue continues.',
-							action: { type: 'more-details', error: postError },
+							action: { error: postError, type: 'more-details' },
 						});
 				}
 			}
@@ -163,10 +168,6 @@ export function createSpeachesTranscriptionService({
 	};
 }
 
-export type SpeachesTranscriptionService = ReturnType<
-	typeof createSpeachesTranscriptionService
->;
-
 import { HttpServiceLive } from '$lib/services/http';
 
 export const SpeachesTranscriptionServiceLive =
diff --git a/apps/whispering/src/lib/services/transcription/whispercpp.ts b/apps/whispering/src/lib/services/transcription/whispercpp.ts
index 105c69a606..c0daa8351a 100644
--- a/apps/whispering/src/lib/services/transcription/whispercpp.ts
+++ b/apps/whispering/src/lib/services/transcription/whispercpp.ts
@@ -1,30 +1,35 @@
+import type { Settings } from '$lib/settings';
+
+import { rpc } from '$lib/query';
 import {
 	WhisperingErr,
-	WhisperingWarningErr,
 	type WhisperingError,
+	WhisperingWarningErr,
 } from '$lib/result';
-import type { Settings } from '$lib/settings';
-import { Ok, tryAsync, type Result } from 'wellcrafted/result';
 import { invoke } from '@tauri-apps/api/core';
 import { exists } from '@tauri-apps/plugin-fs';
-import { extractErrorMessage } from 'wellcrafted/error';
 import { type } from 'arktype';
-import { rpc } from '$lib/query';
+import { extractErrorMessage } from 'wellcrafted/error';
+import { Ok, type Result, tryAsync } from 'wellcrafted/result';
 
 const WhisperCppErrorType = type({
-	name: "'AudioReadError' | 'GpuError' | 'ModelLoadError' | 'TranscriptionError'",
 	message: 'string',
+	name: "'AudioReadError' | 'GpuError' | 'ModelLoadError' | 'TranscriptionError'",
 });
 
+export type WhisperCppTranscriptionService = ReturnType<
+	typeof createWhisperCppTranscriptionService
+>;
+
 export function createWhisperCppTranscriptionService() {
 	return {
 		async transcribe(
 			audioBlob: Blob,
 			options: {
+				modelPath: string;
+				outputLanguage: Settings['transcription.outputLanguage'];
 				prompt: string;
 				temperature: string;
-				outputLanguage: Settings['transcription.outputLanguage'];
-				modelPath: string;
 				useGpu: boolean;
 			},
 		): Promise<Result<string, WhisperingError>> {
@@ -34,17 +39,17 @@ export function createWhisperCppTranscriptionService() {
 					title: '📁 Model File Required',
 					description: 'Please select a Whisper model file in settings.',
 					action: {
-						type: 'link',
-						label: 'Configure model',
 						href: '/settings/transcription',
+						label: 'Configure model',
+						type: 'link',
 					},
 				});
 			}
 
 			// Check if model file exists
 			const { data: isExists } = await tryAsync({
-				try: () => exists(options.modelPath),
 				mapErr: () => Ok(false),
+				try: () => exists(options.modelPath),
 			});
 
 			if (!isExists) {
@@ -52,9 +57,9 @@ export function createWhisperCppTranscriptionService() {
 					title: '❌ Model File Not Found',
 					description: `The model file "${options.modelPath}" does not exist.`,
 					action: {
-						type: 'link',
-						label: 'Select model',
 						href: '/settings/transcription',
+						label: 'Select model',
+						type: 'link',
 					},
 				});
 			}
@@ -68,9 +73,9 @@ export function createWhisperCppTranscriptionService() {
 					description:
 						'FFmpeg is required for enhanced audio format support. Install it to transcribe non-WAV audio files with Whisper C++.',
 					action: {
-						type: 'link',
-						label: 'Install FFmpeg',
 						href: '/install-ffmpeg',
+						label: 'Install FFmpeg',
+						type: 'link',
 					},
 				});
 			}
@@ -81,34 +86,24 @@ export function createWhisperCppTranscriptionService() {
 
 			// Call Tauri command to transcribe with whisper-cpp
 			const result = await tryAsync({
-				try: () =>
-					invoke<string>('transcribe_with_whisper_cpp', {
-						audioData: audioData,
-						modelPath: options.modelPath,
-						language:
-							options.outputLanguage === 'auto' ? null : options.outputLanguage,
-						useGpu: options.useGpu,
-						prompt: options.prompt,
-						temperature: Number.parseFloat(options.temperature),
-					}),
 				mapErr: (unknownError) => {
 					const result = WhisperCppErrorType(unknownError);
 					if (result instanceof type.errors) {
 						return WhisperingErr({
 							title: '❌ Unexpected Whisper C++ Error',
 							description: extractErrorMessage(unknownError),
-							action: { type: 'more-details', error: unknownError },
+							action: { error: unknownError, type: 'more-details' },
 						});
 					}
 					const error = result;
 					switch (error.name) {
-						case 'ModelLoadError':
+						case 'AudioReadError':
 							return WhisperingErr({
-								title: '🤖 Model Loading Error',
+								title: '🔊 Audio Read Error',
 								description: error.message,
 								action: {
-									type: 'more-details',
 									error: new Error(error.message),
+									type: 'more-details',
 								},
 							});
 
@@ -117,19 +112,19 @@ export function createWhisperCppTranscriptionService() {
 								title: '🎮 GPU Error',
 								description: error.message,
 								action: {
-									type: 'link',
-									label: 'Configure settings',
 									href: '/settings/transcription',
+									label: 'Configure settings',
+									type: 'link',
 								},
 							});
 
-						case 'AudioReadError':
+						case 'ModelLoadError':
 							return WhisperingErr({
-								title: '🔊 Audio Read Error',
+								title: '🤖 Model Loading Error',
 								description: error.message,
 								action: {
-									type: 'more-details',
 									error: new Error(error.message),
+									type: 'more-details',
 								},
 							});
 
@@ -138,8 +133,8 @@ export function createWhisperCppTranscriptionService() {
 								title: '❌ Transcription Error',
 								description: error.message,
 								action: {
-									type: 'more-details',
 									error: new Error(error.message),
+									type: 'more-details',
 								},
 							});
 
@@ -148,12 +143,22 @@ export function createWhisperCppTranscriptionService() {
 								title: '❌ Whisper C++ Error',
 								description: 'An unexpected error occurred.',
 								action: {
-									type: 'more-details',
 									error: new Error(String(error)),
+									type: 'more-details',
 								},
 							});
 					}
 				},
+				try: () =>
+					invoke<string>('transcribe_with_whisper_cpp', {
+						audioData: audioData,
+						language:
+							options.outputLanguage === 'auto' ? null : options.outputLanguage,
+						modelPath: options.modelPath,
+						prompt: options.prompt,
+						temperature: Number.parseFloat(options.temperature),
+						useGpu: options.useGpu,
+					}),
 			});
 
 			return result;
@@ -161,9 +166,5 @@ export function createWhisperCppTranscriptionService() {
 	};
 }
 
-export type WhisperCppTranscriptionService = ReturnType<
-	typeof createWhisperCppTranscriptionService
->;
-
 export const WhisperCppTranscriptionServiceLive =
 	createWhisperCppTranscriptionService();
diff --git a/apps/whispering/src/lib/services/tray.ts b/apps/whispering/src/lib/services/tray.ts
index 72e343d21e..1142285ff6 100644
--- a/apps/whispering/src/lib/services/tray.ts
+++ b/apps/whispering/src/lib/services/tray.ts
@@ -1,6 +1,7 @@
-import { goto } from '$app/navigation';
 // import { extension } from '@repo/extension';
 import type { WhisperingRecordingState } from '$lib/constants/audio';
+
+import { goto } from '$app/navigation';
 import { Menu, MenuItem } from '@tauri-apps/api/menu';
 import { resolveResource } from '@tauri-apps/api/path';
 import { TrayIcon } from '@tauri-apps/api/tray';
@@ -12,17 +13,37 @@ import { type Err, Ok, tryAsync } from 'wellcrafted/result';
 
 const TRAY_ID = 'whispering-tray';
 
-const { SetTrayIconServiceError, SetTrayIconServiceErr } = createTaggedError(
+const { SetTrayIconServiceErr, SetTrayIconServiceError } = createTaggedError(
 	'SetTrayIconServiceError',
 );
-type SetTrayIconServiceError = ReturnType<typeof SetTrayIconServiceError>;
-
 type SetTrayIconService = {
 	setTrayIcon: (
 		icon: WhisperingRecordingState,
-	) => Promise<Ok<void> | Err<SetTrayIconServiceError>>;
+	) => Promise<Err<SetTrayIconServiceError> | Ok<void>>;
 };
 
+type SetTrayIconServiceError = ReturnType<typeof SetTrayIconServiceError>;
+
+export function createTrayIconDesktopService(): SetTrayIconService {
+	const trayPromise = initTray();
+	return {
+		setTrayIcon: (recorderState: WhisperingRecordingState) =>
+			tryAsync({
+				mapErr: (error) =>
+					SetTrayIconServiceErr({
+						cause: error,
+						context: { icon: recorderState },
+						message: 'Failed to set tray icon',
+					}),
+				try: async () => {
+					const iconPath = await getIconPath(recorderState);
+					const tray = await trayPromise;
+					return tray.setIcon(iconPath);
+				},
+			}),
+	};
+}
+
 export function createTrayIconWebService(): SetTrayIconService {
 	return {
 		setTrayIcon: async (icon: WhisperingRecordingState) => {
@@ -40,24 +61,12 @@ export function createTrayIconWebService(): SetTrayIconService {
 	};
 }
 
-export function createTrayIconDesktopService(): SetTrayIconService {
-	const trayPromise = initTray();
-	return {
-		setTrayIcon: (recorderState: WhisperingRecordingState) =>
-			tryAsync({
-				try: async () => {
-					const iconPath = await getIconPath(recorderState);
-					const tray = await trayPromise;
-					return tray.setIcon(iconPath);
-				},
-				mapErr: (error) =>
-					SetTrayIconServiceErr({
-						message: 'Failed to set tray icon',
-						context: { icon: recorderState },
-						cause: error,
-					}),
-			}),
-	};
+async function getIconPath(recorderState: WhisperingRecordingState) {
+	const iconPaths = {
+		IDLE: 'recorder-state-icons/studio_microphone.png',
+		RECORDING: 'recorder-state-icons/red_large_square.png',
+	} as const satisfies Record<WhisperingRecordingState, string>;
+	return await resolveResource(iconPaths[recorderState]);
 }
 
 async function initTray() {
@@ -68,41 +77,37 @@ async function initTray() {
 		items: [
 			// Window Controls Section
 			await MenuItem.new({
+				action: () => getCurrentWindow().show(),
 				id: 'show',
 				text: 'Show Window',
-				action: () => getCurrentWindow().show(),
 			}),
 
 			await MenuItem.new({
+				action: () => getCurrentWindow().hide(),
 				id: 'hide',
 				text: 'Hide Window',
-				action: () => getCurrentWindow().hide(),
 			}),
 
 			// Settings Section
 			await MenuItem.new({
-				id: 'settings',
-				text: 'Settings',
 				action: () => {
 					goto('/settings');
 					return getCurrentWindow().show();
 				},
+				id: 'settings',
+				text: 'Settings',
 			}),
 
 			// Quit Section
 			await MenuItem.new({
+				action: () => void exit(0),
 				id: 'quit',
 				text: 'Quit',
-				action: () => void exit(0),
 			}),
 		],
 	});
 
 	const tray = await TrayIcon.new({
-		id: TRAY_ID,
-		icon: await getIconPath('IDLE'),
-		menu: trayMenu,
-		menuOnLeftClick: false,
 		action: (e) => {
 			if (
 				e.type === 'Click' &&
@@ -114,19 +119,15 @@ async function initTray() {
 			}
 			return false;
 		},
+		icon: await getIconPath('IDLE'),
+		id: TRAY_ID,
+		menu: trayMenu,
+		menuOnLeftClick: false,
 	});
 
 	return tray;
 }
 
-async function getIconPath(recorderState: WhisperingRecordingState) {
-	const iconPaths = {
-		IDLE: 'recorder-state-icons/studio_microphone.png',
-		RECORDING: 'recorder-state-icons/red_large_square.png',
-	} as const satisfies Record<WhisperingRecordingState, string>;
-	return await resolveResource(iconPaths[recorderState]);
-}
-
 export const TrayIconServiceLive = window.__TAURI_INTERNALS__
 	? createTrayIconDesktopService()
 	: createTrayIconWebService();
diff --git a/apps/whispering/src/lib/services/types.ts b/apps/whispering/src/lib/services/types.ts
index c9ca2e6ff4..cf80209976 100644
--- a/apps/whispering/src/lib/services/types.ts
+++ b/apps/whispering/src/lib/services/types.ts
@@ -2,35 +2,36 @@ import type { Brand } from 'wellcrafted/brand';
 import type { Result } from 'wellcrafted/result';
 
 /**
- * Callback function for providing real-time status updates during multi-step recording operations.
- * These status messages become user-facing toast notifications that provide encouraging progress
- * feedback during recording workflows. The messages are displayed as loading toasts in the UI,
- * helping users understand what's happening during potentially long-running operations.
+ * Represents an audio recording device with both a unique identifier and human-readable label.
  *
- * @example
- * ```typescript
- * // Good: User-friendly with emoji and encouraging tone
- * sendStatus({
- *   title: '🎙️ Starting Recording',
- *   description: 'Setting up your microphone...'
- * });
+ * On Web (Navigator API):
+ *   - `id`: The unique deviceId from MediaDeviceInfo (e.g., "default" or a GUID)
+ *   - `label`: The human-readable device label (e.g., "Built-in Microphone")
  *
- * sendStatus({
- *   title: '✅ Recording Saved',
- *   description: 'Your recording is ready for transcription!'
- * });
+ * On Desktop (CPAL):
+ *   - `id`: The device name (e.g., "MacBook Pro Microphone")
+ *   - `label`: The same device name (identical to id for desktop)
  *
- * // Bad: Technical language, no emoji, not encouraging
- * sendStatus({
- *   title: 'Initializing MediaStream',
- *   description: 'getUserMedia() call in progress'
- * });
- * ```
+ * This separation allows for better UX (showing readable names) while maintaining
+ * stable identifiers for settings persistence.
+ *
+ * @example
+ * // Web device
+ * const device: Device = {
+ *   id: "8a7b9c..." as DeviceIdentifier,
+ *   label: "Blue Yeti USB Microphone"
+ * };
+ *
+ * // Desktop device
+ * const device: Device = {
+ *   id: "MacBook Pro Microphone" as DeviceIdentifier,
+ *   label: "MacBook Pro Microphone"
+ * };
  */
-export type UpdateStatusMessageFn = (args: {
-	title: string;
-	description: string;
-}) => void;
+export type Device = {
+	id: DeviceIdentifier;
+	label: string;
+};
 
 /**
  * Device acquisition outcome after attempting to connect to a recording device.
@@ -63,14 +64,38 @@ export type UpdateStatusMessageFn = (args: {
  */
 export type DeviceAcquisitionOutcome =
 	| {
-			outcome: 'success';
-	  }
-	| {
+			fallbackDeviceId: DeviceIdentifier;
 			outcome: 'fallback';
 			reason: 'no-device-selected' | 'preferred-device-unavailable';
-			fallbackDeviceId: DeviceIdentifier;
+	  }
+	| {
+			outcome: 'success';
 	  };
 
+/**
+ * Platform-agnostic device identifier for audio recording devices.
+ *
+ * On Web (Navigator API):
+ *   - This is the unique `deviceId` from MediaDeviceInfo (e.g., "default" or a GUID)
+ *   - NOT the device label. We use the actual deviceId for uniqueness
+ *
+ * On Desktop (CPAL):
+ *   - This is the device name as a string (e.g., "MacBook Pro Microphone")
+ *   - The name serves as both identifier and label
+ *
+ * While these represent different concepts on each platform, they serve the same
+ * purpose: uniquely identifying a recording device for selection and persistence.
+ * The branded type ensures type safety and makes the dual nature explicit.
+ *
+ * @example
+ * // Web: Stores the deviceId (unique identifier, NOT the label)
+ * const deviceIdentifier: DeviceIdentifier = "8a7b9c..." as DeviceIdentifier;
+ *
+ * // Desktop: Stores the device name (which is both ID and label)
+ * const deviceIdentifier: DeviceIdentifier = "MacBook Pro Microphone" as DeviceIdentifier;
+ */
+export type DeviceIdentifier = Brand<'DeviceIdentifier'> & string;
+
 /**
  * Common recording service interface that both manual and CPAL recorders implement.
  *
@@ -82,6 +107,11 @@ export type DeviceAcquisitionOutcome =
  * to provide real-time progress feedback to users through toast notifications.
  */
 export type RecordingService = {
+	/**
+	 * Cancel the current recording without saving
+	 */
+	cancelRecording(): Promise<Result<void, unknown>>;
+
 	/**
 	 * Enumerate available recording devices
 	 * @returns Array of device names/labels as identifiers
@@ -95,8 +125,8 @@ export type RecordingService = {
 	 * @returns Information about device acquisition outcome
 	 */
 	startRecording(params: {
-		selectedDeviceId: DeviceIdentifier | null;
 		recordingId: string;
+		selectedDeviceId: DeviceIdentifier | null;
 		// Platform-specific params can be added here
 	}): Promise<Result<DeviceAcquisitionOutcome, unknown>>;
 
@@ -105,68 +135,38 @@ export type RecordingService = {
 	 * @returns The recorded audio as a Blob
 	 */
 	stopRecording(): Promise<Result<Blob, unknown>>;
-
-	/**
-	 * Cancel the current recording without saving
-	 */
-	cancelRecording(): Promise<Result<void, unknown>>;
 };
 
 /**
- * Platform-agnostic device identifier for audio recording devices.
- *
- * On Web (Navigator API):
- *   - This is the unique `deviceId` from MediaDeviceInfo (e.g., "default" or a GUID)
- *   - NOT the device label. We use the actual deviceId for uniqueness
- *
- * On Desktop (CPAL):
- *   - This is the device name as a string (e.g., "MacBook Pro Microphone")
- *   - The name serves as both identifier and label
- *
- * While these represent different concepts on each platform, they serve the same
- * purpose: uniquely identifying a recording device for selection and persistence.
- * The branded type ensures type safety and makes the dual nature explicit.
+ * Callback function for providing real-time status updates during multi-step recording operations.
+ * These status messages become user-facing toast notifications that provide encouraging progress
+ * feedback during recording workflows. The messages are displayed as loading toasts in the UI,
+ * helping users understand what's happening during potentially long-running operations.
  *
  * @example
- * // Web: Stores the deviceId (unique identifier, NOT the label)
- * const deviceIdentifier: DeviceIdentifier = "8a7b9c..." as DeviceIdentifier;
- *
- * // Desktop: Stores the device name (which is both ID and label)
- * const deviceIdentifier: DeviceIdentifier = "MacBook Pro Microphone" as DeviceIdentifier;
- */
-export type DeviceIdentifier = string & Brand<'DeviceIdentifier'>;
-
-/**
- * Represents an audio recording device with both a unique identifier and human-readable label.
- *
- * On Web (Navigator API):
- *   - `id`: The unique deviceId from MediaDeviceInfo (e.g., "default" or a GUID)
- *   - `label`: The human-readable device label (e.g., "Built-in Microphone")
- *
- * On Desktop (CPAL):
- *   - `id`: The device name (e.g., "MacBook Pro Microphone")
- *   - `label`: The same device name (identical to id for desktop)
- *
- * This separation allows for better UX (showing readable names) while maintaining
- * stable identifiers for settings persistence.
+ * ```typescript
+ * // Good: User-friendly with emoji and encouraging tone
+ * sendStatus({
+ *   title: '🎙️ Starting Recording',
+ *   description: 'Setting up your microphone...'
+ * });
  *
- * @example
- * // Web device
- * const device: Device = {
- *   id: "8a7b9c..." as DeviceIdentifier,
- *   label: "Blue Yeti USB Microphone"
- * };
+ * sendStatus({
+ *   title: '✅ Recording Saved',
+ *   description: 'Your recording is ready for transcription!'
+ * });
  *
- * // Desktop device
- * const device: Device = {
- *   id: "MacBook Pro Microphone" as DeviceIdentifier,
- *   label: "MacBook Pro Microphone"
- * };
+ * // Bad: Technical language, no emoji, not encouraging
+ * sendStatus({
+ *   title: 'Initializing MediaStream',
+ *   description: 'getUserMedia() call in progress'
+ * });
+ * ```
  */
-export type Device = {
-	id: DeviceIdentifier;
-	label: string;
-};
+export type UpdateStatusMessageFn = (args: {
+	description: string;
+	title: string;
+}) => void;
 
 /**
  * Type guard to convert a string to DeviceIdentifier
diff --git a/apps/whispering/src/lib/services/vad-recorder.ts b/apps/whispering/src/lib/services/vad-recorder.ts
index 6ce4725a83..796bee7645 100644
--- a/apps/whispering/src/lib/services/vad-recorder.ts
+++ b/apps/whispering/src/lib/services/vad-recorder.ts
@@ -1,17 +1,22 @@
 import type { VadState } from '$lib/constants/audio';
+
 import { MicVAD, utils } from '@ricky0123/vad-web';
 import { createTaggedError, extractErrorMessage } from 'wellcrafted/error';
 import { Err, Ok, tryAsync, trySync } from 'wellcrafted/result';
-import { cleanupRecordingStream, getRecordingStream } from './device-stream';
+
 import type { DeviceIdentifier } from './types';
 
-const { VadRecorderServiceError, VadRecorderServiceErr } = createTaggedError(
+import { cleanupRecordingStream, getRecordingStream } from './device-stream';
+
+const { VadRecorderServiceErr, VadRecorderServiceError } = createTaggedError(
 	'VadRecorderServiceError',
 );
 export type VadRecorderServiceError = ReturnType<
 	typeof VadRecorderServiceError
 >;
 
+export type VadService = ReturnType<typeof createVadService>;
+
 export function createVadService() {
 	let maybeVad: MicVAD | null = null;
 	let vadState: VadState = 'IDLE';
@@ -24,22 +29,22 @@ export function createVadService() {
 
 		startActiveListening: async ({
 			deviceId,
-			onSpeechStart,
 			onSpeechEnd,
-			onVADMisfire,
 			onSpeechRealStart,
-		}: {
+			onSpeechStart,
+			onVADMisfire,
+		}: Pick<MicVAD['options'], 'onSpeechRealStart' | 'onVADMisfire'> & {
 			deviceId: DeviceIdentifier | null;
-			onSpeechStart: () => void;
 			onSpeechEnd: (blob: Blob) => void;
-		} & Pick<MicVAD['options'], 'onVADMisfire' | 'onSpeechRealStart'>) => {
+			onSpeechStart: () => void;
+		}) => {
 			// Always start fresh - no reuse
 			if (maybeVad) {
 				return VadRecorderServiceErr({
+					cause: undefined,
+					context: { vadState },
 					message:
 						'VAD already active. Stop the current session before starting a new one.',
-					context: { vadState },
-					cause: undefined,
 				});
 			}
 			console.log('Starting VAD recording');
@@ -56,45 +61,45 @@ export function createVadService() {
 			console.log('Stream error', streamError);
 			if (streamError) {
 				return VadRecorderServiceErr({
-					message: streamError.message,
-					context: streamError.context,
 					cause: streamError,
+					context: streamError.context,
+					message: streamError.message,
 				});
 			}
 
-			const { stream, deviceOutcome } = streamResult;
+			const { deviceOutcome, stream } = streamResult;
 			currentStream = stream;
 
 			// Create VAD with the validated stream
 			const { data: newVad, error: initializeVadError } = await tryAsync({
+				mapErr: (error) =>
+					VadRecorderServiceErr({
+						cause: error,
+						context: { deviceId },
+						message:
+							'Failed to start voice activated capture. Your voice activated capture could not be started.',
+					}),
 				try: () =>
 					MicVAD.new({
-						stream, // Pass our validated stream directly
-						submitUserSpeechOnPause: true,
-						onSpeechStart: () => {
-							vadState = 'SPEECH_DETECTED';
-							onSpeechStart();
-						},
+						model: 'v5',
 						onSpeechEnd: (audio) => {
 							vadState = 'LISTENING';
 							const wavBuffer = utils.encodeWAV(audio);
 							const blob = new Blob([wavBuffer], { type: 'audio/wav' });
 							onSpeechEnd(blob);
 						},
-						onVADMisfire: () => {
-							onVADMisfire();
-						},
 						onSpeechRealStart: () => {
 							onSpeechRealStart();
 						},
-						model: 'v5',
-					}),
-				mapErr: (error) =>
-					VadRecorderServiceErr({
-						message:
-							'Failed to start voice activated capture. Your voice activated capture could not be started.',
-						context: { deviceId },
-						cause: error,
+						onSpeechStart: () => {
+							vadState = 'SPEECH_DETECTED';
+							onSpeechStart();
+						},
+						onVADMisfire: () => {
+							onVADMisfire();
+						},
+						stream, // Pass our validated stream directly
+						submitUserSpeechOnPause: true,
 					}),
 			});
 
@@ -107,24 +112,24 @@ export function createVadService() {
 
 			// Start listening
 			const { error: startError } = trySync({
-				try: () => newVad.start(),
 				mapErr: (error) =>
 					VadRecorderServiceErr({
-						message: `Failed to start Voice Activity Detector. ${extractErrorMessage(error)}`,
-						context: { vadState },
 						cause: error,
+						context: { vadState },
+						message: `Failed to start Voice Activity Detector. ${extractErrorMessage(error)}`,
 					}),
+				try: () => newVad.start(),
 			});
 			if (startError) {
 				// Clean up everything on start error
 				trySync({
-					try: () => newVad.destroy(),
 					mapErr: (error) =>
 						VadRecorderServiceErr({
-							message: `Failed to destroy Voice Activity Detector. ${extractErrorMessage(error)}`,
-							context: { vadState },
 							cause: error,
+							context: { vadState },
+							message: `Failed to destroy Voice Activity Detector. ${extractErrorMessage(error)}`,
 						}),
+					try: () => newVad.destroy(),
 				});
 				cleanupRecordingStream(stream);
 				maybeVad = null;
@@ -142,13 +147,13 @@ export function createVadService() {
 
 			const vad = maybeVad;
 			const { error: destroyError } = trySync({
-				try: () => vad.destroy(),
 				mapErr: (error) =>
 					VadRecorderServiceErr({
-						message: `Failed to stop Voice Activity Detector. ${extractErrorMessage(error)}`,
-						context: { vadState },
 						cause: error,
+						context: { vadState },
+						message: `Failed to stop Voice Activity Detector. ${extractErrorMessage(error)}`,
 					}),
+				try: () => vad.destroy(),
 			});
 
 			// Always clean up, even if destroy had an error
@@ -167,6 +172,4 @@ export function createVadService() {
 	};
 }
 
-export type VadService = ReturnType<typeof createVadService>;
-
 export const VadServiceLive = createVadService();
diff --git a/apps/whispering/src/lib/settings/settings.ts b/apps/whispering/src/lib/settings/settings.ts
index e387f8bc3b..fdce4907e7 100644
--- a/apps/whispering/src/lib/settings/settings.ts
+++ b/apps/whispering/src/lib/settings/settings.ts
@@ -30,6 +30,12 @@
  */
 
 import type { Command } from '$lib/commands';
+import type { WhisperingSoundNames } from '$lib/constants/sounds';
+import type { DeepgramModel } from '$lib/services/transcription/deepgram';
+import type { ElevenLabsModel } from '$lib/services/transcription/elevenlabs';
+import type { GroqModel } from '$lib/services/transcription/groq';
+import type { OpenAIModel } from '$lib/services/transcription/openai';
+
 import {
 	BITRATE_VALUES_KBPS,
 	DEFAULT_BITRATE_KBPS,
@@ -37,15 +43,10 @@ import {
 } from '$lib/constants/audio';
 import { CommandOrAlt, CommandOrControl } from '$lib/constants/keyboard';
 import { SUPPORTED_LANGUAGES } from '$lib/constants/languages';
-import type { WhisperingSoundNames } from '$lib/constants/sounds';
 import { TRANSCRIPTION_SERVICE_IDS } from '$lib/constants/transcription';
-import type { ElevenLabsModel } from '$lib/services/transcription/elevenlabs';
-import type { GroqModel } from '$lib/services/transcription/groq';
-import type { OpenAIModel } from '$lib/services/transcription/openai';
 import { ALWAYS_ON_TOP_VALUES } from '$lib/constants/ui';
 import { asDeviceIdentifier } from '$lib/services/types';
-import { type ZodBoolean, type ZodString, z } from 'zod';
-import type { DeepgramModel } from '$lib/services/transcription/deepgram';
+import { z, type ZodBoolean, type ZodString } from 'zod';
 
 /**
  * The main settings schema that defines all application settings.
@@ -75,42 +76,51 @@ import type { DeepgramModel } from '$lib/services/transcription/deepgram';
  */
 export const settingsSchema = z.object({
 	...({
+		'sound.playOn.manual-cancel': z.boolean().default(true),
 		'sound.playOn.manual-start': z.boolean().default(true),
 		'sound.playOn.manual-stop': z.boolean().default(true),
-		'sound.playOn.manual-cancel': z.boolean().default(true),
-		'sound.playOn.vad-start': z.boolean().default(true),
-		'sound.playOn.vad-capture': z.boolean().default(true),
-		'sound.playOn.vad-stop': z.boolean().default(true),
 		'sound.playOn.transcriptionComplete': z.boolean().default(true),
 		'sound.playOn.transformationComplete': z.boolean().default(true),
+		'sound.playOn.vad-capture': z.boolean().default(true),
+		'sound.playOn.vad-start': z.boolean().default(true),
+		'sound.playOn.vad-stop': z.boolean().default(true),
 	} satisfies Record<
 		`sound.playOn.${WhisperingSoundNames}`,
 		z.ZodDefault<ZodBoolean>
 	>),
 
-	'transcription.copyToClipboardOnSuccess': z.boolean().default(true),
-	'transcription.writeToCursorOnSuccess': z.boolean().default(true),
-	'transformation.copyToClipboardOnSuccess': z.boolean().default(true),
-	'transformation.writeToCursorOnSuccess': z.boolean().default(false),
+	// Analytics settings
+	'analytics.enabled': z.boolean().default(true),
+	'apiKeys.anthropic': z.string().default(''),
+	'apiKeys.deepgram': z.string().default(''),
+	'apiKeys.elevenlabs': z.string().default(''),
 
-	'system.alwaysOnTop': z.enum(ALWAYS_ON_TOP_VALUES).default('Never'),
+	'apiKeys.google': z.string().default(''),
+
+	'apiKeys.groq': z.string().default(''),
+	'apiKeys.openai': z.string().default(''),
 
-	'database.recordingRetentionStrategy': z
-		.enum(['keep-forever', 'limit-count'])
-		.default('keep-forever'),
 	'database.maxRecordingCount': z
 		.string()
 		.regex(/^\d+$/, 'Must be a number')
 		.default('100'),
-
-	// Recording mode settings
-	'recording.mode': z.enum(RECORDING_MODES).default('manual'),
+	'database.recordingRetentionStrategy': z
+		.enum(['keep-forever', 'limit-count'])
+		.default('keep-forever'),
 	/**
 	 * Recording backend to use in desktop app.
 	 * - 'native': Uses Rust audio recording backend (CPAL)
 	 * - 'browser': Uses browser MediaRecorder API even in desktop
 	 */
 	'recording.backend': z.enum(['native', 'browser']).default('browser'),
+
+	// Desktop recording settings
+	'recording.desktop.outputFolder': z.string().nullable().default(null), // null = use app data dir
+
+	'recording.desktop.sampleRate': z
+		.enum(['16000', '44100', '48000'])
+		.default('16000'),
+
 	/**
 	 * Device identifier for manual recording.
 	 * Can be either a desktop device identifier or navigator device ID.
@@ -121,7 +131,14 @@ export const settingsSchema = z.object({
 		.nullable()
 		.transform((val) => (val ? asDeviceIdentifier(val) : null))
 		.default(null),
+	// Recording mode settings
+	'recording.mode': z.enum(RECORDING_MODES).default('manual'),
 
+	// Browser recording settings (used when browser backend is selected)
+	'recording.navigator.bitrateKbps': z
+		.enum(BITRATE_VALUES_KBPS)
+		.optional()
+		.default(DEFAULT_BITRATE_KBPS),
 	/**
 	 * Device identifier for VAD recording.
 	 * Always a navigator device ID due to the nature of VAD recording
@@ -133,101 +150,104 @@ export const settingsSchema = z.object({
 		.nullable()
 		.transform((val) => (val ? asDeviceIdentifier(val) : null))
 		.default(null),
-
-	// Browser recording settings (used when browser backend is selected)
-	'recording.navigator.bitrateKbps': z
-		.enum(BITRATE_VALUES_KBPS)
-		.optional()
-		.default(DEFAULT_BITRATE_KBPS),
-
-	// Desktop recording settings
-	'recording.desktop.outputFolder': z.string().nullable().default(null), // null = use app data dir
-	'recording.desktop.sampleRate': z
-		.enum(['16000', '44100', '48000'])
-		.default('16000'),
-
-	'transcription.selectedTranscriptionService': z
-		.enum(TRANSCRIPTION_SERVICE_IDS)
-		.default('whispercpp'),
-	// Shared settings in transcription
-	'transcription.outputLanguage': z.enum(SUPPORTED_LANGUAGES).default('auto'),
-	'transcription.prompt': z.string().default(''),
-	'transcription.temperature': z.string().default('0.0'),
-
-	// Service-specific settings
-	'transcription.openai.model': z
+	'system.alwaysOnTop': z.enum(ALWAYS_ON_TOP_VALUES).default('Never'),
+	'transcription.copyToClipboardOnSuccess': z.boolean().default(true),
+	'transcription.deepgram.model': z
 		.string()
-		.transform((val) => val as (string & {}) | OpenAIModel['name'])
-		.default('gpt-4o-mini-transcribe' satisfies OpenAIModel['name']),
+		.transform((val) => val as DeepgramModel['name'] | (string & {}))
+		.default('nova-3' satisfies DeepgramModel['name']),
 	'transcription.elevenlabs.model': z
 		.string()
-		.transform((val) => val as (string & {}) | ElevenLabsModel['name'])
+		.transform((val) => val as ElevenLabsModel['name'] | (string & {}))
 		.default('scribe_v1' satisfies ElevenLabsModel['name']),
+
+	'transcription.favoriteLanguages': z
+		.array(z.enum(SUPPORTED_LANGUAGES))
+		.min(1)
+		.max(3)
+		.default(['en', 'ja', 'zh'])
+		.refine((langs) => new Set(langs).size === langs.length, {
+			message: 'Favorite languages must be unique',
+		}),
 	'transcription.groq.model': z
 		.string()
-		.transform((val) => val as (string & {}) | GroqModel['name'])
+		.transform((val) => val as GroqModel['name'] | (string & {}))
 		.default('whisper-large-v3-turbo' satisfies GroqModel['name']),
-	'transcription.deepgram.model': z
+	'transcription.languageToggleMode': z
+		.enum(['cycle', 'direct'])
+		.default('cycle'),
+	// Service-specific settings
+	'transcription.openai.model': z
 		.string()
-		.transform((val) => val as (string & {}) | DeepgramModel['name'])
-		.default('nova-3' satisfies DeepgramModel['name']),
+		.transform((val) => val as OpenAIModel['name'] | (string & {}))
+		.default('gpt-4o-mini-transcribe' satisfies OpenAIModel['name']),
+	// Shared settings in transcription
+	'transcription.outputLanguage': z.enum(SUPPORTED_LANGUAGES).default('auto'),
+	'transcription.prompt': z.string().default(''),
+	'transcription.selectedTranscriptionService': z
+		.enum(TRANSCRIPTION_SERVICE_IDS)
+		.default('whispercpp'),
 	'transcription.speaches.baseUrl': z.string().default('http://localhost:8000'),
+
 	'transcription.speaches.modelId': z
 		.string()
 		.default('Systran/faster-distil-whisper-small.en'),
+
+	'transcription.temperature': z.string().default('0.0'),
 	'transcription.whispercpp.modelPath': z.string().default(''),
 	'transcription.whispercpp.useGpu': z.boolean().default(true),
+	'transcription.writeToCursorOnSuccess': z.boolean().default(true),
+	'transformation.copyToClipboardOnSuccess': z.boolean().default(true),
+	'transformation.writeToCursorOnSuccess': z.boolean().default(false),
 
 	'transformations.selectedTransformationId': z
 		.string()
 		.nullable()
 		.default(null),
 
-	'apiKeys.openai': z.string().default(''),
-	'apiKeys.anthropic': z.string().default(''),
-	'apiKeys.groq': z.string().default(''),
-	'apiKeys.google': z.string().default(''),
-	'apiKeys.deepgram': z.string().default(''),
-	'apiKeys.elevenlabs': z.string().default(''),
-
-	// Analytics settings
-	'analytics.enabled': z.boolean().default(true),
-
 	...({
-		'shortcuts.local.toggleManualRecording': z.string().nullable().default(' '),
-		'shortcuts.local.startManualRecording': z.string().nullable().default(null),
-		'shortcuts.local.stopManualRecording': z.string().nullable().default(null),
 		'shortcuts.local.cancelManualRecording': z.string().nullable().default('c'),
-		'shortcuts.local.toggleVadRecording': z.string().nullable().default('v'),
+		'shortcuts.local.pushToTalk': z.string().nullable().default('p'),
+		'shortcuts.local.setOutputLanguageSlot1': z.string().nullable().default(null),
+		'shortcuts.local.setOutputLanguageSlot2': z.string().nullable().default(null),
+		'shortcuts.local.setOutputLanguageSlot3': z.string().nullable().default(null),
+		'shortcuts.local.startManualRecording': z.string().nullable().default(null),
 		'shortcuts.local.startVadRecording': z.string().nullable().default(null),
+		'shortcuts.local.stopManualRecording': z.string().nullable().default(null),
 		'shortcuts.local.stopVadRecording': z.string().nullable().default(null),
-		'shortcuts.local.pushToTalk': z.string().nullable().default('p'),
+		'shortcuts.local.toggleManualRecording': z.string().nullable().default(' '),
+		'shortcuts.local.toggleOutputLanguage': z.string().nullable().default(null),
+		'shortcuts.local.toggleVadRecording': z.string().nullable().default('v'),
 	} satisfies Record<
 		`shortcuts.local.${Command['id']}`,
 		z.ZodDefault<z.ZodNullable<ZodString>>
 	>),
 
 	...({
-		'shortcuts.global.toggleManualRecording': z
+		'shortcuts.global.cancelManualRecording': z
 			.string()
 			.nullable()
-			.default(`${CommandOrControl}+Shift+;`),
-		'shortcuts.global.startManualRecording': z
+			.default(`${CommandOrControl}+Shift+'`),
+		'shortcuts.global.pushToTalk': z
 			.string()
 			.nullable()
-			.default(null),
-		'shortcuts.global.stopManualRecording': z.string().nullable().default(null),
-		'shortcuts.global.cancelManualRecording': z
+			.default(`${CommandOrAlt}+Shift+D`),
+		'shortcuts.global.setOutputLanguageSlot1': z.string().nullable().default('Shift+F1'),
+		'shortcuts.global.setOutputLanguageSlot2': z.string().nullable().default('Shift+F2'),
+		'shortcuts.global.setOutputLanguageSlot3': z.string().nullable().default('Shift+F3'),
+		'shortcuts.global.startManualRecording': z
 			.string()
 			.nullable()
-			.default(`${CommandOrControl}+Shift+'`),
-		'shortcuts.global.toggleVadRecording': z.string().nullable().default(null),
+			.default(null),
 		'shortcuts.global.startVadRecording': z.string().nullable().default(null),
+		'shortcuts.global.stopManualRecording': z.string().nullable().default(null),
 		'shortcuts.global.stopVadRecording': z.string().nullable().default(null),
-		'shortcuts.global.pushToTalk': z
+		'shortcuts.global.toggleManualRecording': z
 			.string()
 			.nullable()
-			.default(`${CommandOrAlt}+Shift+D`),
+			.default(`${CommandOrControl}+Shift+;`),
+		'shortcuts.global.toggleOutputLanguage': z.string().nullable().default(null),
+		'shortcuts.global.toggleVadRecording': z.string().nullable().default(null),
 	} satisfies Record<
 		`shortcuts.global.${Command['id']}`,
 		z.ZodDefault<z.ZodNullable<ZodString>>
diff --git a/apps/whispering/src/lib/settings/transcription-validation.ts b/apps/whispering/src/lib/settings/transcription-validation.ts
index 0ef1b865d0..8bda3977e9 100644
--- a/apps/whispering/src/lib/settings/transcription-validation.ts
+++ b/apps/whispering/src/lib/settings/transcription-validation.ts
@@ -32,14 +32,14 @@ export function isTranscriptionServiceConfigured(
 			const apiKey = settings.value[service.apiKeyField];
 			return apiKey !== '';
 		}
-		case 'self-hosted': {
-			const url = settings.value[service.serverUrlField];
-			return url !== '';
-		}
 		case 'local': {
 			const modelPath = settings.value[service.modelPathField];
 			return modelPath !== '';
 		}
+		case 'self-hosted': {
+			const url = settings.value[service.serverUrlField];
+			return url !== '';
+		}
 		default: {
 			return true;
 		}
diff --git a/apps/whispering/src/lib/stores/settings.svelte.ts b/apps/whispering/src/lib/stores/settings.svelte.ts
index 244681a6f8..bbd05a9d77 100644
--- a/apps/whispering/src/lib/stores/settings.svelte.ts
+++ b/apps/whispering/src/lib/stores/settings.svelte.ts
@@ -1,17 +1,18 @@
 import { commands } from '$lib/commands';
 import { rpc } from '$lib/query';
 import {
-	type Settings,
 	getDefaultSettings,
 	parseStoredSettings,
+	type Settings,
 	settingsSchema,
 } from '$lib/settings/settings';
 import { createPersistedState } from '@repo/svelte-utils';
+import { extractErrorMessage } from 'wellcrafted/error';
+
 import {
 	syncGlobalShortcutsWithSettings,
 	syncLocalShortcutsWithSettings,
 } from '../../routes/+layout/register-commands';
-import { extractErrorMessage } from 'wellcrafted/error';
 
 /**
  * Encapsulated settings object with controlled access.
@@ -21,7 +22,6 @@ export const settings = (() => {
 	// Private settings instance
 	const _settings = createPersistedState({
 		key: 'whispering-settings',
-		schema: settingsSchema,
 		onParseError: (error) => {
 			// For empty storage, return defaults
 			if (error.type === 'storage_empty') {
@@ -48,45 +48,22 @@ export const settings = (() => {
 			// Fallback - should never reach here
 			return getDefaultSettings();
 		},
-		onUpdateSuccess: () => {
-			rpc.notify.success.execute({
-				title: 'Settings updated!',
-				description: '',
-			});
-		},
 		onUpdateError: (err) => {
 			rpc.notify.error.execute({
 				title: 'Error updating settings',
 				description: extractErrorMessage(err),
 			});
 		},
+		onUpdateSuccess: () => {
+			rpc.notify.success.execute({
+				title: 'Settings updated!',
+				description: '',
+			});
+		},
+		schema: settingsSchema,
 	});
 
 	return {
-		/**
-		 * Read-only access to current settings values
-		 */
-		get value(): Settings {
-			return _settings.value;
-		},
-
-		/**
-		 * Update multiple settings at once
-		 * @param updates Partial settings object with keys to update
-		 */
-		update(updates: Partial<Settings>) {
-			_settings.value = { ..._settings.value, ...updates };
-		},
-
-		/**
-		 * Update a single setting key
-		 * @param key The setting key to update
-		 * @param value The new value for the setting
-		 */
-		updateKey<K extends keyof Settings>(key: K, value: Settings[K]) {
-			_settings.value = { ..._settings.value, [key]: value };
-		},
-
 		/**
 		 * Reset all settings to their default values
 		 */
@@ -98,7 +75,7 @@ export const settings = (() => {
 		 * Reset shortcuts to their default values
 		 * @param type 'local' or 'global' shortcuts to reset
 		 */
-		resetShortcuts(type: 'local' | 'global') {
+		resetShortcuts(type: 'global' | 'local') {
 			const defaultSettings = getDefaultSettings();
 			const updates = commands.reduce<Partial<Settings>>((acc, command) => {
 				const shortcutKey = `shortcuts.${type}.${command.id}` as const;
@@ -112,13 +89,37 @@ export const settings = (() => {
 			};
 
 			switch (type) {
-				case 'local':
-					syncLocalShortcutsWithSettings();
-					break;
 				case 'global':
 					syncGlobalShortcutsWithSettings();
 					break;
+				case 'local':
+					syncLocalShortcutsWithSettings();
+					break;
 			}
 		},
+
+		/**
+		 * Update multiple settings at once
+		 * @param updates Partial settings object with keys to update
+		 */
+		update(updates: Partial<Settings>) {
+			_settings.value = { ..._settings.value, ...updates };
+		},
+
+		/**
+		 * Update a single setting key
+		 * @param key The setting key to update
+		 * @param value The new value for the setting
+		 */
+		updateKey<K extends keyof Settings>(key: K, value: Settings[K]) {
+			_settings.value = { ..._settings.value, [key]: value };
+		},
+
+		/**
+		 * Read-only access to current settings values
+		 */
+		get value(): Settings {
+			return _settings.value;
+		},
 	};
 })();
diff --git a/apps/whispering/src/lib/utils/createJobQueue.ts b/apps/whispering/src/lib/utils/createJobQueue.ts
index 775f6ddfbd..a545b236f7 100644
--- a/apps/whispering/src/lib/utils/createJobQueue.ts
+++ b/apps/whispering/src/lib/utils/createJobQueue.ts
@@ -23,10 +23,10 @@ export const createJobQueue = <T extends Promise<unknown>>() => {
 	};
 
 	return {
-		queue,
 		addJobToQueue: (job: () => T) => {
 			queue.push(job());
 			processJobQueue();
 		},
+		queue,
 	};
 };
diff --git a/apps/whispering/src/lib/utils/createPressedKeys.svelte.ts b/apps/whispering/src/lib/utils/createPressedKeys.svelte.ts
index 1de7e0b67d..4977cb0fc0 100644
--- a/apps/whispering/src/lib/utils/createPressedKeys.svelte.ts
+++ b/apps/whispering/src/lib/utils/createPressedKeys.svelte.ts
@@ -1,12 +1,14 @@
 import {
-	type KeyboardEventPossibleKey,
 	isSupportedKey,
+	type KeyboardEventPossibleKey,
 	normalizeOptionKeyCharacter,
 } from '$lib/constants/keyboard';
 import { IS_MACOS } from '$lib/constants/platform';
 import { on } from 'svelte/events';
 import { createSubscriber } from 'svelte/reactivity';
 
+export type PressedKeys = ReturnType<typeof createPressedKeys>;
+
 /**
  * Creates a reactive state manager for tracking pressed keyboard keys.
  *
@@ -34,16 +36,16 @@ import { createSubscriber } from 'svelte/reactivity';
  * ```
  */
 export function createPressedKeys({
-	preventDefault = true,
 	onUnsupportedKey,
+	preventDefault = true,
 }: {
+	onUnsupportedKey?: (key: KeyboardEventPossibleKey) => void;
 	/**
 	 * Whether to call preventDefault() on keydown events.
 	 * - true (default): Blocks browser shortcuts (e.g., Ctrl+S won't save the page)
 	 * - false: Allows browser shortcuts to execute alongside key tracking
 	 */
 	preventDefault?: boolean;
-	onUnsupportedKey?: (key: KeyboardEventPossibleKey) => void;
 }) {
 	/**
 	 * Pressed and normalized keys, internally stored and synced via createSubscriber.
@@ -153,5 +155,3 @@ export function createPressedKeys({
 		},
 	};
 }
-
-export type PressedKeys = ReturnType<typeof createPressedKeys>;
diff --git a/apps/whispering/src/lib/utils/createTransformationViewTransitionName.ts b/apps/whispering/src/lib/utils/createTransformationViewTransitionName.ts
index 9e0a6ff3d7..ccfe6ba11c 100644
--- a/apps/whispering/src/lib/utils/createTransformationViewTransitionName.ts
+++ b/apps/whispering/src/lib/utils/createTransformationViewTransitionName.ts
@@ -1,7 +1,7 @@
 export function createTransformationViewTransitionName({
 	transformationId,
 }: {
-	transformationId: string | null;
+	transformationId: null | string;
 }): string {
 	return `transformation-${transformationId ?? 'none'}`;
 }
diff --git a/apps/whispering/src/lib/utils/getRecordingTransitionId.ts b/apps/whispering/src/lib/utils/getRecordingTransitionId.ts
index 4c59e04e07..49d2acf825 100644
--- a/apps/whispering/src/lib/utils/getRecordingTransitionId.ts
+++ b/apps/whispering/src/lib/utils/getRecordingTransitionId.ts
@@ -1,21 +1,21 @@
 import type { Recording, TransformationRun } from '$lib/services/db';
 
 export function getRecordingTransitionId({
-	recordingId,
 	propertyName,
+	recordingId,
 }: {
+	propertyName: 'latestTransformationRunOutput' | keyof Recording;
 	recordingId: string;
-	propertyName: keyof Recording | 'latestTransformationRunOutput';
 }): string {
 	return `recording-${recordingId}-${propertyName}` as const;
 }
 
 export function getTransformationStepRunTransitionId({
-	stepRunId,
 	propertyName,
+	stepRunId,
 }: {
-	stepRunId: string;
 	propertyName: keyof TransformationRun;
+	stepRunId: string;
 }): string {
 	return `transformation-run-${stepRunId}-${propertyName}` as const;
 }
diff --git a/apps/whispering/src/routes/(config)/+layout.svelte b/apps/whispering/src/routes/(config)/+layout.svelte
index 3e39de5378..36ec3e229e 100644
--- a/apps/whispering/src/routes/(config)/+layout.svelte
+++ b/apps/whispering/src/routes/(config)/+layout.svelte
@@ -1,12 +1,12 @@
 <script lang="ts">
 	import { commandCallbacks } from '$lib/commands';
 	import NavItems from '$lib/components/NavItems.svelte';
-	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import {
 		DeviceSelector,
 		TranscriptionSelector,
 		TransformationSelector,
 	} from '$lib/components/settings';
+	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import {
 		recorderStateToIcons,
 		vadStateToIcons,
diff --git a/apps/whispering/src/routes/(config)/desktop-app/+page.svelte b/apps/whispering/src/routes/(config)/desktop-app/+page.svelte
index 6f029a61d7..7adc20d92d 100644
--- a/apps/whispering/src/routes/(config)/desktop-app/+page.svelte
+++ b/apps/whispering/src/routes/(config)/desktop-app/+page.svelte
@@ -1,9 +1,9 @@
 <script lang="ts">
-	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import { ChromeWebStoreIcon } from '$lib/components/icons';
+	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
+	import { CommandIcon, DownloadIcon, MicIcon, ZapIcon } from '@lucide/svelte';
 	import { Button } from '@repo/ui/button';
 	import { Card } from '@repo/ui/card';
-	import { CommandIcon, DownloadIcon, MicIcon, ZapIcon } from '@lucide/svelte';
 </script>
 
 <svelte:head>
diff --git a/apps/whispering/src/routes/(config)/global-shortcut/+page.svelte b/apps/whispering/src/routes/(config)/global-shortcut/+page.svelte
index 25756248e9..c7729d1c39 100644
--- a/apps/whispering/src/routes/(config)/global-shortcut/+page.svelte
+++ b/apps/whispering/src/routes/(config)/global-shortcut/+page.svelte
@@ -1,8 +1,8 @@
 <script lang="ts">
-	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import { ChromeWebStoreIcon } from '$lib/components/icons';
-	import { Button } from '@repo/ui/button';
+	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import { LaptopIcon as DesktopIcon } from '@lucide/svelte';
+	import { Button } from '@repo/ui/button';
 </script>
 
 <svelte:head>
diff --git a/apps/whispering/src/routes/(config)/install-ffmpeg/+page.svelte b/apps/whispering/src/routes/(config)/install-ffmpeg/+page.svelte
index 32fa08c5a0..2da6925d00 100644
--- a/apps/whispering/src/routes/(config)/install-ffmpeg/+page.svelte
+++ b/apps/whispering/src/routes/(config)/install-ffmpeg/+page.svelte
@@ -1,22 +1,22 @@
 <script lang="ts">
-	import { Button } from '@repo/ui/button';
-	import { Link } from '@repo/ui/link';
-	import * as Card from '@repo/ui/card';
-	import * as Alert from '@repo/ui/alert';
-	import { Snippet } from '@repo/ui/snippet';
-	import { Badge } from '@repo/ui/badge';
+	import { goto } from '$app/navigation';
+	import { rpc } from '$lib/query';
+	import * as services from '$lib/services';
 	import {
-		DownloadIcon,
 		CheckCircleIcon,
-		XCircleIcon,
+		DownloadIcon,
+		ExternalLinkIcon,
 		LoaderIcon,
 		RefreshCwIcon,
-		ExternalLinkIcon,
+		XCircleIcon,
 	} from '@lucide/svelte';
-	import * as services from '$lib/services';
-	import { goto } from '$app/navigation';
+	import * as Alert from '@repo/ui/alert';
+	import { Badge } from '@repo/ui/badge';
+	import { Button } from '@repo/ui/button';
+	import * as Card from '@repo/ui/card';
+	import { Link } from '@repo/ui/link';
+	import { Snippet } from '@repo/ui/snippet';
 	import { createQuery } from '@tanstack/svelte-query';
-	import { rpc } from '$lib/query';
 
 	const platform = services.os.type();
 
diff --git a/apps/whispering/src/routes/(config)/macos-enable-accessibility/+page.svelte b/apps/whispering/src/routes/(config)/macos-enable-accessibility/+page.svelte
index eb09898ee7..cc4815bc5f 100644
--- a/apps/whispering/src/routes/(config)/macos-enable-accessibility/+page.svelte
+++ b/apps/whispering/src/routes/(config)/macos-enable-accessibility/+page.svelte
@@ -1,12 +1,13 @@
 <script lang="ts">
+	import { rpc } from '$lib/query';
+	import * as services from '$lib/services';
+	import { CheckCircle2, SettingsIcon } from '@lucide/svelte';
 	import { Button } from '@repo/ui/button';
 	import * as Card from '@repo/ui/card';
-	import { SettingsIcon, CheckCircle2 } from '@lucide/svelte';
-	import * as services from '$lib/services';
-	import { toast } from 'svelte-sonner';
-	import { Command } from '@tauri-apps/plugin-shell';
 	import { createQuery } from '@tanstack/svelte-query';
-	import { rpc } from '$lib/query';
+	import { Command } from '@tauri-apps/plugin-shell';
+	import { toast } from 'svelte-sonner';
+
 	import type { PageData } from './$types';
 
 	let { data }: { data: PageData } = $props();
diff --git a/apps/whispering/src/routes/(config)/recordings/+page.svelte b/apps/whispering/src/routes/(config)/recordings/+page.svelte
index dc85822c4c..c83444227b 100644
--- a/apps/whispering/src/routes/(config)/recordings/+page.svelte
+++ b/apps/whispering/src/routes/(config)/recordings/+page.svelte
@@ -1,7 +1,23 @@
 <script lang="ts">
+	import type { Recording } from '$lib/services/db';
+	import type {
+		ColumnDef,
+		ColumnFiltersState,
+		PaginationState,
+	} from '@tanstack/table-core';
+
 	import { confirmationDialog } from '$lib/components/ConfirmationDialog.svelte';
-	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import { ClipboardIcon, TrashIcon } from '$lib/components/icons';
+	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
+	import { rpc } from '$lib/query';
+	import {
+		ChevronDownIcon,
+		EllipsisIcon,
+		EllipsisIcon as LoadingTranscriptionIcon,
+		RepeatIcon as RetryTranscriptionIcon,
+		PlayIcon as StartTranscriptionIcon,
+	} from '@lucide/svelte';
+	import { createPersistedState } from '@repo/svelte-utils';
 	import { Badge } from '@repo/ui/badge';
 	import { Button, buttonVariants } from '@repo/ui/button';
 	import { Card } from '@repo/ui/card';
@@ -14,42 +30,28 @@
 	import { SelectAllPopover, SortableTableHeader } from '@repo/ui/table';
 	import * as Table from '@repo/ui/table';
 	import { Textarea } from '@repo/ui/textarea';
-	import { rpc } from '$lib/query';
-	import type { Recording } from '$lib/services/db';
 	import { cn } from '@repo/ui/utils';
-	import { createPersistedState } from '@repo/svelte-utils';
 	import { createMutation, createQuery } from '@tanstack/svelte-query';
 	import {
-		FlexRender,
 		createTable as createSvelteTable,
+		FlexRender,
 		renderComponent,
 	} from '@tanstack/svelte-table';
-	import type {
-		ColumnDef,
-		ColumnFiltersState,
-		PaginationState,
-	} from '@tanstack/table-core';
 	import {
 		getCoreRowModel,
 		getFilteredRowModel,
 		getPaginationRowModel,
 		getSortedRowModel,
 	} from '@tanstack/table-core';
-	import {
-		ChevronDownIcon,
-		EllipsisIcon,
-		EllipsisIcon as LoadingTranscriptionIcon,
-		RepeatIcon as RetryTranscriptionIcon,
-		PlayIcon as StartTranscriptionIcon,
-	} from '@lucide/svelte';
+	import { format } from 'date-fns';
 	import { nanoid } from 'nanoid/non-secure';
 	import { createRawSnippet } from 'svelte';
 	import { z } from 'zod';
+
 	import LatestTransformationRunOutputByRecordingId from './LatestTransformationRunOutputByRecordingId.svelte';
 	import RenderAudioUrl from './RenderAudioUrl.svelte';
-	import TranscribedTextDialog from './TranscribedTextDialog.svelte';
 	import { RecordingRowActions } from './row-actions';
-	import { format } from 'date-fns';
+	import TranscribedTextDialog from './TranscribedTextDialog.svelte';
 
 	/**
 	 * Returns a cell renderer for a date/time column using date-fns format.
@@ -85,17 +87,14 @@
 
 	const columns: ColumnDef<Recording>[] = [
 		{
-			id: 'select',
-			header: ({ table }) =>
-				renderComponent(SelectAllPopover<Recording>, { table }),
 			cell: ({ row }) =>
 				renderComponent(Checkbox, {
+					'aria-label': 'Select row',
 					checked: row.getIsSelected(),
 					onCheckedChange: (value) => row.toggleSelected(!!value),
-					'aria-label': 'Select row',
 				}),
-			enableSorting: false,
 			enableHiding: false,
+			enableSorting: false,
 			filterFn: (row, _columnId, filterValue) => {
 				const title = String(row.getValue('title'));
 				const subtitle = String(row.getValue('subtitle'));
@@ -106,78 +105,75 @@
 					transcribedText.toLowerCase().includes(filterValue.toLowerCase())
 				);
 			},
+			header: ({ table }) =>
+				renderComponent(SelectAllPopover<Recording>, { table }),
+			id: 'select',
 		},
 		{
-			id: 'ID',
 			accessorKey: 'id',
-			header: ({ column }) =>
-				renderComponent(SortableTableHeader, { column, headerText: 'ID' }),
 			cell: ({ getValue }) => {
 				const id = getValue<string>();
 				return renderComponent(Badge, {
-					variant: 'id',
 					children: createRawSnippet(() => ({
 						render: () => id,
 					})),
+					variant: 'id',
 				});
 			},
+			header: ({ column }) =>
+				renderComponent(SortableTableHeader, { column, headerText: 'ID' }),
+			id: 'ID',
 		},
 		{
-			id: 'Title',
 			accessorKey: 'title',
 			header: ({ column }) =>
 				renderComponent(SortableTableHeader, {
 					column,
 					headerText: 'Title',
 				}),
+			id: 'Title',
 		},
 		{
-			id: 'Subtitle',
 			accessorKey: 'subtitle',
 			header: ({ column }) =>
 				renderComponent(SortableTableHeader, {
 					column,
 					headerText: 'Subtitle',
 				}),
+			id: 'Subtitle',
 		},
 		{
-			id: 'Timestamp',
 			accessorKey: 'timestamp',
+			cell: formattedCell(DATE_FORMAT),
 			header: ({ column }) =>
 				renderComponent(SortableTableHeader, {
 					column,
 					headerText: 'Timestamp',
 				}),
-			cell: formattedCell(DATE_FORMAT),
+			id: 'Timestamp',
 		},
 		{
-			id: 'Created At',
 			accessorKey: 'createdAt',
+			cell: formattedCell(DATE_FORMAT),
 			header: ({ column }) =>
 				renderComponent(SortableTableHeader, {
 					column,
 					headerText: 'Created At',
 				}),
-			cell: formattedCell(DATE_FORMAT),
+			id: 'Created At',
 		},
 		{
-			id: 'Updated At',
 			accessorKey: 'updatedAt',
+			cell: formattedCell(DATE_FORMAT),
 			header: ({ column }) =>
 				renderComponent(SortableTableHeader, {
 					column,
 					headerText: 'Updated At',
 				}),
-			cell: formattedCell(DATE_FORMAT),
+			id: 'Updated At',
 		},
 		{
-			id: 'Transcribed Text',
 			accessorKey: 'transcribedText',
-			header: ({ column }) =>
-				renderComponent(SortableTableHeader, {
-					column,
-					headerText: 'Transcribed Text',
-				}),
 			cell: ({ getValue, row }) => {
 				const transcribedText = getValue<string>();
 				if (!transcribedText) return;
@@ -186,65 +182,71 @@
 					transcribedText,
 				});
 			},
-		},
-		{
-			id: 'Latest Transformation Run Output',
-			accessorFn: ({ id }) => id,
 			header: ({ column }) =>
 				renderComponent(SortableTableHeader, {
 					column,
-					headerText: 'Latest Transformation Run Output',
+					headerText: 'Transcribed Text',
 				}),
+			id: 'Transcribed Text',
+		},
+		{
+			accessorFn: ({ id }) => id,
 			cell: ({ getValue }) => {
 				const recordingId = getValue<string>();
 				return renderComponent(LatestTransformationRunOutputByRecordingId, {
 					recordingId,
 				});
 			},
-		},
-		{
-			id: 'Audio',
-			accessorFn: ({ id, blob }) => ({ id, blob }),
 			header: ({ column }) =>
 				renderComponent(SortableTableHeader, {
 					column,
-					headerText: 'Audio',
+					headerText: 'Latest Transformation Run Output',
 				}),
-			cell: ({ getValue }) => {
-				const { id, blob } = getValue<Pick<Recording, 'id' | 'blob'>>();
-				return renderComponent(RenderAudioUrl, { id, blob });
-			},
+			id: 'Latest Transformation Run Output',
 		},
 		{
-			id: 'Actions',
-			accessorFn: (recording) => recording,
+			accessorFn: ({ blob, id }) => ({ blob, id }),
+			cell: ({ getValue }) => {
+				const { blob, id } = getValue<Pick<Recording, 'blob' | 'id'>>();
+				return renderComponent(RenderAudioUrl, { blob, id });
+			},
 			header: ({ column }) =>
 				renderComponent(SortableTableHeader, {
 					column,
-					headerText: 'Actions',
+					headerText: 'Audio',
 				}),
+			id: 'Audio',
+		},
+		{
+			accessorFn: (recording) => recording,
 			cell: ({ getValue }) => {
 				const recording = getValue<Recording>();
 				return renderComponent(RecordingRowActions, {
 					recordingId: recording.id,
 				});
 			},
+			header: ({ column }) =>
+				renderComponent(SortableTableHeader, {
+					column,
+					headerText: 'Actions',
+				}),
+			id: 'Actions',
 		},
 	];
 
 	let sorting = createPersistedState({
 		key: 'whispering-recordings-data-table-sorting',
-		onParseError: (error) => [{ id: 'timestamp', desc: true }],
+		onParseError: (error) => [{ desc: true, id: 'timestamp' }],
 		schema: z.array(z.object({ desc: z.boolean(), id: z.string() })),
 	});
 	let columnFilters = $state<ColumnFiltersState>([]);
 	let columnVisibility = createPersistedState({
 		key: 'whispering-recordings-data-table-column-visibility',
 		onParseError: (error) => ({
+			'Created At': false,
 			ID: false,
-			Title: false,
 			Subtitle: false,
-			'Created At': false,
+			Title: false,
 			'Updated At': false,
 		}),
 		schema: z.record(z.string(), z.boolean()),
@@ -258,22 +260,15 @@
 	let globalFilter = $state('');
 
 	const table = createSvelteTable({
-		getRowId: (originalRow) => originalRow.id,
+		columns,
 		get data() {
 			return getAllRecordingsQuery.data ?? [];
 		},
-		columns,
 		getCoreRowModel: getCoreRowModel(),
-		getSortedRowModel: getSortedRowModel(),
 		getFilteredRowModel: getFilteredRowModel(),
 		getPaginationRowModel: getPaginationRowModel(),
-		onSortingChange: (updater) => {
-			if (typeof updater === 'function') {
-				sorting.value = updater(sorting.value);
-			} else {
-				sorting.value = updater;
-			}
-		},
+		getRowId: (originalRow) => originalRow.id,
+		getSortedRowModel: getSortedRowModel(),
 		onColumnFiltersChange: (updater) => {
 			if (typeof updater === 'function') {
 				columnFilters = updater(columnFilters);
@@ -288,11 +283,11 @@
 				columnVisibility.value = updater;
 			}
 		},
-		onRowSelectionChange: (updater) => {
+		onGlobalFilterChange: (updater) => {
 			if (typeof updater === 'function') {
-				rowSelection.value = updater(rowSelection.value);
+				globalFilter = updater(globalFilter);
 			} else {
-				rowSelection.value = updater;
+				globalFilter = updater;
 			}
 		},
 		onPaginationChange: (updater) => {
@@ -302,31 +297,38 @@
 				pagination = updater;
 			}
 		},
-		onGlobalFilterChange: (updater) => {
+		onRowSelectionChange: (updater) => {
 			if (typeof updater === 'function') {
-				globalFilter = updater(globalFilter);
+				rowSelection.value = updater(rowSelection.value);
 			} else {
-				globalFilter = updater;
+				rowSelection.value = updater;
+			}
+		},
+		onSortingChange: (updater) => {
+			if (typeof updater === 'function') {
+				sorting.value = updater(sorting.value);
+			} else {
+				sorting.value = updater;
 			}
 		},
 		state: {
-			get sorting() {
-				return sorting.value;
-			},
 			get columnFilters() {
 				return columnFilters;
 			},
 			get columnVisibility() {
 				return columnVisibility.value;
 			},
-			get rowSelection() {
-				return rowSelection.value;
+			get globalFilter() {
+				return globalFilter;
 			},
 			get pagination() {
 				return pagination;
 			},
-			get globalFilter() {
-				return globalFilter;
+			get rowSelection() {
+				return rowSelection.value;
+			},
+			get sorting() {
+				return sorting.value;
 			},
 		},
 	});
@@ -387,21 +389,21 @@
 						onclick={() => {
 							const toastId = nanoid();
 							rpc.notify.loading.execute({
-								id: toastId,
 								title: 'Transcribing queries.recordings...',
 								description: 'This may take a while.',
+								id: toastId,
 							});
 							transcribeRecordings.mutate(
 								selectedRecordingRows.map(({ original }) => original),
 								{
-									onSuccess: ({ oks, errs }) => {
+									onSuccess: ({ errs, oks }) => {
 										const isAllSuccessful = errs.length === 0;
 										if (isAllSuccessful) {
 											const n = oks.length;
 											rpc.notify.success.execute({
-												id: toastId,
 												title: `Transcribed ${n} recording${n === 1 ? '' : 's'}!`,
 												description: `Your ${n} recording${n === 1 ? ' has' : 's have'} been transcribed successfully.`,
+												id: toastId,
 											});
 											return;
 										}
@@ -409,22 +411,22 @@
 										if (isAllFailed) {
 											const n = errs.length;
 											rpc.notify.error.execute({
-												id: toastId,
 												title: `Failed to transcribe ${n} recording${n === 1 ? '' : 's'}`,
 												description:
 													n === 1
 														? 'Your recording could not be transcribed.'
 														: 'None of your recordings could be transcribed.',
-												action: { type: 'more-details', error: errs },
+												action: { error: errs, type: 'more-details' },
+												id: toastId,
 											});
 											return;
 										}
 										// Mixed results
 										rpc.notify.warning.execute({
-											id: toastId,
 											title: `Transcribed ${oks.length} of ${oks.length + errs.length} recordings`,
 											description: `${oks.length} succeeded, ${errs.length} failed.`,
-											action: { type: 'more-details', error: errs },
+											action: { error: errs, type: 'more-details' },
+											id: toastId,
 										});
 									},
 								},
@@ -500,19 +502,19 @@
 										copyToClipboard.mutate(
 											{ text: joinedTranscriptionsText },
 											{
-												onSuccess: () => {
-													isDialogOpen = false;
-													rpc.notify.success.execute({
-														title: 'Copied transcribed texts to clipboard!',
-														description: joinedTranscriptionsText,
-													});
-												},
 												onError: (error) => {
 													rpc.notify.error.execute({
 														title:
 															'Error copying transcribed texts to clipboard',
 														description: error.message,
-														action: { type: 'more-details', error: error },
+														action: { error: error, type: 'more-details' },
+													});
+												},
+												onSuccess: () => {
+													isDialogOpen = false;
+													rpc.notify.success.execute({
+														title: 'Copied transcribed texts to clipboard!',
+														description: joinedTranscriptionsText,
 													});
 												},
 											},
@@ -533,12 +535,18 @@
 						onclick={() => {
 							confirmationDialog.open({
 								title: 'Delete recordings',
-								subtitle: 'Are you sure you want to delete these recordings?',
 								confirmText: 'Delete',
 								onConfirm: () => {
 									deleteRecordings.mutate(
 										selectedRecordingRows.map(({ original }) => original),
 										{
+											onError: (error) => {
+												rpc.notify.error.execute({
+													title: 'Failed to delete recordings!',
+													description: 'Your recordings could not be deleted.',
+													action: { error: error, type: 'more-details' },
+												});
+											},
 											onSuccess: () => {
 												rpc.notify.success.execute({
 													title: 'Deleted recordings!',
@@ -546,16 +554,10 @@
 														'Your recordings have been deleted successfully.',
 												});
 											},
-											onError: (error) => {
-												rpc.notify.error.execute({
-													title: 'Failed to delete recordings!',
-													description: 'Your recordings could not be deleted.',
-													action: { type: 'more-details', error: error },
-												});
-											},
 										},
 									);
 								},
+								subtitle: 'Are you sure you want to delete these recordings?',
 							});
 						}}
 					>
diff --git a/apps/whispering/src/routes/(config)/recordings/LatestTransformationRunOutputByRecordingId.svelte b/apps/whispering/src/routes/(config)/recordings/LatestTransformationRunOutputByRecordingId.svelte
index aa308c0923..b2bb38693b 100644
--- a/apps/whispering/src/routes/(config)/recordings/LatestTransformationRunOutputByRecordingId.svelte
+++ b/apps/whispering/src/routes/(config)/recordings/LatestTransformationRunOutputByRecordingId.svelte
@@ -1,8 +1,8 @@
 <script lang="ts">
 	import CopyableTextareaExpandsToDialog from '$lib/components/copyable/CopyableTextareaExpandsToDialog.svelte';
-	import { Skeleton } from '@repo/ui/skeleton';
 	import { rpc } from '$lib/query';
 	import { getRecordingTransitionId } from '$lib/utils/getRecordingTransitionId';
+	import { Skeleton } from '@repo/ui/skeleton';
 	import { createQuery } from '@tanstack/svelte-query';
 
 	let {
@@ -18,8 +18,8 @@
 	);
 
 	const id = getRecordingTransitionId({
-		recordingId,
 		propertyName: 'latestTransformationRunOutput',
+		recordingId,
 	});
 </script>
 
diff --git a/apps/whispering/src/routes/(config)/recordings/RenderAudioUrl.svelte b/apps/whispering/src/routes/(config)/recordings/RenderAudioUrl.svelte
index d1750423ff..59a7310671 100644
--- a/apps/whispering/src/routes/(config)/recordings/RenderAudioUrl.svelte
+++ b/apps/whispering/src/routes/(config)/recordings/RenderAudioUrl.svelte
@@ -1,10 +1,11 @@
 <script lang="ts">
 	import type { Recording } from '$lib/services/db';
+
 	import { createBlobUrlManager } from '$lib/utils/blobUrlManager';
 	import { getRecordingTransitionId } from '$lib/utils/getRecordingTransitionId';
 	import { onDestroy } from 'svelte';
 
-	let { id, blob }: Pick<Recording, 'id' | 'blob'> = $props();
+	let { blob, id }: Pick<Recording, 'blob' | 'id'> = $props();
 
 	const blobUrlManager = createBlobUrlManager();
 
@@ -22,8 +23,8 @@
 	<audio
 		class="h-8"
 		style="view-transition-name: {getRecordingTransitionId({
-			recordingId: id,
 			propertyName: 'blob',
+			recordingId: id,
 		})}"
 		controls
 		src={blobUrl}
diff --git a/apps/whispering/src/routes/(config)/recordings/TranscribedTextDialog.svelte b/apps/whispering/src/routes/(config)/recordings/TranscribedTextDialog.svelte
index 546f975488..be9e4fbab8 100644
--- a/apps/whispering/src/routes/(config)/recordings/TranscribedTextDialog.svelte
+++ b/apps/whispering/src/routes/(config)/recordings/TranscribedTextDialog.svelte
@@ -4,17 +4,17 @@
 
 	let {
 		recordingId,
-		transcribedText,
 		rows = 2,
+		transcribedText,
 	}: {
 		recordingId: string;
-		transcribedText: string;
 		rows?: number;
+		transcribedText: string;
 	} = $props();
 
 	const id = getRecordingTransitionId({
-		recordingId,
 		propertyName: 'transcribedText',
+		recordingId,
 	});
 </script>
 
diff --git a/apps/whispering/src/routes/(config)/recordings/row-actions/EditRecordingModal.svelte b/apps/whispering/src/routes/(config)/recordings/row-actions/EditRecordingModal.svelte
index 159714ffb6..2e1f7b1c68 100644
--- a/apps/whispering/src/routes/(config)/recordings/row-actions/EditRecordingModal.svelte
+++ b/apps/whispering/src/routes/(config)/recordings/row-actions/EditRecordingModal.svelte
@@ -1,16 +1,17 @@
 <script lang="ts">
+	import type { Recording } from '$lib/services/db';
+
 	import { confirmationDialog } from '$lib/components/ConfirmationDialog.svelte';
 	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
+	import { rpc } from '$lib/query';
+	import { createBlobUrlManager } from '$lib/utils/blobUrlManager';
+	import { PencilIcon as EditIcon, Loader2Icon } from '@lucide/svelte';
 	import { Button } from '@repo/ui/button';
-	import * as Modal from '@repo/ui/modal';
 	import { Input } from '@repo/ui/input';
 	import { Label } from '@repo/ui/label';
+	import * as Modal from '@repo/ui/modal';
 	import { Textarea } from '@repo/ui/textarea';
-	import { rpc } from '$lib/query';
-	import type { Recording } from '$lib/services/db';
-	import { createBlobUrlManager } from '$lib/utils/blobUrlManager';
 	import { createMutation } from '@tanstack/svelte-query';
-	import { PencilIcon as EditIcon, Loader2Icon } from '@lucide/svelte';
 	import { onDestroy } from 'svelte';
 
 	const updateRecording = createMutation(
@@ -82,7 +83,6 @@
 
 		confirmationDialog.open({
 			title: 'Unsaved changes',
-			subtitle: 'You have unsaved changes. Are you sure you want to leave?',
 			confirmText: 'Leave',
 			onConfirm: () => {
 				// Reset working copy and dirty flag
@@ -91,6 +91,7 @@
 
 				isDialogOpen = false;
 			},
+			subtitle: 'You have unsaved changes. Are you sure you want to leave?',
 		});
 	}
 
@@ -196,10 +197,16 @@
 				onclick={() => {
 					confirmationDialog.open({
 						title: 'Delete recording',
-						subtitle: 'Are you sure? This action cannot be undone.',
 						confirmText: 'Delete',
 						onConfirm: () => {
 							deleteRecording.mutate($state.snapshot(recording), {
+								onError: (error) => {
+									rpc.notify.error.execute({
+										title: 'Failed to delete recording!',
+										description: 'Your recording could not be deleted.',
+										action: { error: error, type: 'more-details' },
+									});
+								},
 								onSuccess: () => {
 									isDialogOpen = false;
 									rpc.notify.success.execute({
@@ -208,15 +215,9 @@
 											'Your recording has been deleted successfully.',
 									});
 								},
-								onError: (error) => {
-									rpc.notify.error.execute({
-										title: 'Failed to delete recording!',
-										description: 'Your recording could not be deleted.',
-										action: { type: 'more-details', error: error },
-									});
-								},
 							});
 						},
+						subtitle: 'Are you sure? This action cannot be undone.',
 					});
 				}}
 				variant="destructive"
@@ -233,6 +234,13 @@
 			<Button
 				onclick={() => {
 					updateRecording.mutate($state.snapshot(workingCopy), {
+						onError: (error) => {
+							rpc.notify.error.execute({
+								title: 'Failed to update recording!',
+								description: 'Your recording could not be updated.',
+								action: { error: error, type: 'more-details' },
+							});
+						},
 						onSuccess: () => {
 							rpc.notify.success.execute({
 								title: 'Updated recording!',
@@ -240,13 +248,6 @@
 							});
 							isDialogOpen = false;
 						},
-						onError: (error) => {
-							rpc.notify.error.execute({
-								title: 'Failed to update recording!',
-								description: 'Your recording could not be updated.',
-								action: { type: 'more-details', error: error },
-							});
-						},
 					});
 				}}
 				disabled={updateRecording.isPending || !isWorkingCopyDirty}
diff --git a/apps/whispering/src/routes/(config)/recordings/row-actions/RecordingRowActions.svelte b/apps/whispering/src/routes/(config)/recordings/row-actions/RecordingRowActions.svelte
index 2084af589e..7f13814b0a 100644
--- a/apps/whispering/src/routes/(config)/recordings/row-actions/RecordingRowActions.svelte
+++ b/apps/whispering/src/routes/(config)/recordings/row-actions/RecordingRowActions.svelte
@@ -1,13 +1,11 @@
 <script lang="ts">
 	import { confirmationDialog } from '$lib/components/ConfirmationDialog.svelte';
-	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
-	import WhisperingTooltip from '$lib/components/WhisperingTooltip.svelte';
 	import CopyToClipboardButton from '$lib/components/copyable/CopyToClipboardButton.svelte';
 	import { ClipboardIcon, TrashIcon } from '$lib/components/icons';
-	import { Skeleton } from '@repo/ui/skeleton';
+	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
+	import WhisperingTooltip from '$lib/components/WhisperingTooltip.svelte';
 	import { rpc } from '$lib/query';
 	import { getRecordingTransitionId } from '$lib/utils/getRecordingTransitionId';
-	import { createMutation, createQuery } from '@tanstack/svelte-query';
 	import {
 		AlertCircleIcon,
 		DownloadIcon,
@@ -17,7 +15,10 @@
 		PlayIcon,
 		RepeatIcon,
 	} from '@lucide/svelte';
+	import { Skeleton } from '@repo/ui/skeleton';
+	import { createMutation, createQuery } from '@tanstack/svelte-query';
 	import { nanoid } from 'nanoid/non-secure';
+
 	import EditRecordingModal from './EditRecordingModal.svelte';
 	import TransformationPicker from './TransformationPicker.svelte';
 	import ViewTransformationRunsDialog from './ViewTransformationRunsDialog.svelte';
@@ -72,9 +73,9 @@
 			onclick={() => {
 				const toastId = nanoid();
 				rpc.notify.loading.execute({
-					id: toastId,
 					title: '📋 Transcribing...',
 					description: 'Your recording is being transcribed...',
+					id: toastId,
 				});
 				transcribeRecording.mutate(recording, {
 					onError: (error) => {
@@ -83,10 +84,10 @@
 							return;
 						}
 						rpc.notify.error.execute({
-							id: toastId,
 							title: '❌ Failed to transcribe recording',
 							description: 'Your recording could not be transcribed.',
-							action: { type: 'more-details', error: error },
+							action: { error: error, type: 'more-details' },
+							id: toastId,
 						});
 					},
 					onSuccess: (transcribedText) => {
@@ -117,10 +118,10 @@
 			onSelect={(transformation) => {
 				const toastId = nanoid();
 				rpc.notify.loading.execute({
-					id: toastId,
 					title: '🔄 Running transformation...',
 					description:
 						'Applying your selected transformation to the transcribed text...',
+					id: toastId,
 				});
 				transformRecording.mutate(
 					{ recordingId: recording.id, transformation },
@@ -132,8 +133,8 @@
 									title: '⚠️ Transformation error',
 									description: transformationRun.error,
 									action: {
-										type: 'more-details',
 										error: transformationRun.error,
+										type: 'more-details',
 									},
 								});
 								return;
@@ -157,8 +158,8 @@
 			contentDescription="transcribed text"
 			textToCopy={recording.transcribedText}
 			viewTransitionName={getRecordingTransitionId({
-				recordingId,
 				propertyName: 'transcribedText',
+				recordingId,
 			})}
 		>
 			<ClipboardIcon class="size-4" />
@@ -169,8 +170,8 @@
 		{:else if latestTransformationRunByRecordingIdQuery.isError}
 			<WhisperingTooltip
 				id={getRecordingTransitionId({
-					recordingId,
 					propertyName: 'latestTransformationRunOutput',
+					recordingId,
 				})}
 				tooltipContent="Error fetching latest transformation run output"
 			>
@@ -189,8 +190,8 @@
 					? latestTransformationRunByRecordingIdQuery.data.output
 					: ''}
 				viewTransitionName={getRecordingTransitionId({
-					recordingId,
 					propertyName: 'latestTransformationRunOutput',
+					recordingId,
 				})}
 			>
 				<FileStackIcon class="size-4" />
@@ -211,7 +212,7 @@
 						rpc.notify.error.execute({
 							title: 'Failed to download recording!',
 							description: 'Your recording could not be downloaded.',
-							action: { type: 'more-details', error },
+							action: { error, type: 'more-details' },
 						});
 					},
 					onSuccess: () => {
@@ -236,24 +237,24 @@
 			onclick={() => {
 				confirmationDialog.open({
 					title: 'Delete recording',
-					subtitle: 'Are you sure you want to delete this recording?',
 					confirmText: 'Delete',
 					onConfirm: () =>
 						deleteRecording.mutate(recording, {
-							onSuccess: () => {
-								rpc.notify.success.execute({
-									title: 'Deleted recording!',
-									description: 'Your recording has been deleted.',
-								});
-							},
 							onError: (error) => {
 								rpc.notify.error.execute({
 									title: 'Failed to delete recording!',
 									description: 'Your recording could not be deleted.',
-									action: { type: 'more-details', error },
+									action: { error, type: 'more-details' },
+								});
+							},
+							onSuccess: () => {
+								rpc.notify.success.execute({
+									title: 'Deleted recording!',
+									description: 'Your recording has been deleted.',
 								});
 							},
 						}),
+					subtitle: 'Are you sure you want to delete this recording?',
 				});
 			}}
 			variant="ghost"
diff --git a/apps/whispering/src/routes/(config)/recordings/row-actions/TransformationPicker.svelte b/apps/whispering/src/routes/(config)/recordings/row-actions/TransformationPicker.svelte
index 3676c34694..90f946b03a 100644
--- a/apps/whispering/src/routes/(config)/recordings/row-actions/TransformationPicker.svelte
+++ b/apps/whispering/src/routes/(config)/recordings/row-actions/TransformationPicker.svelte
@@ -1,14 +1,15 @@
 <script lang="ts">
+	import type { Transformation } from '$lib/services/db';
+
 	import { goto } from '$app/navigation';
 	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
+	import { rpc } from '$lib/query';
+	import { LayersIcon } from '@lucide/svelte';
 	import { Badge } from '@repo/ui/badge';
 	import * as Command from '@repo/ui/command';
-	import * as Popover from '@repo/ui/popover';
 	import { useCombobox } from '@repo/ui/hooks';
-	import { rpc } from '$lib/query';
-	import type { Transformation } from '$lib/services/db';
+	import * as Popover from '@repo/ui/popover';
 	import { createQuery } from '@tanstack/svelte-query';
-	import { LayersIcon } from '@lucide/svelte';
 
 	const transformationsQuery = createQuery(
 		rpc.transformations.queries.getAllTransformations.options,
diff --git a/apps/whispering/src/routes/(config)/recordings/row-actions/ViewTransformationRunsDialog.svelte b/apps/whispering/src/routes/(config)/recordings/row-actions/ViewTransformationRunsDialog.svelte
index 7ebb737824..8ff18091f6 100644
--- a/apps/whispering/src/routes/(config)/recordings/row-actions/ViewTransformationRunsDialog.svelte
+++ b/apps/whispering/src/routes/(config)/recordings/row-actions/ViewTransformationRunsDialog.svelte
@@ -1,11 +1,11 @@
 <script lang="ts">
-	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import { Runs } from '$lib/components/transformations-editor';
+	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
+	import { rpc } from '$lib/query';
+	import { HistoryIcon } from '@lucide/svelte';
 	import { Button } from '@repo/ui/button';
 	import * as Dialog from '@repo/ui/dialog';
-	import { rpc } from '$lib/query';
 	import { createQuery } from '@tanstack/svelte-query';
-	import { HistoryIcon } from '@lucide/svelte';
 
 	let { recordingId }: { recordingId: string } = $props();
 
diff --git a/apps/whispering/src/routes/(config)/settings/+layout.svelte b/apps/whispering/src/routes/(config)/settings/+layout.svelte
index ba610a0217..0ed16aa494 100644
--- a/apps/whispering/src/routes/(config)/settings/+layout.svelte
+++ b/apps/whispering/src/routes/(config)/settings/+layout.svelte
@@ -1,11 +1,12 @@
 <script lang="ts">
 	import { confirmationDialog } from '$lib/components/ConfirmationDialog.svelte';
-	import { Button } from '@repo/ui/button';
-	import { Separator } from '@repo/ui/separator';
 	import { rpc } from '$lib/query';
+	import { settings } from '$lib/stores/settings.svelte';
 	import { RotateCcw } from '@lucide/svelte';
+	import { Button } from '@repo/ui/button';
+	import { Separator } from '@repo/ui/separator';
+
 	import SidebarNav from './SidebarNav.svelte';
-	import { settings } from '$lib/stores/settings.svelte';
 
 	let { children } = $props();
 
@@ -28,10 +29,10 @@
 			return { isOutdated: false, version: currentVersion } as const;
 		}
 		return {
-			isOutdated: true,
-			latestVersion,
 			currentVersion,
+			isOutdated: true,
 			latestReleaseUrl,
+			latestVersion,
 		} as const;
 	})();
 </script>
@@ -47,7 +48,7 @@
 					Customize your Whispering experience.
 				{:then v}
 					{#if v.isOutdated}
-						{@const { latestVersion, currentVersion, latestReleaseUrl } = v}
+						{@const { currentVersion, latestReleaseUrl, latestVersion } = v}
 						Customize your experience for Whispering {currentVersion} (latest
 						<Button
 							class="px-0"
@@ -74,8 +75,6 @@
 			onclick={() => {
 				confirmationDialog.open({
 					title: 'Reset All Settings',
-					subtitle:
-						'This will reset all settings to their default values. This action cannot be undone.',
 					confirmText: 'Reset Settings',
 					onConfirm: () => {
 						settings.reset();
@@ -84,6 +83,8 @@
 							description: 'All settings have been reset to defaults.',
 						});
 					},
+					subtitle:
+						'This will reset all settings to their default values. This action cannot be undone.',
 				});
 			}}
 			class="shrink-0"
diff --git a/apps/whispering/src/routes/(config)/settings/+page.svelte b/apps/whispering/src/routes/(config)/settings/+page.svelte
index 61071ed2c0..afa96a83b1 100644
--- a/apps/whispering/src/routes/(config)/settings/+page.svelte
+++ b/apps/whispering/src/routes/(config)/settings/+page.svelte
@@ -3,10 +3,10 @@
 		LabeledSelect,
 		LabeledSwitch,
 	} from '$lib/components/labeled/index.js';
-	import { Button } from '@repo/ui/button';
-	import { Separator } from '@repo/ui/separator';
 	import { ALWAYS_ON_TOP_OPTIONS } from '$lib/constants/ui';
 	import { settings } from '$lib/stores/settings.svelte';
+	import { Button } from '@repo/ui/button';
+	import { Separator } from '@repo/ui/separator';
 </script>
 
 <svelte:head>
@@ -67,8 +67,8 @@
 		id="recording-retention-strategy"
 		label="Auto Delete Recordings"
 		items={[
-			{ value: 'keep-forever', label: 'Keep All Recordings' },
-			{ value: 'limit-count', label: 'Keep Limited Number' },
+			{ label: 'Keep All Recordings', value: 'keep-forever' },
+			{ label: 'Keep Limited Number', value: 'limit-count' },
 		] as const}
 		selected={settings.value['database.recordingRetentionStrategy']}
 		onSelectedChange={(selected) => {
@@ -82,12 +82,12 @@
 			id="max-recording-count"
 			label="Maximum Recordings"
 			items={[
-				{ value: '0', label: '0 Recordings (Never Save)' },
-				{ value: '5', label: '5 Recordings' },
-				{ value: '10', label: '10 Recordings' },
-				{ value: '25', label: '25 Recordings' },
-				{ value: '50', label: '50 Recordings' },
-				{ value: '100', label: '100 Recordings' },
+				{ label: '0 Recordings (Never Save)', value: '0' },
+				{ label: '5 Recordings', value: '5' },
+				{ label: '10 Recordings', value: '10' },
+				{ label: '25 Recordings', value: '25' },
+				{ label: '50 Recordings', value: '50' },
+				{ label: '100 Recordings', value: '100' },
 			]}
 			selected={settings.value['database.maxRecordingCount']}
 			onSelectedChange={(selected) => {
diff --git a/apps/whispering/src/routes/(config)/settings/SidebarNav.svelte b/apps/whispering/src/routes/(config)/settings/SidebarNav.svelte
index bbd5f3ceb3..4b37ebfe94 100644
--- a/apps/whispering/src/routes/(config)/settings/SidebarNav.svelte
+++ b/apps/whispering/src/routes/(config)/settings/SidebarNav.svelte
@@ -13,18 +13,18 @@
 		{ title: 'Sound', href: '/settings/sound' },
 		{
 			title: 'Shortcuts',
-			href: '/settings/shortcuts/local',
 			activePathPrefix: '/settings/shortcuts',
+			href: '/settings/shortcuts/local',
 		},
 		{ title: 'Privacy & Analytics', href: '/settings/analytics' },
 	] satisfies {
-		title: string;
-		href: string;
 		/**
 		 * If provided, the item is considered active if the current pathname starts with this prefix.
 		 * Otherwise, it is considered active if the current pathname is exactly equal to the item's href.
 		 */
 		activePathPrefix?: string;
+		href: string;
+		title: string;
 	}[];
 
 	const [send, receive] = crossfade({
diff --git a/apps/whispering/src/routes/(config)/settings/analytics/+page.svelte b/apps/whispering/src/routes/(config)/settings/analytics/+page.svelte
index 438f63414d..a91e7d72ad 100644
--- a/apps/whispering/src/routes/(config)/settings/analytics/+page.svelte
+++ b/apps/whispering/src/routes/(config)/settings/analytics/+page.svelte
@@ -1,17 +1,17 @@
 <script lang="ts">
-	import * as Card from '@repo/ui/card';
+	import { rpc } from '$lib/query';
+	import { settings } from '$lib/stores/settings.svelte';
 	import { Badge } from '@repo/ui/badge';
+	import * as Card from '@repo/ui/card';
 	import { Label } from '@repo/ui/label';
 	import { Switch } from '@repo/ui/switch';
-	import { rpc } from '$lib/query';
-	import { settings } from '$lib/stores/settings.svelte';
 
 	function handleAnalyticsToggle(checked: boolean) {
 		settings.updateKey('analytics.enabled', checked);
 		
 		// Log the change (will only send if analytics is now enabled)
 		if (checked) {
-			rpc.analytics.logEvent.execute({ type: 'settings_changed', section: 'analytics' });
+			rpc.analytics.logEvent.execute({ section: 'analytics', type: 'settings_changed' });
 		}
 	}
 </script>
diff --git a/apps/whispering/src/routes/(config)/settings/recording/+page.svelte b/apps/whispering/src/routes/(config)/settings/recording/+page.svelte
index c3c50ba2ea..ee51b57602 100644
--- a/apps/whispering/src/routes/(config)/settings/recording/+page.svelte
+++ b/apps/whispering/src/routes/(config)/settings/recording/+page.svelte
@@ -1,33 +1,34 @@
 <script lang="ts">
-	import DesktopOutputFolder from './DesktopOutputFolder.svelte';
 	import { LabeledSelect } from '$lib/components/labeled/index.js';
-	import { Separator } from '@repo/ui/separator';
-	import * as Alert from '@repo/ui/alert';
-	import { Link } from '@repo/ui/link';
-	import { InfoIcon } from '@lucide/svelte';
 	import {
 		BITRATE_OPTIONS,
 		RECORDING_MODE_OPTIONS,
 	} from '$lib/constants/audio';
+	import { IS_MACOS } from '$lib/constants/platform';
 	import { settings } from '$lib/stores/settings.svelte';
-	import SelectRecordingDevice from './SelectRecordingDevice.svelte';
+	import { InfoIcon } from '@lucide/svelte';
+	import * as Alert from '@repo/ui/alert';
+	import { Link } from '@repo/ui/link';
+	import { Separator } from '@repo/ui/separator';
+
 	import {
-		isUsingNativeBackendWithCloudTranscription,
 		isUsingNativeBackendAtWrongSampleRate,
+		isUsingNativeBackendWithCloudTranscription,
 	} from '../../../+layout/check-ffmpeg';
-	import { IS_MACOS } from '$lib/constants/platform';
+	import DesktopOutputFolder from './DesktopOutputFolder.svelte';
+	import SelectRecordingDevice from './SelectRecordingDevice.svelte';
 
 	const { data } = $props();
 
 	const SAMPLE_RATE_OPTIONS = [
-		{ value: '16000', label: 'Voice Quality (16kHz): Optimized for speech' },
-		{ value: '44100', label: 'Standard Quality (44.1kHz): CD quality' },
-		{ value: '48000', label: 'High Quality (48kHz): Professional audio' },
+		{ label: 'Voice Quality (16kHz): Optimized for speech', value: '16000' },
+		{ label: 'Standard Quality (44.1kHz): CD quality', value: '44100' },
+		{ label: 'High Quality (48kHz): Professional audio', value: '48000' },
 	] as const;
 
 	const RECORDING_BACKEND_OPTIONS = [
-		{ value: 'native', label: 'Native (Rust)' },
-		{ value: 'browser', label: 'Browser (MediaRecorder)' },
+		{ label: 'Native (Rust)', value: 'native' },
+		{ label: 'Browser (MediaRecorder)', value: 'browser' },
 	] as const;
 
 	const isUsingBrowserBackend = $derived(
@@ -155,8 +156,8 @@
 				id="bit-rate"
 				label="Bitrate"
 				items={BITRATE_OPTIONS.map((option) => ({
-					value: option.value,
 					label: option.label,
+					value: option.value,
 				}))}
 				selected={settings.value['recording.navigator.bitrateKbps']}
 				onSelectedChange={(selected) => {
diff --git a/apps/whispering/src/routes/(config)/settings/recording/DesktopOutputFolder.svelte b/apps/whispering/src/routes/(config)/settings/recording/DesktopOutputFolder.svelte
index d86458d5df..03e43e9ab4 100644
--- a/apps/whispering/src/routes/(config)/settings/recording/DesktopOutputFolder.svelte
+++ b/apps/whispering/src/routes/(config)/settings/recording/DesktopOutputFolder.svelte
@@ -1,11 +1,11 @@
 <script lang="ts">
-	import { Input } from '@repo/ui/input';
 	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
-	import { FolderOpen, ExternalLink, RotateCcw } from '@lucide/svelte';
 	import { settings } from '$lib/stores/settings.svelte';
+	import { ExternalLink, FolderOpen, RotateCcw } from '@lucide/svelte';
+	import { Input } from '@repo/ui/input';
 
 	// Top-level await to get the default app data directory
-	let defaultAppDataPath = $state<string | null>(null);
+	let defaultAppDataPath = $state<null | string>(null);
 	
 	// Initialize the default path asynchronously
 	if (window.__TAURI_INTERNALS__) {
@@ -24,9 +24,9 @@
 		
 		const { open } = await import('@tauri-apps/plugin-dialog');
 		const selected = await open({
+			title: 'Select Recording Output Folder',
 			directory: true,
 			multiple: false,
-			title: 'Select Recording Output Folder',
 		});
 		
 		if (selected) settings.updateKey('recording.desktop.outputFolder', selected);
diff --git a/apps/whispering/src/routes/(config)/settings/recording/SelectRecordingDevice.svelte b/apps/whispering/src/routes/(config)/settings/recording/SelectRecordingDevice.svelte
index dc70f3900d..dde4804964 100644
--- a/apps/whispering/src/routes/(config)/settings/recording/SelectRecordingDevice.svelte
+++ b/apps/whispering/src/routes/(config)/settings/recording/SelectRecordingDevice.svelte
@@ -1,20 +1,20 @@
 <script lang="ts">
+	import type { DeviceIdentifier } from '$lib/services/types';
+
 	import { LabeledSelect } from '$lib/components/labeled/index.js';
 	import { rpc } from '$lib/query';
-	import { createQuery } from '@tanstack/svelte-query';
-	import type { DeviceIdentifier } from '$lib/services/types';
 	import { asDeviceIdentifier } from '$lib/services/types';
-
 	import { settings } from '$lib/stores/settings.svelte';
+	import { createQuery } from '@tanstack/svelte-query';
 	
 	let {
-		selected,
+		mode,
 		onSelectedChange,
-		mode 
+		selected 
 	}: {
-		selected: DeviceIdentifier | null;
-		onSelectedChange: (selected: DeviceIdentifier | null) => void;
 		mode: 'manual' | 'vad';
+		onSelectedChange: (selected: DeviceIdentifier | null) => void;
+		selected: DeviceIdentifier | null;
 	} = $props();
 
 	// Determine which backend to use for device enumeration
@@ -45,8 +45,8 @@
 		id="recording-device"
 		label="Recording Device"
 		placeholder="Loading devices..."
-		items={[{ value: '', label: 'Loading devices...' }]}
-		selected={''}
+		items={[{ label: 'Loading devices...', value: '' }]}
+		selected=""
 		onSelectedChange={() => {}}
 		disabled
 	/>
@@ -56,8 +56,8 @@
 	</p>
 {:else}
 	{@const items = getDevicesQuery.data.map((device) => ({
-		value: device.id,
 		label: device.label,
+		value: device.id,
 	}))}
 	<LabeledSelect
 		id="recording-device"
diff --git a/apps/whispering/src/routes/(config)/settings/shortcuts/+layout.svelte b/apps/whispering/src/routes/(config)/settings/shortcuts/+layout.svelte
index 4ec109e235..81280f1bc3 100644
--- a/apps/whispering/src/routes/(config)/settings/shortcuts/+layout.svelte
+++ b/apps/whispering/src/routes/(config)/settings/shortcuts/+layout.svelte
@@ -13,8 +13,8 @@
 	});
 
 	const items = [
-		{ href: '/settings/shortcuts/local', title: 'Local Shortcuts' },
-		{ href: '/settings/shortcuts/global', title: 'Global Shortcuts' },
+		{ title: 'Local Shortcuts', href: '/settings/shortcuts/local' },
+		{ title: 'Global Shortcuts', href: '/settings/shortcuts/global' },
 	] as const;
 </script>
 
diff --git a/apps/whispering/src/routes/(config)/settings/shortcuts/global/+page.svelte b/apps/whispering/src/routes/(config)/settings/shortcuts/global/+page.svelte
index fcd475ce9d..4fc7ecf275 100644
--- a/apps/whispering/src/routes/(config)/settings/shortcuts/global/+page.svelte
+++ b/apps/whispering/src/routes/(config)/settings/shortcuts/global/+page.svelte
@@ -1,11 +1,12 @@
 <script lang="ts">
-	import { Button } from '@repo/ui/button';
-	import { Separator } from '@repo/ui/separator';
 	import { rpc } from '$lib/query';
+	import { settings } from '$lib/stores/settings.svelte';
 	import { Layers2Icon, RotateCcw } from '@lucide/svelte';
+	import { Button } from '@repo/ui/button';
+	import { Separator } from '@repo/ui/separator';
+
 	import ShortcutFormatHelp from '../keyboard-shortcut-recorder/ShortcutFormatHelp.svelte';
 	import ShortcutTable from '../keyboard-shortcut-recorder/ShortcutTable.svelte';
-	import { settings } from '$lib/stores/settings.svelte';
 </script>
 
 <svelte:head>
diff --git a/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/GlobalKeyboardShortcutRecorder.svelte b/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/GlobalKeyboardShortcutRecorder.svelte
index bd23c91091..d9aed20075 100644
--- a/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/GlobalKeyboardShortcutRecorder.svelte
+++ b/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/GlobalKeyboardShortcutRecorder.svelte
@@ -1,26 +1,28 @@
 <script lang="ts">
 	import type { Command } from '$lib/commands';
 	import type { KeyboardEventSupportedKey } from '$lib/constants/keyboard';
+
 	import { rpc } from '$lib/query';
+	import { fromTaggedError } from '$lib/result';
 	import {
 		type Accelerator,
 		pressedKeysToTauriAccelerator,
 	} from '$lib/services/global-shortcut-manager';
 	import { settings } from '$lib/stores/settings.svelte';
 	import { type PressedKeys } from '$lib/utils/createPressedKeys.svelte';
-	import KeyboardShortcutRecorder from './KeyboardShortcutRecorder.svelte';
+
 	import { createKeyRecorder } from './create-key-recorder.svelte';
-	import { fromTaggedError } from '$lib/result';
+	import KeyboardShortcutRecorder from './KeyboardShortcutRecorder.svelte';
 
 	const {
+		autoFocus = true,
 		command,
 		placeholder,
-		autoFocus = true,
 		pressedKeys,
 	}: {
+		autoFocus?: boolean;
 		command: Command;
 		placeholder?: string;
-		autoFocus?: boolean;
 		pressedKeys: PressedKeys;
 	} = $props();
 
@@ -29,7 +31,27 @@
 	);
 
 	const keyRecorder = createKeyRecorder({
-		pressedKeys,
+		onClear: async () => {
+			const { error: unregisterError } =
+				await rpc.shortcuts.unregisterCommandGlobally.execute({
+					accelerator: shortcutValue as Accelerator,
+				});
+
+			if (unregisterError) {
+				rpc.notify.error.execute(
+					fromTaggedError(unregisterError, {
+						title: 'Error clearing global shortcut',
+					}),
+				);
+			}
+
+			settings.updateKey(`shortcuts.global.${command.id}`, null);
+
+			rpc.notify.success.execute({
+				title: 'Global shortcut cleared',
+				description: `Please set a new shortcut to trigger "${command.title}"`,
+			});
+		},
 		onRegister: async (keyCombination: KeyboardEventSupportedKey[]) => {
 			if (shortcutValue) {
 				const { error: unregisterError } =
@@ -42,7 +64,7 @@
 						title: 'Failed to unregister shortcut',
 						description:
 							'Could not unregister the global shortcut. It may already be in use by another application.',
-						action: { type: 'more-details', error: unregisterError },
+						action: { error: unregisterError, type: 'more-details' },
 					});
 				}
 			}
@@ -54,15 +76,15 @@
 				rpc.notify.error.execute({
 					title: 'Invalid shortcut combination',
 					description: `The key combination "${keyCombination.join('+')}" is not valid. Please try a different combination.`,
-					action: { type: 'more-details', error: acceleratorError },
+					action: { error: acceleratorError, type: 'more-details' },
 				});
 				return;
 			}
 
 			const { error: registerError } =
 				await rpc.shortcuts.registerCommandGlobally.execute({
-					command,
 					accelerator,
+					command,
 				});
 
 			if (registerError) {
@@ -71,7 +93,7 @@
 						rpc.notify.error.execute({
 							title: 'Invalid shortcut combination',
 							description: `The key combination "${keyCombination.join('+')}" is not valid. Please try a different combination.`,
-							action: { type: 'more-details', error: registerError },
+							action: { error: registerError, type: 'more-details' },
 						});
 						break;
 					default:
@@ -79,7 +101,7 @@
 							title: 'Failed to register shortcut',
 							description:
 								'Could not register the global shortcut. It may already be in use by another application.',
-							action: { type: 'more-details', error: registerError },
+							action: { error: registerError, type: 'more-details' },
 						});
 						break;
 				}
@@ -93,27 +115,7 @@
 				description: `Press the shortcut to trigger "${command.title}"`,
 			});
 		},
-		onClear: async () => {
-			const { error: unregisterError } =
-				await rpc.shortcuts.unregisterCommandGlobally.execute({
-					accelerator: shortcutValue as Accelerator,
-				});
-
-			if (unregisterError) {
-				rpc.notify.error.execute(
-					fromTaggedError(unregisterError, {
-						title: 'Error clearing global shortcut',
-					}),
-				);
-			}
-
-			settings.updateKey(`shortcuts.global.${command.id}`, null);
-
-			rpc.notify.success.execute({
-				title: 'Global shortcut cleared',
-				description: `Please set a new shortcut to trigger "${command.title}"`,
-			});
-		},
+		pressedKeys,
 	});
 </script>
 
diff --git a/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/KeyboardShortcutRecorder.svelte b/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/KeyboardShortcutRecorder.svelte
index 12e5fa7264..90a43fbfeb 100644
--- a/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/KeyboardShortcutRecorder.svelte
+++ b/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/KeyboardShortcutRecorder.svelte
@@ -1,27 +1,29 @@
 <script lang="ts">
+	import type { KeyboardEventSupportedKey } from '$lib/constants/keyboard';
+
+	import { IS_MACOS } from '$lib/constants/platform';
+	import { AlertTriangle, Keyboard, Pencil, XIcon } from '@lucide/svelte';
 	import * as Alert from '@repo/ui/alert';
 	import { Badge } from '@repo/ui/badge';
 	import { Button } from '@repo/ui/button';
 	import { Input } from '@repo/ui/input';
 	import * as Popover from '@repo/ui/popover';
-	import type { KeyboardEventSupportedKey } from '$lib/constants/keyboard';
-	import { IS_MACOS } from '$lib/constants/platform';
 	import { cn } from '@repo/ui/utils';
-	import { AlertTriangle, Keyboard, Pencil, XIcon } from '@lucide/svelte';
+
 	import { type KeyRecorder } from './create-key-recorder.svelte';
 
 	const {
 		title,
-		placeholder = 'Press a key combination',
 		autoFocus = true,
-		rawKeyCombination,
 		keyRecorder,
+		placeholder = 'Press a key combination',
+		rawKeyCombination,
 	}: {
-		title: string;
-		placeholder?: string;
 		autoFocus?: boolean;
-		rawKeyCombination: string | null;
 		keyRecorder: KeyRecorder;
+		placeholder?: string;
+		rawKeyCombination: null | string;
+		title: string;
 	} = $props();
 
 	let isPopoverOpen = $state(false);
diff --git a/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/LocalKeyboardShortcutRecorder.svelte b/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/LocalKeyboardShortcutRecorder.svelte
index 307f86bff7..0c15a5f215 100644
--- a/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/LocalKeyboardShortcutRecorder.svelte
+++ b/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/LocalKeyboardShortcutRecorder.svelte
@@ -1,25 +1,27 @@
 <script lang="ts">
 	import type { Command } from '$lib/commands';
 	import type { KeyboardEventSupportedKey } from '$lib/constants/keyboard';
+
 	import { rpc } from '$lib/query';
 	import {
-		type CommandId,
 		arrayToShortcutString,
+		type CommandId,
 	} from '$lib/services/local-shortcut-manager';
 	import { settings } from '$lib/stores/settings.svelte';
 	import { type PressedKeys } from '$lib/utils/createPressedKeys.svelte';
-	import KeyboardShortcutRecorder from './KeyboardShortcutRecorder.svelte';
+
 	import { createKeyRecorder } from './create-key-recorder.svelte';
+	import KeyboardShortcutRecorder from './KeyboardShortcutRecorder.svelte';
 
 	const {
+		autoFocus = true,
 		command,
 		placeholder,
-		autoFocus = true,
 		pressedKeys,
 	}: {
+		autoFocus?: boolean;
 		command: Command;
 		placeholder?: string;
-		autoFocus?: boolean;
 		pressedKeys: PressedKeys;
 	} = $props();
 
@@ -28,7 +30,25 @@
 	);
 
 	const keyRecorder = createKeyRecorder({
-		pressedKeys,
+		onClear: async () => {
+			const { error: unregisterError } =
+				await rpc.shortcuts.unregisterCommandLocally.execute({
+					commandId: command.id as CommandId,
+				});
+			if (unregisterError) {
+				rpc.notify.error.execute({
+					title: 'Error clearing local shortcut',
+					description: unregisterError.message,
+					action: { error: unregisterError, type: 'more-details' },
+				});
+			}
+			settings.updateKey(`shortcuts.local.${command.id}`, null);
+
+			rpc.notify.success.execute({
+				title: 'Local shortcut cleared',
+				description: `Please set a new shortcut to trigger "${command.title}"`,
+			});
+		},
 		onRegister: async (keyCombination: KeyboardEventSupportedKey[]) => {
 			const { error: unregisterError } =
 				await rpc.shortcuts.unregisterCommandLocally.execute({
@@ -38,7 +58,7 @@
 				rpc.notify.error.execute({
 					title: 'Error unregistering local shortcut',
 					description: unregisterError.message,
-					action: { type: 'more-details', error: unregisterError },
+					action: { error: unregisterError, type: 'more-details' },
 				});
 			}
 			const { error: registerError } =
@@ -51,7 +71,7 @@
 				rpc.notify.error.execute({
 					title: 'Error registering local shortcut',
 					description: registerError.message,
-					action: { type: 'more-details', error: registerError },
+					action: { error: registerError, type: 'more-details' },
 				});
 				return;
 			}
@@ -63,25 +83,7 @@
 				description: `Press the shortcut to trigger "${command.title}"`,
 			});
 		},
-		onClear: async () => {
-			const { error: unregisterError } =
-				await rpc.shortcuts.unregisterCommandLocally.execute({
-					commandId: command.id as CommandId,
-				});
-			if (unregisterError) {
-				rpc.notify.error.execute({
-					title: 'Error clearing local shortcut',
-					description: unregisterError.message,
-					action: { type: 'more-details', error: unregisterError },
-				});
-			}
-			settings.updateKey(`shortcuts.local.${command.id}`, null);
-
-			rpc.notify.success.execute({
-				title: 'Local shortcut cleared',
-				description: `Please set a new shortcut to trigger "${command.title}"`,
-			});
-		},
+		pressedKeys,
 	});
 </script>
 
diff --git a/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/ShortcutFormatHelp.svelte b/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/ShortcutFormatHelp.svelte
index 93b020bc19..e83778dfad 100644
--- a/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/ShortcutFormatHelp.svelte
+++ b/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/ShortcutFormatHelp.svelte
@@ -1,10 +1,5 @@
 <script lang="ts">
 	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
-	import * as Alert from '@repo/ui/alert';
-	import { Badge } from '@repo/ui/badge';
-	import { Button } from '@repo/ui/button';
-	import * as Dialog from '@repo/ui/dialog';
-	import * as Tooltip from '@repo/ui/tooltip';
 	import {
 		ACCELERATOR_SECTIONS,
 		CommandOrAlt,
@@ -14,8 +9,13 @@
 	} from '$lib/constants/keyboard';
 	import { IS_MACOS } from '$lib/constants/platform';
 	import { AlertTriangle, ExternalLink, HelpCircle } from '@lucide/svelte';
+	import * as Alert from '@repo/ui/alert';
+	import { Badge } from '@repo/ui/badge';
+	import { Button } from '@repo/ui/button';
+	import * as Dialog from '@repo/ui/dialog';
+	import * as Tooltip from '@repo/ui/tooltip';
 
-	let { type }: { type: 'local' | 'global' } = $props();
+	let { type }: { type: 'global' | 'local' } = $props();
 	let dialogOpen = $state(false);
 
 	const isLocal = $derived(type === 'local');
@@ -24,14 +24,6 @@
 	 * Examples for each shortcut type
 	 */
 	const SHORTCUT_EXAMPLES = {
-		local: [
-			' ',
-			`${CommandOrControl.toLowerCase()}+a`,
-			`${CommandOrControl.toLowerCase()}+shift+p`,
-			`${CommandOrAlt.toLowerCase()}+s`,
-			'f5',
-			`control+${CommandOrAlt.toLowerCase()}+delete`,
-		],
 		global: [
 			'Space',
 			'Control+A',
@@ -40,6 +32,14 @@
 			'F5',
 			`Control+${CommandOrAlt}+Delete`,
 		],
+		local: [
+			' ',
+			`${CommandOrControl.toLowerCase()}+a`,
+			`${CommandOrControl.toLowerCase()}+shift+p`,
+			`${CommandOrAlt.toLowerCase()}+s`,
+			'f5',
+			`control+${CommandOrAlt.toLowerCase()}+delete`,
+		],
 	} as const;
 </script>
 
diff --git a/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/ShortcutTable.svelte b/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/ShortcutTable.svelte
index a7e808d4fa..49462014d2 100644
--- a/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/ShortcutTable.svelte
+++ b/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/ShortcutTable.svelte
@@ -1,15 +1,16 @@
 <script lang="ts">
 	import { commands } from '$lib/commands';
-	import { Input } from '@repo/ui/input';
-	import * as Table from '@repo/ui/table';
 	import { rpc } from '$lib/query';
 	import { getDefaultSettings } from '$lib/settings';
 	import { createPressedKeys } from '$lib/utils/createPressedKeys.svelte';
 	import { Search } from '@lucide/svelte';
+	import { Input } from '@repo/ui/input';
+	import * as Table from '@repo/ui/table';
+
 	import GlobalKeyboardShortcutRecorder from './GlobalKeyboardShortcutRecorder.svelte';
 	import LocalKeyboardShortcutRecorder from './LocalKeyboardShortcutRecorder.svelte';
 
-	let { type }: { type: 'local' | 'global' } = $props();
+	let { type }: { type: 'global' | 'local' } = $props();
 
 	let searchQuery = $state('');
 
diff --git a/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/create-key-recorder.svelte.ts b/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/create-key-recorder.svelte.ts
index e2f73d2abe..62dc3b375c 100644
--- a/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/create-key-recorder.svelte.ts
+++ b/apps/whispering/src/routes/(config)/settings/shortcuts/keyboard-shortcut-recorder/create-key-recorder.svelte.ts
@@ -3,6 +3,8 @@ import type { PressedKeys } from '$lib/utils/createPressedKeys.svelte';
 
 const CAPTURE_WINDOW_MS = 300; // Time to wait for additional keys in a combination
 
+export type KeyRecorder = ReturnType<typeof createKeyRecorder>;
+
 /**
  * Creates a keyboard shortcut recorder that captures key combinations
  *
@@ -21,13 +23,13 @@ const CAPTURE_WINDOW_MS = 300; // Time to wait for additional keys in a combinat
  * - Complex combinations built over time
  */
 export function createKeyRecorder({
-	pressedKeys,
-	onRegister,
 	onClear,
+	onRegister,
+	pressedKeys,
 }: {
-	pressedKeys: PressedKeys;
-	onRegister: (keyCombination: KeyboardEventSupportedKey[]) => void;
 	onClear: () => void;
+	onRegister: (keyCombination: KeyboardEventSupportedKey[]) => void;
+	pressedKeys: PressedKeys;
 }) {
 	// State
 	let isListening = $state(false);
@@ -91,9 +93,16 @@ export function createKeyRecorder({
 
 	// Public API
 	return {
+		clear() {
+			isListening = false;
+			capturedKeys.clear();
+			clearCaptureTimer();
+			onClear();
+		},
 		get isListening() {
 			return isListening;
 		},
+		register: onRegister,
 		start() {
 			isListening = true;
 			capturedKeys.clear();
@@ -104,14 +113,5 @@ export function createKeyRecorder({
 			capturedKeys.clear();
 			clearCaptureTimer();
 		},
-		clear() {
-			isListening = false;
-			capturedKeys.clear();
-			clearCaptureTimer();
-			onClear();
-		},
-		register: onRegister,
 	};
 }
-
-export type KeyRecorder = ReturnType<typeof createKeyRecorder>;
diff --git a/apps/whispering/src/routes/(config)/settings/shortcuts/local/+page.svelte b/apps/whispering/src/routes/(config)/settings/shortcuts/local/+page.svelte
index c1f109e526..84c7dc766d 100644
--- a/apps/whispering/src/routes/(config)/settings/shortcuts/local/+page.svelte
+++ b/apps/whispering/src/routes/(config)/settings/shortcuts/local/+page.svelte
@@ -1,11 +1,12 @@
 <script lang="ts">
-	import { Button } from '@repo/ui/button';
-	import { Separator } from '@repo/ui/separator';
 	import { rpc } from '$lib/query';
+	import { settings } from '$lib/stores/settings.svelte';
 	import { RotateCcw } from '@lucide/svelte';
+	import { Button } from '@repo/ui/button';
+	import { Separator } from '@repo/ui/separator';
+
 	import ShortcutFormatHelp from '../keyboard-shortcut-recorder/ShortcutFormatHelp.svelte';
 	import ShortcutTable from '../keyboard-shortcut-recorder/ShortcutTable.svelte';
-	import { settings } from '$lib/stores/settings.svelte';
 </script>
 
 <svelte:head>
diff --git a/apps/whispering/src/routes/(config)/settings/sound/+page.svelte b/apps/whispering/src/routes/(config)/settings/sound/+page.svelte
index 4fc57fcbae..c306d283b8 100644
--- a/apps/whispering/src/routes/(config)/settings/sound/+page.svelte
+++ b/apps/whispering/src/routes/(config)/settings/sound/+page.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { LabeledSwitch } from '$lib/components/labeled';
-	import { Separator } from '@repo/ui/separator';
 	import { settings } from '$lib/stores/settings.svelte';
+	import { Separator } from '@repo/ui/separator';
 </script>
 
 <svelte:head>
diff --git a/apps/whispering/src/routes/(config)/settings/transcription/+page.svelte b/apps/whispering/src/routes/(config)/settings/transcription/+page.svelte
index fdab1ddd5e..c129d36865 100644
--- a/apps/whispering/src/routes/(config)/settings/transcription/+page.svelte
+++ b/apps/whispering/src/routes/(config)/settings/transcription/+page.svelte
@@ -1,42 +1,108 @@
 <script lang="ts">
-	import CopyToClipboardButton from '$lib/components/copyable/CopyToClipboardButton.svelte';
 	import CopyablePre from '$lib/components/copyable/CopyablePre.svelte';
+	import CopyToClipboardButton from '$lib/components/copyable/CopyToClipboardButton.svelte';
 	import {
 		LabeledInput,
 		LabeledSelect,
 		LabeledTextarea,
 	} from '$lib/components/labeled/index.js';
 	import {
+		DeepgramApiKeyInput,
 		ElevenLabsApiKeyInput,
 		GroqApiKeyInput,
 		OpenAiApiKeyInput,
-		DeepgramApiKeyInput,
 	} from '$lib/components/settings';
-	import { Badge } from '@repo/ui/badge';
-	import { Button } from '@repo/ui/button';
-	import * as Card from '@repo/ui/card';
-	import { Checkbox } from '@repo/ui/checkbox';
-	import { Input } from '@repo/ui/input';
-	import { Separator } from '@repo/ui/separator';
-	import * as Alert from '@repo/ui/alert';
-	import { Link } from '@repo/ui/link';
-	import * as Collapsible from '@repo/ui/collapsible';
-	import * as Select from '@repo/ui/select';
-	import { SUPPORTED_LANGUAGES_OPTIONS } from '$lib/constants/languages';
+	import WhisperModelSelector from '$lib/components/settings/WhisperModelSelector.svelte';
+	import { SUPPORTED_LANGUAGES_OPTIONS, type SupportedLanguage } from '$lib/constants/languages';
 	import {
+		DEEPGRAM_TRANSCRIPTION_MODELS,
 		ELEVENLABS_TRANSCRIPTION_MODELS,
 		GROQ_MODELS,
 		OPENAI_TRANSCRIPTION_MODELS,
 		TRANSCRIPTION_SERVICE_OPTIONS,
-		DEEPGRAM_TRANSCRIPTION_MODELS,
 	} from '$lib/constants/transcription';
 	import { settings } from '$lib/stores/settings.svelte';
-	import { TriangleAlert, InfoIcon, CheckIcon } from '@lucide/svelte';
-	import WhisperModelSelector from '$lib/components/settings/WhisperModelSelector.svelte';
+	import { CheckIcon, InfoIcon, TriangleAlert } from '@lucide/svelte';
+	import * as Alert from '@repo/ui/alert';
+	import { Badge } from '@repo/ui/badge';
+	import { Button } from '@repo/ui/button';
+	import * as Card from '@repo/ui/card';
+	import { Checkbox } from '@repo/ui/checkbox';
+	import * as Collapsible from '@repo/ui/collapsible';
+	import { Input } from '@repo/ui/input';
+	import { Link } from '@repo/ui/link';
+	import * as Select from '@repo/ui/select';
+	import { Separator } from '@repo/ui/separator';
+
 	import {
-		isUsingWhisperCppWithBrowserBackend,
 		isUsingNativeBackendAtWrongSampleRate,
+		isUsingWhisperCppWithBrowserBackend,
 	} from '../../../+layout/check-ffmpeg';
+
+	// Helper function to get human-readable language labels
+	const getLanguageLabel = (langCode: SupportedLanguage): string => {
+		const labels: Record<SupportedLanguage, string> = {
+			af: 'Afrikaans',
+			ar: 'Arabic',
+			auto: 'Auto',
+			az: 'Azerbaijani',
+			be: 'Belarusian',
+			bg: 'Bulgarian',
+			bs: 'Bosnian',
+			ca: 'Catalan',
+			cs: 'Czech',
+			cy: 'Welsh',
+			da: 'Danish',
+			de: 'German',
+			el: 'Greek',
+			en: 'English',
+			es: 'Spanish',
+			et: 'Estonian',
+			fa: 'Persian',
+			fi: 'Finnish',
+			fr: 'French',
+			gl: 'Galician',
+			he: 'Hebrew',
+			hi: 'Hindi',
+			hr: 'Croatian',
+			hu: 'Hungarian',
+			hy: 'Armenian',
+			id: 'Indonesian',
+			is: 'Icelandic',
+			it: 'Italian',
+			ja: 'Japanese',
+			kk: 'Kazakh',
+			kn: 'Kannada',
+			ko: 'Korean',
+			lt: 'Lithuanian',
+			lv: 'Latvian',
+			mi: 'Maori',
+			mk: 'Macedonian',
+			mr: 'Marathi',
+			ms: 'Malay',
+			ne: 'Nepali',
+			nl: 'Dutch',
+			no: 'Norwegian',
+			pl: 'Polish',
+			pt: 'Portuguese',
+			ro: 'Romanian',
+			ru: 'Russian',
+			sk: 'Slovak',
+			sl: 'Slovenian',
+			sr: 'Serbian',
+			sv: 'Swedish',
+			sw: 'Swahili',
+			ta: 'Tamil',
+			th: 'Thai',
+			tl: 'Tagalog',
+			tr: 'Turkish',
+			uk: 'Ukrainian',
+			ur: 'Urdu',
+			vi: 'Vietnamese',
+			zh: 'Chinese',
+		};
+		return labels[langCode] || langCode;
+	};
 </script>
 
 <svelte:head>
@@ -71,8 +137,8 @@
 			id="openai-model"
 			label="OpenAI Model"
 			items={OPENAI_TRANSCRIPTION_MODELS.map((model) => ({
-				value: model.name,
 				label: model.name,
+				value: model.name,
 				...model,
 			}))}
 			selected={settings.value['transcription.openai.model']}
@@ -99,8 +165,8 @@
 			id="groq-model"
 			label="Groq Model"
 			items={GROQ_MODELS.map((model) => ({
-				value: model.name,
 				label: model.name,
+				value: model.name,
 				...model,
 			}))}
 			selected={settings.value['transcription.groq.model']}
@@ -127,8 +193,8 @@
 			id="deepgram-model"
 			label="Deepgram Model"
 			items={DEEPGRAM_TRANSCRIPTION_MODELS.map((model) => ({
-				value: model.name,
 				label: model.name,
+				value: model.name,
 				...model,
 			}))}
 			selected={settings.value['transcription.deepgram.model']}
@@ -143,8 +209,8 @@
 			id="elevenlabs-model"
 			label="ElevenLabs Model"
 			items={ELEVENLABS_TRANSCRIPTION_MODELS.map((model) => ({
-				value: model.name,
 				label: model.name,
+				value: model.name,
 				...model,
 			}))}
 			selected={settings.value['transcription.elevenlabs.model']}
@@ -407,6 +473,70 @@
 		placeholder="Select a language"
 	/>
 
+	<!-- Favorite Languages Configuration -->
+	<Card.Root>
+		<Card.Header>
+			<Card.Title class="text-base">Language Toggle Shortcuts</Card.Title>
+			<Card.Description>
+				Configure up to 3 favorite languages for quick switching via keyboard shortcuts
+			</Card.Description>
+		</Card.Header>
+		<Card.Content class="space-y-4">
+			{#if (settings.value['transcription.favoriteLanguages'] ?? ['en', 'ja', 'zh']).length > 0}
+				{#each (settings.value['transcription.favoriteLanguages'] ?? ['en', 'ja', 'zh']) as language, i}
+					{@const slotNumber = i + 1}
+					<div class="flex items-center justify-between p-3 border rounded-lg">
+						<div class="flex items-center gap-3">
+							<Badge variant="outline" class="font-mono text-xs">
+								Slot {slotNumber}
+							</Badge>
+							<div>
+								<p class="font-medium text-sm">
+									{getLanguageLabel(language)}
+								</p>
+								<p class="text-muted-foreground text-xs">
+									Language code: {language}
+								</p>
+							</div>
+						</div>
+						<Button
+							variant="outline"
+							size="sm"
+							disabled
+						>
+							Remove (coming soon)
+						</Button>
+					</div>
+				{/each}
+			{/if}
+
+			{#if (settings.value['transcription.favoriteLanguages'] ?? ['en', 'ja', 'zh']).length < 3}
+				<div class="text-muted-foreground text-sm p-3 border rounded-lg border-dashed">
+					💡 Tip: You can add more favorite languages by editing the settings manually
+				</div>
+			{/if}
+
+			<div class="flex items-center justify-between">
+				<div class="text-muted-foreground text-xs space-y-1">
+					<p><strong>Keyboard shortcuts:</strong></p>
+					<ul class="list-disc list-inside space-y-0.5 ml-2">
+						<li>Toggle between languages: Configure in Settings → Shortcuts</li>
+						<li>Jump to Slot 1/2/3: Configure in Settings → Shortcuts</li>
+					</ul>
+				</div>
+				<Button
+					variant="outline" 
+					size="sm"
+					onclick={() => {
+						settings.updateKey('transcription.favoriteLanguages', ['en', 'ja', 'zh']);
+					}}
+				>
+					Reset to defaults
+				</Button>
+			</div>
+		</Card.Content>
+	</Card.Root>
+
 	<LabeledInput
 		id="temperature"
 		label="Temperature"
@@ -438,9 +568,9 @@
 	item,
 }: {
 	item: {
-		name: string;
-		description: string;
 		cost: string;
+		description: string;
+		name: string;
 	};
 })}
 	<div class="flex flex-col gap-1 py-1">
diff --git a/apps/whispering/src/routes/(config)/transformations/+page.svelte b/apps/whispering/src/routes/(config)/transformations/+page.svelte
index e16deae4ee..440500ec6f 100644
--- a/apps/whispering/src/routes/(config)/transformations/+page.svelte
+++ b/apps/whispering/src/routes/(config)/transformations/+page.svelte
@@ -1,7 +1,17 @@
 <script lang="ts">
+	import type {
+		ColumnDef,
+		ColumnFiltersState,
+		PaginationState,
+	} from '@tanstack/table-core';
+
 	import { confirmationDialog } from '$lib/components/ConfirmationDialog.svelte';
-	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import { TrashIcon } from '$lib/components/icons';
+	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
+	import { rpc } from '$lib/query';
+	import { type Transformation } from '$lib/services/db';
+	import { createTransformationViewTransitionName } from '$lib/utils/createTransformationViewTransitionName';
+	import { createPersistedState } from '@repo/svelte-utils';
 	import { Badge } from '@repo/ui/badge';
 	import { Button } from '@repo/ui/button';
 	import { Checkbox } from '@repo/ui/checkbox';
@@ -9,21 +19,12 @@
 	import { Skeleton } from '@repo/ui/skeleton';
 	import { SelectAllPopover, SortableTableHeader } from '@repo/ui/table';
 	import * as Table from '@repo/ui/table';
-	import { rpc } from '$lib/query';
-	import { type Transformation } from '$lib/services/db';
-	import { createPersistedState } from '@repo/svelte-utils';
-	import { createTransformationViewTransitionName } from '$lib/utils/createTransformationViewTransitionName';
 	import { createMutation, createQuery } from '@tanstack/svelte-query';
 	import {
-		FlexRender,
 		createTable as createSvelteTable,
+		FlexRender,
 		renderComponent,
 	} from '@tanstack/svelte-table';
-	import type {
-		ColumnDef,
-		ColumnFiltersState,
-		PaginationState,
-	} from '@tanstack/table-core';
 	import {
 		getCoreRowModel,
 		getFilteredRowModel,
@@ -32,6 +33,7 @@
 	} from '@tanstack/table-core';
 	import { createRawSnippet } from 'svelte';
 	import { z } from 'zod';
+
 	import CreateTransformationButton from './CreateTransformationButton.svelte';
 	import MarkTransformationActiveButton from './MarkTransformationActiveButton.svelte';
 	import TransformationRowActions from './TransformationRowActions.svelte';
@@ -45,36 +47,36 @@
 
 	const columns: ColumnDef<Transformation>[] = [
 		{
-			id: 'select',
-			header: ({ table }) =>
-				renderComponent(SelectAllPopover<Transformation>, { table }),
 			cell: ({ row }) =>
 				renderComponent(Checkbox, {
+					'aria-label': 'Select row',
 					checked: row.getIsSelected(),
 					onCheckedChange: (value) => row.toggleSelected(!!value),
-					'aria-label': 'Select row',
 				}),
-			enableSorting: false,
 			enableHiding: false,
+			enableSorting: false,
+			header: ({ table }) =>
+				renderComponent(SelectAllPopover<Transformation>, { table }),
+			id: 'select',
 		},
 		{
-			id: 'mark-selected',
 			cell: ({ row }) =>
 				renderComponent(MarkTransformationActiveButton, {
-					transformation: row.original,
 					size: 'icon',
+					transformation: row.original,
 				}),
-			enableSorting: false,
 			enableHiding: false,
+			enableSorting: false,
+			id: 'mark-selected',
 		},
 		{
 			accessorKey: 'id',
 			cell: ({ getValue }) =>
 				renderComponent(Badge, {
-					variant: 'id',
 					children: createRawSnippet((name) => ({
 						render: () => getValue<string>(),
 					})),
+					variant: 'id',
 				}),
 			header: 'ID',
 		},
@@ -95,21 +97,21 @@
 				}),
 		},
 		{
-			id: 'actions',
 			accessorFn: (transformation) => transformation,
-			header: 'Actions',
 			cell: ({ getValue }) => {
 				const transformation = getValue<Transformation>();
 				return renderComponent(TransformationRowActions, {
 					transformationId: transformation.id,
 				});
 			},
+			header: 'Actions',
+			id: 'actions',
 		},
 	];
 
 	let sorting = createPersistedState({
 		key: 'whispering-transformations-data-table-sorting',
-		onParseError: (error) => [{ id: 'title', desc: false }],
+		onParseError: (error) => [{ desc: false, id: 'title' }],
 		schema: z.array(z.object({ desc: z.boolean(), id: z.string() })),
 	});
 	let columnFilters = $state<ColumnFiltersState>([]);
@@ -121,27 +123,27 @@
 	let pagination = $state<PaginationState>({ pageIndex: 0, pageSize: 10 });
 
 	const table = createSvelteTable({
-		getRowId: (originalRow) => originalRow.id,
+		columns,
 		get data() {
 			return transformationsQuery.data ?? [];
 		},
-		columns,
 		getCoreRowModel: getCoreRowModel(),
-		getSortedRowModel: getSortedRowModel(),
 		getFilteredRowModel: getFilteredRowModel(),
 		getPaginationRowModel: getPaginationRowModel(),
-		onSortingChange: (updater) => {
+		getRowId: (originalRow) => originalRow.id,
+		getSortedRowModel: getSortedRowModel(),
+		onColumnFiltersChange: (updater) => {
 			if (typeof updater === 'function') {
-				sorting.value = updater(sorting.value);
+				columnFilters = updater(columnFilters);
 			} else {
-				sorting.value = updater;
+				columnFilters = updater;
 			}
 		},
-		onColumnFiltersChange: (updater) => {
+		onPaginationChange: (updater) => {
 			if (typeof updater === 'function') {
-				columnFilters = updater(columnFilters);
+				pagination = updater(pagination);
 			} else {
-				columnFilters = updater;
+				pagination = updater;
 			}
 		},
 		onRowSelectionChange: (updater) => {
@@ -151,25 +153,25 @@
 				rowSelection.value = updater;
 			}
 		},
-		onPaginationChange: (updater) => {
+		onSortingChange: (updater) => {
 			if (typeof updater === 'function') {
-				pagination = updater(pagination);
+				sorting.value = updater(sorting.value);
 			} else {
-				pagination = updater;
+				sorting.value = updater;
 			}
 		},
 		state: {
-			get sorting() {
-				return sorting.value;
-			},
 			get columnFilters() {
 				return columnFilters;
 			},
+			get pagination() {
+				return pagination;
+			},
 			get rowSelection() {
 				return rowSelection.value;
 			},
-			get pagination() {
-				return pagination;
+			get sorting() {
+				return sorting.value;
 			},
 		},
 	});
@@ -216,12 +218,18 @@
 				onclick={() => {
 					confirmationDialog.open({
 						title: 'Delete transformations',
-						subtitle: 'Are you sure you want to delete these transformations?',
 						confirmText: 'Delete',
 						onConfirm: () => {
 							deleteTransformations.mutate(
 								selectedTransformationRows.map(({ original }) => original),
 								{
+									onError: (error) => {
+										rpc.notify.error.execute({
+											title: 'Failed to delete transformations!',
+											description: 'Your transformations could not be deleted.',
+											action: { error: error, type: 'more-details' },
+										});
+									},
 									onSuccess: () => {
 										rpc.notify.success.execute({
 											title: 'Deleted transformations!',
@@ -229,16 +237,10 @@
 												'Your transformations have been deleted successfully.',
 										});
 									},
-									onError: (error) => {
-										rpc.notify.error.execute({
-											title: 'Failed to delete transformations!',
-											description: 'Your transformations could not be deleted.',
-											action: { type: 'more-details', error: error },
-										});
-									},
 								},
 							);
 						},
+						subtitle: 'Are you sure you want to delete these transformations?',
 					});
 				}}
 			>
diff --git a/apps/whispering/src/routes/(config)/transformations/CreateTransformationButton.svelte b/apps/whispering/src/routes/(config)/transformations/CreateTransformationButton.svelte
index 5721419b5c..ab07f8fe2c 100644
--- a/apps/whispering/src/routes/(config)/transformations/CreateTransformationButton.svelte
+++ b/apps/whispering/src/routes/(config)/transformations/CreateTransformationButton.svelte
@@ -1,13 +1,13 @@
 <script lang="ts">
 	import { confirmationDialog } from '$lib/components/ConfirmationDialog.svelte';
 	import { Editor } from '$lib/components/transformations-editor';
+	import { rpc } from '$lib/query';
+	import { generateDefaultTransformation } from '$lib/services/db';
+	import { PlusIcon } from '@lucide/svelte';
 	import { Button } from '@repo/ui/button';
 	import * as Dialog from '@repo/ui/dialog';
 	import { Separator } from '@repo/ui/separator';
-	import { rpc } from '$lib/query';
-	import { generateDefaultTransformation } from '$lib/services/db';
 	import { createMutation } from '@tanstack/svelte-query';
-	import { PlusIcon } from '@lucide/svelte';
 
 	const createTransformation = createMutation(
 		rpc.transformations.mutations.createTransformation.options,
@@ -19,11 +19,11 @@
 	function promptUserConfirmLeave() {
 		confirmationDialog.open({
 			title: 'Unsaved changes',
-			subtitle: 'You have unsaved changes. Are you sure you want to leave?',
 			confirmText: 'Leave',
 			onConfirm: () => {
 				isDialogOpen = false;
 			},
+			subtitle: 'You have unsaved changes. Are you sure you want to leave?',
 		});
 	}
 </script>
@@ -68,6 +68,13 @@
 				type="submit"
 				onclick={() =>
 					createTransformation.mutate($state.snapshot(transformation), {
+						onError: (error) => {
+							rpc.notify.error.execute({
+								title: 'Failed to create transformation!',
+								description: 'Your transformation could not be created.',
+								action: { error, type: 'more-details' },
+							});
+						},
 						onSuccess: () => {
 							isDialogOpen = false;
 							transformation = generateDefaultTransformation();
@@ -77,13 +84,6 @@
 									'Your transformation has been created successfully.',
 							});
 						},
-						onError: (error) => {
-							rpc.notify.error.execute({
-								title: 'Failed to create transformation!',
-								description: 'Your transformation could not be created.',
-								action: { type: 'more-details', error },
-							});
-						},
 					})}
 			>
 				Create
diff --git a/apps/whispering/src/routes/(config)/transformations/EditTransformationModal.svelte b/apps/whispering/src/routes/(config)/transformations/EditTransformationModal.svelte
index 35c9ab9e34..ad381833e6 100644
--- a/apps/whispering/src/routes/(config)/transformations/EditTransformationModal.svelte
+++ b/apps/whispering/src/routes/(config)/transformations/EditTransformationModal.svelte
@@ -1,15 +1,17 @@
 <script lang="ts">
+	import type { Transformation } from '$lib/services/db';
+
 	import { confirmationDialog } from '$lib/components/ConfirmationDialog.svelte';
-	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import { PencilIcon as EditIcon } from '$lib/components/icons';
 	import { Editor } from '$lib/components/transformations-editor';
+	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
+	import { rpc } from '$lib/query';
+	import { HistoryIcon, Loader2Icon, PlayIcon, TrashIcon } from '@lucide/svelte';
 	import { Button } from '@repo/ui/button';
 	import * as Modal from '@repo/ui/modal';
 	import { Separator } from '@repo/ui/separator';
-	import { rpc } from '$lib/query';
-	import type { Transformation } from '$lib/services/db';
 	import { createMutation } from '@tanstack/svelte-query';
-	import { HistoryIcon, Loader2Icon, PlayIcon, TrashIcon } from '@lucide/svelte';
+
 	import MarkTransformationActiveButton from './MarkTransformationActiveButton.svelte';
 
 	const updateTransformation = createMutation(
@@ -21,9 +23,9 @@
 	);
 
 	let {
-		transformation,
 		class: className,
-	}: { transformation: Transformation; class?: string } = $props();
+		transformation,
+	}: { class?: string; transformation: Transformation; } = $props();
 
 	let isDialogOpen = $state(false);
 
@@ -77,7 +79,6 @@
 
 		confirmationDialog.open({
 			title: 'Unsaved changes',
-			subtitle: 'You have unsaved changes. Are you sure you want to leave?',
 			confirmText: 'Leave',
 			onConfirm: () => {
 				// Reset working copy and dirty flag
@@ -86,6 +87,7 @@
 
 				isDialogOpen = false;
 			},
+			subtitle: 'You have unsaved changes. Are you sure you want to leave?',
 		});
 	}
 </script>
@@ -141,10 +143,16 @@
 				onclick={() => {
 					confirmationDialog.open({
 						title: 'Delete transformation',
-						subtitle: 'Are you sure? This action cannot be undone.',
 						confirmText: 'Delete',
 						onConfirm: () => {
 							deleteTransformation.mutate($state.snapshot(transformation), {
+								onError: (error) => {
+									rpc.notify.error.execute({
+										title: 'Failed to delete transformation!',
+										description: 'Your transformation could not be deleted.',
+										action: { error, type: 'more-details' },
+									});
+								},
 								onSuccess: () => {
 									isDialogOpen = false;
 									rpc.notify.success.execute({
@@ -153,15 +161,9 @@
 											'Your transformation has been deleted successfully.',
 									});
 								},
-								onError: (error) => {
-									rpc.notify.error.execute({
-										title: 'Failed to delete transformation!',
-										description: 'Your transformation could not be deleted.',
-										action: { type: 'more-details', error },
-									});
-								},
 							});
 						},
+						subtitle: 'Are you sure? This action cannot be undone.',
 					});
 				}}
 				variant="destructive"
@@ -182,6 +184,13 @@
 				<Button
 					onclick={() => {
 						updateTransformation.mutate($state.snapshot(workingCopy), {
+							onError: (error) => {
+								rpc.notify.error.execute({
+									title: 'Failed to update transformation!',
+									description: 'Your transformation could not be updated.',
+									action: { error, type: 'more-details' },
+								});
+							},
 							onSuccess: () => {
 								rpc.notify.success.execute({
 									title: 'Updated transformation!',
@@ -190,13 +199,6 @@
 								});
 								isDialogOpen = false;
 							},
-							onError: (error) => {
-								rpc.notify.error.execute({
-									title: 'Failed to update transformation!',
-									description: 'Your transformation could not be updated.',
-									action: { type: 'more-details', error },
-								});
-							},
 						});
 					}}
 					disabled={updateTransformation.isPending || !isWorkingCopyDirty}
diff --git a/apps/whispering/src/routes/(config)/transformations/MarkTransformationActiveButton.svelte b/apps/whispering/src/routes/(config)/transformations/MarkTransformationActiveButton.svelte
index fe184389c5..cbf8255d57 100644
--- a/apps/whispering/src/routes/(config)/transformations/MarkTransformationActiveButton.svelte
+++ b/apps/whispering/src/routes/(config)/transformations/MarkTransformationActiveButton.svelte
@@ -1,17 +1,18 @@
 <script lang="ts">
-	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import type { Transformation } from '$lib/services/db';
+
+	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import { settings } from '$lib/stores/settings.svelte';
 	import { CheckCircleIcon, CircleIcon } from '@lucide/svelte';
 
 	let {
-		transformation,
 		class: className,
 		size = 'default',
+		transformation,
 	}: {
-		transformation: Transformation;
 		class?: string;
 		size?: 'default' | 'icon';
+		transformation: Transformation;
 	} = $props();
 
 	const isTransformationActive = $derived(
diff --git a/apps/whispering/src/routes/(config)/transformations/TransformationRowActions.svelte b/apps/whispering/src/routes/(config)/transformations/TransformationRowActions.svelte
index 4db57f0280..563a6bac8c 100644
--- a/apps/whispering/src/routes/(config)/transformations/TransformationRowActions.svelte
+++ b/apps/whispering/src/routes/(config)/transformations/TransformationRowActions.svelte
@@ -1,10 +1,11 @@
 <script lang="ts">
 	import { confirmationDialog } from '$lib/components/ConfirmationDialog.svelte';
-	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import { TrashIcon } from '$lib/components/icons';
-	import { Skeleton } from '@repo/ui/skeleton';
+	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import { rpc } from '$lib/query';
+	import { Skeleton } from '@repo/ui/skeleton';
 	import { createMutation, createQuery } from '@tanstack/svelte-query';
+
 	import EditTransformationModal from './EditTransformationModal.svelte';
 
 	let { transformationId }: { transformationId: string } = $props();
@@ -32,10 +33,16 @@
 			onclick={() => {
 				confirmationDialog.open({
 					title: 'Delete transformation',
-					subtitle: 'Are you sure you want to delete this transformation?',
 					confirmText: 'Delete',
 					onConfirm: () =>
 						deleteTransformation.mutate(transformation, {
+							onError: (error) => {
+								rpc.notify.error.execute({
+									title: 'Failed to delete transformation!',
+									description: 'Your transformation could not be deleted.',
+									action: { error, type: 'more-details' },
+								});
+							},
 							onSuccess: () => {
 								rpc.notify.success.execute({
 									title: 'Deleted transformation!',
@@ -43,14 +50,8 @@
 										'Your transformation has been deleted successfully.',
 								});
 							},
-							onError: (error) => {
-								rpc.notify.error.execute({
-									title: 'Failed to delete transformation!',
-									description: 'Your transformation could not be deleted.',
-									action: { type: 'more-details', error },
-								});
-							},
 						}),
+					subtitle: 'Are you sure you want to delete this transformation?',
 				});
 			}}
 			variant="ghost"
diff --git a/apps/whispering/src/routes/(config)/transformations/new/+page.svelte b/apps/whispering/src/routes/(config)/transformations/new/+page.svelte
index 0c2b012932..d20a137bb2 100644
--- a/apps/whispering/src/routes/(config)/transformations/new/+page.svelte
+++ b/apps/whispering/src/routes/(config)/transformations/new/+page.svelte
@@ -1,10 +1,10 @@
 <script lang="ts">
 	import { goto } from '$app/navigation';
 	import { Editor } from '$lib/components/transformations-editor';
-	import { Button } from '@repo/ui/button';
-	import * as Card from '@repo/ui/card';
 	import { rpc } from '$lib/query';
 	import { generateDefaultTransformation } from '$lib/services/db';
+	import { Button } from '@repo/ui/button';
+	import * as Card from '@repo/ui/card';
 	import { createMutation } from '@tanstack/svelte-query';
 
 	const createTransformation = createMutation(
@@ -27,6 +27,13 @@
 			<Button
 				onclick={() =>
 					createTransformation.mutate($state.snapshot(transformation), {
+						onError: (error) => {
+							rpc.notify.error.execute({
+								title: 'Failed to create transformation!',
+								description: 'Your transformation could not be created.',
+								action: { error, type: 'more-details' },
+							});
+						},
 						onSuccess: () => {
 							goto('/transformations');
 							rpc.notify.success.execute({
@@ -35,13 +42,6 @@
 									'Your transformation has been created successfully.',
 							});
 						},
-						onError: (error) => {
-							rpc.notify.error.execute({
-								title: 'Failed to create transformation!',
-								description: 'Your transformation could not be created.',
-								action: { type: 'more-details', error },
-							});
-						},
 					})}
 			>
 				Create Transformation
diff --git a/apps/whispering/src/routes/+layout.svelte b/apps/whispering/src/routes/+layout.svelte
index 4b91e94a61..c2710b9493 100644
--- a/apps/whispering/src/routes/+layout.svelte
+++ b/apps/whispering/src/routes/+layout.svelte
@@ -1,11 +1,12 @@
 <script lang="ts">
 	import { onNavigate } from '$app/navigation';
-	import { queryClient } from '$lib/query/_client';
 	import { rpc } from '$lib/query';
+	import { queryClient } from '$lib/query/_client';
+	import * as services from '$lib/services';
 	import { QueryClientProvider } from '@tanstack/svelte-query';
-	import { SvelteQueryDevtools } from '@tanstack/svelte-query-devtools';
 	import '@repo/ui/app.css';
-	import * as services from '$lib/services';
+	import { SvelteQueryDevtools } from '@tanstack/svelte-query-devtools';
+
 	import AppShell from './+layout/AppShell.svelte';
 
 	let { children } = $props();
diff --git a/apps/whispering/src/routes/+layout/AppShell.svelte b/apps/whispering/src/routes/+layout/AppShell.svelte
index e3e9fcc349..65b9a84773 100644
--- a/apps/whispering/src/routes/+layout/AppShell.svelte
+++ b/apps/whispering/src/routes/+layout/AppShell.svelte
@@ -10,10 +10,12 @@
 	import { settings } from '$lib/stores/settings.svelte';
 	// import { extension } from '@repo/extension';
 	import { createQuery } from '@tanstack/svelte-query';
-	import { ModeWatcher, mode } from 'mode-watcher';
+	import { mode, ModeWatcher } from 'mode-watcher';
 	import { onDestroy, onMount } from 'svelte';
 	import { Toaster, type ToasterProps } from 'svelte-sonner';
+
 	import { syncWindowAlwaysOnTopWithRecorderState } from './alwaysOnTop.svelte';
+	import { checkFfmpeg } from './check-ffmpeg';
 	import { checkForUpdates } from './check-for-updates';
 	import {
 		resetGlobalShortcutsToDefaultIfDuplicates,
@@ -22,7 +24,6 @@
 		syncLocalShortcutsWithSettings,
 	} from './register-commands';
 	import { registerOnboarding } from './register-onboarding';
-	import { checkFfmpeg } from './check-ffmpeg';
 	import { 
 		registerAccessibilityPermission,
 		registerMicrophonePermission 
@@ -72,26 +73,26 @@
 		getRecorderStateQuery.data;
 		getVadStateQuery.data;
 		services.db.cleanupExpiredRecordings({
+			maxRecordingCount: settings.value['database.maxRecordingCount'],
 			recordingRetentionStrategy:
 				settings.value['database.recordingRetentionStrategy'],
-			maxRecordingCount: settings.value['database.maxRecordingCount'],
 		});
 	});
 
 	const TOASTER_SETTINGS = {
+		closeButton: true,
+		duration: 5000,
 		position: 'bottom-right',
 		richColors: true,
-		duration: 5000,
-		visibleToasts: 5,
 		toastOptions: {
 			classes: {
-				toast: 'flex flex-wrap *:data-content:flex-1',
-				icon: 'shrink-0',
 				actionButton: 'w-full mt-3 inline-flex justify-center',
 				closeButton: 'w-full mt-3 inline-flex justify-center',
+				icon: 'shrink-0',
+				toast: 'flex flex-wrap *:data-content:flex-1',
 			},
 		},
-		closeButton: true,
+		visibleToasts: 5,
 	} satisfies ToasterProps;
 
 	let { children } = $props();
diff --git a/apps/whispering/src/routes/+layout/alwaysOnTop.svelte.ts b/apps/whispering/src/routes/+layout/alwaysOnTop.svelte.ts
index 2dad7bb4d0..f43e2e9d32 100644
--- a/apps/whispering/src/routes/+layout/alwaysOnTop.svelte.ts
+++ b/apps/whispering/src/routes/+layout/alwaysOnTop.svelte.ts
@@ -21,30 +21,30 @@ export function syncWindowAlwaysOnTopWithRecorderState() {
 			case 'Always':
 				setAlwaysOnTop(true);
 				break;
-			case 'When Recording and Transcribing':
+			case 'Never':
+				setAlwaysOnTop(false);
+				break;
+			case 'When Recording':
 				if (
 					getRecorderStateQuery.data === 'RECORDING' ||
-					getVadStateQuery.data === 'SPEECH_DETECTED' ||
-					rpc.transcription.isCurrentlyTranscribing()
+					getVadStateQuery.data === 'SPEECH_DETECTED'
 				) {
 					setAlwaysOnTop(true);
 				} else {
 					setAlwaysOnTop(false);
 				}
 				break;
-			case 'When Recording':
+			case 'When Recording and Transcribing':
 				if (
 					getRecorderStateQuery.data === 'RECORDING' ||
-					getVadStateQuery.data === 'SPEECH_DETECTED'
+					getVadStateQuery.data === 'SPEECH_DETECTED' ||
+					rpc.transcription.isCurrentlyTranscribing()
 				) {
 					setAlwaysOnTop(true);
 				} else {
 					setAlwaysOnTop(false);
 				}
 				break;
-			case 'Never':
-				setAlwaysOnTop(false);
-				break;
 		}
 	});
 }
diff --git a/apps/whispering/src/routes/+layout/check-ffmpeg.ts b/apps/whispering/src/routes/+layout/check-ffmpeg.ts
index ae849bf81a..ceca42802b 100644
--- a/apps/whispering/src/routes/+layout/check-ffmpeg.ts
+++ b/apps/whispering/src/routes/+layout/check-ffmpeg.ts
@@ -1,71 +1,7 @@
-import { toast } from 'svelte-sonner';
 import { goto } from '$app/navigation';
 import { rpc } from '$lib/query';
 import { settings } from '$lib/stores/settings.svelte';
-
-/**
- * Checks if Whisper C++ is selected as the transcription service
- * @returns true if using Whisper C++ for transcription
- */
-function isUsingWhisperCpp(): boolean {
-	return (
-		settings.value['transcription.selectedTranscriptionService'] ===
-		'whispercpp'
-	);
-}
-
-/**
- * Checks if the native (Rust) recording backend is selected
- * @returns true if using native backend for recording
- */
-function isUsingNativeBackend(): boolean {
-	return settings.value['recording.backend'] === 'native';
-}
-
-/**
- * Checks if the browser (MediaRecorder) recording backend is selected
- * @returns true if using browser backend for recording
- */
-function isUsingBrowserBackend(): boolean {
-	return settings.value['recording.backend'] === 'browser';
-}
-
-/**
- * Checks if the sample rate is set to 16kHz
- * Note: Whisper C++ requires 16kHz audio input
- * @returns true if sample rate is 16000Hz
- */
-function isUsing16kHz(): boolean {
-	return settings.value['recording.desktop.sampleRate'] === '16000';
-}
-
-/**
- * Checks if FFmpeg is REQUIRED for Whisper C++ with browser recording
- * Browser backend cannot produce 16kHz WAV directly, so FFmpeg is required
- * @returns true if using Whisper C++ with browser backend
- */
-export function isUsingWhisperCppWithBrowserBackend(): boolean {
-	return isUsingWhisperCpp() && isUsingBrowserBackend();
-}
-
-/**
- * Checks if FFmpeg is REQUIRED for Whisper C++ with wrong sample rate
- * Native backend with non-16kHz audio needs FFmpeg to convert for Whisper C++
- * @returns true if using Whisper C++ with native backend at non-16kHz
- */
-export function isUsingNativeBackendAtWrongSampleRate(): boolean {
-	return isUsingWhisperCpp() && isUsingNativeBackend() && !isUsing16kHz();
-}
-
-/**
- * Checks if FFmpeg would benefit cloud transcription with native backend
- * FFmpeg enables audio compression for faster uploads to cloud services
- * Only relevant when using native backend with cloud providers (not Whisper C++)
- * @returns true if using native backend with any cloud transcription service
- */
-export function isUsingNativeBackendWithCloudTranscription(): boolean {
-	return isUsingNativeBackend() && !isUsingWhisperCpp();
-}
+import { toast } from 'svelte-sonner';
 
 /**
  * Checks for FFmpeg installation and shows an appropriate toast based on current settings.
@@ -128,3 +64,67 @@ export async function checkFfmpeg() {
 		return;
 	}
 }
+
+/**
+ * Checks if FFmpeg is REQUIRED for Whisper C++ with wrong sample rate
+ * Native backend with non-16kHz audio needs FFmpeg to convert for Whisper C++
+ * @returns true if using Whisper C++ with native backend at non-16kHz
+ */
+export function isUsingNativeBackendAtWrongSampleRate(): boolean {
+	return isUsingWhisperCpp() && isUsingNativeBackend() && !isUsing16kHz();
+}
+
+/**
+ * Checks if FFmpeg would benefit cloud transcription with native backend
+ * FFmpeg enables audio compression for faster uploads to cloud services
+ * Only relevant when using native backend with cloud providers (not Whisper C++)
+ * @returns true if using native backend with any cloud transcription service
+ */
+export function isUsingNativeBackendWithCloudTranscription(): boolean {
+	return isUsingNativeBackend() && !isUsingWhisperCpp();
+}
+
+/**
+ * Checks if FFmpeg is REQUIRED for Whisper C++ with browser recording
+ * Browser backend cannot produce 16kHz WAV directly, so FFmpeg is required
+ * @returns true if using Whisper C++ with browser backend
+ */
+export function isUsingWhisperCppWithBrowserBackend(): boolean {
+	return isUsingWhisperCpp() && isUsingBrowserBackend();
+}
+
+/**
+ * Checks if the sample rate is set to 16kHz
+ * Note: Whisper C++ requires 16kHz audio input
+ * @returns true if sample rate is 16000Hz
+ */
+function isUsing16kHz(): boolean {
+	return settings.value['recording.desktop.sampleRate'] === '16000';
+}
+
+/**
+ * Checks if the browser (MediaRecorder) recording backend is selected
+ * @returns true if using browser backend for recording
+ */
+function isUsingBrowserBackend(): boolean {
+	return settings.value['recording.backend'] === 'browser';
+}
+
+/**
+ * Checks if the native (Rust) recording backend is selected
+ * @returns true if using native backend for recording
+ */
+function isUsingNativeBackend(): boolean {
+	return settings.value['recording.backend'] === 'native';
+}
+
+/**
+ * Checks if Whisper C++ is selected as the transcription service
+ * @returns true if using Whisper C++ for transcription
+ */
+function isUsingWhisperCpp(): boolean {
+	return (
+		settings.value['transcription.selectedTranscriptionService'] ===
+		'whispercpp'
+	);
+}
diff --git a/apps/whispering/src/routes/+layout/check-for-updates.ts b/apps/whispering/src/routes/+layout/check-for-updates.ts
index f614a94359..ccb8196ac7 100644
--- a/apps/whispering/src/routes/+layout/check-for-updates.ts
+++ b/apps/whispering/src/routes/+layout/check-for-updates.ts
@@ -1,9 +1,9 @@
 import {
-	type UpdateInfo,
 	updateDialog,
+	type UpdateInfo,
 } from '$lib/components/UpdateDialog.svelte';
 import { rpc } from '$lib/query';
-import { type DownloadEvent, check } from '@tauri-apps/plugin-updater';
+import { check, type DownloadEvent } from '@tauri-apps/plugin-updater';
 import { extractErrorMessage } from 'wellcrafted/error';
 
 export async function checkForUpdates() {
@@ -15,9 +15,9 @@ export async function checkForUpdates() {
 				title: `Update ${update.version} available`,
 				description: 'A new version of Whispering is available.',
 				action: {
-					type: 'button',
 					label: 'View Update',
 					onClick: () => updateDialog.open(update),
+					type: 'button',
 				},
 				persist: true,
 			});
@@ -56,8 +56,6 @@ async function mockCheck(): Promise<UpdateInfo> {
 
 	// Return mock update data that matches the full Update type
 	return {
-		version: '2.0.0',
-		date: new Date().toISOString(),
 		body: `## What's New in v2.0.0
 
 ### 🚀 Features
@@ -82,6 +80,7 @@ async function mockCheck(): Promise<UpdateInfo> {
 ### 📝 Notes
 This is a mock update for testing purposes. The actual update
 process would download and install real application files.`,
+		date: new Date().toISOString(),
 		/**
 		 * Mock download and install function that simulates real update behavior
 		 */
@@ -94,8 +93,8 @@ process would download and install real application files.`,
 
 			// Emit Started event
 			progressCallback?.({
-				event: 'Started',
 				data: { contentLength: totalSize },
+				event: 'Started',
 			});
 
 			// Simulate download in chunks
@@ -108,14 +107,15 @@ process would download and install real application files.`,
 				downloaded += chunkSize;
 
 				progressCallback?.({
-					event: 'Progress',
 					data: { chunkLength: chunkSize },
+					event: 'Progress',
 				});
 			}
 
 			// Emit Finished event
 			progressCallback?.({ event: 'Finished' });
 		},
+		version: '2.0.0',
 	};
 }
 
diff --git a/apps/whispering/src/routes/+layout/register-commands.ts b/apps/whispering/src/routes/+layout/register-commands.ts
index 64c6fb9122..e0ad141e5f 100644
--- a/apps/whispering/src/routes/+layout/register-commands.ts
+++ b/apps/whispering/src/routes/+layout/register-commands.ts
@@ -1,76 +1,46 @@
+import type { Accelerator } from '$lib/services/global-shortcut-manager';
+import type { Settings } from '$lib/settings';
+
 import { commands } from '$lib/commands';
 import { rpc } from '$lib/query';
-import type { Accelerator } from '$lib/services/global-shortcut-manager';
 import {
 	type CommandId,
 	shortcutStringToArray,
 } from '$lib/services/local-shortcut-manager';
-import type { Settings } from '$lib/settings';
 import { settings } from '$lib/stores/settings.svelte';
 import { partitionResults } from 'wellcrafted/result';
 
 /**
- * Synchronizes local keyboard shortcuts with the current settings.
- * - Registers shortcuts that have key combinations defined in settings
- * - Unregisters shortcuts that don't have key combinations defined
- * - Shows error toast if any registration/unregistration fails
+ * Checks if any global shortcuts are duplicated and resets all to defaults if duplicates found.
+ * Returns true if duplicates were found and reset, false otherwise.
  */
-export async function syncLocalShortcutsWithSettings() {
-	const results = await Promise.all(
-		commands
-			.map((command) => {
-				const keyCombination = settings.value[`shortcuts.local.${command.id}`];
-				if (!keyCombination) {
-					return rpc.shortcuts.unregisterCommandLocally.execute({
-						commandId: command.id as CommandId,
-					});
-				}
-				return rpc.shortcuts.registerCommandLocally.execute({
-					command,
-					keyCombination: shortcutStringToArray(keyCombination),
-				});
-			})
-			.filter((result) => result !== undefined),
-	);
-	const { errs } = partitionResults(results);
-	if (errs.length > 0) {
-		rpc.notify.error.execute({
-			title: 'Error registering local commands',
-			description: errs.map((err) => err.error.message).join('\n'),
-			action: { type: 'more-details', error: errs },
-		});
-	}
-}
+export function resetGlobalShortcutsToDefaultIfDuplicates(): boolean {
+	const globalShortcuts = new Map<string, string>();
 
-/**
- * Synchronizes global keyboard shortcuts with the current settings.
- * - Registers shortcuts that have key combinations defined in settings
- * - Unregisters shortcuts that don't have key combinations defined
- * - Shows error toast if any registration/unregistration fails
- */
-export async function syncGlobalShortcutsWithSettings() {
-	const results = await Promise.all(
-		commands
-			.map((command) => {
-				const accelerator = settings.value[
-					`shortcuts.global.${command.id}`
-				] as Accelerator | null;
-				if (!accelerator) return;
-				return rpc.shortcuts.registerCommandGlobally.execute({
-					command,
-					accelerator,
+	// Check for duplicates
+	for (const command of commands) {
+		const shortcut = settings.value[`shortcuts.global.${command.id}`];
+		if (shortcut) {
+			if (globalShortcuts.has(shortcut)) {
+				// If duplicates found, reset all global shortcuts to defaults
+				settings.resetShortcuts('global');
+				rpc.notify.success.execute({
+					title: 'Shortcuts reset',
+					description:
+						'Duplicate global shortcuts detected. All global shortcuts have been reset to defaults.',
+					action: {
+						href: '/settings/shortcuts/global',
+						label: 'Configure shortcuts',
+						type: 'link',
+					},
 				});
-			})
-			.filter((result) => result !== undefined),
-	);
-	const { errs } = partitionResults(results);
-	if (errs.length > 0) {
-		rpc.notify.error.execute({
-			title: 'Error registering global commands',
-			description: errs.map((err) => err.error.message).join('\n'),
-			action: { type: 'more-details', error: errs },
-		});
+
+				return true;
+			}
+			globalShortcuts.set(shortcut, command.id);
+		}
 	}
+	return false;
 }
 
 /**
@@ -92,9 +62,9 @@ export function resetLocalShortcutsToDefaultIfDuplicates(): boolean {
 					description:
 						'Duplicate local shortcuts detected. All local shortcuts have been reset to defaults.',
 					action: {
-						type: 'link',
-						label: 'Configure shortcuts',
 						href: '/settings/shortcuts/local',
+						label: 'Configure shortcuts',
+						type: 'link',
 					},
 				});
 
@@ -107,34 +77,65 @@ export function resetLocalShortcutsToDefaultIfDuplicates(): boolean {
 }
 
 /**
- * Checks if any global shortcuts are duplicated and resets all to defaults if duplicates found.
- * Returns true if duplicates were found and reset, false otherwise.
+ * Synchronizes global keyboard shortcuts with the current settings.
+ * - Registers shortcuts that have key combinations defined in settings
+ * - Unregisters shortcuts that don't have key combinations defined
+ * - Shows error toast if any registration/unregistration fails
  */
-export function resetGlobalShortcutsToDefaultIfDuplicates(): boolean {
-	const globalShortcuts = new Map<string, string>();
-
-	// Check for duplicates
-	for (const command of commands) {
-		const shortcut = settings.value[`shortcuts.global.${command.id}`];
-		if (shortcut) {
-			if (globalShortcuts.has(shortcut)) {
-				// If duplicates found, reset all global shortcuts to defaults
-				settings.resetShortcuts('global');
-				rpc.notify.success.execute({
-					title: 'Shortcuts reset',
-					description:
-						'Duplicate global shortcuts detected. All global shortcuts have been reset to defaults.',
-					action: {
-						type: 'link',
-						label: 'Configure shortcuts',
-						href: '/settings/shortcuts/global',
-					},
+export async function syncGlobalShortcutsWithSettings() {
+	const results = await Promise.all(
+		commands
+			.map((command) => {
+				const accelerator = settings.value[
+					`shortcuts.global.${command.id}`
+				] as Accelerator | null;
+				if (!accelerator) return;
+				return rpc.shortcuts.registerCommandGlobally.execute({
+					accelerator,
+					command,
 				});
+			})
+			.filter((result) => result !== undefined),
+	);
+	const { errs } = partitionResults(results);
+	if (errs.length > 0) {
+		rpc.notify.error.execute({
+			title: 'Error registering global commands',
+			description: errs.map((err) => err.error.message).join('\n'),
+			action: { error: errs, type: 'more-details' },
+		});
+	}
+}
 
-				return true;
-			}
-			globalShortcuts.set(shortcut, command.id);
-		}
+/**
+ * Synchronizes local keyboard shortcuts with the current settings.
+ * - Registers shortcuts that have key combinations defined in settings
+ * - Unregisters shortcuts that don't have key combinations defined
+ * - Shows error toast if any registration/unregistration fails
+ */
+export async function syncLocalShortcutsWithSettings() {
+	const results = await Promise.all(
+		commands
+			.map((command) => {
+				const keyCombination = settings.value[`shortcuts.local.${command.id}`];
+				if (!keyCombination) {
+					return rpc.shortcuts.unregisterCommandLocally.execute({
+						commandId: command.id as CommandId,
+					});
+				}
+				return rpc.shortcuts.registerCommandLocally.execute({
+					command,
+					keyCombination: shortcutStringToArray(keyCombination),
+				});
+			})
+			.filter((result) => result !== undefined),
+	);
+	const { errs } = partitionResults(results);
+	if (errs.length > 0) {
+		rpc.notify.error.execute({
+			title: 'Error registering local commands',
+			description: errs.map((err) => err.error.message).join('\n'),
+			action: { error: errs, type: 'more-details' },
+		});
 	}
-	return false;
 }
diff --git a/apps/whispering/src/routes/+layout/register-onboarding.ts b/apps/whispering/src/routes/+layout/register-onboarding.ts
index 740cb32c8a..80f4361927 100644
--- a/apps/whispering/src/routes/+layout/register-onboarding.ts
+++ b/apps/whispering/src/routes/+layout/register-onboarding.ts
@@ -17,9 +17,9 @@ export function registerOnboarding() {
 			title: 'Welcome to Whispering!',
 			description: 'Please select a transcription service to get started.',
 			action: {
-				type: 'link',
-				label: 'Configure',
 				href: '/settings/transcription',
+				label: 'Configure',
+				type: 'link',
 			},
 			persist: true,
 		});
@@ -30,8 +30,8 @@ export function registerOnboarding() {
 		const missingConfig = (
 			{
 				cloud: `${selectedService.name} API key`,
-				'self-hosted': `${selectedService.name} server URL`,
 				local: `${selectedService.name} model file`,
+				'self-hosted': `${selectedService.name} server URL`,
 			} as const
 		)[selectedService.location];
 
@@ -39,9 +39,9 @@ export function registerOnboarding() {
 			title: 'Welcome to Whispering!',
 			description: `Please configure your ${missingConfig} to get started.`,
 			action: {
-				type: 'link',
-				label: 'Configure',
 				href: '/settings/transcription',
+				label: 'Configure',
+				type: 'link',
 			},
 			persist: true,
 		});
diff --git a/apps/whispering/src/routes/+layout/register-permissions.ts b/apps/whispering/src/routes/+layout/register-permissions.ts
index 524931caa5..4bd509f6bd 100644
--- a/apps/whispering/src/routes/+layout/register-permissions.ts
+++ b/apps/whispering/src/routes/+layout/register-permissions.ts
@@ -1,8 +1,8 @@
+import { goto } from '$app/navigation';
 import { IS_MACOS } from '$lib/constants/platform';
 import * as services from '$lib/services';
 import { nanoid } from 'nanoid/non-secure';
 import { toast } from 'svelte-sonner';
-import { goto } from '$app/navigation';
 
 export function registerAccessibilityPermission() {
 	// Only run on macOS desktop
@@ -23,10 +23,8 @@ export function registerAccessibilityPermission() {
 		if (!isAccessibilityGranted) {
 			// Toast if permission not granted
 			toast.warning('Accessibility Permission Issue', {
-				id: accessibilityToastId,
 				description:
 					'Whispering needs accessibility permissions. This often requires removing and re-adding the app after updates.',
-				duration: Number.POSITIVE_INFINITY,
 				action: {
 					label: 'View Guide',
 					onClick: () => {
@@ -35,6 +33,8 @@ export function registerAccessibilityPermission() {
 						toast.dismiss(accessibilityToastId);
 					},
 				},
+				duration: Number.POSITIVE_INFINITY,
+				id: accessibilityToastId,
 			});
 		}
 	})();
@@ -64,9 +64,7 @@ export function registerMicrophonePermission() {
 		if (!isMicrophoneGranted) {
 			// Toast if permission not granted
 			toast.info('Microphone Permission Required', {
-				id: microphoneToastId,
 				description: 'Whispering needs microphone access to record audio',
-				duration: Number.POSITIVE_INFINITY,
 				action: {
 					label: 'Enable Permission',
 					onClick: async () => {
@@ -83,6 +81,8 @@ export function registerMicrophonePermission() {
 						toast.dismiss(microphoneToastId);
 					},
 				},
+				duration: Number.POSITIVE_INFINITY,
+				id: microphoneToastId,
 			});
 		}
 	})();
diff --git a/apps/whispering/src/routes/+page.svelte b/apps/whispering/src/routes/+page.svelte
index be3d4dcd4c..178790d6c7 100644
--- a/apps/whispering/src/routes/+page.svelte
+++ b/apps/whispering/src/routes/+page.svelte
@@ -1,25 +1,30 @@
 <script lang="ts">
+	import type { Recording } from '$lib/services/db';
+	import type { UnlistenFn } from '@tauri-apps/api/event';
+
 	import { commandCallbacks } from '$lib/commands';
-	import NavItems from '$lib/components/NavItems.svelte';
-	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import CopyToClipboardButton from '$lib/components/copyable/CopyToClipboardButton.svelte';
 	import { ClipboardIcon } from '$lib/components/icons';
+	import NavItems from '$lib/components/NavItems.svelte';
 	import {
 		DeviceSelector,
 		TranscriptionSelector,
 		TransformationSelector,
 	} from '$lib/components/settings';
+	import WhisperingButton from '$lib/components/WhisperingButton.svelte';
 	import {
+		recorderStateToIcons,
 		RECORDING_MODE_OPTIONS,
 		type RecordingMode,
-		recorderStateToIcons,
 		vadStateToIcons,
 	} from '$lib/constants/audio';
+	import { SUPPORTED_LANGUAGES_OPTIONS } from '$lib/constants/languages';
 	import { rpc } from '$lib/query';
-	import type { Recording } from '$lib/services/db';
 	import { settings } from '$lib/stores/settings.svelte';
 	import { createBlobUrlManager } from '$lib/utils/blobUrlManager';
 	import { getRecordingTransitionId } from '$lib/utils/getRecordingTransitionId';
+	import { Loader2Icon } from '@lucide/svelte';
+	import { Badge } from '@repo/ui/badge';
 	import {
 		ACCEPT_AUDIO,
 		ACCEPT_VIDEO,
@@ -28,9 +33,8 @@
 	} from '@repo/ui/file-drop-zone';
 	import * as ToggleGroup from '@repo/ui/toggle-group';
 	import { createQuery } from '@tanstack/svelte-query';
-	import type { UnlistenFn } from '@tauri-apps/api/event';
-	import { Loader2Icon } from '@lucide/svelte';
 	import { onDestroy, onMount } from 'svelte';
+
 	import TranscribedTextDialog from './(config)/recordings/TranscribedTextDialog.svelte';
 
 	const getRecorderStateQuery = createQuery(
@@ -41,17 +45,23 @@
 		rpc.recordings.getLatestRecording.options,
 	);
 
+	// Helper function to get language label from code
+	function getLanguageLabel(langCode: string): string {
+		const option = SUPPORTED_LANGUAGES_OPTIONS.find(opt => opt.value === langCode);
+		return option?.label || langCode;
+	}
+
 	const latestRecording = $derived<Recording>(
 		latestRecordingQuery.data ?? {
-			id: '',
 			title: '',
-			subtitle: '',
+			blob: new Blob(),
 			createdAt: '',
-			updatedAt: '',
+			id: '',
+			subtitle: '',
 			timestamp: '',
-			blob: new Blob(),
 			transcribedText: '',
 			transcriptionStatus: 'UNPROCESSED',
+			updatedAt: '',
 		},
 	);
 
@@ -93,28 +103,28 @@
 	] as const;
 
 	const MIME_TYPE_MAP = {
-		// Audio
-		mp3: 'audio/mpeg',
-		wav: 'audio/wav',
-		m4a: 'audio/mp4',
 		aac: 'audio/aac',
-		ogg: 'audio/ogg',
-		flac: 'audio/flac',
-		wma: 'audio/x-ms-wma',
-		opus: 'audio/opus',
-		// Video
-		mp4: 'video/mp4',
 		avi: 'video/x-msvideo',
-		mov: 'video/quicktime',
-		wmv: 'video/x-ms-wmv',
+		flac: 'audio/flac',
 		flv: 'video/x-flv',
+		m4a: 'audio/mp4',
+		m4v: 'video/mp4',
 		mkv: 'video/x-matroska',
+		mov: 'video/quicktime',
+		// Audio
+		mp3: 'audio/mpeg',
+		// Video
+		mp4: 'video/mp4',
+		ogg: 'audio/ogg',
+		opus: 'audio/opus',
+		wav: 'audio/wav',
 		webm: 'video/webm',
-		m4v: 'video/mp4',
+		wma: 'audio/x-ms-wma',
+		wmv: 'video/x-ms-wmv',
 	} as const;
 
 	// Store unlisten function for drag drop events
-	let unlistenDragDrop: UnlistenFn | undefined;
+	let unlistenDragDrop: undefined | UnlistenFn;
 
 	// Set up desktop drag and drop listener
 	onMount(async () => {
@@ -150,8 +160,8 @@
 					// Filter for audio/video files based on extension
 					const pathResults = await Promise.all(
 						event.payload.paths.map(async (path) => ({
-							path,
 							isValid: (await isAudio(path)) || (await isVideo(path)),
+							path,
 						})),
 					);
 					const validPaths = pathResults
@@ -275,6 +285,11 @@
 							🚫
 						</WhisperingButton>
 					{:else}
+						{#if (settings.value['transcription.favoriteLanguages'] ?? ['en', 'ja', 'zh']).length > 1}
+							<Badge variant="secondary" class="text-xs">
+								{getLanguageLabel(settings.value['transcription.outputLanguage'])}
+							</Badge>
+						{/if}
 						<DeviceSelector mode="manual" />
 						<TranscriptionSelector />
 						<TransformationSelector />
@@ -300,6 +315,11 @@
 				<!-- Right column: Selectors -->
 				<div class="flex justify-end items-center gap-1.5 mb-2">
 					{#if getVadStateQuery.data === 'IDLE'}
+						{#if (settings.value['transcription.favoriteLanguages'] ?? ['en', 'ja', 'zh']).length > 1}
+							<Badge variant="secondary" class="text-xs">
+								{getLanguageLabel(settings.value['transcription.outputLanguage'])}
+							</Badge>
+						{/if}
 						<DeviceSelector mode="vad" />
 						<TranscriptionSelector />
 						<TransformationSelector />
@@ -326,6 +346,11 @@
 						class="h-32 sm:h-36 lg:h-40 xl:h-44 w-full"
 					/>
 					<div class="flex items-center gap-1.5">
+						{#if (settings.value['transcription.favoriteLanguages'] ?? ['en', 'ja', 'zh']).length > 1}
+							<Badge variant="secondary" class="text-xs">
+								{getLanguageLabel(settings.value['transcription.outputLanguage'])}
+							</Badge>
+						{/if}
 						<TranscriptionSelector />
 						<TransformationSelector />
 					</div>
@@ -349,8 +374,8 @@
 					contentDescription="transcribed text"
 					textToCopy={latestRecording.transcribedText}
 					viewTransitionName={getRecordingTransitionId({
-						recordingId: latestRecording.id,
 						propertyName: 'transcribedText',
+						recordingId: latestRecording.id,
 					})}
 					size="default"
 					variant="secondary"
@@ -367,8 +392,8 @@
 			{#if blobUrl}
 				<audio
 					style="view-transition-name: {getRecordingTransitionId({
-						recordingId: latestRecording.id,
 						propertyName: 'blob',
+						recordingId: latestRecording.id,
 					})}"
 					src={blobUrl}
 					controls
diff --git a/apps/whispering/src/routes/test-persist-toast/+page.svelte b/apps/whispering/src/routes/test-persist-toast/+page.svelte
index 9c999041dd..234169a15e 100644
--- a/apps/whispering/src/routes/test-persist-toast/+page.svelte
+++ b/apps/whispering/src/routes/test-persist-toast/+page.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
-	import { Button } from '@repo/ui/button';
 	import { notify } from '$lib/query/notify';
+	import { Button } from '@repo/ui/button';
 
 	let persistentToastId: string | undefined;
 
@@ -8,9 +8,7 @@
 		persistentToastId = notify.error.mutate({
 			title: 'Persistent Error',
 			description: 'This toast will stay visible until you dismiss it',
-			persist: true,
 			action: {
-				type: 'button',
 				label: 'Dismiss',
 				onClick: () => {
 					if (persistentToastId) {
@@ -18,7 +16,9 @@
 						persistentToastId = undefined;
 					}
 				},
+				type: 'button',
 			},
+			persist: true,
 		});
 	}
 
diff --git a/apps/whispering/vite.config.ts b/apps/whispering/vite.config.ts
index 923bfcb03f..cb69780f9e 100644
--- a/apps/whispering/vite.config.ts
+++ b/apps/whispering/vite.config.ts
@@ -6,24 +6,24 @@ const host = process.env.TAURI_DEV_HOST;
 
 // https://vitejs.dev/config/
 export default defineConfig(async () => ({
-	plugins: [sveltekit(), tailwindcss()],
-
 	// Vite options tailored for Tauri development and only applied in `tauri dev` or `tauri build`
 	//
 	// 1. prevent vite from obscuring rust errors
 	clearScreen: false,
+
+	plugins: [sveltekit(), tailwindcss()],
 	// 2. tauri expects a fixed port, fail if that port is not available
 	server: {
-		port: 1420,
-		strictPort: true,
-		host: host || false,
 		hmr: host
 			? {
-					protocol: 'ws',
 					host,
 					port: 1421,
+					protocol: 'ws',
 				}
 			: undefined,
+		host: host || false,
+		port: 1420,
+		strictPort: true,
 		watch: {
 			// 3. tell vite to ignore watching `src-tauri`
 			ignored: ['**/src-tauri/**'],