mirror of
https://github.com/HKUDS/nanobot.git
synced 2026-09-03 17:52:00 +03:00
fix(webui): tighten native settings spacing
This commit is contained in:
@@ -76,13 +76,16 @@ export function SettingsSidebar({
|
||||
<aside
|
||||
className={cn(
|
||||
"flex w-full shrink-0 flex-col bg-settings-surface px-3 pb-2 lg:w-[17rem] lg:px-3 lg:pb-4",
|
||||
hostChromeInset ? "pt-[4.25rem] lg:pt-[4.25rem]" : "pt-4 lg:pt-4",
|
||||
hostChromeInset ? "pt-10 lg:pt-10" : "pt-4 lg:pt-4",
|
||||
)}
|
||||
>
|
||||
<button
|
||||
type="button"
|
||||
onClick={onBackToChat}
|
||||
className="touch-target mb-2 inline-flex w-fit items-center gap-1.5 rounded-full px-2.5 py-1.5 text-[12px] font-medium text-muted-foreground transition-colors hover:bg-muted/70 hover:text-foreground lg:mb-3"
|
||||
className={cn(
|
||||
"touch-target mb-2 inline-flex w-fit items-center gap-1.5 rounded-full px-2.5 py-1.5 text-[12px] font-medium text-muted-foreground transition-colors hover:bg-muted/70 hover:text-foreground lg:mb-3",
|
||||
hostChromeInset && "-ml-1",
|
||||
)}
|
||||
>
|
||||
<ChevronLeft className="h-3.5 w-3.5" aria-hidden />
|
||||
{t("settings.backToChat")}
|
||||
|
||||
@@ -480,6 +480,9 @@ describe("App layout", () => {
|
||||
expect(
|
||||
screen.getByRole("navigation", { name: "Settings sections" }),
|
||||
).toBeInTheDocument();
|
||||
const backButton = screen.getByRole("button", { name: "Back to chat" });
|
||||
expect(backButton.closest("aside")).toHaveClass("pt-4", "lg:pt-4");
|
||||
expect(backButton).not.toHaveClass("-ml-1");
|
||||
expect(container.querySelectorAll("main")).toHaveLength(1);
|
||||
expect(screen.getByRole("heading", { level: 1, name: "Settings" })).toBeInTheDocument();
|
||||
});
|
||||
@@ -1657,6 +1660,28 @@ describe("App layout", () => {
|
||||
await waitFor(() => expect(flowSidebar).toHaveStyle({ width: "272px" }));
|
||||
});
|
||||
|
||||
it("aligns native settings navigation below the titlebar without extra top padding", async () => {
|
||||
vi.mocked(fetchBootstrap).mockResolvedValue({
|
||||
token: "tok",
|
||||
api_token: "api-tok",
|
||||
ws_path: "/",
|
||||
expires_in: 300,
|
||||
runtime_surface: "native",
|
||||
});
|
||||
mockFetchRoutes({ "/api/settings": baseSettingsPayload() });
|
||||
|
||||
render(<App />);
|
||||
|
||||
await waitFor(() => expect(connectSpy).toHaveBeenCalled());
|
||||
const sidebar = screen.getByRole("navigation", { name: "Sidebar navigation" });
|
||||
fireEvent.click(within(sidebar).getByRole("button", { name: "Settings" }));
|
||||
|
||||
const backButton = await screen.findByRole("button", { name: "Back to chat" });
|
||||
expect(backButton.closest("aside")).toHaveClass("pt-10", "lg:pt-10");
|
||||
expect(backButton.closest("aside")).not.toHaveClass("pt-[4.25rem]");
|
||||
expect(backButton).toHaveClass("-ml-1");
|
||||
});
|
||||
|
||||
it("uses native chrome when the host bridge overrides browser gateway metadata", async () => {
|
||||
Reflect.set(window, "nanobotHost", { pickFolder: vi.fn() });
|
||||
vi.mocked(fetchBootstrap).mockResolvedValue({
|
||||
|
||||
Reference in New Issue
Block a user