chore(buddybook): support base URL

waku-org · Nov 2, 2024 · 7faa598 · 7faa598
1 parent 9050ca9
commit 7faa598
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 17 deletions.
diff --git a/examples/buddybook/index.html b/examples/buddybook/index.html
@@ -2,11 +2,11 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
-    <link rel="icon" type="image/png" href="/favicon.png" />
+    <link rel="icon" type="image/svg+xml" href="/buddybook/favicon.svg" />
+    <link rel="icon" type="image/png" href="/buddybook/favicon.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>BuddyBook Dogfood</title>
-    <base href="/" />
+    <base href="/buddybook/" />
     <script>
       window.global = window;
       window.process = {

diff --git a/examples/buddybook/src/App.tsx b/examples/buddybook/src/App.tsx
@@ -130,11 +130,11 @@ function App() {
       <Header wakuStatus={wakuStatus} />
       <main className="container mx-auto px-4 py-4 md:py-8 max-w-7xl">
         <Routes>
-          <Route path="/create" element={<ChainCreationForm />} />
-          <Route path="/view" element={<ChainList chainsData={chainsData} onChainUpdate={handleChainUpdate} isLoading={isLoadingChains} />} />
-          <Route path="/" element={<Home />} />
+          <Route path="create" element={<ChainCreationForm />} />
+          <Route path="view" element={<ChainList chainsData={chainsData} onChainUpdate={handleChainUpdate} isLoading={isLoadingChains} />} />
+          <Route path="" element={<Home />} />
           <Route 
-            path="/sign/:chainUUID/:blockUUID" 
+            path="sign/:chainUUID/:blockUUID"
             element={
               <SignSharedChain 
                 chainsData={chainsData} 
@@ -143,8 +143,8 @@ function App() {
               />
             } 
           />
-          <Route path="/telemetry" element={<TelemetryPage />} />
-          <Route path="*" element={<Navigate to="/" replace />} />
+          <Route path="telemetry" element={<TelemetryPage />} />
+          <Route path="*" element={<Navigate to="" replace />} />
         </Routes>
       </main>
     </div>
@@ -155,7 +155,7 @@ const Home: React.FC = () => (
   <div className="space-y-4 md:space-y-6 p-4 md:p-6">
     <h1 className="text-2xl md:text-4xl font-bold">BuddyBook</h1>
     <div className="w-full max-w-sm mx-auto p-4 md:p-6 bg-card rounded-lg shadow-md">
-      <Link to="/create">
+      <Link to="create">
         <Button className="w-full mb-4">
           Create New Chain
         </Button>

diff --git a/examples/buddybook/src/components/Header.tsx b/examples/buddybook/src/components/Header.tsx
@@ -57,32 +57,32 @@ const Header: React.FC<HeaderProps> = ({ wakuStatus }) => {
 
   return (
     <header className="border-b">
-      <div className="container mx-auto px-4 py-2 md:py-4">
+      <div className="container mx-auto px-4 py-4">
         <div className="flex flex-col md:flex-row justify-between items-center space-y-2 md:space-y-0">
           <div className="flex flex-col md:flex-row items-center space-y-2 md:space-y-0 md:space-x-4 w-full md:w-auto">
             <h1 className="text-xl md:text-2xl font-bold">BuddyBook</h1>
             <nav className="w-full md:w-auto">
               <ul className="flex justify-center md:justify-start space-x-4">
                 <li>
                   <Link 
-                    to="/create" 
-                    className={`text-sm ${location.pathname === '/create' ? 'text-primary font-semibold' : 'text-muted-foreground'}`}
+                    to="create"
+                    className={`text-sm ${location.pathname.endsWith('/create') ? 'text-primary font-semibold' : 'text-muted-foreground'}`}
                   >
                     Create Chain
                   </Link>
                 </li>
                 <li>
                   <Link 
-                    to="/view" 
-                    className={`text-sm ${location.pathname === '/view' ? 'text-primary font-semibold' : 'text-muted-foreground'}`}
+                    to="view"
+                    className={`text-sm ${location.pathname.endsWith('/view') ? 'text-primary font-semibold' : 'text-muted-foreground'}`}
                   >
                     View Chains
                   </Link>
                 </li>
                 <li>
                   <Link 
-                    to="/telemetry" 
-                    className={`text-sm ${location.pathname === '/telemetry' ? 'text-primary font-semibold' : 'text-muted-foreground'}`}
+                    to="telemetry"
+                    className={`text-sm ${location.pathname.endsWith('/telemetry') ? 'text-primary font-semibold' : 'text-muted-foreground'}`}
                   >
                     Telemetry
                   </Link>

diff --git a/examples/buddybook/vite.config.ts b/examples/buddybook/vite.config.ts
@@ -6,6 +6,7 @@ export default defineConfig(({ mode }) => {
   const env = loadEnv(mode, process.cwd(), '')
 
   return {
+    base: '/buddybook/',
     plugins: [
       react(),
       {