Set Up Feedback

Follow this path from an empty workspace to a verified issue and feature request. The full API contract is in Feedback.

Generate and securely store the project key

Generate the key

Open Settings → API Key, select Generate Key, and copy the raw value immediately.

Store the key

Put it in the server environment used by the generated integration.

AIOLA_KEY=aio_<48-hex-characters>

Configure issue and feature schemas

Open Settings → Feedback. In Forms, configure Issue and Feature Request separately and select Save; then use Get code on the same page. The defaults and all seven field types are listed in Feedback. The default Issue form requires title, email, device, and description; attachment and url are optional. The default Feature Request form requires title and description; attachment and url are optional. You can change these fields and their required status in Settings → Feedback → Forms; payloads must match the saved schema.

Field-key generation and single-use field constraints

Keys are generated from labels: lowercase, replace non-alphanumeric runs with _, trim _, and use field when empty. Duplicate keys become <key>_2, <key>_3, and later suffixes. Each form permits only one email, one url, and one attachment field.

Choose Next.js, React, Python, or raw HTTP

The app offers exactly Next.js, React, and Python in Get code. Raw HTTP is the no-UI/custom-sender path.

Exact endpoint/auth/payload

POST https://lhrsgoaselmgophvbqme.supabase.co/functions/v1/submit-feedback
Authorization: Bearer <project-key>
Content-Type: application/json

{ "type": "issue", "title": "Checkout fails", "email": "you@example.com", "device": "macOS - Intel", "description": "Submit returns an error" }

Current generated files and code blocks

Next.js
React
Python
Raw HTTP

Create components/report-dialog.tsx and components/feature-request-dialog.tsx from the schema-specific component output, plus this generated proxy at app/api/report/route.ts:

import { NextRequest, NextResponse } from "next/server"
const FEEDBACK_URL = "https://lhrsgoaselmgophvbqme.supabase.co/functions/v1/submit-feedback"
export const config = { api: { bodyParser: { sizeLimit: "10mb" } } }
export async function POST(req: NextRequest) {
  const body = await req.json()
  const res = await fetch(FEEDBACK_URL, { method: "POST", headers: { "Authorization": `Bearer ${process.env.AIOLA_KEY}`, "Content-Type": "application/json" }, body: JSON.stringify(body) })
  if (!res.ok) return NextResponse.json(await res.json().catch(() => ({})), { status: res.status })
  return NextResponse.json({ success: true })
}

The generated dialogs post to /api/report; React does not generate a key-bearing backend. Add this Express proxy and keep AIOLA_KEY only on the server:

npm install express

// server.js — Node.js 18 or newer
const express = require("express")

const app = express()
app.use(express.json({ limit: "5mb" }))
app.post("/api/report", async (req, res) => {
  const upstream = await fetch("https://lhrsgoaselmgophvbqme.supabase.co/functions/v1/submit-feedback", {
    method: "POST",
    headers: { Authorization: `Bearer ${process.env.AIOLA_KEY}`, "Content-Type": "application/json" },
    body: JSON.stringify(req.body),
  })
  const body = await upstream.json().catch(() => ({}))
  res.status(upstream.status).json(body)
})
app.listen(3001)

node server.js

Configure the React development server or production reverse proxy to forward /api/report to this server. The generated src/api/feedback.ts is:

const FEEDBACK_URL = "/api/report" // proxy through your backend
export async function submitFeedback(type: "issue" | "feature_request", data: Record<string, unknown>) {
  const res = await fetch(FEEDBACK_URL, { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ type, ...data }) })
  if (!res.ok) throw new Error("Feedback submission failed")
  return res.json()
}

The generator produces templates/feedback_issue.html and templates/feedback_feature_request.html; both submit multipart/form-data to /feedback. Install the server dependencies:

pip install Flask requests

Add this complete Flask route as feedback_api.py:

import base64
import os

import requests
from flask import Flask, redirect, render_template, request

