mirror of
https://github.com/Radiquum/AniX.git
synced 2025-04-05 07:44:38 +00:00
131 lines
4.3 KiB
TypeScript
131 lines
4.3 KiB
TypeScript
"use client";
|
||
import { useUserStore } from "./store/auth";
|
||
import { usePreferencesStore } from "./store/preferences";
|
||
import { Navbar } from "./components/Navbar/NavbarUpdate";
|
||
import { Inter } from "next/font/google";
|
||
import { useEffect, useState } from "react";
|
||
import { Button, Modal } from "flowbite-react";
|
||
import { Spinner } from "./components/Spinner/Spinner";
|
||
import { ChangelogModal } from "#/components/ChangelogModal/ChangelogModal";
|
||
import PlausibleProvider from "next-plausible";
|
||
import { Bounce, ToastContainer } from "react-toastify";
|
||
|
||
const inter = Inter({ subsets: ["latin"] });
|
||
|
||
export const App = (props) => {
|
||
const preferencesStore = usePreferencesStore();
|
||
const userStore = useUserStore((state) => state);
|
||
const [showChangelog, setShowChangelog] = useState(false);
|
||
const [currentVersion, setCurrentVersion] = useState("");
|
||
const [previousVersions, setPreviousVersions] = useState([]);
|
||
|
||
useEffect(() => {
|
||
async function _checkVersion() {
|
||
const res = await fetch("/api/version");
|
||
const data = await res.json();
|
||
|
||
if (data.version !== preferencesStore.params.version) {
|
||
setShowChangelog(true);
|
||
setCurrentVersion(data.version);
|
||
setPreviousVersions(data.previous);
|
||
}
|
||
}
|
||
|
||
if (preferencesStore._hasHydrated) {
|
||
_checkVersion();
|
||
userStore.checkAuth();
|
||
}
|
||
|
||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||
}, [preferencesStore._hasHydrated]);
|
||
|
||
if (!preferencesStore._hasHydrated && !userStore._hasHydrated) {
|
||
return (
|
||
<body
|
||
className={`${inter.className} overflow-x-hidden dark:bg-[#0d1117] dark:text-white h-screen flex justify-center items-center`}
|
||
>
|
||
<Spinner />
|
||
</body>
|
||
);
|
||
}
|
||
|
||
if (userStore.state === "loading") {
|
||
return (
|
||
<body
|
||
className={`${inter.className} overflow-x-hidden dark:bg-[#0d1117] dark:text-white h-screen flex justify-center items-center`}
|
||
>
|
||
<Spinner />
|
||
</body>
|
||
);
|
||
}
|
||
|
||
return (
|
||
<body
|
||
className={`${inter.className} overflow-x-hidden dark:bg-[#0d1117] dark:text-white`}
|
||
>
|
||
<Navbar />
|
||
<main className="container px-2 pt-4 pb-24 mx-auto sm:pb-0">
|
||
{props.children}
|
||
</main>
|
||
<ChangelogModal
|
||
isOpen={showChangelog && preferencesStore.flags.showChangelog}
|
||
setIsOpen={() => {
|
||
setShowChangelog(false);
|
||
preferencesStore.setParams({ version: currentVersion });
|
||
}}
|
||
version={currentVersion}
|
||
previousVersions={previousVersions}
|
||
/>
|
||
<Modal
|
||
show={preferencesStore.params.isFirstLaunch}
|
||
onClose={() => preferencesStore.setParams({ isFirstLaunch: false })}
|
||
>
|
||
<Modal.Header>Внимание</Modal.Header>
|
||
<Modal.Body>
|
||
<p>
|
||
Данный сайт не связан с разработчиками приложения Anixart, это
|
||
неофициальная имплементация веб клиента для этого приложения.
|
||
<br />
|
||
<br />
|
||
Используя данный веб-сайт вы принимаете что мы не несём
|
||
ответственности за ваш аккаунт.
|
||
<br />
|
||
<br />
|
||
На сайте могут присутствовать ошибки и не доработки, а так-же
|
||
отсутствующий функционал.
|
||
</p>
|
||
</Modal.Body>
|
||
<Modal.Footer>
|
||
<Button
|
||
color={"blue"}
|
||
onClick={() => preferencesStore.setParams({ isFirstLaunch: false })}
|
||
>
|
||
Принимаю
|
||
</Button>
|
||
</Modal.Footer>
|
||
</Modal>
|
||
{preferencesStore.flags.enableAnalytics && (
|
||
<PlausibleProvider
|
||
domain="anix.wah.su"
|
||
trackLocalhost={false}
|
||
selfHosted={true}
|
||
enabled={true}
|
||
/>
|
||
)}
|
||
<ToastContainer
|
||
className={"mx-2 mb-20 sm:mb-0"}
|
||
position="bottom-center"
|
||
autoClose={5000}
|
||
hideProgressBar={false}
|
||
newestOnTop={true}
|
||
closeOnClick={true}
|
||
rtl={false}
|
||
pauseOnFocusLoss={false}
|
||
draggable={true}
|
||
pauseOnHover={true}
|
||
theme="colored"
|
||
transition={Bounce}
|
||
/>
|
||
</body>
|
||
);
|
||
};
|