From 07469dde882ceff1af599a53de4b4bbec9bf167c Mon Sep 17 00:00:00 2001
From: Sebastian Seedorf <sebastian.seedorf.ext@adevinta.com>
Date: Thu, 18 Aug 2022 13:33:50 +0200
Subject: [PATCH] Added base path

---
 components/contexts/GroupProvider.tsx | 16 ++++++++++++----
 components/home/Home.tsx              |  2 +-
 next.config.js                        |  1 +
 pages/_app.tsx                        | 10 +++++++++-
 pages/_document.tsx                   | 18 ------------------
 pages/index.tsx                       |  1 -
 6 files changed, 23 insertions(+), 25 deletions(-)
 delete mode 100644 pages/_document.tsx

diff --git a/components/contexts/GroupProvider.tsx b/components/contexts/GroupProvider.tsx
index 19066e3..eaefb84 100644
--- a/components/contexts/GroupProvider.tsx
+++ b/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,
diff --git a/components/home/Home.tsx b/components/home/Home.tsx
index 18bf378..4fabe61 100644
--- a/components/home/Home.tsx
+++ b/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>
diff --git a/next.config.js b/next.config.js
index df1ce99..f1142f3 100644
--- a/next.config.js
+++ b/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: {
diff --git a/pages/_app.tsx b/pages/_app.tsx
index 30d8431..8934ec1 100644
--- a/pages/_app.tsx
+++ b/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
diff --git a/pages/_document.tsx b/pages/_document.tsx
deleted file mode 100644
index cae57e5..0000000
--- a/pages/_document.tsx
+++ /dev/null
@@ -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
diff --git a/pages/index.tsx b/pages/index.tsx
index caf90d0..330b073 100644
--- a/pages/index.tsx
+++ b/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>