Files
cobble/src/pages/__root.tsx
T
tben dbfe48796b Make the app an installable PWA with phone layout and Web Push
Add a generated manifest, icon set, offline page and service worker that never caches authenticated HTML, plus install and update UI. Turn the rail into a drawer below md with container-query internals, dvh and safe-area handling, and reconnect the socket after visibility/network changes. Add Web Push subscriptions, presence-aware delivery, notification settings and tests.
2026-10-19 17:12:16 +01:00

143 lines
4.1 KiB
TypeScript
Executable File

// @ts-ignore
import "../styles/main.css";
import React from "react";
import type {
BunextPageHeadFCProps,
BunextRootComponentProps,
} from "@moduletrace/bunext/types";
import type {
AppContextObject,
AppStateObject,
PagePropsType,
} from "@/src/types";
import { SiteData } from "@/src/data/site-data";
import Layout from "../layouts/main";
import AuthLayout from "../layouts/auth";
import BotsLayout from "../layouts/bots";
import ThemeInitScript from "../components/general/theme-init-script";
import PwaInitScript from "../components/general/pwa-init-script";
import ServiceWorkerRegistrar from "../components/general/service-worker-registrar";
export const AppContext = React.createContext<AppContextObject>(
{} as AppContextObject,
);
/**
* # NextApp App Root
* @description Root component for NextApp App (Next.js)
*/
export default function App({
children,
props,
url,
query,
}: BunextRootComponentProps) {
const [refresh, setRefresh] = React.useState(0);
const [appState, setAppState] = React.useState<AppStateObject>({
likes: null,
});
const page_props = props as PagePropsType;
const appContextObject: AppContextObject = {
user: page_props?.user || null,
user_types: page_props?.user_types || null,
appState,
setAppState,
refresh,
setRefresh,
SITE_DATA: {
siteName: SiteData["SiteName"],
},
pageProps: { ...props, url },
query,
};
if (url?.pathname.startsWith("/admin")) {
return (
<AppContext.Provider value={appContextObject}>
<BotsLayout>{children}</BotsLayout>
<ServiceWorkerRegistrar />
</AppContext.Provider>
);
}
if (
url?.pathname.startsWith("/auth") &&
!url.pathname.startsWith("/auth/logout")
) {
return (
<AppContext.Provider value={appContextObject}>
<AuthLayout>{children}</AuthLayout>
<ServiceWorkerRegistrar />
</AppContext.Provider>
);
}
return (
<AppContext.Provider value={appContextObject}>
<Layout
// no_header_divider={
// url?.pathname ? ["/"].includes(url.pathname) : undefined
// }
blank={
url?.pathname
? ["/auth/logout"].includes(url.pathname)
: undefined
}
>
{children}
</Layout>
<ServiceWorkerRegistrar />
</AppContext.Provider>
);
}
export function Head({ serverRes, ctx }: BunextPageHeadFCProps) {
return (
<>
<ThemeInitScript />
<PwaInitScript />
<meta name="application-name" content={SiteData["SiteName"]} />
<meta name="mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta
name="apple-mobile-web-app-title"
content={SiteData["SiteName"]}
/>
<meta
name="apple-mobile-web-app-status-bar-style"
content="default"
/>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link
rel="preconnect"
href="https://fonts.gstatic.com"
crossOrigin=""
/>
<link
href="https://fonts.googleapis.com/css2?family=Lato:wght@400;700;900&display=swap"
rel="stylesheet"
/>
<link
rel="icon"
href="/favicon.ico"
sizes="16x16 24x24 32x32 48x48"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="/favicon.png"
/>
<link
rel="apple-touch-icon"
sizes="180x180"
href="/apple-touch-icon.png"
/>
</>
);
}