Skip to content

Commit

Permalink
typescript
Browse files Browse the repository at this point in the history
  • Loading branch information
Brendonovich committed Dec 6, 2024
1 parent 25e4e4a commit ab6299f
Show file tree
Hide file tree
Showing 4 changed files with 58 additions and 75 deletions.
9 changes: 6 additions & 3 deletions apps/desktop/src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,10 @@ import "./styles/theme.css";
import { generalSettingsStore } from "./store";
import { commands, type AppTheme } from "./utils/tauri";
import type { UnlistenFn } from "@tauri-apps/api/event";
import { getCurrentWebviewWindow, WebviewWindow } from "@tauri-apps/api/webviewWindow";
import {
getCurrentWebviewWindow,
WebviewWindow,
} from "@tauri-apps/api/webviewWindow";

const queryClient = new QueryClient({
defaultOptions: {
Expand Down Expand Up @@ -80,7 +83,7 @@ function createThemeListener(currentWindow: WebviewWindow) {
generalSettingsStore.get().then((s) => {
const t = s?.theme ?? null;
update(t);
return t
return t;
})
);
generalSettingsStore.listen((s) => {
Expand All @@ -106,7 +109,7 @@ function createThemeListener(currentWindow: WebviewWindow) {
document.documentElement.classList.toggle(
"dark",
appTheme === "dark" ||
window.matchMedia("(prefers-color-scheme: dark)").matches
window.matchMedia("(prefers-color-scheme: dark)").matches
);
});
}
Expand Down
121 changes: 50 additions & 71 deletions apps/desktop/src/routes/(window-chrome)/settings/general.tsx
Original file line number Diff line number Diff line change
@@ -1,8 +1,4 @@
import {
createResource,
Show,
For,
} from "solid-js";
import { createResource, Show, For } from "solid-js";
import { createStore } from "solid-js/store";
import { generalSettingsStore } from "~/store";
import type { AppTheme, GeneralSettingsStore } from "~/utils/tauri";
Expand Down Expand Up @@ -107,7 +103,7 @@ function AppearanceSection(props: {
class={`w-24 h-[4.8rem] rounded-md overflow-hidden focus:outline-none ring-offset-gray-50 transition-all duration-200 ${
props.currentTheme === theme.id
? "ring-2 ring-offset-2"
: "group-hover:ring-2 ring-offset-2 group-hover:ring-gray-300"
: "group-hover:ring-2 ring-offset-2 group-hover:ring-gray-300"
}`}
aria-label={`Select theme: ${theme.name}`}
>
Expand All @@ -121,9 +117,7 @@ function AppearanceSection(props: {
</div>
<span
class={`mt-2 text-sm transition-color duration-200 ${
props.currentTheme === theme.id
? "text-blue-400"
: ""
props.currentTheme === theme.id ? "text-blue-400" : ""
}`}
>
{theme.name}
Expand Down Expand Up @@ -198,70 +192,55 @@ function Inner(props: { initialStore: GeneralSettingsStore | null }) {
}}
/>
<For each={settingsList}>
{(setting) => (
<Show
when={!setting.platforms || setting.platforms.includes(ostype)}
>
<div class="space-y-2 py-3">
{setting.pro && (
<span class="text-xs font-medium bg-blue-400 text-gray-50 px-2 py-1 rounded-lg">
Cap Pro
</span>
)}
<div class="flex items-center justify-between">
<div class="flex items-center gap-2">
<p class="text-[--text-primary]">{setting.label}</p>
</div>
<button
type="button"
role="switch"
aria-checked={
settings[setting.key as keyof GeneralSettingsStore]
}
data-state={
settings[setting.key as keyof GeneralSettingsStore]
? "checked"
: "unchecked"
}
value={
settings[setting.key as keyof GeneralSettingsStore]
? "on"
: "off"
}
class={`peer inline-flex h-4 w-8 shrink-0 cursor-pointer items-center rounded-full transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 ${
settings[setting.key as keyof GeneralSettingsStore]
? "bg-blue-400 border-blue-400"
: "bg-gray-300 border-gray-300"
}`}
onClick={() =>
handleChange(
setting.key,
!settings[setting.key as keyof GeneralSettingsStore]
)
}
>
<span
data-state={
settings[setting.key as keyof GeneralSettingsStore]
? "checked"
: "unchecked"
}
class={`pointer-events-none block h-4 w-4 rounded-full bg-gray-50 shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0 border-2 ${
settings[setting.key as keyof GeneralSettingsStore]
? "border-blue-400"
: "border-gray-300"
{(setting) => {
const value = () => !!settings[setting.key];

return (
<Show
when={
!setting.platforms || setting.platforms.includes(ostype)
}
>
<div class="space-y-2 py-3">
{setting.pro && (
<span class="text-xs font-medium bg-blue-400 text-gray-50 px-2 py-1 rounded-lg">
Cap Pro
</span>
)}
<div class="flex items-center justify-between">
<div class="flex items-center gap-2">
<p class="text-[--text-primary]">{setting.label}</p>
</div>
<button
type="button"
role="switch"
aria-checked={value()}
data-state={value() ? "checked" : "unchecked"}
value={value() ? "on" : "off"}
class={`peer inline-flex h-4 w-8 shrink-0 cursor-pointer items-center rounded-full transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 ${
value()
? "bg-blue-400 border-blue-400"
: "bg-gray-300 border-gray-300"
}`}
/>
</button>
onClick={() => handleChange(setting.key, !value())}
>
<span
data-state={value() ? "checked" : "unchecked"}
class={`pointer-events-none block h-4 w-4 rounded-full bg-gray-50 shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0 border-2 ${
value() ? "border-blue-400" : "border-gray-300"
}`}
/>
</button>
</div>
{setting.description && (
<p class="text-xs text-[--text-tertiary]">
{setting.description}
</p>
)}
</div>
{setting.description && (
<p class="text-xs text-[--text-tertiary]">
{setting.description}
</p>
)}
</div>
</Show>
)}
</Show>
);
}}
</For>
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion apps/desktop/src/routes/camera.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -138,7 +138,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={() => {
setOptions({
setOptions.mutate({
...options(),
cameraLabel: null,
});
Expand Down
1 change: 1 addition & 0 deletions apps/desktop/tsconfig.tsbuildinfo
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
{"root":["./src/app.tsx","./src/entry-client.tsx","./src/entry-server.tsx","./src/global.d.ts","./src/icons.tsx","./src/store.ts","./src/vite-env.d.ts","./src/components/loader.tsx","./src/components/switchtab.tsx","./src/components/titlebar/titlebar.tsx","./src/components/titlebar/controls/captioncontrolswindows11.tsx","./src/components/titlebar/controls/windowcontrolbutton.tsx","./src/routes/(window-chrome).tsx","./src/routes/camera.tsx","./src/routes/in-progress-recording.tsx","./src/routes/notifications.tsx","./src/routes/prev-recordings.tsx","./src/routes/window-capture-occluder.tsx","./src/routes/(window-chrome)/(main).tsx","./src/routes/(window-chrome)/callback.template.ts","./src/routes/(window-chrome)/settings.tsx","./src/routes/(window-chrome)/setup.tsx","./src/routes/(window-chrome)/signin.tsx","./src/routes/(window-chrome)/update.tsx","./src/routes/(window-chrome)/upgrade.tsx","./src/routes/(window-chrome)/settings/changelog.tsx","./src/routes/(window-chrome)/settings/feedback.tsx","./src/routes/(window-chrome)/settings/general.tsx","./src/routes/(window-chrome)/settings/hotkeys.tsx","./src/routes/(window-chrome)/settings/index.tsx","./src/routes/(window-chrome)/settings/recordings.tsx","./src/routes/(window-chrome)/settings/screenshots.tsx","./src/routes/(window-chrome)/settings/apps/index.tsx","./src/routes/(window-chrome)/settings/apps/s3-config.tsx","./src/routes/editor/configsidebar.tsx","./src/routes/editor/editor.tsx","./src/routes/editor/header.tsx","./src/routes/editor/player.tsx","./src/routes/editor/timeline.tsx","./src/routes/editor/context.ts","./src/routes/editor/editorinstancecontext.ts","./src/routes/editor/index.tsx","./src/routes/editor/projectconfig.ts","./src/routes/editor/ui.tsx","./src/routes/editor/utils.ts","./src/store/progress.ts","./src/utils/createpresets.ts","./src/utils/env.ts","./src/utils/events.ts","./src/utils/plans.ts","./src/utils/queries.ts","./src/utils/socket.ts","./src/utils/tauri.ts","./src/utils/titlebar-state.ts","./src/utils/web-api.ts"],"version":"5.7.2"}

0 comments on commit ab6299f

Please sign in to comment.