🎨 Palette: Add loading state to demo project button

[madara88645]

💡 What: Added an isDemoLoading state in App.jsx and passed it down to GraphViewer.jsx to show a visual loading spinner on the "See a live demo" button.

🎯 Why: Previously, clicking the "See a live demo" button triggered an asynchronous fetch (to load the demo graph and AI context) without any visual feedback, leaving users wondering if their click was registered and allowing them to potentially spam-click the button.

📸 Before/After: Before, the button remained interactive and identical during the fetch. After, the button switches to a disabled state and displays a VibeGraph spinner with the text "Loading demo...".

♿ Accessibility: Enhanced the button's aria-label to announce "Loading demo project..." when active and applied disabled={isDemoLoading} to properly prevent multiple keyboard or mouse events.

---

PR created automatically by Jules for task 18117511068612470657 started by @madara88645

[google-labs-jules]

👋 Jules, reporting for duty! I'm here to lend a hand with this pull request.

When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down.

I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job!

For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with @jules. You can find this option in the Pull Request section of your global Jules UI settings. You can always switch back!

New to Jules? Learn more at jules.google/docs.

---

For security, I will only act on instructions from the user who triggered this task.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
vibegraph	Ready	Preview, Comment	Jun 26, 2026 11:10pm

[cursor]

PR Risk Assessment

Risk level: Low

Decision: Approved — no additional reviewers required.

Evidence (from diff only)

File	Change
explorer/src/App.jsx	Adds isDemoLoading state; sets true/false around existing handleLoadDemo async fetch
explorer/src/components/GraphViewer.jsx	Disables demo CTA, shows spinner + copy, updates aria-label while loading
.Jules/palette.md	Jules learning journal entry (no runtime impact)

Scope: 19 additions / 5 deletions across 3 files. Frontend-only UX improvement on the empty-state "See a live demo" button.

Risk factors considered

• Blast radius: Isolated to demo-load CTA in GraphViewer; no shared backend or API changes.
• Complexity: Straightforward React state + try/finally cleanup; easy to reason about.
• Security / auth / infra: None touched.
• User-facing surface: Minor non-core flow improvement (loading feedback + double-click prevention).
• CODEOWNERS: Sole owner is PR author (@madara88645); no separate domain expert required for this narrow UI change.

Actions taken

• ✅ Approved (Low risk — within auto-approve threshold)
• ⏭️ Reviewers: not assigned (risk below Medium; 0 reviewers currently requested)

---

Automated risk assessment by Cursor Automation

  

_{Sent by Cursor Automation: Assign PR reviewers}