History

Integrate macOS traffic lights into sidebar (#1049)

maria committed 4 months ago

Commit 175c5861 parent e5304844 files · +22 −3Browse files

Unified · Split

4 files
  1. apps/desktop/src/main/index.ts +3 −0
  2. packages/app/src/entry-client.tsx +4 −0
  3. packages/app/src/web/shell.tsx +6 −3
  4. packages/react/src/styles/globals.css +9 −0
apps/desktop/src/main/index.ts+3−0
@@ -398,6 +398,9 @@ const createWindow = async (conn: SidecarConnection) => { · 397 unmodified lines
398 show: false,398 show: false,
399 backgroundColor: "#0a0a0a",399 backgroundColor: "#0a0a0a",
400 autoHideMenuBar: true,400 autoHideMenuBar: true,
401 ...(process.platform === "darwin"
402 ? { titleBarStyle: "hidden" as const, trafficLightPosition: { x: 16, y: 17 } }
403 : {}),
401 ...(linuxIcon ? { icon: linuxIcon } : {}),404 ...(linuxIcon ? { icon: linuxIcon } : {}),
402 webPreferences: {405 webPreferences: {
403 preload: PRELOAD_PATH,406 preload: PRELOAD_PATH,
packages/app/src/entry-client.tsx+4−0
@@ -8,6 +8,10 @@ import "@executor-js/react/globals.css"; · 7 unmodified lines
8 8
9initDesktopCrashReporting();9initDesktopCrashReporting();
10 10
11if ("executor" in window && navigator.platform.includes("Mac")) {
12 document.documentElement.classList.add("executor-desktop-macos");
13}
14
11// Resolve the local bearer token (?_token → localStorage → dev global) and set15// Resolve the local bearer token (?_token → localStorage → dev global) and set
12// the connection's auth BEFORE the router mounts, so the first API atom carries16// the connection's auth BEFORE the router mounts, so the first API atom carries
13// it. No-op on desktop (the main process injects the header).17// it. No-op on desktop (the main process injects the header).
packages/app/src/web/shell.tsx+6−3
@@ -349,14 +349,17 @@ function SidebarContent(props: { · 348 unmodified lines
349 return (349 return (
350 <>350 <>
351 {props.showBrand !== false && (351 {props.showBrand !== false && (
352 <div className="flex h-12 shrink-0 items-center gap-2 border-b border-sidebar-border px-4">352 <div className="desktop-macos-sidebar-header flex h-12 shrink-0 items-center gap-2 border-b border-sidebar-border px-4">
353 <Link to="/{-$orgSlug}" className="flex shrink-0 items-center gap-1.5">353 <Link
354 to="/{-$orgSlug}"
355 className="desktop-macos-no-drag flex shrink-0 items-center gap-1.5"
356 >
354 <span className="font-display text-base tracking-tight text-foreground">executor</span>357 <span className="font-display text-base tracking-tight text-foreground">executor</span>
355 <span className="rounded bg-primary/15 px-1.5 py-px text-[10px] font-semibold uppercase tracking-wider text-primary">358 <span className="rounded bg-primary/15 px-1.5 py-px text-[10px] font-semibold uppercase tracking-wider text-primary">
356 Beta359 Beta
357 </span>360 </span>
358 </Link>361 </Link>
359 <div className="ml-auto flex min-w-0 flex-1 justify-end">362 <div className="desktop-macos-no-drag ml-auto flex min-w-0 flex-1 justify-end pl-3">
360 <ServerConnectionMenu variant="header" />363 <ServerConnectionMenu variant="header" />
361 </div>364 </div>
362 </div>365 </div>
packages/react/src/styles/globals.css+9−0
@@ -149,6 +149,15 @@ · 148 unmodified lines
149 }149 }
150}150}
151 151
152.executor-desktop-macos .desktop-macos-sidebar-header {
153 -webkit-app-region: drag;
154 padding-left: 88px;
155}
156
157.executor-desktop-macos .desktop-macos-no-drag {
158 -webkit-app-region: no-drag;
159}
160
152.dark {161.dark {
153 --sidebar: hsl(240 5.9% 10%);162 --sidebar: hsl(240 5.9% 10%);
154 --sidebar-foreground: hsl(240 4.8% 95.9%);163 --sidebar-foreground: hsl(240 4.8% 95.9%);