2023-03-19 18:01:08 +01:00
|
|
|
import "core-js/stable";
|
2023-11-19 20:03:35 +01:00
|
|
|
import "./stores/__old/imports";
|
|
|
|
import "@/setup/ga";
|
2023-11-26 16:04:23 +01:00
|
|
|
import "@/assets/css/index.css";
|
2023-11-19 20:03:35 +01:00
|
|
|
|
2023-11-24 17:11:00 +01:00
|
|
|
import React, { Suspense, useCallback } from "react";
|
2023-09-01 15:37:03 +02:00
|
|
|
import type { ReactNode } from "react";
|
2022-02-16 21:30:12 +01:00
|
|
|
import ReactDOM from "react-dom";
|
2023-10-14 19:28:27 +02:00
|
|
|
import { HelmetProvider } from "react-helmet-async";
|
2023-11-26 16:04:23 +01:00
|
|
|
import { useTranslation } from "react-i18next";
|
2023-02-19 16:05:19 +01:00
|
|
|
import { BrowserRouter, HashRouter } from "react-router-dom";
|
2023-11-05 17:56:56 +01:00
|
|
|
import { useAsync } from "react-use";
|
2023-02-24 20:12:20 +01:00
|
|
|
import { registerSW } from "virtual:pwa-register";
|
2023-01-07 21:36:18 +01:00
|
|
|
|
2023-11-26 16:04:23 +01:00
|
|
|
import { Button } from "@/components/buttons/Button";
|
2023-11-24 17:11:00 +01:00
|
|
|
import { Icon, Icons } from "@/components/Icon";
|
|
|
|
import { Loading } from "@/components/layout/Loading";
|
2023-11-05 17:56:56 +01:00
|
|
|
import { useAuthRestore } from "@/hooks/auth/useAuthRestore";
|
2023-11-24 17:11:00 +01:00
|
|
|
import { useBackendUrl } from "@/hooks/auth/useBackendUrl";
|
2023-10-24 20:34:54 +02:00
|
|
|
import { ErrorBoundary } from "@/pages/errors/ErrorBoundary";
|
2023-11-05 17:56:56 +01:00
|
|
|
import { MigrationPart } from "@/pages/parts/migrations/MigrationPart";
|
2023-11-24 17:11:00 +01:00
|
|
|
import { LargeTextPart } from "@/pages/parts/util/LargeTextPart";
|
2023-01-07 21:36:18 +01:00
|
|
|
import App from "@/setup/App";
|
2023-10-21 22:14:54 +02:00
|
|
|
import { conf } from "@/setup/config";
|
2023-06-18 14:10:26 +02:00
|
|
|
import i18n from "@/setup/i18n";
|
2023-11-24 17:11:00 +01:00
|
|
|
import { useAuthStore } from "@/stores/auth";
|
2023-11-19 20:03:35 +01:00
|
|
|
import { BookmarkSyncer } from "@/stores/bookmarks/BookmarkSyncer";
|
2023-10-31 19:07:47 +01:00
|
|
|
import { useLanguageStore } from "@/stores/language";
|
2023-11-19 20:47:20 +01:00
|
|
|
import { ProgressSyncer } from "@/stores/progress/ProgressSyncer";
|
2023-11-24 17:11:00 +01:00
|
|
|
import { SettingsSyncer } from "@/stores/subtitles/SettingsSyncer";
|
2023-11-18 17:28:10 +01:00
|
|
|
import { useThemeStore } from "@/stores/theme";
|
2023-10-31 19:07:47 +01:00
|
|
|
|
2023-01-25 21:44:15 +01:00
|
|
|
import { initializeChromecast } from "./setup/chromecast";
|
2023-10-31 19:07:47 +01:00
|
|
|
import { initializeOldStores } from "./stores/__old/migrations";
|
2022-12-29 18:25:57 +01:00
|
|
|
|
|
|
|
// initialize
|
|
|
|
const key =
|
|
|
|
(window as any)?.__CONFIG__?.VITE_KEY ?? import.meta.env.VITE_KEY ?? null;
|
|
|
|
if (key) {
|
2023-02-22 21:41:13 +01:00
|
|
|
(window as any).initMW(conf().PROXY_URLS, key);
|
2022-12-29 18:25:57 +01:00
|
|
|
}
|
2023-01-25 21:44:15 +01:00
|
|
|
initializeChromecast();
|
2023-02-24 20:12:20 +01:00
|
|
|
registerSW({
|
2023-03-19 18:01:08 +01:00
|
|
|
immediate: true,
|
2023-02-24 20:12:20 +01:00
|
|
|
});
|
2021-07-14 00:31:37 +02:00
|
|
|
|
2023-11-18 15:12:31 +01:00
|
|
|
function LoadingScreen(props: { type: "user" | "lazy" }) {
|
2023-11-26 16:04:23 +01:00
|
|
|
const mapping = {
|
|
|
|
user: "screens.loadingUser",
|
|
|
|
lazy: "screens.loadingApp",
|
|
|
|
};
|
|
|
|
const { t } = useTranslation();
|
2023-11-24 17:11:00 +01:00
|
|
|
return (
|
2023-11-26 16:04:23 +01:00
|
|
|
<LargeTextPart iconSlot={<Loading />}>
|
|
|
|
{t(mapping[props.type] ?? "unknown.translation")}
|
|
|
|
</LargeTextPart>
|
2023-11-24 17:11:00 +01:00
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
function ErrorScreen(props: {
|
|
|
|
children: ReactNode;
|
|
|
|
showResetButton?: boolean;
|
|
|
|
}) {
|
2023-11-26 16:04:23 +01:00
|
|
|
const { t } = useTranslation();
|
2023-11-24 17:11:00 +01:00
|
|
|
const setBackendUrl = useAuthStore((s) => s.setBackendUrl);
|
|
|
|
const resetBackend = useCallback(() => {
|
|
|
|
setBackendUrl(null);
|
|
|
|
// eslint-disable-next-line no-restricted-globals
|
|
|
|
location.reload();
|
|
|
|
}, [setBackendUrl]);
|
|
|
|
|
|
|
|
return (
|
|
|
|
<LargeTextPart
|
|
|
|
iconSlot={
|
|
|
|
<Icon className="text-type-danger text-2xl" icon={Icons.WARNING} />
|
|
|
|
}
|
|
|
|
>
|
|
|
|
{props.children}
|
|
|
|
{props.showResetButton ? (
|
|
|
|
<div className="mt-6">
|
|
|
|
<Button theme="secondary" onClick={resetBackend}>
|
2023-11-26 16:04:23 +01:00
|
|
|
{t("screens.loadingUserError.reset")}
|
2023-11-24 17:11:00 +01:00
|
|
|
</Button>
|
|
|
|
</div>
|
|
|
|
) : null}
|
|
|
|
</LargeTextPart>
|
|
|
|
);
|
2023-11-18 15:12:31 +01:00
|
|
|
}
|
|
|
|
|
2023-11-05 17:56:56 +01:00
|
|
|
function AuthWrapper() {
|
|
|
|
const status = useAuthRestore();
|
2023-11-24 17:11:00 +01:00
|
|
|
const backendUrl = conf().BACKEND_URL;
|
|
|
|
const userBackendUrl = useBackendUrl();
|
2023-11-26 16:04:23 +01:00
|
|
|
const { t } = useTranslation();
|
2023-11-05 17:56:56 +01:00
|
|
|
|
2023-11-18 15:12:31 +01:00
|
|
|
if (status.loading) return <LoadingScreen type="user" />;
|
2023-11-24 17:11:00 +01:00
|
|
|
if (status.error)
|
|
|
|
return (
|
|
|
|
<ErrorScreen showResetButton={backendUrl !== userBackendUrl}>
|
2023-11-26 16:04:23 +01:00
|
|
|
{t(
|
|
|
|
backendUrl !== userBackendUrl
|
|
|
|
? "screens.loadingUserError.textWithReset"
|
|
|
|
: "screens.loadingUserError.text"
|
|
|
|
)}
|
2023-11-24 17:11:00 +01:00
|
|
|
</ErrorScreen>
|
|
|
|
);
|
2023-11-05 17:56:56 +01:00
|
|
|
return <App />;
|
|
|
|
}
|
|
|
|
|
|
|
|
function MigrationRunner() {
|
|
|
|
const status = useAsync(async () => {
|
|
|
|
i18n.changeLanguage(useLanguageStore.getState().language);
|
|
|
|
await initializeOldStores();
|
|
|
|
}, []);
|
2023-11-26 16:04:23 +01:00
|
|
|
const { t } = useTranslation();
|
2023-11-05 17:56:56 +01:00
|
|
|
|
|
|
|
if (status.loading) return <MigrationPart />;
|
2023-11-24 17:11:00 +01:00
|
|
|
if (status.error)
|
2023-11-26 16:04:23 +01:00
|
|
|
return <ErrorScreen>{t("screens.migration.failed")}</ErrorScreen>;
|
2023-11-05 17:56:56 +01:00
|
|
|
return <AuthWrapper />;
|
|
|
|
}
|
2023-02-12 00:41:55 +01:00
|
|
|
|
2023-02-19 16:05:19 +01:00
|
|
|
function TheRouter(props: { children: ReactNode }) {
|
|
|
|
const normalRouter = conf().NORMAL_ROUTER;
|
2023-02-19 18:03:54 +01:00
|
|
|
|
|
|
|
if (normalRouter) return <BrowserRouter>{props.children}</BrowserRouter>;
|
|
|
|
return <HashRouter>{props.children}</HashRouter>;
|
2023-02-19 16:05:19 +01:00
|
|
|
}
|
|
|
|
|
2023-11-18 17:28:10 +01:00
|
|
|
function ThemeProvider(props: { children: ReactNode }) {
|
|
|
|
const theme = useThemeStore((s) => s.theme);
|
|
|
|
const themeSelector = theme ? `theme-${theme}` : undefined;
|
|
|
|
|
|
|
|
return <div className={themeSelector}>{props.children}</div>;
|
|
|
|
}
|
|
|
|
|
2021-07-14 00:31:37 +02:00
|
|
|
ReactDOM.render(
|
2022-02-16 21:30:12 +01:00
|
|
|
<React.StrictMode>
|
|
|
|
<ErrorBoundary>
|
2023-10-14 19:28:27 +02:00
|
|
|
<HelmetProvider>
|
2023-11-18 15:12:31 +01:00
|
|
|
<Suspense fallback={<LoadingScreen type="lazy" />}>
|
2023-11-18 17:28:10 +01:00
|
|
|
<ThemeProvider>
|
2023-11-19 20:47:20 +01:00
|
|
|
<ProgressSyncer />
|
2023-11-19 20:03:35 +01:00
|
|
|
<BookmarkSyncer />
|
2023-11-24 17:11:00 +01:00
|
|
|
<SettingsSyncer />
|
2023-11-18 17:28:10 +01:00
|
|
|
<TheRouter>
|
|
|
|
<MigrationRunner />
|
|
|
|
</TheRouter>
|
|
|
|
</ThemeProvider>
|
2023-11-18 15:12:31 +01:00
|
|
|
</Suspense>
|
2023-10-14 19:28:27 +02:00
|
|
|
</HelmetProvider>
|
2022-02-16 21:30:12 +01:00
|
|
|
</ErrorBoundary>
|
|
|
|
</React.StrictMode>,
|
|
|
|
document.getElementById("root")
|
2021-07-14 00:31:37 +02:00
|
|
|
);
|