113 lines
3.2 KiB
JavaScript
113 lines
3.2 KiB
JavaScript
// @ts-check
|
|
|
|
import "device-agnostic-ui/theme.css";
|
|
import "device-agnostic-ui/global.css";
|
|
import "device-agnostic-ui/Button.css";
|
|
import "device-agnostic-ui/ButtonSubmit.css";
|
|
import "device-agnostic-ui/Code.css";
|
|
import "device-agnostic-ui/Fieldset.css";
|
|
import "device-agnostic-ui/Heading.css";
|
|
import "device-agnostic-ui/Loading.css";
|
|
import "device-agnostic-ui/Margin.css";
|
|
import "device-agnostic-ui/Scroll.css";
|
|
import "device-agnostic-ui/Table.css";
|
|
import "device-agnostic-ui/Textbox.css";
|
|
|
|
import { InMemoryCache } from "@apollo/client/cache/inmemory/inMemoryCache.js";
|
|
import { ApolloClient } from "@apollo/client/core/ApolloClient.js";
|
|
import { ApolloProvider } from "@apollo/client/react/context/ApolloProvider.js";
|
|
import createUploadLink from "apollo-upload-client/createUploadLink.mjs";
|
|
import nextApp from "next/app.js";
|
|
import nextHead from "next/head.js";
|
|
import { createElement as h, Fragment } from "react";
|
|
|
|
let token = process.env.API_TOKEN;
|
|
|
|
const createApolloClient = (cache = {}) =>
|
|
new ApolloClient({
|
|
ssrMode: typeof window === "undefined",
|
|
cache: new InMemoryCache().restore(cache),
|
|
link: createUploadLink({
|
|
uri: process.env.API_URI,
|
|
headers: {
|
|
"Apollo-Require-Preflight": "true",
|
|
"tenant-id": "imagetech",
|
|
authorization: `Bearer ${token}`,
|
|
},
|
|
}),
|
|
});
|
|
|
|
/**
|
|
* React component for the Next.js app.
|
|
* @param {import("next/app.js").AppProps & AppCustomProps} props Props.
|
|
*/
|
|
function App({
|
|
Component,
|
|
pageProps,
|
|
apolloCache,
|
|
apolloClient = createApolloClient(apolloCache),
|
|
}) {
|
|
return h(ApolloProvider, {
|
|
client: apolloClient,
|
|
children: h(
|
|
Fragment,
|
|
null,
|
|
h(
|
|
nextHead.default,
|
|
null,
|
|
h("meta", {
|
|
name: "viewport",
|
|
content: "width=device-width, initial-scale=1",
|
|
}),
|
|
h("meta", { name: "color-scheme", content: "light dark" }),
|
|
h("meta", { name: "theme-color", content: "white" }),
|
|
h("link", { rel: "manifest", href: "/manifest.webmanifest" }),
|
|
),
|
|
h(Component, pageProps),
|
|
),
|
|
});
|
|
}
|
|
|
|
if (typeof window === "undefined")
|
|
App.getInitialProps =
|
|
/** @param {import("next/app.js").AppContext} context */
|
|
async function getInitialProps(context) {
|
|
const apolloClient = createApolloClient();
|
|
const [props, { default: ReactDOMServer }, { getMarkupFromTree }] =
|
|
await Promise.all([
|
|
nextApp.default.getInitialProps(context),
|
|
import("react-dom/server"),
|
|
import("@apollo/client/react/ssr/getDataFromTree.js"),
|
|
]);
|
|
|
|
try {
|
|
await getMarkupFromTree({
|
|
tree: h(App, {
|
|
...props,
|
|
apolloClient,
|
|
router: context.router,
|
|
Component: context.Component,
|
|
}),
|
|
renderFunction: ReactDOMServer.renderToStaticMarkup,
|
|
});
|
|
} catch (error) {
|
|
console.error(error);
|
|
}
|
|
|
|
return {
|
|
...props,
|
|
apolloCache: apolloClient.cache.extract(),
|
|
};
|
|
};
|
|
|
|
export default App;
|
|
|
|
/**
|
|
* Next.js app custom props.
|
|
* @typedef {object} AppCustomProps
|
|
* @prop {import(
|
|
* "@apollo/client/cache/inmemory/types.js"
|
|
* ).NormalizedCacheObject} [apolloCache] Apollo Client initial cache.
|
|
* @prop {ApolloClient<any>} apolloClient Apollo Client.
|
|
*/
|