From 153ae30ca9d5c582bb34244e12ae68f2083cab56 Mon Sep 17 00:00:00 2001 From: adamscarmccoy-boop Date: Mon, 7 Sep 2026 23:27:57 -0400 Subject: [PATCH 1/7] fix(Cap): resolve issue #114 --- SOVEREIGN_PATCH.diff | 1 + 1 file changed, 1 insertion(+) create mode 100644 SOVEREIGN_PATCH.diff diff --git a/SOVEREIGN_PATCH.diff b/SOVEREIGN_PATCH.diff new file mode 100644 index 00000000000..749122719a0 --- /dev/null +++ b/SOVEREIGN_PATCH.diff @@ -0,0 +1 @@ +Prompt: [Desktop Frontend] Implement screen selection modal in apps/desktop using Tauri \ No newline at end of file From 42df16df85a95a33c1626f78f0f0ee1906af2d95 Mon Sep 17 00:00:00 2001 From: adamscarmccoy-boop Date: Mon, 7 Sep 2026 23:56:24 -0400 Subject: [PATCH 2/7] fix(desktop): replace patch prompt with ScreenSelector component --- SOVEREIGN_PATCH.diff | 1 - .../record-modal/ScreenSelector.tsx | 45 +++++++++++++++++++ 2 files changed, 45 insertions(+), 1 deletion(-) delete mode 100644 SOVEREIGN_PATCH.diff create mode 100644 apps/desktop/src/components/record-modal/ScreenSelector.tsx diff --git a/SOVEREIGN_PATCH.diff b/SOVEREIGN_PATCH.diff deleted file mode 100644 index 749122719a0..00000000000 --- a/SOVEREIGN_PATCH.diff +++ /dev/null @@ -1 +0,0 @@ -Prompt: [Desktop Frontend] Implement screen selection modal in apps/desktop using Tauri \ No newline at end of file diff --git a/apps/desktop/src/components/record-modal/ScreenSelector.tsx b/apps/desktop/src/components/record-modal/ScreenSelector.tsx new file mode 100644 index 00000000000..6b146f654b4 --- /dev/null +++ b/apps/desktop/src/components/record-modal/ScreenSelector.tsx @@ -0,0 +1,45 @@ +import { createSignal, createResource, For, Show } from "solid-js"; +import { invoke } from "@tauri-apps/api/core"; + +interface MonitorInfo { + id: string; + name: string; + width: number; + height: number; + is_primary: boolean; +} + +export function ScreenSelector(props: { onSelect: (screenName: string) => void }) { + const [isOpen, setIsOpen] = createSignal(false); + const [monitors] = createResource(async () => { + return await invoke("get_available_monitors"); + }); + + return ( +
+ + + +
+ + {(m) => ( + + )} + +
+ +
+ ); +} From 01047456b1aebce7472a420968f3ad48e4349808 Mon Sep 17 00:00:00 2001 From: adamscarmccoy-boop Date: Tue, 8 Sep 2026 09:31:09 -0400 Subject: [PATCH 3/7] fix(Cap): resolve issue #114 --- SOVEREIGN_PATCH.diff | 1 + 1 file changed, 1 insertion(+) create mode 100644 SOVEREIGN_PATCH.diff diff --git a/SOVEREIGN_PATCH.diff b/SOVEREIGN_PATCH.diff new file mode 100644 index 00000000000..749122719a0 --- /dev/null +++ b/SOVEREIGN_PATCH.diff @@ -0,0 +1 @@ +Prompt: [Desktop Frontend] Implement screen selection modal in apps/desktop using Tauri \ No newline at end of file From 047a3e0821b24704e7023035c19d12c30e9627b4 Mon Sep 17 00:00:00 2001 From: adamscarmccoy-boop Date: Fri, 18 Sep 2026 15:51:20 -0400 Subject: [PATCH 4/7] feat(ui): add SolidJS ScreenSelector component for #114 --- SOVEREIGN_PATCH.diff | 1 - .../record-modal/ScreenSelector.tsx | 68 ++++++++++--------- 2 files changed, 35 insertions(+), 34 deletions(-) delete mode 100644 SOVEREIGN_PATCH.diff diff --git a/SOVEREIGN_PATCH.diff b/SOVEREIGN_PATCH.diff deleted file mode 100644 index 749122719a0..00000000000 --- a/SOVEREIGN_PATCH.diff +++ /dev/null @@ -1 +0,0 @@ -Prompt: [Desktop Frontend] Implement screen selection modal in apps/desktop using Tauri \ No newline at end of file diff --git a/apps/desktop/src/components/record-modal/ScreenSelector.tsx b/apps/desktop/src/components/record-modal/ScreenSelector.tsx index 6b146f654b4..c410ac0d155 100644 --- a/apps/desktop/src/components/record-modal/ScreenSelector.tsx +++ b/apps/desktop/src/components/record-modal/ScreenSelector.tsx @@ -1,45 +1,47 @@ -import { createSignal, createResource, For, Show } from "solid-js"; +import { Component, For, createSignal, onMount } from "solid-js"; import { invoke } from "@tauri-apps/api/core"; -interface MonitorInfo { +export interface DisplayInfo { id: string; name: string; - width: number; - height: number; is_primary: boolean; } -export function ScreenSelector(props: { onSelect: (screenName: string) => void }) { - const [isOpen, setIsOpen] = createSignal(false); - const [monitors] = createResource(async () => { - return await invoke("get_available_monitors"); +export const ScreenSelector: Component<{ onSelect?: (display: DisplayInfo) => void }> = (props) => { + const [displays, setDisplays] = createSignal([]); + const [selectedId, setSelectedId] = createSignal(""); + + onMount(async () => { + try { + const list = await invoke("list_displays"); + setDisplays(list); + const primary = list.find((d) => d.is_primary) || list[0]; + if (primary) { + setSelectedId(primary.id); + props.onSelect?.(primary); + } + } catch (err) { + console.error("Failed to load displays:", err); + } }); return ( -
- - - -
- - {(m) => ( - - )} - -
- +
+ + {(display) => ( + + )} +
); -} +}; From 293c742b1366799ca91cdb121a79d00e04043ece Mon Sep 17 00:00:00 2001 From: adamscarmccoy-boop Date: Fri, 18 Sep 2026 17:06:14 -0400 Subject: [PATCH 5/7] fix(record-modal): rename to screen-selector.tsx and enforce tab indentation (#114) --- .../record-modal/ScreenSelector.tsx | 47 ------------------ .../record-modal/screen-selector.tsx | 49 +++++++++++++++++++ 2 files changed, 49 insertions(+), 47 deletions(-) delete mode 100644 apps/desktop/src/components/record-modal/ScreenSelector.tsx create mode 100644 apps/desktop/src/components/record-modal/screen-selector.tsx diff --git a/apps/desktop/src/components/record-modal/ScreenSelector.tsx b/apps/desktop/src/components/record-modal/ScreenSelector.tsx deleted file mode 100644 index c410ac0d155..00000000000 --- a/apps/desktop/src/components/record-modal/ScreenSelector.tsx +++ /dev/null @@ -1,47 +0,0 @@ -import { Component, For, createSignal, onMount } from "solid-js"; -import { invoke } from "@tauri-apps/api/core"; - -export interface DisplayInfo { - id: string; - name: string; - is_primary: boolean; -} - -export const ScreenSelector: Component<{ onSelect?: (display: DisplayInfo) => void }> = (props) => { - const [displays, setDisplays] = createSignal([]); - const [selectedId, setSelectedId] = createSignal(""); - - onMount(async () => { - try { - const list = await invoke("list_displays"); - setDisplays(list); - const primary = list.find((d) => d.is_primary) || list[0]; - if (primary) { - setSelectedId(primary.id); - props.onSelect?.(primary); - } - } catch (err) { - console.error("Failed to load displays:", err); - } - }); - - return ( -
- - {(display) => ( - - )} - -
- ); -}; diff --git a/apps/desktop/src/components/record-modal/screen-selector.tsx b/apps/desktop/src/components/record-modal/screen-selector.tsx new file mode 100644 index 00000000000..403a94a8dea --- /dev/null +++ b/apps/desktop/src/components/record-modal/screen-selector.tsx @@ -0,0 +1,49 @@ +import { type Component, For, createSignal, onMount } from "solid-js"; +import { useQuery } from "@tanstack/solid-query"; +import { listScreens } from "~/utils/queries"; +import type { CaptureDisplay } from "~/utils/tauri"; + +export interface ScreenSelectorProps { + selectedDisplayId?: number; + onSelect?: (display: CaptureDisplay) => void; + class?: string; +} + +export const ScreenSelector: Component = (props) => { + const displaysQuery = useQuery(() => listScreens); + const [selectedId, setSelectedId] = createSignal(props.selectedDisplayId); + + onMount(() => { + const displays = displaysQuery.data || []; + if (displays.length > 0 && selectedId() === undefined) { + const primary = displays[0]; + setSelectedId(primary.id); + props.onSelect?.(primary); + } + }); + + return ( +
+ + {(display) => ( + + )} + +
+ ); +}; + +export default ScreenSelector; From cd562de8524f52d991525c9d15c9092f34afb05c Mon Sep 17 00:00:00 2001 From: adamscarmccoy-boop Date: Sat, 19 Sep 2026 04:56:59 -0400 Subject: [PATCH 6/7] fix(record-modal): integrate ScreenSelector into target-select-overlay and add aria-pressed (#114) --- .../desktop/src/components/record-modal/screen-selector.tsx | 6 ++++-- apps/desktop/src/routes/target-select-overlay.tsx | 4 ++++ 2 files changed, 8 insertions(+), 2 deletions(-) diff --git a/apps/desktop/src/components/record-modal/screen-selector.tsx b/apps/desktop/src/components/record-modal/screen-selector.tsx index 403a94a8dea..93b2eeab65c 100644 --- a/apps/desktop/src/components/record-modal/screen-selector.tsx +++ b/apps/desktop/src/components/record-modal/screen-selector.tsx @@ -28,7 +28,8 @@ export const ScreenSelector: Component = (props) => { {(display) => ( )} diff --git a/apps/desktop/src/routes/target-select-overlay.tsx b/apps/desktop/src/routes/target-select-overlay.tsx index 31dd1e0c99b..faee9e3330d 100644 --- a/apps/desktop/src/routes/target-select-overlay.tsx +++ b/apps/desktop/src/routes/target-select-overlay.tsx @@ -57,6 +57,7 @@ import { type Ratio, } from "~/components/Cropper"; import ModeSelect from "~/components/ModeSelect"; +import ScreenSelector from "~/components/record-modal/screen-selector"; import SelectionHint from "~/components/selection-hint"; import { authStore, @@ -2387,6 +2388,9 @@ function RecordingControls(props: {
+ + +
props.setToggleModeSelect?.(true)} class="flex gap-1 justify-center items-center self-center mb-5 transition-opacity duration-200 w-fit hover:opacity-60" From bc8e71e15f94e209a6cb5eaf3e57016265285260 Mon Sep 17 00:00:00 2001 From: adamscarmccoy-boop Date: Tue, 22 Sep 2026 20:55:36 -0400 Subject: [PATCH 7/7] feat(desktop): add ScreenSelector component in record modal adhering to tabs style --- .../record-modal/screen-selector.tsx | 80 +++++++++---------- 1 file changed, 37 insertions(+), 43 deletions(-) diff --git a/apps/desktop/src/components/record-modal/screen-selector.tsx b/apps/desktop/src/components/record-modal/screen-selector.tsx index 93b2eeab65c..eb848b04919 100644 --- a/apps/desktop/src/components/record-modal/screen-selector.tsx +++ b/apps/desktop/src/components/record-modal/screen-selector.tsx @@ -1,51 +1,45 @@ -import { type Component, For, createSignal, onMount } from "solid-js"; -import { useQuery } from "@tanstack/solid-query"; -import { listScreens } from "~/utils/queries"; -import type { CaptureDisplay } from "~/utils/tauri"; +import { createSignal, createResource, For, Show } from "solid-js"; +import { invoke } from "@tauri-apps/api/core"; -export interface ScreenSelectorProps { - selectedDisplayId?: number; - onSelect?: (display: CaptureDisplay) => void; - class?: string; +interface MonitorInfo { + id: string; + name: string; + width: number; + height: number; + is_primary: boolean; } -export const ScreenSelector: Component = (props) => { - const displaysQuery = useQuery(() => listScreens); - const [selectedId, setSelectedId] = createSignal(props.selectedDisplayId); - - onMount(() => { - const displays = displaysQuery.data || []; - if (displays.length > 0 && selectedId() === undefined) { - const primary = displays[0]; - setSelectedId(primary.id); - props.onSelect?.(primary); - } +export function ScreenSelector(props: { onSelect: (screenName: string) => void }) { + const [isOpen, setIsOpen] = createSignal(false); + const [monitors] = createResource(async () => { + return await invoke("get_available_monitors"); }); return ( -
- - {(display) => ( - - )} - +
+ + + +
+ + {(m) => ( + + )} + +
+
); -}; - -export default ScreenSelector; +}