diff --git a/src/app/client/client-view.tsx b/src/app/client/client-view.tsx index b2a820d3..d6f2500e 100644 --- a/src/app/client/client-view.tsx +++ b/src/app/client/client-view.tsx @@ -1,6 +1,6 @@ "use client"; -import { LogOut } from "lucide-react"; +import { ChevronLeft, ChevronRight, LogOut } from "lucide-react"; import Link from "next/link"; import { signOut } from "next-auth/react"; import { @@ -56,11 +56,13 @@ export function ClientView({ clientUrl, hotelName, initialOnline, + defaultToolbarPosition = "right", }: { ticket: string; clientUrl: string; hotelName: string; initialOnline: number; + defaultToolbarPosition?: string; }) { const [_isFullscreen, setIsFullscreen] = useState(false); const [onlineCount, setOnlineCount] = useState(initialOnline); @@ -98,10 +100,36 @@ export function ClientView({ const clientSrc = `${base}${sep}sso=${encodeURIComponent(ticket)}`; const [mounted, setMounted] = useState(false); + const [position, setPosition] = useState<"left" | "right">("right"); + useEffect(() => { setMounted(true); }, []); + useEffect(() => { + const params = new URLSearchParams(window.location.search); + const urlPos = params.get("toolbar"); + if (urlPos === "left" || urlPos === "right") { + setPosition(urlPos); + return; + } + try { + const stored = localStorage.getItem("client_toolbar_position"); + if (stored === "left" || stored === "right") { + setPosition(stored); + return; + } + } catch { /* private mode */ } + if (defaultToolbarPosition === "left" || defaultToolbarPosition === "right") + setPosition(defaultToolbarPosition as "left" | "right"); + }, [defaultToolbarPosition]); + + function togglePosition() { + const next = position === "left" ? "right" : "left"; + setPosition(next); + try { localStorage.setItem("client_toolbar_position", next); } catch {} + } + const toolbar = ( -
+
{onlineCount}
+ + {position === "left" ? : } + signOut({ callbackUrl: "/" })} title="Logout" diff --git a/src/app/client/page.tsx b/src/app/client/page.tsx index c84b10af..6e8e6ac0 100644 --- a/src/app/client/page.tsx +++ b/src/app/client/page.tsx @@ -16,9 +16,10 @@ export default async function ClientPage() { const userId = Number(session.user.id); - const [hotelName, clientUrl] = await Promise.all([ + const [hotelName, clientUrl, defaultToolbarPosition] = await Promise.all([ resolveHotelName(), siteSettings.get("nitro_client_url", ""), + siteSettings.get("client_toolbar_position", "right"), ]); const ip = (await headers()).get("x-real-client-ip") ?? "0.0.0.0"; @@ -34,6 +35,7 @@ export default async function ClientPage() { clientUrl={clientUrl || "/nitro-client/"} hotelName={hotelName} initialOnline={onlineCount} + defaultToolbarPosition={defaultToolbarPosition ?? "right"} /> ); }