diff --git a/client/.env b/client/.env index e69de29..2d1bf5f 100644 --- a/client/.env +++ b/client/.env @@ -0,0 +1 @@ +VITE_API_BASE_URL= \ No newline at end of file diff --git a/client/.storybook/main.js b/client/.storybook/main.js index 4acfaf0..b7f27e9 100644 --- a/client/.storybook/main.js +++ b/client/.storybook/main.js @@ -1,6 +1,6 @@ - - /** @type { import('@storybook/react-vite').StorybookConfig } */ +import { mergeConfig } from 'vite'; + const config = { "stories": [ "../src/**/*.mdx", @@ -12,6 +12,23 @@ const config = { "@storybook/addon-a11y", "@storybook/addon-docs" ], - "framework": "@storybook/react-vite" + "framework": "@storybook/react-vite", + + // --- ADDED THE PROXY INJECTION HERE --- + async viteFinal(config) { + return mergeConfig(config, { + server: { + proxy: { + '/api': { + target: 'http://vdap.org:8082', + changeOrigin: true, + secure: false, + }, + }, + }, + }); + }, + // -------------------------------------- }; + export default config; \ No newline at end of file diff --git a/client/src/components/Widgets/VaaActivity7Day.stories.jsx b/client/src/components/Widgets/VaaActivity7Day.stories.jsx index ae00c40..9f1b698 100644 --- a/client/src/components/Widgets/VaaActivity7Day.stories.jsx +++ b/client/src/components/Widgets/VaaActivity7Day.stories.jsx @@ -35,7 +35,7 @@ export const Populated = { msw: { handlers: [ // Intercept the exact URL your component is trying to fetch - http.get('*/api/v2/dvar_vaa', () => { + http.get('*/api/v2/comm_coor_vaa', () => { // Return a 200 OK with the mock JSON return HttpResponse.json(mockData); }), @@ -49,7 +49,7 @@ export const ServerCrash = { parameters: { msw: { handlers: [ - http.get('*/api/v2/dvar_vaa', () => { + http.get('*/api/v2/comm_coor_vaa', () => { // Return a 500 Error return new HttpResponse(null, { status: 500 }); }), @@ -63,7 +63,7 @@ export const EmptyData = { parameters: { msw: { handlers: [ - http.get('*/api/v2/dvar_vaa', () => { + http.get('*/api/v2/comm_coor_vaa', () => { return HttpResponse.json([]); }), ], diff --git a/client/src/hooks/useVdapApi.js b/client/src/hooks/useVdapApi.js index c486b31..ed369db 100644 --- a/client/src/hooks/useVdapApi.js +++ b/client/src/hooks/useVdapApi.js @@ -11,10 +11,13 @@ export default function useWidgetApi(endpoint) { setError(null); try { - const baseUrl = import.meta.env.VITE_API_BASE_URL || 'http://web-api:8000'; - // Strip leading slashes to prevent double slashes in the URL - const cleanEndpoint = endpoint.startsWith('/') ? endpoint.slice(1) : endpoint; - const url = `${baseUrl}/${cleanEndpoint}`; + // CHANGED: Fallback is now an empty string. + const baseUrl = import.meta.env.VITE_API_BASE_URL || ''; + + // CHANGED: Ensure the endpoint always starts with a slash + // so it resolves perfectly as a relative path to the root domain. + const cleanEndpoint = endpoint.startsWith('/') ? endpoint : `/${endpoint}`; + const url = `${baseUrl}${cleanEndpoint}`; const response = await fetch(url); @@ -37,7 +40,7 @@ export default function useWidgetApi(endpoint) { if (endpoint) { fetchData(); } - }, [endpoint]); // Re-fetch if the endpoint changes + }, [endpoint]); return { data, isLoading, error }; } \ No newline at end of file diff --git a/client/vite.config.js b/client/vite.config.js index 5757f5b..95d0a2e 100644 --- a/client/vite.config.js +++ b/client/vite.config.js @@ -13,15 +13,28 @@ const dirname = typeof __dirname !== 'undefined' ? __dirname : path.dirname(file // More info at: https://storybook.js.org/docs/next/writing-tests/integrations/vitest-addon export default defineConfig({ plugins: [react(), jsconfigPaths()], + + // --- ADDED THE SERVER PROXY HERE --- + server: { + proxy: { + '/api': { + target: 'http://vdap.org:8082', // The remote internet API + changeOrigin: true, // Tricks the remote server into accepting the request + secure: false, // Set to true later when you upgrade to HTTPS + }, + }, + }, + // ----------------------------------- + test: { projects: [{ extends: true, plugins: [ - // The plugin will run tests for the stories defined in your Storybook config - // See options at: https://storybook.js.org/docs/next/writing-tests/integrations/vitest-addon#storybooktest - storybookTest({ - configDir: path.join(dirname, '.storybook') - })], + // The plugin will run tests for the stories defined in your Storybook config + // See options at: https://storybook.js.org/docs/next/writing-tests/integrations/vitest-addon#storybooktest + storybookTest({ + configDir: path.join(dirname, '.storybook') + })], test: { name: 'storybook', browser: {