base

HGZdev · Aug 26, 2024 · 1f532de · 1f532de
1 parent 04534e7
commit 1f532de
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 14 deletions.
diff --git a/build/index.html b/build/index.html
@@ -4,8 +4,8 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Vite + React + TS</title>
-    <script type="module" crossorigin src="/assets/index-DPXrw42T.js"></script>
-    <link rel="stylesheet" crossorigin href="/assets/index-xP7HRqhF.css">
+    <script type="module" crossorigin src="/tablet-weaving-editor/assets/index-CFIm4IPL.js"></script>
+    <link rel="stylesheet" crossorigin href="/tablet-weaving-editor/assets/index-xP7HRqhF.css">
   </head>
   <body>
     <div id="root"></div>

diff --git a/src/client/Pages/Public/LandingPage.tsx b/src/client/Pages/Public/LandingPage.tsx
@@ -6,6 +6,7 @@ import {
   // ButtonSecondary,
 } from "../../Components/Buttons";
 import styled from "styled-components";
+const VITE_BASE_URL = import.meta.env.VITE_BASE_URL;
 
 const Container = styled.div`
   ::before {
@@ -15,7 +16,7 @@ const Container = styled.div`
     left: 0;
     width: 100%;
     height: 100%;
-    background-image: url("/images/pexels-karolina-grabowska-4219654.jpg");
+    background-image: url(${VITE_BASE_URL}images/pexels-karolina-grabowska-4219654.jpg);
     background-size: cover;
     background-position: center;
     background-repeat: no-repeat;
@@ -39,21 +40,21 @@ const LandingPage: React.FC = () => {
         <div className="flex justify-center gap-4">
           <ButtonPrimary
             className=""
-            onClick={() => navigate("/editor")}
+            onClick={() => navigate("/tablet-weaving-editor/editor")}
             aria-label="Editor"
           >
             Create new pattern
           </ButtonPrimary>
           {/* <ButtonSecondary
             className=""
-            onClick={() => navigate("/templates")}
+            onClick={() => navigate("/tablet-weaving-editor/templates")}
             aria-label="Templates"
           >
             Use template
           </ButtonSecondary>
           <ButtonAccent
             className=""
-            onClick={() => navigate("/gallery")}
+            onClick={() => navigate("/tablet-weaving-editor/gallery")}
             aria-label="Gallery"
           >
             Load your pattern

diff --git a/src/client/Root.tsx b/src/client/Root.tsx
@@ -13,16 +13,20 @@ import {makeApolloProvider} from "../../lib/apollo/ApolloClient.tsx";
 import GlobalStyles from "../styles/GlobalStyles.ts";
 import Editor from "./Pages/Public/Editor/Editor.tsx";
 import {DraftProvider} from "./Pages/Public/Editor/DraftContext/DraftContextProvider.tsx";
+const VITE_BASE_URL = import.meta.env.VITE_BASE_URL;
 
 export const ApolloProvider = makeApolloProvider(import.meta.env);
 
 export const RoutesConfig = (
   <>
-    <Route path="/" element={<LandingPage />} errorElement={<ErrorPage />} />
-    <Route path="/editor" element={<Editor />} />
-    {/* <Route path="/templates" element={<Templates />} /> */}
-    {/* <Route path="/" element={<PublicRoute Component={LandingPage} />} errorElement={<ErrorPage />}/> */}
-    {/* <Route path="/gallery" element={<PrivateRoute Component={Gallery} />} /> */}
+    <Route
+      path={`${VITE_BASE_URL}`}
+      element={<LandingPage />}
+      errorElement={<ErrorPage />}
+    />
+    <Route path={`${VITE_BASE_URL}editor`} element={<Editor />} />
+    {/* <Route path={`${VITE_BASE_URL}templates`} element={<Templates />} /> */}
+    {/* <Route path={`${VITE_BASE_URL}gallery`} element={<PrivateRoute Component={Gallery} />} /> */}
     <Route path="*" element={<ErrorPage />} />
   </>
 );
@@ -41,7 +45,6 @@ const Root: React.FC = () => {
       <ApolloProvider>
         <DraftProvider>
           <GlobalStyles />
-
           <RouterProvider router={router} future={{v7_startTransition: true}} />
         </DraftProvider>
       </ApolloProvider>

diff --git a/vite.config.ts b/vite.config.ts
@@ -5,10 +5,11 @@ import {visualizer} from "rollup-plugin-visualizer";
 import type {PluginOption} from "vite";
 
 export default ({mode}) => {
-  const {VITE_LOCAL_PORT, VITE_LOCAL_SERVER_PORT} = getViteConfig(mode);
+  const {VITE_BASE_URL, VITE_LOCAL_PORT, VITE_LOCAL_SERVER_PORT} =
+    getViteConfig(mode);
 
   return defineConfig({
-    // base: "/tablet-weaving-editor/",
+    base: VITE_BASE_URL,
     plugins: [
       react(),
       visualizer({