94 lines
2.4 KiB
JavaScript
94 lines
2.4 KiB
JavaScript
import Head from "next/head";
|
|
import styles from "../styles/Home.module.css";
|
|
import Header from "../components/templates/header";
|
|
import Generator from "../components/templates/generator";
|
|
import Manual from "../components/templates/manual";
|
|
import Nav from "../components/templates/nav";
|
|
import UserTop from "../components/templates/userTop";
|
|
import Footer from "../components/templates/footer";
|
|
import { useState } from "react";
|
|
import { useSession, signIn, signOut } from "next-auth/react";
|
|
import { Pane, Button, Tab, Tablist } from "evergreen-ui";
|
|
|
|
export default function Home() {
|
|
const { data: session } = useSession();
|
|
const [selectedIndex, setSelectedIndex] = useState(0);
|
|
const [tabs] = useState(["auto", "manual"]);
|
|
//const [realTabs] = useState([Generator, Manual]);
|
|
|
|
if (session) {
|
|
return (
|
|
<div className="">
|
|
<Head>
|
|
<title>Wastpol</title>
|
|
</Head>
|
|
|
|
<div className="flex md:flex-row flex-col justify-between px-8 mt-2">
|
|
<Nav />
|
|
<UserTop session={session} />
|
|
</div>
|
|
|
|
<main className="flex flex-1 flex-col items-center">
|
|
<div className="flex flex-col items-center p-8 mt-12 rounded-md shadow-md transition-all duration-500 hover:shadow-xl">
|
|
<Header />
|
|
<Tablist>
|
|
{tabs.map((tab, index) => (
|
|
<Tab
|
|
key={tab}
|
|
id={tab}
|
|
onSelect={() => setSelectedIndex(index)}
|
|
isSelected={index === selectedIndex}
|
|
>
|
|
{tab}
|
|
</Tab>
|
|
))}
|
|
</Tablist>
|
|
<Pane>
|
|
{realTabs.map((tab, index) =>
|
|
index == 1 ? (
|
|
<Pane
|
|
key={tab}
|
|
id={`panel-${tab}`}
|
|
role="tabpanel"
|
|
display={index === selectedIndex ? "block" : "none"}
|
|
>
|
|
<Manual />
|
|
</Pane>
|
|
) : (
|
|
<Pane
|
|
key={tab}
|
|
id={`panel-${tab}`}
|
|
role="tabpanel"
|
|
display={index === selectedIndex ? "block" : "none"}
|
|
>
|
|
<Generator />
|
|
</Pane>
|
|
)
|
|
)}
|
|
</Pane>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="grid place-items-center h-screen">
|
|
<Head>
|
|
<title>Wastpol</title>
|
|
</Head>
|
|
<div className="flex flex-col justify-center">
|
|
<h2 className="p-2">Nie zalogowano</h2>
|
|
<br></br>
|
|
<Button
|
|
onClick={() => signIn()}
|
|
appearance="primary"
|
|
// className="p-2 bg-slate-200 rounded-md"
|
|
>
|
|
Zaloguj
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|