blob: 19718b216dffb20386144b9234684903af552c1d (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
|
"use client";
import Image from "next/image";
import { deleteAuth, getAuth } from "../../api/auth";
import { Button } from "@mui/material";
import { useRouter } from "next/navigation";
import { useEffect, useState } from "react";
interface AuthPayload {
token?: string;
email?: string;
name?: string;
[k: string]: unknown;
}
export default function Header() {
const router = useRouter();
const [mounted, setMounted] = useState(false);
const [auth, setAuth] = useState<AuthPayload | string | null>(null);
useEffect(() => {
setMounted(true);
const a = getAuth() as AuthPayload | string | null;
setAuth(a);
}, []);
const onLogout = () => {
deleteAuth();
router.push("/login");
};
if (!mounted) return null;
return (
<header className="fixed top-0 left-0 right-0 z-50 bg-white shadow-sm">
<div className="max-w-screen-xl mx-auto flex items-center justify-between p-3">
<div className="flex items-center gap-2">
<Image src="/images/indoteknik-logo.png" width={32} height={32} alt="logo" />
{/* <span className="font-semibold">indoteknik</span> */}
</div>
<div className="flex items-center gap-3">
<span className="text-sm text-gray-600">
{typeof auth === "object" && auth?.email ? auth.email : ""}
</span>
<Button size="small" variant="text" color="error" onClick={onLogout}>
Logout
</Button>
</div>
</div>
</header>
);
}
|