From 73061a88598cf9182743648adae2ba85926fc99f Mon Sep 17 00:00:00 2001
From: "Hugo P.Brito" <hugopbrit@gmail.com>
Date: Thu, 16 Jul 2026 15:38:45 +0100
Subject: [PATCH] fix(ui): restore auth header controls

---
 ui/components/auth/oss/auth-layout.test.tsx | 9 ++++-----
 ui/components/auth/oss/auth-layout.tsx      | 8 ++++++--
 2 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/ui/components/auth/oss/auth-layout.test.tsx b/ui/components/auth/oss/auth-layout.test.tsx
index baf504cc58..452b423d12 100644
--- a/ui/components/auth/oss/auth-layout.test.tsx
+++ b/ui/components/auth/oss/auth-layout.test.tsx
@@ -5,11 +5,13 @@ import { AuthLayout } from "./auth-layout";
 import { PublicAuthShell } from "./public-auth-shell";
 
 vi.mock("@/components/ThemeSwitch", () => ({
-  ThemeSwitch: () => <button type="button">Auth card theme toggle</button>,
+  ThemeSwitch: ({ "aria-label": ariaLabel }: { "aria-label"?: string }) => (
+    <button type="button" aria-label={ariaLabel} />
+  ),
 }));
 
 describe("AuthLayout", () => {
-  it("renders the auth card title and content without the theme toggle", () => {
+  it("renders the auth card title and content", () => {
     // Given
     const title = "Sign in to Prowler";
 
@@ -23,9 +25,6 @@ describe("AuthLayout", () => {
     // Then
     expect(screen.getByText(title)).toBeVisible();
     expect(screen.getByRole("form", { name: "Sign in form" })).toBeVisible();
-    expect(
-      screen.queryByRole("button", { name: "Auth card theme toggle" }),
-    ).not.toBeInTheDocument();
   });
 
   it("renders the brand in the centered auth layout flow above the card", () => {
diff --git a/ui/components/auth/oss/auth-layout.tsx b/ui/components/auth/oss/auth-layout.tsx
index c03695dba9..1b970f8865 100644
--- a/ui/components/auth/oss/auth-layout.tsx
+++ b/ui/components/auth/oss/auth-layout.tsx
@@ -1,6 +1,7 @@
 import { ReactNode } from "react";
 
 import { ProwlerBrand } from "@/components/icons";
+import { ThemeSwitch } from "@/components/ThemeSwitch";
 
 interface AuthLayoutProps {
   title: string;
@@ -26,8 +27,11 @@ export const AuthLayout = ({ title, children }: AuthLayoutProps) => {
 
         {/* Auth Form Container */}
         <div className="border-border-neutral-secondary dark:bg-bg-neutral-primary/85 relative z-10 flex w-full max-w-sm flex-col gap-4 rounded-[14px] border bg-white/90 px-8 py-10 shadow-sm md:max-w-md">
-          {/* Header */}
-          <p className="pb-2 text-xl font-medium">{title}</p>
+          {/* Header with Title and Theme Toggle */}
+          <div className="flex items-center justify-between">
+            <p className="pb-2 text-xl font-medium">{title}</p>
+            <ThemeSwitch aria-label="Toggle theme" />
+          </div>
 
           {/* Content */}
           {children}