diff --git a/.claude/settings.local.json b/.claude/settings.local.json index ca4e270..8d9c603 100644 --- a/.claude/settings.local.json +++ b/.claude/settings.local.json @@ -2,7 +2,6 @@ "permissions": { "allow": [ "Bash(yarn init:*)", - "Bash(yarn add:*)", "Bash(mkdir:*)", "Bash(yarn build-plugin:*)", "Bash(rm:*)", @@ -120,7 +119,9 @@ "Bash(open http://localhost:5174/tool/translate?tab=example)", "Bash(open http://localhost:5174/tool/translate)", "Bash(GITHUB_PAGES=true yarn build)", - "Bash(gh run list:*)" + "Bash(gh run list:*)", + "Bash(npm run validate:*)", + "Bash(gh repo view:*)" ] } } \ No newline at end of file diff --git a/toolvault-frontend/playwright.config.ts b/toolvault-frontend/playwright.config.ts index 9b475c6..f984e79 100644 --- a/toolvault-frontend/playwright.config.ts +++ b/toolvault-frontend/playwright.config.ts @@ -18,7 +18,7 @@ export default defineConfig({ }, ], webServer: { - command: 'yarn preview --port 4173', + command: 'VITE_PREVIEW_MODE=true yarn preview --port 4173', url: 'http://localhost:4173', reuseExistingServer: !process.env.CI, timeout: 30 * 1000, // 30 seconds diff --git a/toolvault-frontend/public/404.html b/toolvault-frontend/public/404.html index 866ab39..634a3d0 100644 --- a/toolvault-frontend/public/404.html +++ b/toolvault-frontend/public/404.html @@ -2,21 +2,17 @@ - + ToolVault - Tool Discovery and Execution Platform
- \ No newline at end of file diff --git a/toolvault-frontend/src/App.tsx b/toolvault-frontend/src/App.tsx index 3a1d3f6..c05e5a4 100644 --- a/toolvault-frontend/src/App.tsx +++ b/toolvault-frontend/src/App.tsx @@ -7,8 +7,11 @@ import ToolBrowser from './components/ToolBrowser/ToolBrowser'; import './App.css'; function App() { + // Get the base path from Vite's configuration + const basename = import.meta.env.BASE_URL; + return ( - + } /> diff --git a/toolvault-frontend/src/main.tsx b/toolvault-frontend/src/main.tsx index d8ff0ce..f19fd31 100644 --- a/toolvault-frontend/src/main.tsx +++ b/toolvault-frontend/src/main.tsx @@ -3,6 +3,18 @@ import { createRoot } from 'react-dom/client' import './index.css' import App from './App.tsx' +// Handle GitHub Pages SPA redirect +(function() { + const redirect = sessionStorage.redirect; + delete sessionStorage.redirect; + if (redirect && redirect !== location.href) { + // Extract the path from the stored redirect URL + const redirectUrl = new URL(redirect); + const newPath = redirectUrl.pathname + redirectUrl.search + redirectUrl.hash; + history.replaceState({}, '', newPath); + } +})(); + const rootElement = document.getElementById('root'); if (!rootElement) { throw new Error('Root element not found'); diff --git a/toolvault-frontend/src/services/bundleLoader.ts b/toolvault-frontend/src/services/bundleLoader.ts index 03ba930..c5c8432 100644 --- a/toolvault-frontend/src/services/bundleLoader.ts +++ b/toolvault-frontend/src/services/bundleLoader.ts @@ -36,10 +36,15 @@ export class BundleLoader { } async loadPhase0Bundle(): Promise { - // Load the Phase 0 JavaScript bundle from the original location + // Load the Phase 0 JavaScript bundle from the correct location + const basePath = import.meta.env.BASE_URL || '/'; + const isPreviewMode = import.meta.env.VITE_PREVIEW_MODE === 'true'; + const bundlePath = import.meta.env.DEV ? '/examples/javascript-bundle/index.json' // Vite dev server can serve parent directories with fs.allow - : '/examples/javascript-bundle/index.json'; // In production, this will be bundled + : isPreviewMode + ? '/examples/javascript-bundle/index.json' // Preview mode serves from root + : `${basePath}examples/javascript-bundle/index.json`; // GitHub Pages production return this.loadBundle(bundlePath); } @@ -74,9 +79,14 @@ export class BundleLoader { } try { + const basePath = import.meta.env.BASE_URL || '/'; + const isPreviewMode = import.meta.env.VITE_PREVIEW_MODE === 'true'; + const historyPath = import.meta.env.DEV ? '/examples/javascript-bundle/history.json' - : '/examples/javascript-bundle/history.json'; + : isPreviewMode + ? '/examples/javascript-bundle/history.json' // Preview mode serves from root + : `${basePath}examples/javascript-bundle/history.json`; // GitHub Pages production const response = await fetch(historyPath); if (!response.ok) { diff --git a/toolvault-frontend/src/services/scriptLoader.ts b/toolvault-frontend/src/services/scriptLoader.ts index 530d75e..359560d 100644 --- a/toolvault-frontend/src/services/scriptLoader.ts +++ b/toolvault-frontend/src/services/scriptLoader.ts @@ -71,9 +71,14 @@ export class ScriptLoader { return new Promise((resolve, reject) => { // Determine script path based on tool category const category = this.getToolCategory(toolMetadata); + const basePath = import.meta.env.BASE_URL || '/'; + const isPreviewMode = import.meta.env.VITE_PREVIEW_MODE === 'true'; + const scriptPath = import.meta.env.DEV ? `/examples/javascript-bundle/tools/${category}/${toolMetadata.id}.js` // Vite dev server can serve parent directories with fs.allow - : `/examples/javascript-bundle/tools/${category}/${toolMetadata.id}.js`; // In production, this will be bundled + : isPreviewMode + ? `/examples/javascript-bundle/tools/${category}/${toolMetadata.id}.js` // Preview mode serves from root + : `${basePath}examples/javascript-bundle/tools/${category}/${toolMetadata.id}.js`; // GitHub Pages production // Create script element const script = document.createElement('script');