getaura 0.4.0 → 0.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "getaura",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "Aura helps you and your coding agent follow best practices while you vibe code.",
   "type": "module",
   "bin": {

package/templates/guides/security-headers.md

@@ -0,0 +1,58 @@
+---
+title: Add security headers to a single-page app
+summary: Where a Vite app (Lovable, Bolt, v0) sets security headers on Vercel, Netlify, Cloudflare Pages and Lovable's own hosting.
+services: [vercel]
+---
+
+# Add security headers to a single-page app
+
+Security headers tell browsers to block common attacks: loading your site over plain HTTP, embedding it in another site to trick people into clicking (clickjacking), guessing file types, and leaking full addresses to other sites. A single-page app made with Vite (Lovable, Bolt, v0) can't send them itself: whoever hosts it does. This takes about ten minutes.
+
+Run `aura apply add-security-headers` first. When Aura can tell where the app is hosted, it adds the headers for you in a pull request. Otherwise, follow the section for your host.
+
+## Vercel
+
+Add a `vercel.json` file at the top of the repo (or add `headers` to the one you have):
+
+```json
+{
+  "headers": [
+    {
+      "source": "/(.*)",
+      "headers": [
+        { "key": "Strict-Transport-Security", "value": "max-age=63072000" },
+        { "key": "X-Content-Type-Options", "value": "nosniff" },
+        { "key": "X-Frame-Options", "value": "DENY" },
+        { "key": "Referrer-Policy", "value": "strict-origin-when-cross-origin" },
+        { "key": "Permissions-Policy", "value": "camera=(), microphone=(), geolocation=()" }
+      ]
+    }
+  ]
+}
+```
+
+## Netlify or Cloudflare Pages
+
+Add a file called `_headers` (no extension) in the `public/` folder:
+
+```text
+/*
+  Strict-Transport-Security: max-age=63072000
+  X-Content-Type-Options: nosniff
+  X-Frame-Options: DENY
+  Referrer-Policy: strict-origin-when-cross-origin
+  Permissions-Policy: camera=(), microphone=(), geolocation=()
+```
+
+## Lovable's hosting
+
+Lovable's own hosting doesn't let an app set its own headers yet. You have two options:
+
+1. Publish the app on Vercel or Netlify instead. Connect the GitHub repo there; Lovable keeps working on the same repo. Then follow the section above.
+2. Keep Lovable's hosting and put Cloudflare in front of your custom domain, then add the headers with a Cloudflare **Transform Rule** (**Rules**, then **Transform Rules**, then **Modify Response Header**).
+
+## Check it worked
+
+After the next deploy, open your site, then open the browser's developer tools (**Network** tab), reload, click the first request and look under **Response Headers**. You should see the five headers above.
+
+Aura only reads your files. It never changes your hosting settings or deploys.

package/templates/vite/ErrorBoundary.tsx

@@ -0,0 +1,32 @@
+import { Component, type ErrorInfo, type ReactNode } from "react";
+
+// Shown when something in the app breaks while drawing the screen, instead of a blank white page.
+// Visitors never see the technical details: they go to the browser console for whoever is debugging.
+
+type Props = { children: ReactNode };
+type State = { failed: boolean };
+
+export default class ErrorBoundary extends Component<Props, State> {
+  state: State = { failed: false };
+
+  static getDerivedStateFromError(): State {
+    return { failed: true };
+  }
+
+  componentDidCatch(error: Error, info: ErrorInfo) {
+    console.error("The app crashed while drawing the screen", error, info.componentStack);
+  }
+
+  render() {
+    if (!this.state.failed) return this.props.children;
+    return (
+      <main className="aura-page">
+        <h1 className="aura-title">Something went wrong</h1>
+        <p className="aura-text">Sorry, this page didn’t load. Please try again. If it keeps happening, come back in a few minutes.</p>
+        <button type="button" onClick={() => window.location.reload()} className="aura-button">
+          Reload the page
+        </button>
+      </main>
+    );
+  }
+}

package/templates/vite/NotFound.tsx

@@ -0,0 +1,15 @@
+import { Link } from "react-router-dom";
+
+// Shown for any address the app doesn't know, so a mistyped or old link still leads somewhere.
+
+export default function NotFound() {
+  return (
+    <main className="aura-page">
+      <h1 className="aura-title">Page not found</h1>
+      <p className="aura-text">There’s nothing at this address. It may have moved, or the link may be mistyped.</p>
+      <Link to="/" className="aura-link">
+        Go to the home page
+      </Link>
+    </main>
+  );
+}