diff --git a/apps/desktop/src-tauri/src/windows.rs b/apps/desktop/src-tauri/src/windows.rs index ba6d5a71f6..604cb3b826 100644 --- a/apps/desktop/src-tauri/src/windows.rs +++ b/apps/desktop/src-tauri/src/windows.rs @@ -265,6 +265,7 @@ impl ShowCapWindow { .visible_on_all_workspaces(true) .content_protected(should_protect) .center() + .transparent(true) .initialization_script(format!( " window.__CAP__ = window.__CAP__ ?? {{}}; @@ -275,9 +276,38 @@ impl ShowCapWindow { )) .build()?; - if new_recording_flow { - #[cfg(target_os = "macos")] - crate::platform::set_window_level(window.as_ref().window(), 50); + #[cfg(target_os = "macos")] + { + window + .run_on_main_thread({ + let win = window.as_ref().window(); + move || unsafe { + let ns_win = + win.ns_window().unwrap() as *const objc2_app_kit::NSWindow; + + // Hide traffic lights if needed + if let Some(button) = (*ns_win).standardWindowButton( + objc2_app_kit::NSWindowButton::CloseButton, + ) { + button.setHidden(true); + } + if let Some(button) = (*ns_win).standardWindowButton( + objc2_app_kit::NSWindowButton::MiniaturizeButton, + ) { + button.setHidden(true); + } + if let Some(button) = (*ns_win) + .standardWindowButton(objc2_app_kit::NSWindowButton::ZoomButton) + { + button.setHidden(true); + } + } + }) + .ok(); + + if new_recording_flow { + crate::platform::set_window_level(window.as_ref().window(), 50); + } } #[cfg(target_os = "macos")] @@ -398,6 +428,7 @@ impl ShowCapWindow { .resizable(true) .maximized(false) .center() + .transparent(true) .build()? } Self::Editor { .. } => { diff --git a/apps/desktop/src/icons.tsx b/apps/desktop/src/icons.tsx index 08cbfb816a..0c5d645219 100644 --- a/apps/desktop/src/icons.tsx +++ b/apps/desktop/src/icons.tsx @@ -88,3 +88,151 @@ export const Flip = (props: { class: string }) => { ); }; + +export const DoubleArrowSwitcher = (props: { class: string }) => { + return ( + + + + ); +}; + +export const ArrowUpRight = (props: { class: string }) => { + return ( + + + + ); +}; + +export const RecordFill = (props: { class: string }) => { + return ( + + + + + ); +}; + +export const InflightLogo = (props: { class: string }) => { + return ( + + + + ); +}; + +export const CloseIcon = (props: { class: string }) => { + return ( + + + + ); +}; + +export const SettingsIcon = (props: { class: string }) => { + return ( + + + + ); +}; + +export const CameraIcon = (props: { class: string }) => { + return ( + + + + ); +}; + +export const MicrophoneIcon = (props: { class: string }) => { + return ( + + + + ); +}; + +export const SystemAudioIcon = (props: { class: string }) => { + return ( + + + + ); +}; + +export const DisplayIcon = (props: { class?: string }) => { + return ( + + + + ); +}; + +export const WindowIcon = (props: { class?: string }) => { + return ( + + + + ); +}; + +export const CropIcon = (props: { class?: string }) => { + return ( + + + + + + + + + + + ); +}; diff --git a/apps/desktop/src/routes/(window-chrome).tsx b/apps/desktop/src/routes/(window-chrome).tsx index 6483767acb..cdbe7f21ab 100644 --- a/apps/desktop/src/routes/(window-chrome).tsx +++ b/apps/desktop/src/routes/(window-chrome).tsx @@ -8,10 +8,7 @@ import { onCleanup, onMount, type ParentProps, Suspense } from "solid-js"; import { AbsoluteInsetLoader } from "~/components/Loader"; import CaptionControlsWindows11 from "~/components/titlebar/controls/CaptionControlsWindows11"; import { initializeTitlebar } from "~/utils/titlebar-state"; -import { - useWindowChromeContext, - WindowChromeContext, -} from "./(window-chrome)/Context"; +import { useWindowChromeContext, WindowChromeContext } from "./(window-chrome)/Context"; export const route = { info: { @@ -34,7 +31,18 @@ export default function (props: RouteSectionProps) { return ( -
+
{/* breaks sometimes */} @@ -79,10 +87,7 @@ function Header() { return (
{ctx.state()?.items} @@ -96,9 +101,5 @@ function Inner(props: ParentProps) { if (location.pathname !== "/") getCurrentWindow().show(); }); - return ( -
- {props.children} -
- ); + return
{props.children}
; } diff --git a/apps/desktop/src/routes/(window-chrome)/new-main/CameraSelect.tsx b/apps/desktop/src/routes/(window-chrome)/new-main/CameraSelect.tsx index ab95e90f45..3c06b8bbf3 100644 --- a/apps/desktop/src/routes/(window-chrome)/new-main/CameraSelect.tsx +++ b/apps/desktop/src/routes/(window-chrome)/new-main/CameraSelect.tsx @@ -7,6 +7,7 @@ import type { CameraInfo } from "~/utils/tauri"; import InfoPill from "./InfoPill"; import TargetSelectInfoPill from "./TargetSelectInfoPill"; import useRequestPermission from "./useRequestPermission"; +import { CameraIcon } from "~/icons"; const NO_CAMERA = "No Camera"; @@ -20,8 +21,8 @@ export default function CameraSelect(props: { ); } @@ -31,9 +32,7 @@ export function CameraSelectBase(props: { options: CameraInfo[]; value: CameraInfo | null; onChange: (camera: CameraInfo | null) => void; - PillComponent: Component< - ComponentProps<"button"> & { variant: "blue" | "red" } - >; + PillComponent: Component & { variant: "blue" | "red" }>; class: string; iconClass: string; }) { @@ -41,13 +40,10 @@ export function CameraSelectBase(props: { const permissions = createQuery(() => getPermissions); const requestPermission = useRequestPermission(); - const permissionGranted = () => - permissions?.data?.camera === "granted" || - permissions?.data?.camera === "notNeeded"; + const permissionGranted = () => permissions?.data?.camera === "granted" || permissions?.data?.camera === "notNeeded"; const onChange = (cameraLabel: CameraInfo | null) => { - if (!cameraLabel && !permissionGranted()) - return requestPermission("camera"); + if (!cameraLabel && !permissionGranted()) return requestPermission("camera"); props.onChange(cameraLabel); @@ -80,7 +76,7 @@ export function CameraSelectBase(props: { text: o.display_name, checked: o === props.value, action: () => onChange(o), - }), + }) ), ]) .then((items) => Menu.new({ items })) @@ -90,11 +86,9 @@ export function CameraSelectBase(props: { }} class={props.class} > - -

- {props.value?.display_name ?? NO_CAMERA} -

- +

{props.value?.display_name ?? NO_CAMERA}

+ {/* + /> */}
); diff --git a/apps/desktop/src/routes/(window-chrome)/new-main/HorizontalTargetButton.tsx b/apps/desktop/src/routes/(window-chrome)/new-main/HorizontalTargetButton.tsx new file mode 100644 index 0000000000..aacf86cd2f --- /dev/null +++ b/apps/desktop/src/routes/(window-chrome)/new-main/HorizontalTargetButton.tsx @@ -0,0 +1,41 @@ +import { cx } from "cva"; +import { type Component, type ComponentProps, splitProps } from "solid-js"; + +type HorizontalTargetButtonProps = { + selected: boolean; + Component: Component>; + name: string; + disabled?: boolean; +} & ComponentProps<"button">; + +function HorizontalTargetButton(props: HorizontalTargetButtonProps) { + const [local, rest] = splitProps(props, ["selected", "Component", "name", "disabled", "class"]); + + return ( + + ); +} + +export default HorizontalTargetButton; diff --git a/apps/desktop/src/routes/(window-chrome)/new-main/InfoPill.tsx b/apps/desktop/src/routes/(window-chrome)/new-main/InfoPill.tsx index f6ab0811c2..8fd3064c02 100644 --- a/apps/desktop/src/routes/(window-chrome)/new-main/InfoPill.tsx +++ b/apps/desktop/src/routes/(window-chrome)/new-main/InfoPill.tsx @@ -1,16 +1,24 @@ import { cx } from "cva"; import type { ComponentProps } from "solid-js"; -export default function InfoPill( - props: ComponentProps<"button"> & { variant: "blue" | "red" }, -) { +export default function InfoPill(props: ComponentProps<"button"> & { variant: "blue" | "red" }) { + return ( +
); diff --git a/apps/desktop/src/routes/(window-chrome)/new-main/SystemAudio.tsx b/apps/desktop/src/routes/(window-chrome)/new-main/SystemAudio.tsx index 786c15781e..b8849d9d40 100644 --- a/apps/desktop/src/routes/(window-chrome)/new-main/SystemAudio.tsx +++ b/apps/desktop/src/routes/(window-chrome)/new-main/SystemAudio.tsx @@ -2,41 +2,35 @@ import { createQuery } from "@tanstack/solid-query"; import type { Component, ComponentProps, JSX } from "solid-js"; import { Dynamic } from "solid-js/web"; -import { - createCurrentRecordingQuery, - isSystemAudioSupported, -} from "~/utils/queries"; +import { createCurrentRecordingQuery, isSystemAudioSupported } from "~/utils/queries"; import { useRecordingOptions } from "../OptionsContext"; -import InfoPill from "./InfoPill"; +import InfoPill, { InfoPillNew } from "./InfoPill"; +import { SystemAudioIcon } from "~/icons"; export default function SystemAudio() { return ( } + class="flex flex-row gap-2 items-center px-2 w-full h-9 rounded-lg transition-colors cursor-default disabled:opacity-70 cursor-pointer hover:bg-white/[0.03] disabled:text-gray-11 text-neutral-300 hover:text-white KSelect" + PillComponent={InfoPillNew} + icon={} /> ); } export function SystemAudioToggleRoot( - props: Omit< - ComponentProps<"button">, - "onClick" | "disabled" | "title" | "type" | "children" - > & { + props: Omit, "onClick" | "disabled" | "title" | "type" | "children"> & { PillComponent: Component<{ - variant: "blue" | "red"; + variant: "on" | "off"; children: JSX.Element; }>; icon: JSX.Element; - }, + } ) { const { rawOptions, setOptions } = useRecordingOptions(); const currentRecording = createCurrentRecordingQuery(); const systemAudioSupported = createQuery(() => isSystemAudioSupported); - const isDisabled = () => - !!currentRecording.data || systemAudioSupported.data === false; + const isDisabled = () => !!currentRecording.data || systemAudioSupported.data === false; const tooltipMessage = () => { if (systemAudioSupported.data === false) { return "System audio capture requires macOS 13.0 or later"; @@ -57,14 +51,9 @@ export function SystemAudioToggleRoot( > {props.icon}

- {rawOptions.captureSystemAudio - ? "Record System Audio" - : "No System Audio"} + {rawOptions.captureSystemAudio ? "Record System Audio" : "No System Audio"}

- + {rawOptions.captureSystemAudio ? "On" : "Off"} diff --git a/apps/desktop/src/routes/(window-chrome)/new-main/TargetTypeButton.tsx b/apps/desktop/src/routes/(window-chrome)/new-main/TargetTypeButton.tsx index 6664e1e402..6e24c60df9 100644 --- a/apps/desktop/src/routes/(window-chrome)/new-main/TargetTypeButton.tsx +++ b/apps/desktop/src/routes/(window-chrome)/new-main/TargetTypeButton.tsx @@ -9,13 +9,7 @@ type TargetTypeButtonProps = { } & ComponentProps<"button">; function TargetTypeButton(props: TargetTypeButtonProps) { - const [local, rest] = splitProps(props, [ - "selected", - "Component", - "name", - "disabled", - "class", - ]); + const [local, rest] = splitProps(props, ["selected", "Component", "name", "disabled", "class"]); return ( ); diff --git a/apps/desktop/src/routes/(window-chrome)/new-main/index.tsx b/apps/desktop/src/routes/(window-chrome)/new-main/index.tsx index bc38363267..f2e313f9f7 100644 --- a/apps/desktop/src/routes/(window-chrome)/new-main/index.tsx +++ b/apps/desktop/src/routes/(window-chrome)/new-main/index.tsx @@ -3,29 +3,13 @@ import { createEventListener } from "@solid-primitives/event-listener"; import { useNavigate } from "@solidjs/router"; import { createMutation, useQuery } from "@tanstack/solid-query"; import { listen } from "@tauri-apps/api/event"; -import { - getAllWebviewWindows, - WebviewWindow, -} from "@tauri-apps/api/webviewWindow"; -import { - getCurrentWindow, - LogicalSize, - primaryMonitor, -} from "@tauri-apps/api/window"; +import { getAllWebviewWindows, WebviewWindow } from "@tauri-apps/api/webviewWindow"; +import { getCurrentWindow, LogicalSize, primaryMonitor } from "@tauri-apps/api/window"; import * as dialog from "@tauri-apps/plugin-dialog"; import { type as ostype } from "@tauri-apps/plugin-os"; import * as updater from "@tauri-apps/plugin-updater"; import { cx } from "cva"; -import { - createEffect, - createMemo, - createSignal, - ErrorBoundary, - onCleanup, - onMount, - Show, - Suspense, -} from "solid-js"; +import { createEffect, createMemo, createSignal, ErrorBoundary, onCleanup, onMount, Show, Suspense } from "solid-js"; import { reconcile } from "solid-js/store"; // Removed solid-motionone in favor of solid-transition-group import { Transition } from "solid-transition-group"; @@ -60,10 +44,7 @@ import IconLucideSearch from "~icons/lucide/search"; import IconMaterialSymbolsScreenshotFrame2Rounded from "~icons/material-symbols/screenshot-frame-2-rounded"; import IconMdiMonitor from "~icons/mdi/monitor"; import { WindowChromeHeader } from "../Context"; -import { - RecordingOptionsProvider, - useRecordingOptions, -} from "../OptionsContext"; +import { RecordingOptionsProvider, useRecordingOptions } from "../OptionsContext"; import CameraSelect from "./CameraSelect"; import ChangelogButton from "./ChangeLogButton"; import MicrophoneSelect from "./MicrophoneSelect"; @@ -71,31 +52,26 @@ import SystemAudio from "./SystemAudio"; import TargetDropdownButton from "./TargetDropdownButton"; import TargetMenuGrid from "./TargetMenuGrid"; import TargetTypeButton from "./TargetTypeButton"; +import HorizontalTargetButton from "./HorizontalTargetButton"; +import { CloseIcon, CropIcon, DisplayIcon, InflightLogo, SettingsIcon, WindowIcon } from "~/icons"; function getWindowSize() { return { - width: 270, - height: 256, + width: 272, + height: 386, }; } const findCamera = (cameras: CameraInfo[], id: DeviceOrModelID) => { return cameras.find((c) => { if (!id) return false; - return "DeviceID" in id - ? id.DeviceID === c.device_id - : id.ModelID === c.model_id; + return "DeviceID" in id ? id.DeviceID === c.device_id : id.ModelID === c.model_id; }); }; -type WindowListItem = Pick< - CaptureWindow, - "id" | "owner_name" | "name" | "bounds" | "refresh_rate" ->; +type WindowListItem = Pick; -const createWindowSignature = ( - list?: readonly WindowListItem[], -): string | undefined => { +const createWindowSignature = (list?: readonly WindowListItem[]): string | undefined => { if (!list) return undefined; return list @@ -117,14 +93,10 @@ const createWindowSignature = ( type DisplayListItem = Pick; -const createDisplaySignature = ( - list?: readonly DisplayListItem[], -): string | undefined => { +const createDisplaySignature = (list?: readonly DisplayListItem[]): string | undefined => { if (!list) return undefined; - return list - .map((item) => [item.id, item.name, item.refresh_rate].join(":")) - .join("|"); + return list.map((item) => [item.id, item.name, item.refresh_rate].join(":")).join("|"); }; type TargetMenuPanelProps = @@ -150,28 +122,19 @@ function TargetMenuPanel(props: TargetMenuPanelProps & SharedTargetMenuProps) { const [search, setSearch] = createSignal(""); const trimmedSearch = createMemo(() => search().trim()); const normalizedQuery = createMemo(() => trimmedSearch().toLowerCase()); - const placeholder = - props.variant === "display" ? "Search displays" : "Search windows"; - const noResultsMessage = - props.variant === "display" - ? "No matching displays" - : "No matching windows"; - - const filteredDisplayTargets = createMemo( - () => { - if (props.variant !== "display") return []; - const query = normalizedQuery(); - const targets = props.targets ?? []; - if (!query) return targets; - - const matchesQuery = (value?: string | null) => - !!value && value.toLowerCase().includes(query); - - return targets.filter( - (target) => matchesQuery(target.name) || matchesQuery(target.id), - ); - }, - ); + const placeholder = props.variant === "display" ? "Search displays" : "Search windows"; + const noResultsMessage = props.variant === "display" ? "No matching displays" : "No matching windows"; + + const filteredDisplayTargets = createMemo(() => { + if (props.variant !== "display") return []; + const query = normalizedQuery(); + const targets = props.targets ?? []; + if (!query) return targets; + + const matchesQuery = (value?: string | null) => !!value && value.toLowerCase().includes(query); + + return targets.filter((target) => matchesQuery(target.name) || matchesQuery(target.id)); + }); const filteredWindowTargets = createMemo(() => { if (props.variant !== "window") return []; @@ -179,14 +142,10 @@ function TargetMenuPanel(props: TargetMenuPanelProps & SharedTargetMenuProps) { const targets = props.targets ?? []; if (!query) return targets; - const matchesQuery = (value?: string | null) => - !!value && value.toLowerCase().includes(query); + const matchesQuery = (value?: string | null) => !!value && value.toLowerCase().includes(query); return targets.filter( - (target) => - matchesQuery(target.name) || - matchesQuery(target.owner_name) || - matchesQuery(target.id), + (target) => matchesQuery(target.name) || matchesQuery(target.owner_name) || matchesQuery(target.id) ); }); @@ -225,10 +184,7 @@ function TargetMenuPanel(props: TargetMenuPanelProps & SharedTargetMenuProps) {
-
+
{props.variant === "display" ? ( - !hasDisplayTargetsData() && - (displayTargets.status === "pending" || - displayTargets.fetchStatus === "fetching"); + !hasDisplayTargetsData() && (displayTargets.status === "pending" || displayTargets.fetchStatus === "fetching"); const windowMenuLoading = () => - !hasWindowTargetsData() && - (windowTargets.status === "pending" || - windowTargets.fetchStatus === "fetching"); + !hasWindowTargetsData() && (windowTargets.status === "pending" || windowTargets.fetchStatus === "fetching"); const displayErrorMessage = () => { if (!displayTargets.error) return undefined; @@ -378,10 +330,7 @@ function Page() { }; const selectDisplayTarget = (target: CaptureDisplayWithThumbnail) => { - setOptions( - "captureTarget", - reconcile({ variant: "display", id: target.id }), - ); + setOptions("captureTarget", reconcile({ variant: "display", id: target.id })); setOptions("targetMode", "display"); commands.openTargetSelectOverlays(rawOptions.captureTarget); setDisplayMenuOpen(false); @@ -389,10 +338,7 @@ function Page() { }; const selectWindowTarget = async (target: CaptureWindowWithThumbnail) => { - setOptions( - "captureTarget", - reconcile({ variant: "window", id: target.id }), - ); + setOptions("captureTarget", reconcile({ variant: "window", id: target.id })); setOptions("targetMode", "window"); commands.openTargetSelectOverlays(rawOptions.captureTarget); setWindowMenuOpen(false); @@ -424,15 +370,13 @@ function Page() { const size = getWindowSize(); currentWindow.setSize(new LogicalSize(size.width, size.height)); - const unlistenFocus = currentWindow.onFocusChanged( - ({ payload: focused }) => { - if (focused) { - const size = getWindowSize(); + const unlistenFocus = currentWindow.onFocusChanged(({ payload: focused }) => { + if (focused) { + const size = getWindowSize(); - currentWindow.setSize(new LogicalSize(size.width, size.height)); - } - }, - ); + currentWindow.setSize(new LogicalSize(size.width, size.height)); + } + }); const unlistenResize = currentWindow.onResized(() => { const size = getWindowSize(); @@ -454,16 +398,10 @@ function Page() { const cameras = useQuery(() => listVideoDevices); const mics = useQuery(() => listAudioDevices); - const windowListSignature = createMemo(() => - createWindowSignature(windows.data), - ); - const displayListSignature = createMemo(() => - createDisplaySignature(screens.data), - ); - const [windowThumbnailsSignature, setWindowThumbnailsSignature] = - createSignal(); - const [displayThumbnailsSignature, setDisplayThumbnailsSignature] = - createSignal(); + const windowListSignature = createMemo(() => createWindowSignature(windows.data)); + const displayListSignature = createMemo(() => createDisplaySignature(screens.data)); + const [windowThumbnailsSignature, setWindowThumbnailsSignature] = createSignal(); + const [displayThumbnailsSignature, setDisplayThumbnailsSignature] = createSignal(); createEffect(() => { if (windowTargets.status !== "success") return; @@ -514,12 +452,10 @@ function Page() { if (rawOptions.captureTarget.variant === "display") { const screenId = rawOptions.captureTarget.id; - screen = - screens.data?.find((s) => s.id === screenId) ?? screens.data?.[0]; + screen = screens.data?.find((s) => s.id === screenId) ?? screens.data?.[0]; } else if (rawOptions.captureTarget.variant === "area") { const screenId = rawOptions.captureTarget.screen; - screen = - screens.data?.find((s) => s.id === screenId) ?? screens.data?.[0]; + screen = screens.data?.find((s) => s.id === screenId) ?? screens.data?.[0]; } return screen; @@ -571,10 +507,7 @@ function Page() { if (!screen) return; if (target.variant === "window" && windows.data?.length === 0) { - setOptions( - "captureTarget", - reconcile({ variant: "display", id: screen.id }), - ); + setOptions("captureTarget", reconcile({ variant: "display", id: screen.id })); } }); @@ -600,26 +533,71 @@ function Page() { const signIn = createSignInMutation(); const BaseControls = () => ( -
- { - if (!c) setCamera.mutate(null); - else if (c.model_id) setCamera.mutate({ ModelID: c.model_id }); - else setCamera.mutate({ DeviceID: c.device_id }); - }} - /> - setMicInput.mutate(v)} - /> - +
+

Select inputs

+
+ { + if (!c) setCamera.mutate(null); + else if (c.model_id) setCamera.mutate({ ModelID: c.model_id }); + else setCamera.mutate({ DeviceID: c.device_id }); + }} + /> + setMicInput.mutate(v)} + /> + +
+
+ ); + + const RecordingControls = () => ( +
+

Select what to record

+
+ { + if (isRecording()) return; + setOptions("targetMode", (v) => (v === "display" ? null : "display")); + if (rawOptions.targetMode) commands.openTargetSelectOverlays(null); + else commands.closeTargetSelectOverlays(); + }} + name="Display" + /> + { + if (isRecording()) return; + setOptions("targetMode", (v) => (v === "window" ? null : "window")); + if (rawOptions.targetMode) commands.openTargetSelectOverlays(null); + else commands.closeTargetSelectOverlays(); + }} + name="Window" + /> + { + if (isRecording()) return; + setOptions("targetMode", (v) => (v === "area" ? null : "area")); + if (rawOptions.targetMode) commands.openTargetSelectOverlays(null); + else commands.closeTargetSelectOverlays(); + }} + name="Area" + /> +
); @@ -633,113 +611,9 @@ function Page() { exitClass="scale-100" exitToClass="scale-95" > -
-
-
- { - if (isRecording()) return; - setOptions("targetMode", (v) => - v === "display" ? null : "display", - ); - if (rawOptions.targetMode) - commands.openTargetSelectOverlays(null); - else commands.closeTargetSelectOverlays(); - }} - name="Display" - class="flex-1 rounded-none focus-visible:ring-0 focus-visible:ring-offset-0" - /> - (displayTriggerRef = el)} - disabled={isRecording()} - expanded={displayMenuOpen()} - onClick={() => { - setDisplayMenuOpen((prev) => { - const next = !prev; - if (next) { - setWindowMenuOpen(false); - setHasOpenedDisplayMenu(true); - } - return next; - }); - }} - aria-haspopup="menu" - aria-label="Choose display" - /> -
-
- { - if (isRecording()) return; - setOptions("targetMode", (v) => - v === "window" ? null : "window", - ); - if (rawOptions.targetMode) - commands.openTargetSelectOverlays(null); - else commands.closeTargetSelectOverlays(); - }} - name="Window" - class="flex-1 rounded-none focus-visible:ring-0 focus-visible:ring-offset-0" - /> - (windowTriggerRef = el)} - disabled={isRecording()} - expanded={windowMenuOpen()} - onClick={() => { - setWindowMenuOpen((prev) => { - const next = !prev; - if (next) { - setDisplayMenuOpen(false); - setHasOpenedWindowMenu(true); - } - return next; - }); - }} - aria-haspopup="menu" - aria-label="Choose window" - /> -
- { - if (isRecording()) return; - setOptions("targetMode", (v) => (v === "area" ? null : "area")); - if (rawOptions.targetMode) - commands.openTargetSelectOverlays(null); - else commands.closeTargetSelectOverlays(); - }} - name="Area" - /> -
+
+
); @@ -766,16 +640,30 @@ function Page() {
+ + +
+ +
+
Settings}> - Previous Recordings}> + {/* Previous Recordings}> - )} + )} */}
- {ostype() === "macos" && ( -
- )} - }> + {/* {ostype() === "macos" &&
} */} + {/* }> { @@ -832,17 +718,13 @@ function Page() { license.data?.type === "pro" ? "bg-[--blue-300] text-gray-1 dark:text-gray-12" : "bg-gray-4 cursor-pointer hover:bg-gray-5", - ostype() === "windows" && "ml-2", + ostype() === "windows" && "ml-2" )} > - {license.data?.type === "commercial" - ? "Commercial" - : license.data?.type === "pro" - ? "Pro" - : "Personal"} + {license.data?.type === "commercial" ? "Commercial" : license.data?.type === "pro" ? "Pro" : "Personal"} - + */}