diff --git a/front/apps/web/src/pages/_app.tsx b/front/apps/web/src/pages/_app.tsx
index 35dda215..11662192 100755
--- a/front/apps/web/src/pages/_app.tsx
+++ b/front/apps/web/src/pages/_app.tsx
@@ -35,7 +35,8 @@ import {
setSsrApiUrl,
useUserTheme,
SetupStep,
- ServerInfo,
+ type ServerInfo,
+ useFetch,
} from "@kyoo/models";
import { getCurrentAccount, readCookie, updateAccount } from "@kyoo/models/src/account-internal";
import {
@@ -53,13 +54,12 @@ import arrayShuffle from "array-shuffle";
import NextApp, { type AppContext, type AppProps } from "next/app";
import { Poppins } from "next/font/google";
import Head from "next/head";
-import { type ComponentType, useContext, useState } from "react";
+import { type ComponentType, useContext, useState, useEffect } from "react";
import { Tooltip } from "react-tooltip";
import superjson from "superjson";
import { StyleRegistryProvider, useMobileHover, useStyleRegistry, useTheme } from "yoshiki/web";
import { withTranslations } from "../i18n";
-import { redirect } from "next/navigation";
-import { NextResponse } from "next/server";
+import { NextRouter, useRouter } from "next/router";
const font = Poppins({ weight: ["300", "400", "900"], subsets: ["latin"], display: "swap" });
@@ -135,6 +135,27 @@ const ConnectionErrorVerifier = ({
return ;
};
+const SetupChecker = () => {
+ const { data } = useFetch({ path: ["info"], parser: ServerInfoP });
+ const router = useRouter();
+
+ const step = data?.setupStatus;
+
+ useEffect(() => {
+ if (!step) return;
+ if (step !== SetupStep.Done && !SetupChecker.isRouteAllowed(router, step))
+ router.push(`/setup?step=${step}`);
+ }, [router.route, step, router]);
+
+ return null;
+};
+
+SetupChecker.isRouteAllowed = (router: NextRouter, step: SetupStep) =>
+ (router.route === "/setup" && router.query.step === step) ||
+ router.route === "/register" ||
+ router.route.startsWith("/login") ||
+ router.route === "/settings";
+
const WithLayout = ({ Component, ...props }: { Component: ComponentType }) => {
const layoutInfo = (Component as QueryPage).getLayout ?? (({ page }) => page);
const { Layout, props: layoutProps } =
@@ -180,6 +201,7 @@ const App = ({ Component, pageProps }: AppProps) => {
/>
+
@@ -237,12 +259,7 @@ App.getInitialProps = async (ctx: AppContext) => {
const info = client.getQueryData(["info"]);
if (
info!.setupStatus !== SetupStep.Done &&
- !(
- (ctx.router.route === "/setup" && ctx.router.query.step === info!.setupStatus) ||
- ctx.router.route === "/register" ||
- ctx.router.route === "/login" ||
- ctx.router.route === "/settings"
- )
+ !SetupChecker.isRouteAllowed(ctx.router, info!.setupStatus)
) {
ctx.ctx.res!.writeHead(307, { Location: `/setup?step=${info!.setupStatus}` });
ctx.ctx.res!.end();