69 lines
2.5 KiB
TypeScript
69 lines
2.5 KiB
TypeScript
import { DirectionProvider } from "@base-ui/react/direction-provider";
|
|
import { useEffect } from "react";
|
|
import { Outlet, ScrollRestoration } from "react-router-dom";
|
|
import { useInstance } from "./contexts/InstanceContext";
|
|
import useNavigateTo from "./hooks/useNavigateTo";
|
|
import { useUserLocale } from "./hooks/useUserLocale";
|
|
import { useUserTheme } from "./hooks/useUserTheme";
|
|
import { cleanupExpiredOAuthState } from "./utils/oauth";
|
|
|
|
const App = () => {
|
|
const navigateTo = useNavigateTo();
|
|
const { profile: instanceProfile, profileLoaded, generalSetting: instanceGeneralSetting } = useInstance();
|
|
|
|
// Apply user preferences reactively
|
|
const direction = useUserLocale();
|
|
useUserTheme();
|
|
|
|
// Clean up expired OAuth states on app initialization
|
|
useEffect(() => {
|
|
cleanupExpiredOAuthState();
|
|
}, []);
|
|
|
|
// Redirect to sign up page if the instance needs initial setup (no users yet).
|
|
// needsSetup is used instead of a missing admin so an instance that has lost its
|
|
// admins isn't mistaken for a fresh install (which would create a normal user).
|
|
// Guard with profileLoaded so a fetch failure doesn't incorrectly trigger the redirect.
|
|
useEffect(() => {
|
|
if (profileLoaded && instanceProfile.needsSetup) {
|
|
navigateTo("/auth/signup");
|
|
}
|
|
}, [profileLoaded, instanceProfile.needsSetup, navigateTo]);
|
|
|
|
useEffect(() => {
|
|
if (instanceGeneralSetting.additionalStyle) {
|
|
const styleEl = document.createElement("style");
|
|
styleEl.innerHTML = instanceGeneralSetting.additionalStyle;
|
|
styleEl.setAttribute("type", "text/css");
|
|
document.body.insertAdjacentElement("beforeend", styleEl);
|
|
}
|
|
}, [instanceGeneralSetting.additionalStyle]);
|
|
|
|
useEffect(() => {
|
|
if (instanceGeneralSetting.additionalScript) {
|
|
const scriptEl = document.createElement("script");
|
|
scriptEl.innerHTML = instanceGeneralSetting.additionalScript;
|
|
document.head.appendChild(scriptEl);
|
|
}
|
|
}, [instanceGeneralSetting.additionalScript]);
|
|
|
|
// Dynamic update metadata with customized profile
|
|
useEffect(() => {
|
|
if (!instanceGeneralSetting.customProfile) {
|
|
return;
|
|
}
|
|
|
|
document.title = instanceGeneralSetting.customProfile.title;
|
|
const link = document.querySelector("link[rel~='icon']") as HTMLLinkElement;
|
|
link.href = instanceGeneralSetting.customProfile.logoUrl || "/logo.webp";
|
|
}, [instanceGeneralSetting.customProfile]);
|
|
|
|
return (
|
|
<DirectionProvider direction={direction}>
|
|
<Outlet />
|
|
<ScrollRestoration />
|
|
</DirectionProvider>
|
|
);
|
|
};
|
|
|
|
export default App;
|