Added base path

components/contexts/GroupProvider.tsx

@@ -9,6 +9,7 @@ import {
   GroupSetFactoryArrayBody,
   SetFactoryArrayBody
 } from '../../src/types/ApiSchemasFrontend'
+import {NextRouter, useRouter} from 'next/router'
 
 interface Props {
   children: ReactNodeLike
@@ -91,8 +92,8 @@ interface StoredFile {
   excludedSuggestions: string[]
 }
 
-export const postFetchJson = async (url: string, body: unknown) => {
-  const res = await fetch(url, {
+export const postFetchJson = async (router: NextRouter, url: string, body: unknown) => {
+  const res = await fetch(router.basePath+url, {
     method: 'POST',
     headers: {
       'Content-Type': 'application/json'
@@ -103,6 +104,7 @@ export const postFetchJson = async (url: string, body: unknown) => {
 }
 
 export const GroupProvider: FC<Props> = ({ children, id, initial }) => {
+  const router = useRouter()
   const [excludedSuggestions, _setExcludedSuggestions] = useState<string[]>(initial.ignored)
   const [basicValues, _setBasicValues] = useState<string[]>(initial.base)
   const [groups, setGroups] = useState<Dict<Group>>(initial.groups)
@@ -122,7 +124,7 @@ export const GroupProvider: FC<Props> = ({ children, id, initial }) => {
   const setExcludedSuggestions = useCallback<typeof _setExcludedSuggestions>(
     val => {
       _setExcludedSuggestions(val)
-      postFetchJson(`/api/${fixedEncodeURIComponent(id)}/factories`, {
+      postFetchJson(router, `/api/${fixedEncodeURIComponent(id)}/factories`, {
         type: 'ignored',
         factories: val
       } as SetFactoryArrayBody).catch(console.error)
@@ -133,7 +135,7 @@ export const GroupProvider: FC<Props> = ({ children, id, initial }) => {
   const setBasicValues = useCallback<typeof _setBasicValues>(
     val => {
       _setBasicValues(val)
-      postFetchJson(`/api/${fixedEncodeURIComponent(id)}/factories`, {
+      postFetchJson(router, `/api/${fixedEncodeURIComponent(id)}/factories`, {
         type: 'base',
         factories: val
       } as SetFactoryArrayBody).catch(console.error)
@@ -151,11 +153,13 @@ export const GroupProvider: FC<Props> = ({ children, id, initial }) => {
       })
       ;(async () => {
         await postFetchJson(
+          router,
           `/api/${fixedEncodeURIComponent(id)}/group/${fixedEncodeURIComponent(name)}/add`,
           {}
         )
         if (exports.length) {
           await postFetchJson(
+            router,
             `/api/${fixedEncodeURIComponent(id)}/group/${fixedEncodeURIComponent(name)}/factories`,
             {
               type: 'exports',
@@ -165,6 +169,7 @@ export const GroupProvider: FC<Props> = ({ children, id, initial }) => {
         }
         if (malls.length) {
           await postFetchJson(
+            router,
             `/api/${fixedEncodeURIComponent(id)}/group/${fixedEncodeURIComponent(name)}/factories`,
             {
               type: 'malls',
@@ -185,6 +190,7 @@ export const GroupProvider: FC<Props> = ({ children, id, initial }) => {
         return { ...g }
       })
       postFetchJson(
+        router,
         `/api/${fixedEncodeURIComponent(id)}/group/${fixedEncodeURIComponent(name)}/remove`,
         {}
       ).catch(console.error)
@@ -202,6 +208,7 @@ export const GroupProvider: FC<Props> = ({ children, id, initial }) => {
         return { ...g }
       })
       postFetchJson(
+        router,
         `/api/${fixedEncodeURIComponent(id)}/group/${fixedEncodeURIComponent(name)}/rename`,
         {
           newName
@@ -219,6 +226,7 @@ export const GroupProvider: FC<Props> = ({ children, id, initial }) => {
         return { ...g }
       })
       postFetchJson(
+        router,
         `/api/${fixedEncodeURIComponent(id)}/group/${fixedEncodeURIComponent(name)}/factories`,
         {
           type,

components/home/Home.tsx

@@ -50,7 +50,7 @@ export const Home: FC = () => {
         Store
       </button>
       <button
-        onClick={() => postFetchJson(`/api/${router.query.id}/upload`, { groups, ignored: ignoredFactories, base: baseFactories } as UploadDataBody)}
+        onClick={() => postFetchJson(router, `/api/${router.query.id}/upload`, { groups, ignored: ignoredFactories, base: baseFactories } as UploadDataBody)}
       >
         Upload
       </button>

next.config.js

@@ -4,6 +4,7 @@ const isBuildStage = envVar.get('IS_BUILD_STAGE').default('false').asBool()
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   reactStrictMode: true,
+  basePath: '/factorio',
   swcMinify: true,
   /** @type {import('next/config').ServerRuntimeConfig} */
   serverRuntimeConfig: {

pages/_app.tsx

@@ -1,9 +1,17 @@
 import '../styles/globals.css'
 import type { AppProps } from 'next/app'
 import { FC } from 'react'
+import Head from 'next/head'
+import {useRouter} from 'next/router'
 
 const MyApp: FC<AppProps> = ({ Component, pageProps }) => {
-  return <Component {...pageProps} />
+  const router = useRouter()
+  return <>
+    <Head>
+      <link rel='icon' href={`${router.basePath}/favicon.ico`} />
+    </Head>
+    <Component {...pageProps} />
+  </>
 }
 
 export default MyApp

pages/_document.tsx

@@ -1,18 +0,0 @@
-import { Html, Main, NextScript, DocumentProps, Head } from 'next/document'
-import { FC } from 'react'
-import Dict = NodeJS.Dict
-
-const MyDocument: FC<DocumentProps> = ({ __NEXT_DATA__ }) => {
-  const pageProps: Dict<unknown> | undefined = __NEXT_DATA__?.props?.pageProps
-  return (
-    <Html>
-      <Head />
-      <body className={pageProps?.bodyClassName as string}>
-        <Main />
-        <NextScript />
-      </body>
-    </Html>
-  )
-}
-
-export default MyDocument

pages/index.tsx

@@ -10,7 +10,6 @@ const Page: NextPage<PropsGroupProvider> = ({ id, ...initial }) => {
       <Head>
         <title>Factorio Microservices</title>
         <meta name='description' content='Create Factorio microservices' />
-        <link rel='icon' href='/favicon.ico' />
       </Head>
       <Home />
     </GroupProvider>