Fix production data fetching with static JSON

- Add build-time data fetching from Confluence
- Create build-data.js script to fetch and save data at build time
- Update App.tsx to use static JSON in production, API in development
- Install tsx for running TypeScript build scripts
- Configure Amplify to fetch data during build process
- Add public directory configuration to Vite

This fixes the white page error by providing data at build time instead of runtime.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

amplify.yml

@@ -6,6 +6,7 @@ frontend:
         - npm ci
     build:
       commands:
+        - npx tsx scripts/build-data.js
         - npm run build
   artifacts:
     baseDirectory: dist

package.json

@@ -28,6 +28,7 @@
     "eslint-plugin-react-refresh": "^0.4.5",
     "postcss": "^8.4.32",
     "tailwindcss": "^3.3.0",
+    "tsx": "^4.20.3",
     "typescript": "^5.2.2",
     "vite": "^5.0.8"
   }

public/filaments.json

@@ -0,0 +1,387 @@
+[
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Mistletoe Green",
+    "refill": "",
+    "vakum": "vakuum x1",
+    "otvoreno": "otvorena x1",
+    "kolicina": "2",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Indingo Purple",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "otvorena",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Black",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "2x otvorena",
+    "kolicina": "2",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Black",
+    "refill": "Da",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Jade White",
+    "refill": "",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Gray",
+    "refill": "",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Red",
+    "refill": "",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Hot Pink",
+    "refill": "",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Cocoa Brown",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "otvorena",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "White",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "otvorena",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Coton Candy Cloud",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "otvorena",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Sunflower Yellow",
+    "refill": "",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Yellow",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "otvorena",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Magenta",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "otvorena",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Beige",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "otvorena",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Cyan",
+    "refill": "",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Matte",
+    "boja": "Scarlet Red",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "otvorena",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Matte",
+    "boja": "Mandarin Orange",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "otvorena",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Matte",
+    "boja": "Marine Blue",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "otvorena",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Matte",
+    "boja": "Charcoal",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "otvorena",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Matte",
+    "boja": "Ivory White",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "otvorena",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Matte",
+    "boja": "Ivory White",
+    "refill": "Da",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Matte",
+    "boja": "Ash Gray",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "otvorena",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Cobalt Blue",
+    "refill": "Da",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Turquoise",
+    "refill": "Da",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Matte",
+    "boja": "Nardo Gray",
+    "refill": "Da",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Bright Green",
+    "refill": "Da",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Matte",
+    "boja": "Charcoal",
+    "refill": "Da",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Basic",
+    "boja": "Gold",
+    "refill": "Da",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Glow",
+    "boja": "Glow Green",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "otvorena",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "Wood",
+    "boja": "Black Walnut",
+    "refill": "",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "CF",
+    "boja": "Black",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "otvorena",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PLA",
+    "finish": "CF",
+    "boja": "Jeans Blue",
+    "refill": "",
+    "vakum": "",
+    "otvoreno": "otvorena",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "PETG",
+    "finish": "",
+    "boja": "Black",
+    "refill": "",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  },
+  {
+    "brand": "BambuLab",
+    "tip": "ABS",
+    "finish": "",
+    "boja": "Black",
+    "refill": "",
+    "vakum": "vakuum",
+    "otvoreno": "",
+    "kolicina": "",
+    "cena": ""
+  }
+]

scripts/build-data.js

@@ -0,0 +1,35 @@
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+import { fetchFromConfluence } from '../src/server/confluence.ts';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+async function buildData() {
+  try {
+    console.log('Fetching filament data from Confluence...');
+    const filaments = await fetchFromConfluence({
+      CONFLUENCE_API_URL: process.env.CONFLUENCE_API_URL,
+      CONFLUENCE_TOKEN: process.env.CONFLUENCE_TOKEN,
+      CONFLUENCE_PAGE_ID: process.env.CONFLUENCE_PAGE_ID
+    });
+    
+    // Create public directory if it doesn't exist
+    const publicDir = path.join(__dirname, '..', 'public');
+    if (!fs.existsSync(publicDir)) {
+      fs.mkdirSync(publicDir, { recursive: true });
+    }
+    
+    // Write data to public directory
+    const dataPath = path.join(publicDir, 'filaments.json');
+    fs.writeFileSync(dataPath, JSON.stringify(filaments, null, 2));
+    
+    console.log(`Successfully wrote ${filaments.length} filaments to ${dataPath}`);
+  } catch (error) {
+    console.error('Error building data:', error);
+    process.exit(1);
+  }
+}
+
+buildData();

src/App.tsx

@@ -27,7 +27,9 @@ function App() {
       setLoading(true);
       setError(null);
       
-      const response = await axios.get('/api/filaments');
+      // In development, use the API endpoint; in production, use the static JSON
+      const url = import.meta.env.DEV ? '/api/filaments' : '/filaments.json';
+      const response = await axios.get(url);
       setFilaments(response.data);
       setLastUpdate(new Date());
     } catch (err) {

vite.config.ts

@@ -11,6 +11,7 @@ export default defineConfig(({ mode }) => {
   const env = loadEnv(mode, process.cwd(), '')
   
   return {
+    publicDir: 'public',
     plugins: [
       react(),
       {