refactor: switch from hash to browser routing

- Remove hash-based routing in favor of cleaner URLs - Add 404.html redirect for GitHub Pages client-side routing support
ligsnf · Dec 23, 2024 · f7731d4 · f7731d4
1 parent bc65b20
commit f7731d4
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 1 deletion.
diff --git a/public/404.html b/public/404.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Redirecting...</title>
+  <script>
+    // Get the current path excluding the base path
+    const path = window.location.pathname.replace('/monash-grades-calculator', '');
+    // Redirect to the base URL while preserving the path after it
+    window.location.href = '/monash-grades-calculator/' + 
+      (path.startsWith('/') ? path.slice(1) : path) + 
+      window.location.search + 
+      window.location.hash;
+  </script>
+</head>
+<body>
+  Redirecting...
+</body>
+</html>
diff --git a/src/main.tsx b/src/main.tsx
@@ -1,16 +1,20 @@
 import { StrictMode } from 'react'
 import ReactDOM from 'react-dom/client'
 import './index.css'
-import { RouterProvider, createRouter } from '@tanstack/react-router'
+import { RouterProvider, createRouter, createBrowserHistory } from '@tanstack/react-router'
 import { ThemeProvider } from "@/components/theme/theme-provider"
 
 // Import the generated route tree
 import { routeTree } from './routeTree.gen'
 
+// Create browser history
+const browserHistory = createBrowserHistory()
+
 // Create a new router instance
 const router = createRouter({ 
     routeTree,
     basepath: "/monash-grades-calculator/",
+    history: browserHistory,
 })
 
 // Register the router instance for type safety