Replace redirect flow with inline submit via Cloudflare Worker

The previous flow took users off the page to a GitHub issue form.
Now everything happens in the background:

1. User pastes URL, clicks Request
2. Frontend POSTs to /api/request (Cloudflare Worker)
3. Worker creates the GitHub issue (triggers auto-add pipeline)
4. User sees inline success message with their docs link

Changes:
- Add worker/ with Cloudflare Worker that proxies to GitHub Issues API
- Rewrite frontend JS to use fetch() with loading/success/error states
- Remove nav "Request a Repo" button (the inline form is the entry point)
- Remove .request-btn CSS, add .submit-feedback state classes

Worker deployment:
  cd worker && npx wrangler secret put GITHUB_TOKEN
  npx wrangler deploy

Route repos.supermodeltools.com/api/* to the worker in Cloudflare.

Author: jonathanpopham

generate-index.go

@@ -196,18 +196,6 @@ a:focus-visible { outline: 2px solid var(--accent-light); outline-offset: 2px; b
 .site-nav { display: flex; gap: 16px; align-items: center; }
 .site-nav a { color: var(--text-muted); font-size: 14px; font-weight: 500; white-space: nowrap; }
 .site-nav a:hover { color: var(--text); text-decoration: none; }
-.request-btn {
-  color: var(--accent-light) !important;
-  border: 1px solid var(--accent);
-  border-radius: var(--radius);
-  padding: 6px 12px;
-  transition: background 0.2s, color 0.2s;
-}
-.request-btn:hover {
-  background: var(--accent);
-  color: #fff !important;
-  text-decoration: none !important;
-}
 .hero {
   padding: 64px 0 48px;
   text-align: center;
@@ -395,14 +383,21 @@ a:focus-visible { outline: 2px solid var(--accent-light); outline-offset: 2px; b
   pointer-events: auto;
 }
 .submit-btn.active:hover { background: var(--accent-light); }
-.submit-preview {
-  margin-top: 8px;
+.submit-btn.loading {
+  opacity: 0.6;
+  pointer-events: none;
+}
+.submit-feedback {
+  margin-top: 10px;
   font-size: 13px;
-  color: var(--green);
   font-family: var(--mono);
   display: none;
 }
-.submit-preview.visible { display: block; }
+.submit-feedback.visible { display: block; }
+.submit-feedback.preview { color: var(--text-muted); }
+.submit-feedback.success { color: var(--green); }
+.submit-feedback.success a { color: var(--green); text-decoration: underline; }
+.submit-feedback.error { color: var(--red); }
 @media (max-width: 768px) {
   .container { padding: 0 16px; }
   .hero { padding: 40px 0 32px; }
@@ -432,7 +427,6 @@ a:focus-visible { outline: 2px solid var(--accent-light); outline-offset: 2px; b
         <a href="https://supermodeltools.com">Website</a>
         <a href="https://github.com/supermodeltools">GitHub</a>
         <a href="https://x.com/supermodeltools">X</a>
-        <a href="https://github.com/supermodeltools/supermodeltools.github.io/issues/new?template=request-repo.yml" class="request-btn">+ Request a Repo</a>
       </nav>
     </div>
   </header>
@@ -464,7 +458,7 @@ a:focus-visible { outline: 2px solid var(--accent-light); outline-offset: 2px; b
             <input type="text" class="submit-input" id="submit-url" placeholder="https://github.com/owner/repo" autocomplete="off" spellcheck="false">
             <button class="submit-btn" id="submit-btn" type="button">Request</button>
           </div>
-          <div class="submit-preview" id="submit-preview"></div>
+          <div class="submit-feedback" id="submit-feedback"></div>
         </div>
       </div>
 
@@ -510,10 +504,10 @@ a:focus-visible { outline: 2px solid var(--accent-light); outline-offset: 2px; b
     var noResults = document.getElementById('no-results');
     var submitInput = document.getElementById('submit-url');
     var submitBtn = document.getElementById('submit-btn');
-    var submitPreview = document.getElementById('submit-preview');
+    var feedback = document.getElementById('submit-feedback');
     var noResultsRequest = document.getElementById('no-results-request');
 
-    var issueBase = 'https://github.com/supermodeltools/supermodeltools.github.io/issues/new?template=request-repo.yml';
+    var API_URL = '/api/request';
 
     // --- Search ---
     searchInput.addEventListener('input', function() {
@@ -546,36 +540,71 @@ a:focus-visible { outline: 2px solid var(--accent-light); outline-offset: 2px; b
       return null;
     }
 
+    function showFeedback(msg, type) {
+      feedback.className = 'submit-feedback visible ' + type;
+      feedback.innerHTML = msg;
+    }
+
     submitInput.addEventListener('input', function() {
       var parsed = parseRepo(this.value);
       if (parsed) {
         var name = parsed.split('/')[1];
-        submitPreview.textContent = '\u2192 Docs will be at repos.supermodeltools.com/' + name + '/';
-        submitPreview.classList.add('visible');
+        showFeedback('\u2192 repos.supermodeltools.com/' + name + '/', 'preview');
         submitBtn.classList.add('active');
       } else {
-        submitPreview.classList.remove('visible');
+        feedback.className = 'submit-feedback';
         submitBtn.classList.remove('active');
       }
     });
 
-    function submitRequest() {
+    async function submitRequest() {
       var parsed = parseRepo(submitInput.value);
       if (!parsed) return;
+
       var repoUrl = 'https://github.com/' + parsed;
       var name = parsed.split('/')[1];
-      var url = issueBase
-        + '&repo_url=' + encodeURIComponent(repoUrl)
-        + '&title=' + encodeURIComponent('[Repo Request] ' + name);
-      window.open(url, '_blank');
+
+      // Loading state
+      submitBtn.classList.add('loading');
+      submitBtn.textContent = 'Submitting...';
+      showFeedback('Setting up ' + name + '...', 'preview');
+
+      try {
+        var resp = await fetch(API_URL, {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({ url: repoUrl }),
+        });
+        var data = await resp.json();
+
+        if (!resp.ok || !data.success) {
+          showFeedback(data.error || 'Something went wrong. Please try again.', 'error');
+          submitBtn.classList.remove('loading');
+          submitBtn.textContent = 'Request';
+          return;
+        }
+
+        // Success — show the link, clear the input
+        showFeedback(
+          '\u2713 Submitted! Docs will be generated at <a href="' + data.docs_url + '">' +
+          'repos.supermodeltools.com/' + name + '/</a>', 'success'
+        );
+        submitInput.value = '';
+        submitBtn.classList.remove('active', 'loading');
+        submitBtn.textContent = 'Request';
+      } catch (e) {
+        showFeedback('Network error. Please try again.', 'error');
+        submitBtn.classList.remove('loading');
+        submitBtn.textContent = 'Request';
+      }
     }
 
     submitBtn.addEventListener('click', submitRequest);
     submitInput.addEventListener('keydown', function(e) {
-      if (e.key === 'Enter') submitRequest();
+      if (e.key === 'Enter' && submitBtn.classList.contains('active')) submitRequest();
     });
 
-    // "No results" request link: pre-fill with search query as a guess
+    // "No results" link: scroll up and focus the submit input
     noResultsRequest.addEventListener('click', function() {
       var q = searchInput.value.trim();
       submitInput.value = q;

worker/index.js

@@ -0,0 +1,93 @@
+/**
+ * Cloudflare Worker — repo request proxy
+ *
+ * Receives a repo URL from the homepage, creates a GitHub issue
+ * (which triggers the auto-add-repo workflow), and returns immediately.
+ *
+ * Environment secrets (set via wrangler secret put):
+ *   GITHUB_TOKEN — fine-grained PAT with issues:write on supermodeltools.github.io
+ *
+ * Deploy:
+ *   cd worker && npx wrangler deploy
+ *
+ * Route (add in Cloudflare dashboard or wrangler.toml):
+ *   repos.supermodeltools.com/api/*  →  this worker
+ */
+
+const CORS_HEADERS = {
+  'Access-Control-Allow-Origin': 'https://repos.supermodeltools.com',
+  'Access-Control-Allow-Methods': 'POST, OPTIONS',
+  'Access-Control-Allow-Headers': 'Content-Type',
+};
+
+const REPO_RE = /github\.com\/([a-zA-Z0-9._-]+\/[a-zA-Z0-9._-]+)/;
+
+export default {
+  async fetch(request, env) {
+    if (request.method === 'OPTIONS') {
+      return new Response(null, { status: 204, headers: CORS_HEADERS });
+    }
+
+    if (request.method !== 'POST') {
+      return jsonResponse({ error: 'Method not allowed' }, 405);
+    }
+
+    let body;
+    try {
+      body = await request.json();
+    } catch {
+      return jsonResponse({ error: 'Invalid JSON' }, 400);
+    }
+
+    const url = (body.url || '').trim().replace(/\/+$/, '').replace(/\.git$/, '');
+    const match = url.match(REPO_RE);
+    if (!match) {
+      return jsonResponse({ error: 'Invalid GitHub repository URL' }, 400);
+    }
+
+    const upstream = match[1];
+    const name = upstream.split('/')[1];
+
+    // Create the GitHub issue — this triggers auto-add-repo.yml
+    const ghResponse = await fetch(
+      'https://api.github.com/repos/supermodeltools/supermodeltools.github.io/issues',
+      {
+        method: 'POST',
+        headers: {
+          Authorization: `Bearer ${env.GITHUB_TOKEN}`,
+          Accept: 'application/vnd.github+json',
+          'User-Agent': 'supermodel-request-bot',
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({
+          title: `[Repo Request] ${name}`,
+          body: `### Repository URL\n\nhttps://github.com/${upstream}`,
+          labels: ['repo-request'],
+        }),
+      }
+    );
+
+    if (!ghResponse.ok) {
+      const err = await ghResponse.text();
+      console.error('GitHub API error:', ghResponse.status, err);
+      return jsonResponse({ error: 'Failed to submit request. Please try again.' }, 502);
+    }
+
+    const issue = await ghResponse.json();
+
+    return jsonResponse({
+      success: true,
+      name,
+      upstream,
+      docs_url: `https://repos.supermodeltools.com/${name}/`,
+      issue_url: issue.html_url,
+    });
+  },
+};
+
+function jsonResponse(data, status = 200) {
+  return new Response(JSON.stringify(data), {
+    status,
+    headers: { 'Content-Type': 'application/json', ...CORS_HEADERS },
+  });
+}

worker/wrangler.toml

@@ -0,0 +1,7 @@
+name = "repo-request"
+main = "index.js"
+compatibility_date = "2024-01-01"
+
+# Route: intercept /api/* on the custom domain
+# Requires the domain to be proxied through Cloudflare
+# routes = [{ pattern = "repos.supermodeltools.com/api/*", zone_name = "supermodeltools.com" }]