fix(recording): detect microphone starvation during voip calls

apps/desktop/src/routes/(window-chrome)/new-main/ChangeLogButton.tsx

@@ -1,16 +1,25 @@
 import { makePersisted } from "@solid-primitives/storage";
 import { getVersion } from "@tauri-apps/api/app";
 import { createEffect, createResource } from "solid-js";
-import { createStore } from "solid-js/store";
+import { createStore, type SetStoreFunction } from "solid-js/store";
 import Tooltip from "~/components/Tooltip";
 import { hideCurrentWindow } from "~/utils/hide-window";
 import { commands } from "~/utils/tauri";
 import { apiClient } from "~/utils/web-api";
 import IconLucideBell from "~icons/lucide/bell";
 
+type ChangelogState = {
+	hasUpdate: boolean;
+	lastOpenedVersion: string;
+	changelogClicked: boolean;
+};
+
 const ChangelogButton = () => {
-	const [changelogState, setChangelogState] = makePersisted(
-		createStore({
+	const [changelogState, setChangelogState] = makePersisted<
+		ChangelogState,
+		[ChangelogState, SetStoreFunction<ChangelogState>]
+	>(
+		createStore<ChangelogState>({
 			hasUpdate: false,
 			lastOpenedVersion: "",
 			changelogClicked: false,

apps/desktop/src/routes/(window-chrome)/onboarding.tsx

@@ -15,7 +15,7 @@ import {
 	onMount,
 	Show,
 } from "solid-js";
-import { createStore } from "solid-js/store";
+import { createStore, type SetStoreFunction } from "solid-js/store";
 import { generalSettingsStore } from "~/store";
 import {
 	isPermissionGranted as isPermitted,
@@ -1700,10 +1700,12 @@ function StartupOverlay(props: {
 	isExiting: boolean;
 	onGetStarted: () => void;
 }) {
-	const [audioState, setAudioState] = makePersisted(
-		createStore({ isMuted: false }),
-		{ name: "audioSettings" },
-	);
+	const [audioState, setAudioState] = makePersisted<
+		{ isMuted: boolean },
+		[{ isMuted: boolean }, SetStoreFunction<{ isMuted: boolean }>]
+	>(createStore<{ isMuted: boolean }>({ isMuted: false }), {
+		name: "audioSettings",
+	});
 
 	let audioEl: HTMLAudioElement | undefined;
 	let cloud1Animation: Animation | undefined;

apps/desktop/src/routes/camera.tsx

@@ -20,7 +20,7 @@ import {
 	Show,
 	Suspense,
 } from "solid-js";
-import { createStore } from "solid-js/store";
+import { createStore, type SetStoreFunction } from "solid-js/store";
 import {
 	CAMERA_DEFAULT_SIZE,
 	CAMERA_MAX_SIZE,
@@ -237,10 +237,12 @@ function NativeCameraPreviewPage(props: {
 }) {
 	const isCameraOnlyMode = () => getCameraOnlyMode();
 
-	const [state, setState] = makePersisted(
-		createStore<CameraWindowState>(getDefaultCameraWindowState()),
-		{ name: CAMERA_WINDOW_STATE_STORAGE_KEY },
-	);
+	const [state, setState] = makePersisted<
+		CameraWindowState,
+		[CameraWindowState, SetStoreFunction<CameraWindowState>]
+	>(createStore<CameraWindowState>(getDefaultCameraWindowState()), {
+		name: CAMERA_WINDOW_STATE_STORAGE_KEY,
+	});
 
 	const centerCameraOnlyWindow = () => {
 		ignoreMoveFor(1500);
@@ -369,10 +371,12 @@ function LegacyCameraPreviewPage(props: {
 	const currentRecording = createCurrentRecordingQuery();
 	const isInstantRecording = () => currentRecording.data?.mode === "instant";
 
-	const [state, setState] = makePersisted(
-		createStore<CameraWindowState>(getDefaultCameraWindowState()),
-		{ name: CAMERA_WINDOW_STATE_STORAGE_KEY },
-	);
+	const [state, setState] = makePersisted<
+		CameraWindowState,
+		[CameraWindowState, SetStoreFunction<CameraWindowState>]
+	>(createStore<CameraWindowState>(getDefaultCameraWindowState()), {
+		name: CAMERA_WINDOW_STATE_STORAGE_KEY,
+	});
 
 	const centerCameraOnlyWindow = () => {
 		ignoreMoveFor(1500);

apps/desktop/src/routes/capture-area.tsx

@@ -9,7 +9,7 @@ import {
 } from "@tauri-apps/api/webviewWindow";
 import { type as ostype } from "@tauri-apps/plugin-os";
 import { createMemo, createSignal, onCleanup, onMount, Show } from "solid-js";
-import { createStore, reconcile } from "solid-js/store";
+import { createStore, reconcile, type SetStoreFunction } from "solid-js/store";
 import { Transition } from "solid-transition-group";
 import {
 	CROP_ZERO,
@@ -42,11 +42,19 @@ export default function CaptureArea() {
 		onCleanup(() => unlisten());
 	});
 
-	const [state, setState] = makePersisted(
-		createStore<{
-			snapToRatio: boolean;
-			lastSelectedBounds: { screenId: DisplayId; bounds: CropBounds }[];
-		}>({ snapToRatio: true, lastSelectedBounds: [] }),
+	type CaptureAreaState = {
+		snapToRatio: boolean;
+		lastSelectedBounds: { screenId: DisplayId; bounds: CropBounds }[];
+	};
+
+	const [state, setState] = makePersisted<
+		CaptureAreaState,
+		[CaptureAreaState, SetStoreFunction<CaptureAreaState>]
+	>(
+		createStore<CaptureAreaState>({
+			snapToRatio: true,
+			lastSelectedBounds: [],
+		}),
 		{
 			name: "capture-area",
 		},

apps/desktop/src/routes/editor/Editor.tsx

@@ -26,6 +26,7 @@ import {
 	onCleanup,
 	onMount,
 	Show,
+	type Signal,
 	Suspense,
 	Switch,
 } from "solid-js";
@@ -577,10 +578,12 @@ function Inner(props: {
 
 	const [layoutRef, setLayoutRef] = createSignal<HTMLDivElement>();
 	const layoutBounds = createElementBounds(layoutRef);
-	const [userTimelineHeight, setUserTimelineHeight] = makePersisted(
-		createSignal<number | null>(null),
-		{ name: "editorTimelineHeightOverride" },
-	);
+	const [userTimelineHeight, setUserTimelineHeight] = makePersisted<
+		number | null,
+		Signal<number | null>
+	>(createSignal<number | null>(null), {
+		name: "editorTimelineHeightOverride",
+	});
 	const [isResizingTimeline, setIsResizingTimeline] = createSignal(false);
 	const [timelineContentHeight, setTimelineContentHeight] = createSignal(
 		DEFAULT_TIMELINE_CONTENT_HEIGHT,
@@ -848,7 +851,7 @@ function Inner(props: {
 	const MAX_SPLIT_RATIO = 0.75;
 	const DEFAULT_SPLIT_RATIO = 0.5;
 
-	const [splitRatio, setSplitRatio] = makePersisted(
+	const [splitRatio, setSplitRatio] = makePersisted<number, Signal<number>>(
 		createSignal(DEFAULT_SPLIT_RATIO),
 		{ name: "editorTranscriptSplitRatio" },
 	);
@@ -1433,10 +1436,10 @@ function Dialogs() {
 									height: dialog().size.y,
 								};
 
-								const [snapToRatio, setSnapToRatioEnabled] = makePersisted(
-									createSignal(true),
-									{ name: "editorCropSnapToRatio" },
-								);
+								const [snapToRatio, setSnapToRatioEnabled] = makePersisted<
+									boolean,
+									Signal<boolean>
+								>(createSignal(true), { name: "editorCropSnapToRatio" });
 
 								async function showCropOptionsMenu(
 									e: UIEvent,

apps/desktop/src/routes/editor/ExportPage.tsx

@@ -24,7 +24,12 @@ import {
 	Switch,
 	type ValidComponent,
 } from "solid-js";
-import { createStore, produce, reconcile } from "solid-js/store";
+import {
+	createStore,
+	produce,
+	reconcile,
+	type SetStoreFunction,
+} from "solid-js/store";
 import { Dynamic } from "solid-js/web";
 import toast from "solid-toast";
 import { Toggle } from "~/components/Toggle";
@@ -210,7 +215,10 @@ export function ExportPage() {
 			(error.message === "Export cancelled" ||
 				error.message === "Save dialog cancelled"));
 
-	const [_settings, setSettings] = makePersisted(
+	const [_settings, setSettings] = makePersisted<
+		Settings,
+		[Settings, SetStoreFunction<Settings>]
+	>(
 		createStore<Settings>({
 			format: "Mp4",
 			fps: 30,

apps/desktop/src/routes/editor/TranscriptPage.tsx

@@ -10,6 +10,7 @@ import {
 	For,
 	on,
 	Show,
+	type Signal,
 } from "solid-js";
 import { produce } from "solid-js/store";
 import toast from "solid-toast";
@@ -80,7 +81,10 @@ export function TranscriptPanel() {
 
 	const recordingSegments = () => editorInstance.recordings.segments;
 
-	const [textSizeIndex, setTextSizeIndex] = makePersisted(createSignal(1), {
+	const [textSizeIndex, setTextSizeIndex] = makePersisted<
+		number,
+		Signal<number>
+	>(createSignal(1), {
 		name: "editorTranscriptTextSize",
 	});
 	const [exportingFormat, setExportingFormat] =

apps/desktop/src/routes/editor/editor-skeleton.tsx

@@ -1,7 +1,7 @@
 import { createElementBounds } from "@solid-primitives/bounds";
 import { makePersisted } from "@solid-primitives/storage";
 import { type as ostype } from "@tauri-apps/plugin-os";
-import { createSignal, For, Show } from "solid-js";
+import { createSignal, For, Show, type Signal } from "solid-js";
 import CaptionControlsMacOS from "~/components/titlebar/controls/CaptionControlsMacOS";
 import CaptionControlsWindows11 from "~/components/titlebar/controls/CaptionControlsWindows11";
 import { DEFAULT_TIMELINE_HEIGHT, editorVerticalLayout } from "./editor-layout";
@@ -191,9 +191,12 @@ export function EditorSkeleton() {
 	const model = usePreparingEditorModel();
 	const [layoutRef, setLayoutRef] = createSignal<HTMLDivElement>();
 	const bounds = createElementBounds(layoutRef);
-	const [savedHeight] = makePersisted(createSignal<number | null>(null), {
-		name: "editorTimelineHeightOverride",
-	});
+	const [savedHeight] = makePersisted<number | null, Signal<number | null>>(
+		createSignal<number | null>(null),
+		{
+			name: "editorTimelineHeightOverride",
+		},
+	);
 	const layout = () =>
 		editorVerticalLayout(
 			(bounds.height ?? 576) - 16,

apps/desktop/src/routes/recordings-overlay.tsx

@@ -96,14 +96,14 @@ export default function () {
 		document.body.style.background = "transparent";
 	});
 
-	const [recordings, setRecordings] = makePersisted(
-		createStore<MediaEntry[]>([]),
-		{ name: "recordings-store" },
-	);
-	const [screenshots, setScreenshots] = makePersisted(
-		createStore<MediaEntry[]>([]),
-		{ name: "screenshots-store" },
-	);
+	const [recordings, setRecordings] = makePersisted<
+		MediaEntry[],
+		[MediaEntry[], SetStoreFunction<MediaEntry[]>]
+	>(createStore<MediaEntry[]>([]), { name: "recordings-store" });
+	const [screenshots, setScreenshots] = makePersisted<
+		MediaEntry[],
+		[MediaEntry[], SetStoreFunction<MediaEntry[]>]
+	>(createStore<MediaEntry[]>([]), { name: "screenshots-store" });
 
 	const addMediaEntry = (path: string, type?: "recording" | "screenshot") => {
 		const setMedia = type === "screenshot" ? setScreenshots : setRecordings;

apps/desktop/src/routes/screenshot-editor/Editor.tsx

@@ -11,6 +11,7 @@ import {
 	onCleanup,
 	onMount,
 	Show,
+	type Signal,
 	Switch,
 } from "solid-js";
 import { unwrap } from "solid-js/store";
@@ -288,10 +289,10 @@ function Dialogs() {
 									};
 								};
 
-								const [snapToRatio, setSnapToRatioEnabled] = makePersisted(
-									createSignal(true),
-									{ name: "editorCropSnapToRatio" },
-								);
+								const [snapToRatio, setSnapToRatioEnabled] = makePersisted<
+									boolean,
+									Signal<boolean>
+								>(createSignal(true), { name: "editorCropSnapToRatio" });
 
 								async function showCropOptionsMenu(
 									e: UIEvent,

apps/desktop/src/routes/screenshot-editor/context.tsx

@@ -9,6 +9,7 @@ import {
 	createSignal,
 	on,
 	onCleanup,
+	type Signal,
 } from "solid-js";
 import { createStore, reconcile, unwrap } from "solid-js/store";
 import { createLazySignal, type FrameData } from "~/utils/socket";
@@ -188,10 +189,10 @@ function createScreenshotEditorContext() {
 	const [activeTool, setActiveTool] =
 		createSignal<ScreenshotEditorTool>("select");
 
-	const [layersPanelOpen, setLayersPanelOpen] = makePersisted(
-		createSignal(false),
-		{ name: "screenshotEditorLayersPanelOpen" },
-	);
+	const [layersPanelOpen, setLayersPanelOpen] = makePersisted<
+		boolean,
+		Signal<boolean>
+	>(createSignal(false), { name: "screenshotEditorLayersPanelOpen" });
 	const [focusAnnotationId, setFocusAnnotationId] = createSignal<string | null>(
 		null,
 	);

apps/desktop/src/routes/target-select-overlay.tsx

@@ -32,7 +32,7 @@ import {
 	Suspense,
 	Switch,
 } from "solid-js";
-import { createStore, reconcile } from "solid-js/store";
+import { createStore, reconcile, type SetStoreFunction } from "solid-js/store";
 import toast from "solid-toast";
 import {
 	CAMERA_DEFAULT_SIZE,
@@ -201,7 +201,10 @@ function Inner() {
 		overlayInstance: string;
 	}>();
 	const [options, setOptions] = useOptions();
-	const [areaSelectionPreferences, setAreaSelectionPreferences] = makePersisted(
+	const [areaSelectionPreferences, setAreaSelectionPreferences] = makePersisted<
+		AreaSelectionPreferences,
+		[AreaSelectionPreferences, SetStoreFunction<AreaSelectionPreferences>]
+	>(
 		createStore<AreaSelectionPreferences>(
 			createDefaultAreaSelectionPreferences(),
 		),
@@ -1536,10 +1539,12 @@ const WS_STALL_TIMEOUT_MS = 2000;
 
 function CameraPreviewInline() {
 	const { rawOptions } = useRecordingOptions();
-	const [state, setState] = makePersisted(
-		createStore<CameraWindowState>(getDefaultCameraWindowState()),
-		{ name: CAMERA_WINDOW_STATE_STORAGE_KEY },
-	);
+	const [state, setState] = makePersisted<
+		CameraWindowState,
+		[CameraWindowState, SetStoreFunction<CameraWindowState>]
+	>(createStore<CameraWindowState>(getDefaultCameraWindowState()), {
+		name: CAMERA_WINDOW_STATE_STORAGE_KEY,
+	});
 	const [hasFrame, setHasFrame] = createSignal(false);
 	const [frameDimensions, setFrameDimensions] = createSignal<{
 		width: number;