Add interactive GUI, PWA completeness, and secure server-side AI assistant

[Copilot]

The repo had a PWA shell (manifest, SW, CSS) but no index.html or JS — no renderable UI. CSS was also truncated mid-rule. This PR adds all missing pieces and an optional secure AI proxy.

Front-end

• index.html — business card UI using existing CSS class names; keyboard-accessible, ARIA-labelled throughout
• app.js — clipboard copy (Clipboard API + execCommand fallback), Web Share API with URL-copy fallback, dark/light theme toggle persisted to localStorage, PWA beforeinstallprompt handling
• vcard.js — generates and triggers download of a vCard 3.0 .vcf
• chat-ui.js — collapsible chat panel; ships a local FAQ fallback so it works with zero config; switches to server proxy when <meta name="chat-endpoint"> is present

Styling

• Completed truncated style.css (was cut off inside .contact-item a)
• Added: action buttons, copy buttons, toast notifications, light theme ([data-theme="light"]), chat panel + typing indicator animation

Service Worker

• Bumped cache to stacey-card-v2; added new JS assets to cache list
• Added activate handler to purge stale caches
• Navigation requests now serve cached index.html as offline fallback

Server-side AI proxy (optional)

server/netlify/functions/chat.js — serverless function that proxies to OpenAI. API key never touches the client.

// Key stays server-side only
const apiKey = process.env.OPENAI_API_KEY;
if (!apiKey) return jsonResponse(503, { error: 'AI service is not configured.' });

• Input validation (type, length), history sanitisation (role allowlist, truncation)
• In-memory rate limiting per IP (documented limitation: resets on cold start)
• CORS Access-Control-Allow-Origin driven by ALLOWED_ORIGIN env var (defaults to the GitHub Pages origin)

Config / docs

• .env.example — documents OPENAI_API_KEY, OPENAI_MODEL, ALLOWED_ORIGIN
• .gitignore — excludes .env, node_modules, build artefacts
• README.md — rewritten: local dev, GitHub Pages deploy, AI assistant wiring, env var reference

Original prompt

Create a pull request in Stacey77/RAG7 that makes the app's GUI fully interactive and adds a secure AI assistant (server-side) rather than embedding secrets in the client.

Context / Current repo state

• Repo appears to be a simple PWA business-card style app.
• Files present at repo root: manifest.json, style.css, sw.js, README.md, SECURITY.md, and .github/.
• sw.js references /rag7/index.html but no .html files are currently in the repository.
• There is no existing JS app logic beyond the service worker.

Goals

1. Add the missing index.html and required front-end assets to provide a complete, polished, interactive GUI.
2. Add front-end interactivity (copy-to-clipboard, share, download vCard, theme toggle, install prompt handling, simple form interactions).
3. Add an AI assistant feature that is secure:
   • Do not put any API keys in client code.
   • Provide a server-side endpoint that proxies requests to an LLM.
   • Provide a graceful offline / no-key fallback.
4. Keep it deployable as a GitHub Pages PWA (static site) while offering an optional server component.

Detailed Requirements

A) Front-end: index.html

• Create index.html at repo root.
• Must reference style.css and new JS (app.js).
• Render a business card UI consistent with the CSS class names already in style.css (e.g., .card-container, .business-card, .header, .content, .name, .title, .company, .contact-info, .contact-item).
• Include interactive controls:
  • Buttons/links for phone, email, website (if provided), address (maps link).
  • "Copy" actions for phone/email.
  • "Download vCard" action.
  • "Share" action using Web Share API with fallback.
  • Theme toggle.
  • AI assistant launcher button.
• Accessibility:
  • Keyboard operable controls.
  • Appropriate aria-* labels.

B) Front-end: JavaScript (app.js, vcard.js, chat-ui.js as needed)

• Implement:
  • Clipboard copy (with toast/status message).
  • Share action with fallback to copying URL.
  • vCard generation and download.
  • Theme persistence via localStorage.
  • PWA install prompt handling (listen for beforeinstallprompt and show install UI).
  • AI assistant UI:
    • A collapsible chat panel.
    • Send message, display assistant responses.
    • Calls server endpoint if configured; otherwise uses a small local FAQ fallback.
• Avoid frameworks (plain HTML/CSS/JS) unless the repo already uses one (it doesn't).

C) Server-side (optional) AI proxy

Because GitHub Pages is static, include an optional server folder with a minimal serverless-friendly endpoint:

• Add server/ with one of:
  • server/edge-function example (Cloudflare Workers), OR
  • server/netlify/functions/chat.js, OR
  • server/vercel/api/chat.ts.
    Pick one and document how to deploy it.
• Endpoint accepts { message, history } and returns { reply }.
• Integrate with a mainstream LLM provider via environment variable OPENAI_API_KEY (or similarly named), but do not hardcode.
• Include rate limiting basics and input validation.
• Return safe error messages.

D) Update PWA / Service worker

• Update sw.js cache list to include new assets (/rag7/app.js, etc.), and ensure paths work on GitHub Pages project site.
• Add cache version bump.
• Ensure fetch handler supports navigation requests (serve cached index.html as fallback for offline).

E) Fix/complete styling

• Ensure style.css is not truncated: it currently ends mid-rule (.contact-item a { ...). Complete the file so it is valid CSS.
• Add styling for:
  • buttons
  • toast notifications
  • theme toggle
  • AI chat panel

F) Documentation

• Update README.md to include:
  • How to run locally.
  • How to deploy on GitHub Pages.
  • How to enable the AI assistant server (choose provider) and set env vars.
  • Security notes about API keys.
• Add .env.example for server env vars.

Acceptance Criteria

• index.html exists and renders the card.
• All interactive features work without a build step.
• PWA is installable and works offline (at least cached shell).
• AI assistant works in "local fallback" mode by default; with optional server it can call the LLM securely.
• No secrets committed.

Notes

• Keep paths compatible with GitHub Pages project site base path /rag7/.
• If the repo name casing differs (RAG7 vs rag7), use the actual deployed base path referenced in manifest.json and sw.js (currently /rag7/).

The following is the prior conversation context from the user's chat exploration (may be truncated):

User: MAKE GUI FULLY INTERACTIVE

Assistant: I'd be happy to help make a GUI fully interactive! To assist you better, I need a bit more information:

1. Which repository is this for? (Please provide the owner and repository name, e.g., username/repo-name)

2. What GUI are you referring to? (e.g., a web interface, desktop app, mobile app, specific page or component)

3. **What would you like me to d...

This pull request was created from Copilot chat.

---

💬 Send tasks to Copilot coding agent from Slack and Teams to turn conversations into code. Copilot posts an update in your thread when it's finished.