Files
calendar/apps/web/modules/shell/TopNav.tsx
T
Dhairyashil ShindeGitHubDevin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>peer@cal.com <peer@cal.com>
da91152365 feat: standalone page config to use in companion (#27018)
* feat: hide navigation when ?standalone=true URL parameter is present

Co-Authored-By: peer@cal.com <peer@cal.com>

* feat: standalone page config to use in companion

---------

Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Co-authored-by: peer@cal.com <peer@cal.com>
2026-01-19 19:27:14 +00:00

47 lines
1.8 KiB
TypeScript

import { useSession } from "next-auth/react";
import Link from "next/link";
import { useIsEmbed } from "@calcom/embed-core/embed-iframe";
import { useIsStandalone } from "@calcom/lib/hooks/useIsStandalone";
import { useLocale } from "@calcom/lib/hooks/useLocale";
import { Icon } from "@calcom/ui/components/icon";
import { Logo } from "@calcom/ui/components/logo";
import { KBarTrigger } from "./Kbar";
import { UserDropdown } from "./user-dropdown/UserDropdown";
export function TopNavContainer() {
const { status } = useSession();
const isStandalone = useIsStandalone();
if (status !== "authenticated" || isStandalone) return null;
return <TopNav />;
}
function TopNav() {
const isEmbed = useIsEmbed();
const { t } = useLocale();
return (
<>
<nav
style={isEmbed ? { display: "none" } : {}}
className="bg-cal-muted/50 border-subtle sticky top-0 z-40 flex w-full items-center justify-between border-b px-4 py-1.5 backdrop-blur-lg sm:p-4 md:hidden">
<Link href="/event-types">
<Logo />
</Link>
<div className="flex items-center gap-2 self-center">
<span className="hover:bg-cal-muted hover:text-emphasis text-default group flex items-center rounded-full text-sm font-medium transition lg:hidden">
<KBarTrigger />
</span>
<button className="hover:bg-cal-muted hover:text-subtle text-muted rounded-full p-1 transition focus:outline-none focus:ring-2 focus:ring-black focus:ring-offset-2">
<span className="sr-only">{t("settings")}</span>
<Link href="/settings/my-account/profile">
<Icon name="settings" className="text-default h-4 w-4" aria-hidden="true" />
</Link>
</button>
<UserDropdown small />
</div>
</nav>
</>
);
}