mirror of
https://github.com/formbricks/formbricks.git
synced 2026-01-25 10:30:30 -06:00
277bd014ae
* add possibility to track events with posthog by setting environment variables POSTHOG_API_KEY and POSTHOG_API_HOST
91 lines
2.4 KiB
TypeScript
91 lines
2.4 KiB
TypeScript
import { signIn, useSession } from "next-auth/react";
|
|
import Head from "next/head";
|
|
import { useEffect, useState } from "react";
|
|
import { usePosthog } from "../../lib/posthog";
|
|
import { classNames } from "../../lib/utils";
|
|
import Loading from "../Loading";
|
|
import MenuBreadcrumbs from "./MenuBreadcrumbs";
|
|
import MenuProfile from "./MenuProfile";
|
|
import MenuSteps from "./MenuSteps";
|
|
import NewFormNavButton from "./NewFormNavButton";
|
|
|
|
interface BaseLayoutAuthorizedProps {
|
|
title: string;
|
|
breadcrumbs: any;
|
|
steps?: any;
|
|
currentStep?: string;
|
|
children: React.ReactNode;
|
|
bgClass?: string;
|
|
limitHeightScreen?: boolean;
|
|
}
|
|
|
|
export default function BaseLayoutAuthorized({
|
|
title,
|
|
breadcrumbs,
|
|
steps,
|
|
currentStep,
|
|
children,
|
|
bgClass = "bg-ui-gray-lighter",
|
|
limitHeightScreen = false,
|
|
}: BaseLayoutAuthorizedProps) {
|
|
const { data: session, status } = useSession();
|
|
const [loading, setLoading] = useState(true);
|
|
|
|
useEffect(() => {
|
|
if (status !== "loading") {
|
|
if (!session) {
|
|
signIn();
|
|
} else {
|
|
setLoading(false);
|
|
}
|
|
}
|
|
}, [session, status]);
|
|
|
|
usePosthog(session?.user?.email);
|
|
|
|
if (status === "loading" || loading) {
|
|
return <Loading />;
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<Head>
|
|
<title>{title}</title>
|
|
</Head>
|
|
<div
|
|
className={classNames(
|
|
bgClass,
|
|
limitHeightScreen
|
|
? "h-screen max-h-screen overflow-hidden"
|
|
: "min-h-screen",
|
|
"flex h-full"
|
|
)}
|
|
>
|
|
<div className="flex flex-col flex-1 h-full">
|
|
<header className="w-full">
|
|
<div className="relative z-10 flex flex-shrink-0 h-16 bg-white border-b shadow-sm border-ui-gray-light">
|
|
<div className="flex justify-between flex-1">
|
|
<div className="flex flex-1 space-x-8">
|
|
<NewFormNavButton />
|
|
<MenuBreadcrumbs breadcrumbs={breadcrumbs} />
|
|
</div>
|
|
<div className="flex flex-1">
|
|
{steps && (
|
|
<MenuSteps steps={steps} currentStep={currentStep} />
|
|
)}
|
|
</div>
|
|
<div className="flex items-center justify-end flex-1 space-x-2 text-right sm:space-x-4">
|
|
<div className="mr-6">
|
|
<MenuProfile />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
{children}
|
|
</div>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|