app = Flask(__name__)
FEEDBACK_URL = "https://lhrsgoaselmgophvbqme.supabase.co/functions/v1/submit-feedback"
AIOLA_KEY = os.environ["AIOLA_KEY"]

def submit_feedback(feedback_type: str, data: dict) -> dict:
    res = requests.post(FEEDBACK_URL, headers={"Authorization": f"Bearer {AIOLA_KEY}", "Content-Type": "application/json"}, json={"type": feedback_type, **data})
    res.raise_for_status()
    return res.json()

@app.get("/feedback/<feedback_type>")
def feedback_form(feedback_type: str):
    template = "feedback_feature_request.html" if feedback_type == "feature_request" else "feedback_issue.html"
    return render_template(template)

@app.post("/feedback")
def feedback_submit():
    data = request.form.to_dict()
    feedback_type = data.pop("type", "issue")
    for field, upload in request.files.items():
        if upload.filename:
            encoded = base64.b64encode(upload.read()).decode("ascii")
            data[field] = [f"data:{upload.mimetype};base64,{encoded}"]
    submit_feedback(feedback_type, data)
    return redirect(f"/feedback/{feedback_type}", code=303)

if __name__ == "__main__":
    app.run(debug=True)

curl -X POST https://lhrsgoaselmgophvbqme.supabase.co/functions/v1/submit-feedback \
  -H "Authorization: Bearer $AIOLA_KEY" \
  -H "Content-Type: application/json" \
  -d '{"type":"issue","title":"Short summary","email":"you@example.com","device":"macOS - Intel","description":"What happened, in the user own words","attachment":["data:image/png;base64,iVBORw0KGgo..."],"url":"https://example.com/page","app_version":"1.4.2","trigger":"uninstall-page"}'

Attachment conversion and limits

Generated browser components accept PNG/JPEG/WebP, keep five files, resize the longest side to 1,024 px, and encode JPEG at quality 0.75. Server limits are listed in Feedback.

Server-side validation and rate limits

Read the exact body, field, attachment, subscription, and rate rules in Feedback; do not add client assumptions beyond them.

Error/status handling

Status	Meaning
`400`	Invalid JSON or configured fields
`401`	Missing/invalid key
`402`	Subscription required
`405`	Method not allowed
`413`	Body above 5 MiB
`429`	IP or project-key rate limit

Verification in project and central views

Send both types

Submit one issue and one feature_request from the deployed path.

Verify workspace

Open Feedback, find both records, and change a status.

Verify Central

Open Central → Feedback and confirm the same records show their project name.

Key rotation procedure

Regenerate in Settings → API Key, copy the new value once, update every backend/deployment secret, redeploy, and repeat verification. The previous key stops working immediately.

Getting Started

Workspaces & Central

Chat & AI

Project Operations

Monitoring

Connections

Settings

Setup Guides

Reference

Set Up Feedback

Generate and securely store the project key

Configure issue and feature schemas

Field-key generation and single-use field constraints

Choose Next.js, React, Python, or raw HTTP

Exact endpoint/auth/payload

Current generated files and code blocks

Attachment conversion and limits

Server-side validation and rate limits

Error/status handling

Verification in project and central views

Key rotation procedure

​Generate and securely store the project key

​Configure issue and feature schemas

​Field-key generation and single-use field constraints

​Choose Next.js, React, Python, or raw HTTP

​Exact endpoint/auth/payload

​Current generated files and code blocks

​Attachment conversion and limits

​Server-side validation and rate limits

​Error/status handling

​Verification in project and central views

​Key rotation procedure

Generate and securely store the project key

Configure issue and feature schemas

Field-key generation and single-use field constraints

Choose Next.js, React, Python, or raw HTTP

Exact endpoint/auth/payload

Current generated files and code blocks

Attachment conversion and limits

Server-side validation and rate limits

Error/status handling

Verification in project and central views

Key rotation procedure