* 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>
47 lines
1.8 KiB
TypeScript
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>
|
|
</>
|
|
);
|
|
}
|