ceos/unsloth
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Studio: fix macOS titlebar drag and collapsed layout (#7555)

Browse source 
* Fix macOS Studio titlebar interactions

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Refine macOS titlebar alignment

* Hide collapsed macOS sidebar border

---------

Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>
This commit is contained in:
Wasim Yousef Said 2026-07-28 15:26:17 +02:00 • committed by GitHub
commit 4c2df3e6f8
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 38 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

2
studio/frontend/src/app/provider.tsx
View file

@ -255,7 +255,7 @@ const MAC_NATIVE_CHROME_STYLE = {
"--studio-non-chat-content-top-inset": "34px",
"--studio-hidden-route-top-inset": "34px",
"--studio-chat-header-height": "44px",
"--studio-chat-header-padding-top": "8px",
"--studio-chat-header-padding-top": "7px",
"--studio-chat-control-height": "33px",
"--studio-chat-header-right-inset": "0px",
} as CSSProperties;

7
studio/frontend/src/components/app-sidebar.tsx
View file

@ -1183,7 +1183,11 @@ export function AppSidebar() {
<Sidebar
collapsible="icon"
variant="sidebar"
className="font-heading group-data-[collapsible=icon]:[&_[data-sidebar=sidebar]]:bg-white dark:group-data-[collapsible=icon]:[&_[data-sidebar=sidebar]]:bg-background"
className={cn(
"font-heading group-data-[collapsible=icon]:[&_[data-sidebar=sidebar]]:bg-white dark:group-data-[collapsible=icon]:[&_[data-sidebar=sidebar]]:bg-background",
usesNativeMacTitlebar &&
"group-data-[collapsible=icon]:[&_[data-sidebar=sidebar]]:border-r-0",
)}
>
<SidebarHeader
className={cn(
@ -1205,6 +1209,7 @@ export function AppSidebar() {
/>
)}
<div
data-tauri-drag-region={usesNativeMacTitlebar || undefined}
className={cn(
"relative z-10 flex items-center gap-[8.5px] group-data-[collapsible=icon]:hidden",
showCompactMacBrand &&

3
studio/frontend/src/features/chat/chat-page.tsx
View file

@ -781,6 +781,7 @@ function GeneralCompareHeader({
// Controlled so the body-portaled popover can't linger over another tab off-route.
const active = useChatActive();
const [selectorOpen, setSelectorOpen] = useState(false);
const { pinned } = useSidebar();
return (
<div
@ -3192,7 +3193,7 @@ export function ChatPage({
// Provides `active` to ChatRuntimeProvider (drops the message views/composers
// while off-route, keeping the runtime alive) and to the compare chrome.
<ChatActiveContext.Provider value={active}>
<div className="flex min-h-0 min-w-0 flex-1 basis-0 bg-background overflow-hidden">
<div className="flex min-h-0 min-w-0 flex-1 basis-0 overflow-hidden bg-background">
{/* Portaled surfaces render to document.body, escaping the parent's hidden
wrapper, so gate them on `active` to keep them off other tabs. */}
{active && <GuidedTour {...tour.tourProps} />}

29
tests/studio/test_desktop_reliability_frontend_contract.py
View file

@ -28,6 +28,7 @@ APP_PROVIDER = FRONTEND / "app/provider.tsx"
CLIPBOARD_FILES = FRONTEND / "features/chat/utils/clipboard-files.ts"
TAURI_CAPABILITIES = REPO / "studio/src-tauri/capabilities/default.json"
CHAT_PAGE = FRONTEND / "features/chat/chat-page.tsx"
def test_file_actions_route_through_native_commands_only_in_tauri():
@ -216,6 +217,34 @@ def test_expanded_titlebar_button_and_corner_match_sidebar_edge():
)
def test_visible_mac_sidebar_header_is_a_drag_region():
source = APP_SIDEBAR.read_text(encoding = "utf-8")
header = source.split("<SidebarHeader", 1)[1].split("</SidebarHeader>", 1)[0]
drag_region = "data-tauri-drag-region={usesNativeMacTitlebar || undefined}"
assert drag_region in header
assert header.index(drag_region) < header.index('"relative z-10 flex items-center')
def test_mac_chat_header_controls_share_the_titlebar_row():
source = CHAT_PAGE.read_text(encoding = "utf-8")
provider = APP_PROVIDER.read_text(encoding = "utf-8")
assert "shouldUseNativeMacWindowTitlebar" not in source
assert "[--studio-content-top-inset:var(--studio-mac-titlebar-height" not in source
assert source.count("var(--studio-mac-traffic-light-inset") == 2
assert '"--studio-chat-header-padding-top": "7px"' in provider
assert "pt-[var(--studio-content-top-inset,0px)] md:flex-row" in source
assert "absolute top-[var(--studio-content-top-inset,0px)]" in source
def test_collapsed_mac_sidebar_hides_divider():
source = APP_SIDEBAR.read_text(encoding = "utf-8")
assert "group-data-[collapsible=icon]:[&_[data-sidebar=sidebar]]:border-r-0" in source
assert "top-[var(--studio-mac-titlebar-height,34px)]" not in source
def test_chat_sidebar_row_actions_visible_on_coarse_pointers():
"""unslothai/unsloth#7276: Recents chat kebab must be tappable on iPad."""
sidebar_source = APP_SIDEBAR.read_text(encoding = "utf-8")