76 lines
1.9 KiB
TypeScript
76 lines
1.9 KiB
TypeScript
"use client";
|
|
import { PlaneIcon, Workflow } from "lucide-react";
|
|
import { useSession } from "next-auth/react";
|
|
import { useRouter, useSearchParams } from "next/navigation";
|
|
import { useEffect, useState } from "react";
|
|
|
|
export const StatsToggle = () => {
|
|
const [checked, setChecked] = useState(false);
|
|
const session = useSession();
|
|
const router = useRouter();
|
|
const searchParams = useSearchParams();
|
|
|
|
useEffect(() => {
|
|
const statsPage = searchParams.get("stats") || "pilot";
|
|
if (statsPage === "dispo") {
|
|
setChecked(false);
|
|
} else {
|
|
setChecked(true);
|
|
}
|
|
}, [searchParams]);
|
|
|
|
useEffect(() => {
|
|
if (checked) {
|
|
router.push("/?stats=pilot");
|
|
} else {
|
|
router.push("/?stats=dispo");
|
|
}
|
|
}, [checked, router]);
|
|
|
|
return (
|
|
<header className="flex justify-between items-center pb-4">
|
|
<h1 className="text-2xl font-bold">
|
|
Hallo,{" "}
|
|
{session.status === "authenticated"
|
|
? session.data?.user.firstname + " <" + session.data?.user.publicId + ">"
|
|
: "<username>"}
|
|
{"!"}
|
|
</h1>
|
|
<div>
|
|
<div className="tooltip tooltip-left" data-tip="Disponent / Pilot">
|
|
<label className="toggle text-base-content">
|
|
<input
|
|
type="checkbox"
|
|
checked={checked}
|
|
onChange={(e) => setChecked(e.target.checked)}
|
|
/>
|
|
<Workflow className="w-4 h-4" viewBox="0 0 24 24" aria-label="enabled" />
|
|
<PlaneIcon className="w-4 h-4" viewBox="0 0 24 24" aria-label="disabled" />
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
);
|
|
};
|
|
|
|
export const StatsTitle = () => {
|
|
const session = useSession();
|
|
|
|
return (
|
|
<header className="flex justify-left items-center pb-4">
|
|
<h1 className="text-2xl font-bold">
|
|
Hallo,{" "}
|
|
{session.status === "authenticated" ? (
|
|
<>
|
|
{session.data?.user.firstname}
|
|
<span className="text-info text-xl">{" #" + session.data?.user.publicId}</span>
|
|
</>
|
|
) : (
|
|
"<username>"
|
|
)}
|
|
{"!"}
|
|
</h1>
|
|
</header>
|
|
);
|
|
};
|