feat(desktop): implement previous selection audio and camera

apps/desktop/src-tauri/capabilities/default.json

@@ -17,6 +17,7 @@
     "core:window:allow-set-focus",
     "core:window:allow-start-dragging",
     "core:window:allow-set-position",
+    "core:webview:default",
     "core:webview:allow-create-webview-window",
     "core:app:allow-version",
     "shell:default",

apps/desktop/src-tauri/src/lib.rs

@@ -2232,6 +2232,12 @@ async fn reset_microphone_permissions(app: AppHandle) -> Result<(), ()> {
     Ok(())
 }
 
+#[tauri::command]
+#[specta::specta]
+async fn is_camera_window_open(app: AppHandle) -> bool {
+    CapWindow::Camera { ws_port: 0 }.get(&app).is_some()
+}
+
 #[cfg_attr(mobile, tauri::mobile_entry_point)]
 pub async fn run() {
     let specta_builder = tauri_specta::Builder::new()
@@ -2286,7 +2292,8 @@ pub async fn run() {
             set_general_settings,
             delete_auth_open_signin,
             reset_camera_permissions,
-            reset_microphone_permissions
+            reset_microphone_permissions,
+            is_camera_window_open
         ])
         .events(tauri_specta::collect_events![
             RecordingOptionsChanged,

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

@@ -4,7 +4,6 @@ import { createEventListener } from "@solid-primitives/event-listener";
 import { cache, createAsync, redirect, useNavigate } from "@solidjs/router";
 import { createMutation, createQuery } from "@tanstack/solid-query";
 import { getVersion } from "@tauri-apps/api/app";
-import { Window } from "@tauri-apps/api/window";
 import { cx } from "cva";
 import {
   Show,
@@ -47,7 +46,7 @@ export const route = {
 };
 
 export default function () {
-  const options = createOptionsQuery();
+  const { options, setOptions } = createOptionsQuery();
   const windows = createQuery(() => listWindows);
   const videoDevices = createVideoDevicesQuery();
   const audioDevices = createQuery(() => listAudioDevices);
@@ -87,7 +86,6 @@ export default function () {
     }
   });
 
-  // important for sign in redirect, trust me
   createAsync(() => getAuth());
 
   createUpdateCheck();
@@ -179,12 +177,25 @@ export default function () {
 
     if (!item || !options.data) return;
 
-    commands.setRecordingOptions({
+    setOptions({
       ...options.data,
       audioInputName: item.name !== "No Audio" ? item.name : null,
     });
   };
 
+  onMount(async () => {
+    if (options.data?.cameraLabel && options.data.cameraLabel !== "No Camera") {
+      const cameraWindowActive = await commands.isCameraWindowOpen();
+
+      if (!cameraWindowActive) {
+        console.log("cameraWindow not found");
+        setOptions({
+          ...options.data,
+        });
+      }
+    }
+  });
+
   return (
     <div class="flex justify-center flex-col p-[1rem] gap-[0.75rem] text-[0.875rem] font-[400] bg-gray-50 h-full">
       <div class="absolute top-3 right-3">
@@ -247,7 +258,7 @@ export default function () {
         value={selectedWindow() ?? null}
         onChange={(d: CaptureWindow | null) => {
           if (!d || !options.data) return;
-          commands.setRecordingOptions({
+          setOptions({
             ...options.data,
             captureTarget: { variant: "window", ...d },
           });
@@ -265,7 +276,7 @@ export default function () {
               return;
             }
             if (s === "screen") {
-              commands.setRecordingOptions({
+              setOptions({
                 ...options.data,
                 captureTarget: { variant: "screen" },
               });
@@ -330,12 +341,12 @@ export default function () {
               if (!options.data) return;
 
               if (!item || !item.isCamera) {
-                await commands.setRecordingOptions({
+                await setOptions({
                   ...options.data,
                   cameraLabel: null,
                 });
               } else {
-                await commands.setRecordingOptions({
+                await setOptions({
                   ...options.data,
                   cameraLabel: item.name,
                 });
@@ -401,7 +412,7 @@ export default function () {
                         return requestPermission("camera");
                       }
                       if (!options.data?.cameraLabel) return;
-                      commands.setRecordingOptions({
+                      setOptions({
                         ...options.data,
                         cameraLabel: null,
                       });
@@ -492,14 +503,14 @@ export default function () {
                 if (permissions?.data?.microphone !== "granted") {
                   await requestPermission("microphone");
                   if (permissions?.data?.microphone === "granted") {
-                    commands.setRecordingOptions({
+                    setOptions({
                       ...options.data!,
                       audioInputName: audioDevice().name,
                     });
                   }
                 } else {
                   if (!options.data?.audioInputName) return;
-                  commands.setRecordingOptions({
+                  setOptions({
                     ...options.data,
                     audioInputName: null,
                   });

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

@@ -59,12 +59,13 @@ export default function () {
             <div>
               <Switch fallback={<IconCapLogo class="animate-spin size-4" />}>
                 <Match when={updateStatus()?.type === "done"}>
-                  Update has been installed. Restart Cap to finish updating.
-                  <div class="flex flex-row gap-4">
-                    <Button variant="secondary" onClick={() => navigate("/")}>
-                      Restart Later
-                    </Button>
-                    <Button onClick={() => relaunch()}>Restart Now</Button>
+                  <div class="flex flex-col gap-4">
+                    <p>
+                      Update has been installed. Restart Cap to finish updating.
+                    </p>
+                    <div class="flex flex-row">
+                      <Button onClick={() => relaunch()}>Restart Now</Button>
+                    </div>
                   </div>
                 </Match>
                 <Match

apps/desktop/src/routes/camera.tsx

@@ -19,7 +19,6 @@ import { ToggleButton as KToggleButton } from "@kobalte/core/toggle-button";
 import { cx } from "cva";
 
 import { createOptionsQuery } from "~/utils/queries";
-import { commands } from "~/utils/tauri";
 import { createImageDataWS, createLazySignal } from "~/utils/socket";
 
 namespace CameraWindow {
@@ -37,7 +36,7 @@ const BAR_HEIGHT = 56;
 const { cameraWsPort } = (window as any).__CAP__;
 
 export default function () {
-  const options = createOptionsQuery();
+  const { options, setOptions } = createOptionsQuery();
 
   const [state, setState] = makePersisted(
     createStore<CameraWindow.State>({
@@ -133,7 +132,7 @@ export default function () {
                 <div class="flex flex-row gap-[0.25rem] p-[0.25rem] opacity-0 group-hover:opacity-100 translate-y-2 group-hover:translate-y-0 rounded-xl transition-[opacity,transform] bg-gray-500 border border-white-transparent-20 text-gray-400">
                   <ControlButton
                     onClick={() => {
-                      commands.setRecordingOptions({
+                      setOptions({
                         ...options(),
                         cameraLabel: null,
                       });

apps/desktop/src/utils/queries.ts

@@ -1,10 +1,10 @@
 import { createQuery, queryOptions } from "@tanstack/solid-query";
-import { createTimer } from "@solid-primitives/timer";
 
-import { commands } from "./tauri";
+import { commands, RecordingOptions } from "./tauri";
 import { createQueryInvalidate } from "./events";
 import { createStore, reconcile } from "solid-js/store";
-import { createMemo } from "solid-js";
+import { createEffect, createMemo } from "solid-js";
+import { makePersisted } from "@solid-primitives/storage";
 
 export const listWindows = queryOptions({
   queryKey: ["capture", "windows"] as const,
@@ -64,15 +64,48 @@ export const getPermissions = queryOptions({
   refetchInterval: 1000,
 });
 
+type PartialRecordingOptions = Omit<RecordingOptions, "captureTarget">;
 export function createOptionsQuery() {
-  const options = createQuery(() => getOptions);
+  const KEY = "recordingOptionsQuery";
+  const localState = localStorage.getItem(KEY);
+  const [state, setState, _init] = makePersisted(
+    createStore<PartialRecordingOptions>(
+      localState
+        ? JSON.parse(localState)
+        : {
+            cameraLabel: null,
+            audioInputName: null,
+          }
+    )
+  );
+
+  const setOptions = (newOptions: RecordingOptions) => {
+    commands.setRecordingOptions(newOptions);
+    const { captureTarget: _, ...partialOptions } = newOptions;
+    setState(partialOptions);
+  };
+
+  createEffect(() => {
+    localStorage.setItem(KEY, JSON.stringify(state));
+  });
+
+  const options = createQuery(() => ({
+    ...getOptions,
+    select: (data) => {
+      if (data && state) {
+        return { ...data, ...state };
+      }
+    },
+  }));
+
   createQueryInvalidate(options, "recordingOptionsChanged");
 
-  return options;
+  return { options, setOptions };
 }
 
 export function createCurrentRecordingQuery() {
   const currentRecording = createQuery(() => getCurrentRecording);
+
   createQueryInvalidate(currentRecording, "currentRecordingChanged");
 
   return currentRecording;

apps/desktop/src/utils/tauri.ts

@@ -307,6 +307,9 @@ async resetMicrophonePermissions() : Promise<Result<null, null>> {
     if(e instanceof Error) throw e;
     else return { status: "error", error: e  as any };
 }
+},
+async isCameraWindowOpen() : Promise<boolean> {
+    return await TAURI_INVOKE("is_camera_window_open");
 }
 }