mcpmake 0.1.0

package/dist/cloud/web/templates/pages/admin/overview.hbs

@@ -0,0 +1,123 @@
+<div class="admin-page">
+  <div class="admin-page-header">
+    <h1>System Overview</h1>
+  </div>
+
+  <div id="admin-stats" hx-get="/admin/_stats" hx-trigger="every 10s" hx-swap="innerHTML" aria-live="polite">
+    {{> admin-stats}}
+  </div>
+
+  <div class="health-panel">
+    <h2>Health</h2>
+    <div class="health-grid">
+      <div class="health-item">
+        <span class="health-badge {{#if health.db}}health-badge--ok{{else}}health-badge--bad{{/if}}">{{#if health.db}}OK{{else}}OFF{{/if}}</span>
+        <div class="health-meta">
+          <span class="health-name">Database</span>
+          <span class="health-sub">{{#if health.db}}reachable{{else}}in-memory mode{{/if}}</span>
+        </div>
+      </div>
+      <div class="health-item">
+        <span class="health-badge {{#if health.stripe}}health-badge--ok{{else}}health-badge--bad{{/if}}">{{#if health.stripe}}OK{{else}}OFF{{/if}}</span>
+        <div class="health-meta">
+          <span class="health-name">Stripe</span>
+          <span class="health-sub">{{#if health.stripe}}configured{{else}}not configured{{/if}}</span>
+        </div>
+      </div>
+      <div class="health-item">
+        <span class="health-badge health-badge--neutral">{{health.backend}}</span>
+        <div class="health-meta">
+          <span class="health-name">Container backend</span>
+          <span class="health-sub">driver</span>
+        </div>
+      </div>
+      <div class="health-item">
+        <span class="health-badge {{#if health.ramOk}}health-badge--ok{{else}}health-badge--bad{{/if}}">{{#if health.ramOk}}OK{{else}}ALERT{{/if}}</span>
+        <div class="health-meta">
+          <span class="health-name">RAM pressure</span>
+          <span class="health-sub">{{health.memUsedPct}}% used</span>
+        </div>
+      </div>
+      <div class="health-item">
+        <span class="health-badge {{#if health.diskOk}}health-badge--ok{{else}}health-badge--bad{{/if}}">{{#if health.diskOk}}OK{{else}}ALERT{{/if}}</span>
+        <div class="health-meta">
+          <span class="health-name">Disk pressure</span>
+          <span class="health-sub">{{health.diskUsedPct}}% used</span>
+        </div>
+      </div>
+    </div>
+    {{#if health.alerts.length}}
+      <ul class="health-alerts">
+        {{#each health.alerts}}<li>{{this}}</li>{{/each}}
+      </ul>
+    {{/if}}
+  </div>
+
+  <div class="chart-panel">
+    <div class="chart-panel-header">
+      <h2>API failure rate</h2>
+      <span class="chart-panel-meta">last 60 minutes</span>
+    </div>
+    <div class="failure-rate-grid">
+      <div class="stat-card">
+        <span class="stat-card-value">{{failure.requests}}</span>
+        <span class="stat-card-label">Requests (last hour)</span>
+      </div>
+      <div class="stat-card">
+        <span class="stat-card-value {{#if (eq failure.serverErrorRatePct '0.0')}}status-green{{else}}status-red{{/if}}">{{failure.serverErrorRatePct}}%</span>
+        <span class="stat-card-label">Server error rate (5xx)</span>
+      </div>
+      <div class="stat-card">
+        <span class="stat-card-value">{{failure.clientErrorRatePct}}%</span>
+        <span class="stat-card-label">Client error rate (4xx)</span>
+      </div>
+    </div>
+    <div class="chart-box">
+      <span class="chart-box-label">Requests / minute (live)</span>
+      {{{lastHourChart}}}
+    </div>
+  </div>
+
+  <div class="chart-panel">
+    <div class="chart-panel-header">
+      <h2>History</h2>
+      <span class="chart-panel-meta">last 24 hours</span>
+    </div>
+    {{#if hasHistory}}
+      <div class="chart-grid">
+        <div class="chart-box">
+          <span class="chart-box-label">Requests vs 5xx errors</span>
+          {{{charts.requestsErrors}}}
+          <div class="chart-legend">
+            <span class="chart-legend-item"><span class="chart-swatch chart-swatch--a"></span>Requests</span>
+            <span class="chart-legend-item"><span class="chart-swatch chart-swatch--b"></span>5xx errors</span>
+          </div>
+        </div>
+        <div class="chart-box">
+          <span class="chart-box-label">Memory vs disk used (%)</span>
+          {{{charts.memDisk}}}
+          <div class="chart-legend">
+            <span class="chart-legend-item"><span class="chart-swatch chart-swatch--a"></span>Memory</span>
+            <span class="chart-legend-item"><span class="chart-swatch chart-swatch--b"></span>Disk</span>
+          </div>
+        </div>
+        <div class="chart-box">
+          <span class="chart-box-label">Total users</span>
+          {{{charts.users}}}
+        </div>
+        <div class="chart-box">
+          <span class="chart-box-label">Total servers</span>
+          {{{charts.servers}}}
+        </div>
+      </div>
+    {{else}}
+      <div class="chart-empty">
+        {{#if historyEmpty}}
+          <p>History requires <code>DATABASE_URL</code>. Configure a database to retain metric samples across restarts.</p>
+        {{else}}
+          <p>No metric samples recorded yet. Charts will populate as the sampler runs.</p>
+        {{/if}}
+      </div>
+    {{/if}}
+  </div>
+</div>

package/dist/cloud/web/templates/pages/admin/servers.hbs

@@ -0,0 +1,129 @@
+<div class="admin-page" x-data="adminServers()">
+  <div class="admin-page-header">
+    <h1>All Servers</h1>
+    <span class="admin-page-count">{{servers.length}} total</span>
+  </div>
+
+  <input
+    type="text"
+    class="search-input"
+    placeholder="Filter by slug, user, or status..."
+    x-model="search"
+  >
+
+  <div class="admin-table-wrap">
+    <table class="admin-table">
+      <thead>
+        <tr>
+          <th @click="sortBy('slug')" :class="sortClass('slug')">Slug</th>
+          <th @click="sortBy('status')" :class="sortClass('status')">Status</th>
+          <th @click="sortBy('userId')" :class="sortClass('userId')">User</th>
+          <th @click="sortBy('toolCount')" :class="sortClass('toolCount')">Tools</th>
+          <th @click="sortBy('port')" :class="sortClass('port')">Port</th>
+          <th @click="sortBy('createdAt')" :class="sortClass('createdAt')">Created</th>
+          <th @click="sortBy('lastActiveAt')" :class="sortClass('lastActiveAt')">Last Active</th>
+          <th>Actions</th>
+        </tr>
+      </thead>
+      <tbody>
+        <template x-for="server in filteredServers()" :key="server.slug">
+          <tr>
+            <td><code x-text="server.slug"></code></td>
+            <td>
+              <span
+                class="status-dot"
+                :class="{
+                  'status-green': server.status === 'running',
+                  'status-gray': server.status === 'stopped',
+                  'status-red': server.status === 'error',
+                  'status-yellow': server.status === 'building'
+                }"
+                x-text="server.status"
+              ></span>
+            </td>
+            <td x-text="server.userEmail || server.userId || '(anonymous)'"></td>
+            <td x-text="server.toolCount"></td>
+            <td><code x-text="server.port"></code></td>
+            <td x-text="formatDate(server.createdAt)"></td>
+            <td x-text="formatDate(server.lastActiveAt)"></td>
+            <td class="admin-actions">
+              <form method="POST" :action="'/admin/servers/' + server.slug + '/delete'" style="display:inline">
+                <input type="hidden" name="_csrf" value="{{csrfToken}}">
+                <button
+                  type="submit"
+                  class="btn btn-sm btn-danger"
+                  @click.prevent="confirmDelete($event, server.slug)"
+                >Delete</button>
+              </form>
+            </td>
+          </tr>
+        </template>
+        <template x-if="filteredServers().length === 0">
+          <tr>
+            <td colspan="8" class="admin-table-empty">No servers match your filter.</td>
+          </tr>
+        </template>
+      </tbody>
+    </table>
+  </div>
+</div>
+
+<script>
+  function adminServers() {
+    return {
+      search: '',
+      sortCol: 'createdAt',
+      sortDir: 'desc',
+      servers: {{{json servers}}},
+
+      sortBy(col) {
+        if (this.sortCol === col) {
+          this.sortDir = this.sortDir === 'asc' ? 'desc' : 'asc';
+        } else {
+          this.sortCol = col;
+          this.sortDir = 'asc';
+        }
+      },
+
+      sortClass(col) {
+        if (this.sortCol !== col) return 'sortable';
+        return 'sortable sorted-' + this.sortDir;
+      },
+
+      filteredServers() {
+        let result = this.servers;
+        const q = this.search.toLowerCase().trim();
+        if (q) {
+          result = result.filter(s =>
+            s.slug.toLowerCase().includes(q) ||
+            (s.userEmail || '').toLowerCase().includes(q) ||
+            (s.userId || '').toLowerCase().includes(q) ||
+            s.status.toLowerCase().includes(q)
+          );
+        }
+        const col = this.sortCol;
+        const dir = this.sortDir === 'asc' ? 1 : -1;
+        result = [...result].sort((a, b) => {
+          const va = a[col] ?? '';
+          const vb = b[col] ?? '';
+          if (typeof va === 'number' && typeof vb === 'number') return (va - vb) * dir;
+          return String(va).localeCompare(String(vb)) * dir;
+        });
+        return result;
+      },
+
+      formatDate(iso) {
+        if (!iso) return '';
+        const d = new Date(iso);
+        if (isNaN(d.getTime())) return iso;
+        return d.toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' });
+      },
+
+      confirmDelete(event, slug) {
+        if (confirm('Delete server "' + slug + '"? This will stop the container and remove all data.')) {
+          event.target.closest('form').submit();
+        }
+      }
+    };
+  }
+</script>

package/dist/cloud/web/templates/pages/admin/telemetry.hbs

@@ -0,0 +1,39 @@
+<div class="admin-page">
+  <div class="admin-page-header">
+    <h1>Telemetry</h1>
+    <span class="admin-page-count">{{groups.length}} groups</span>
+  </div>
+
+  <p class="form-hint">CLI crash and error reports, grouped by fingerprint. PII is stripped at ingest.</p>
+
+  <div class="admin-table-wrap">
+    <table class="admin-table">
+      <thead>
+        <tr>
+          <th>Count</th>
+          <th>Last seen</th>
+          <th>Command</th>
+          <th>Error</th>
+          <th>CLI</th>
+          <th>Platform</th>
+        </tr>
+      </thead>
+      <tbody>
+        {{#each groups}}
+          <tr>
+            <td><span class="telemetry-count">{{this.count}}</span></td>
+            <td>{{formatDate this.lastSeen}}</td>
+            <td><code>{{this.command}}</code></td>
+            <td class="telemetry-error" title="{{this.errorMessage}}">{{truncate this.errorMessage 120}}</td>
+            <td><code>{{this.cliVersion}}</code></td>
+            <td>{{this.platform}}</td>
+          </tr>
+        {{else}}
+          <tr>
+            <td colspan="6" class="admin-table-empty">No telemetry reports yet.</td>
+          </tr>
+        {{/each}}
+      </tbody>
+    </table>
+  </div>
+</div>

package/dist/cloud/web/templates/pages/admin/user-edit.hbs

@@ -0,0 +1,91 @@
+<div class="admin-page">
+  <div class="admin-page-header">
+    <a href="/admin/users" class="admin-back-link">&larr; Users</a>
+    <h1>{{targetUser.email}}</h1>
+  </div>
+
+  <div class="admin-stats">
+    <div class="stat-card">
+      <span class="stat-card-value">
+        <span class="plan-badge plan-badge--{{targetUser.plan}}">{{targetUser.plan}}</span>
+      </span>
+      <span class="stat-card-label">Plan</span>
+    </div>
+    <div class="stat-card">
+      <span class="stat-card-value">{{balance}}</span>
+      <span class="stat-card-label">Credit Balance</span>
+    </div>
+    <div class="stat-card">
+      <span class="stat-card-value">{{serverCount}}</span>
+      <span class="stat-card-label">Servers</span>
+    </div>
+    <div class="stat-card">
+      <span class="stat-card-value {{#if targetUser.isAdmin}}status-green{{/if}}">{{#if targetUser.isAdmin}}Yes{{else}}No{{/if}}</span>
+      <span class="stat-card-label">Admin</span>
+    </div>
+  </div>
+
+  <div class="system-info">
+    <h2>Account</h2>
+    <dl class="system-info-list">
+      <div class="system-info-row">
+        <dt>Email</dt>
+        <dd>{{targetUser.email}}</dd>
+      </div>
+      <div class="system-info-row">
+        <dt>Registered</dt>
+        <dd>{{formatDate targetUser.createdAt}}</dd>
+      </div>
+      <div class="system-info-row">
+        <dt>Last login</dt>
+        <dd>{{#if targetUser.lastLoginAt}}{{formatDate targetUser.lastLoginAt}}{{else}}—{{/if}}</dd>
+      </div>
+    </dl>
+  </div>
+
+  <div class="credit-panel">
+    <h2>Adjust credits</h2>
+    <p class="form-hint">Grant or revoke promotional tool-call credits. Recorded in the ledger below.</p>
+    <form method="POST" action="/admin/users/{{targetUser.id}}/credits" class="credit-form">
+      <input type="hidden" name="_csrf" value="{{csrfToken}}">
+      <div class="credit-form-row">
+        <label class="credit-form-field">
+          <span>Amount</span>
+          <input type="number" name="amount" min="1" max="100000000" step="1" required class="search-input" placeholder="e.g. 1000">
+        </label>
+        <div class="credit-form-actions">
+          <button type="submit" name="action" value="grant" class="btn btn-primary">Grant</button>
+          <button type="submit" name="action" value="revoke" class="btn btn-secondary">Revoke</button>
+        </div>
+      </div>
+    </form>
+  </div>
+
+  <div class="admin-table-wrap">
+    <h2 class="ledger-heading">Recent ledger</h2>
+    <table class="admin-table">
+      <thead>
+        <tr>
+          <th>When</th>
+          <th>Change</th>
+          <th>Reason</th>
+          <th>Balance after</th>
+        </tr>
+      </thead>
+      <tbody>
+        {{#each ledger}}
+          <tr>
+            <td>{{formatDate this.createdAt}}</td>
+            <td><span class="{{#if this.isCredit}}status-green{{else}}status-red{{/if}}">{{this.deltaLabel}}</span></td>
+            <td><code>{{this.reason}}</code></td>
+            <td>{{this.balanceAfter}}</td>
+          </tr>
+        {{else}}
+          <tr>
+            <td colspan="4" class="admin-table-empty">No credit activity yet.</td>
+          </tr>
+        {{/each}}
+      </tbody>
+    </table>
+  </div>
+</div>

package/dist/cloud/web/templates/pages/admin/users.hbs

@@ -0,0 +1,179 @@
+<div class="admin-page" x-data="adminUsers()">
+  <div class="admin-page-header">
+    <h1>User Management</h1>
+    <span class="admin-page-count">{{users.length}} total</span>
+  </div>
+
+  <input
+    type="text"
+    class="search-input"
+    placeholder="Filter by email or plan..."
+    x-model="search"
+  >
+
+  <div class="admin-table-wrap">
+    <table class="admin-table">
+      <thead>
+        <tr>
+          <th @click="sortBy('email')" :class="sortClass('email')">Email</th>
+          <th @click="sortBy('plan')" :class="sortClass('plan')">Plan</th>
+          <th @click="sortBy('isAdmin')" :class="sortClass('isAdmin')">Admin?</th>
+          <th @click="sortBy('serverCount')" :class="sortClass('serverCount')">Servers</th>
+          <th @click="sortBy('createdAt')" :class="sortClass('createdAt')">Registered</th>
+          <th @click="sortBy('lastLoginAt')" :class="sortClass('lastLoginAt')">Last Login</th>
+          <th>Actions</th>
+        </tr>
+      </thead>
+      <tbody>
+        <template x-for="user in filteredUsers()" :key="user.id">
+          <tr>
+            <td><a class="admin-row-link" :href="'/admin/users/' + user.id" x-text="user.email"></a></td>
+            <td>
+              <span
+                class="plan-badge"
+                :class="'plan-badge--' + user.plan"
+                x-text="user.plan"
+              ></span>
+            </td>
+            <td>
+              <span
+                x-show="user.isAdmin"
+                class="admin-badge"
+              >admin</span>
+            </td>
+            <td x-text="user.serverCount"></td>
+            <td x-text="formatDate(user.createdAt)"></td>
+            <td x-text="formatDate(user.lastLoginAt)"></td>
+            <td class="admin-actions">
+              <form
+                class="inline-action"
+                method="POST"
+                :action="'/admin/users/' + user.id + '/plan'"
+                hx-post
+                :hx-post="'/admin/users/' + user.id + '/plan'"
+                hx-swap="none"
+                @htmx:after-request="handlePlanChange($event, user)"
+              >
+                <input type="hidden" name="_csrf" value="{{csrfToken}}">
+                <select name="plan" :value="user.plan" class="admin-select" @change="$el.closest('form').requestSubmit()">
+                  <option value="free" :selected="user.plan === 'free'">free</option>
+                  <option value="hobbyist" :selected="user.plan === 'hobbyist'">hobbyist</option>
+                  <option value="pro" :selected="user.plan === 'pro'">pro</option>
+                  <option value="team" :selected="user.plan === 'team'">team</option>
+                  <option value="enterprise" :selected="user.plan === 'enterprise'">enterprise</option>
+                </select>
+              </form>
+
+              <form
+                class="inline-action"
+                method="POST"
+                :action="'/admin/users/' + user.id + '/admin'"
+                hx-post
+                :hx-post="'/admin/users/' + user.id + '/admin'"
+                hx-swap="none"
+                @htmx:after-request="handleAdminToggle($event, user)"
+              >
+                <input type="hidden" name="_csrf" value="{{csrfToken}}">
+                <button type="submit" class="btn btn-sm btn-secondary" x-text="user.isAdmin ? 'Revoke admin' : 'Make admin'"></button>
+              </form>
+
+              <form
+                class="inline-action"
+                method="POST"
+                :action="'/admin/users/' + user.id + '/delete'"
+              >
+                <input type="hidden" name="_csrf" value="{{csrfToken}}">
+                <button
+                  type="submit"
+                  class="btn btn-sm btn-danger"
+                  @click.prevent="confirmDelete($event, user)"
+                >Delete</button>
+              </form>
+            </td>
+          </tr>
+        </template>
+        <template x-if="filteredUsers().length === 0">
+          <tr>
+            <td colspan="7" class="admin-table-empty">No users match your filter.</td>
+          </tr>
+        </template>
+      </tbody>
+    </table>
+  </div>
+</div>
+
+<script>
+  function adminUsers() {
+    return {
+      search: '',
+      sortCol: 'createdAt',
+      sortDir: 'desc',
+      users: {{{json users}}},
+
+      sortBy(col) {
+        if (this.sortCol === col) {
+          this.sortDir = this.sortDir === 'asc' ? 'desc' : 'asc';
+        } else {
+          this.sortCol = col;
+          this.sortDir = 'asc';
+        }
+      },
+
+      sortClass(col) {
+        if (this.sortCol !== col) return 'sortable';
+        return 'sortable sorted-' + this.sortDir;
+      },
+
+      filteredUsers() {
+        let result = this.users;
+        const q = this.search.toLowerCase().trim();
+        if (q) {
+          result = result.filter(u =>
+            u.email.toLowerCase().includes(q) ||
+            u.plan.toLowerCase().includes(q)
+          );
+        }
+        const col = this.sortCol;
+        const dir = this.sortDir === 'asc' ? 1 : -1;
+        result = [...result].sort((a, b) => {
+          const va = a[col] ?? '';
+          const vb = b[col] ?? '';
+          if (typeof va === 'number' && typeof vb === 'number') return (va - vb) * dir;
+          if (typeof va === 'boolean' && typeof vb === 'boolean') return ((va ? 1 : 0) - (vb ? 1 : 0)) * dir;
+          return String(va).localeCompare(String(vb)) * dir;
+        });
+        return result;
+      },
+
+      formatDate(iso) {
+        if (!iso) return '';
+        const d = new Date(iso);
+        if (isNaN(d.getTime())) return iso;
+        return d.toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' });
+      },
+
+      handlePlanChange(event, user) {
+        if (event.detail.successful) {
+          const form = event.target;
+          const select = form.querySelector('select[name="plan"]');
+          user.plan = select.value;
+        }
+      },
+
+      handleAdminToggle(event, user) {
+        if (event.detail.successful) {
+          user.isAdmin = !user.isAdmin;
+        }
+      },
+
+      confirmDelete(event, user) {
+        if (user.isAdmin) {
+          if (!confirm('This user is an admin. Are you sure you want to delete "' + user.email + '"?')) return;
+        } else {
+          if (!confirm('Delete user "' + user.email + '"? This cannot be undone.')) return;
+        }
+        event.target.closest('form').submit();
+      }
+    };
+  }
+</script>

package/dist/cloud/web/templates/pages/auth/forgot-password.hbs

@@ -0,0 +1,25 @@
+<h1>Reset password</h1>
+<p class="auth-subtitle">Enter your email to receive a reset link</p>
+
+{{#if error}}
+<div class="auth-error" role="alert" aria-live="assertive">{{error}}</div>
+{{/if}}
+
+{{#if success}}
+<div class="auth-success" role="status" aria-live="polite">{{success}}</div>
+{{else}}
+<form method="POST" action="/forgot-password">
+  <input type="hidden" name="_csrf" value="{{csrfToken}}">
+
+  <div class="form-group">
+    <label for="email">Email</label>
+    <input type="email" id="email" name="email" value="{{email}}" required autocomplete="email" autofocus>
+  </div>
+
+  <button type="submit" class="auth-submit">Send reset link</button>
+</form>
+{{/if}}
+
+<div class="auth-footer">
+  <a href="/login">Back to sign in</a>
+</div>

package/dist/cloud/web/templates/pages/auth/login.hbs

@@ -0,0 +1,33 @@
+<h1>Sign in</h1>
+<p class="auth-subtitle">Welcome back to mcpmake</p>
+
+{{#if success}}
+<div class="auth-success" role="status" aria-live="polite">{{success}}</div>
+{{/if}}
+
+{{#if error}}
+<div class="auth-error" role="alert" aria-live="assertive">{{error}}</div>
+{{/if}}
+
+<form method="POST" action="/login">
+  <input type="hidden" name="_csrf" value="{{csrfToken}}">
+
+  <div class="form-group">
+    <label for="email">Email</label>
+    <input type="email" id="email" name="email" value="{{email}}" required autocomplete="email" autofocus>
+  </div>
+
+  <div class="form-group">
+    <label for="password">Password</label>
+    <input type="password" id="password" name="password" required autocomplete="current-password">
+  </div>
+
+  <button type="submit" class="auth-submit">Sign in</button>
+</form>
+
+<div class="auth-footer">
+  <a href="/forgot-password">Forgot your password?</a>
+</div>
+<div class="auth-footer">
+  Don't have an account? <a href="/register">Register</a>
+</div>

package/dist/cloud/web/templates/pages/auth/register.hbs

@@ -0,0 +1,32 @@
+<h1>Create account</h1>
+<p class="auth-subtitle">Get started with mcpmake Cloud</p>
+
+{{#if error}}
+<div class="auth-error" role="alert" aria-live="assertive">{{error}}</div>
+{{/if}}
+
+<form method="POST" action="/register">
+  <input type="hidden" name="_csrf" value="{{csrfToken}}">
+
+  <div class="form-group">
+    <label for="email">Email</label>
+    <input type="email" id="email" name="email" value="{{email}}" required autocomplete="email" autofocus>
+  </div>
+
+  <div class="form-group">
+    <label for="password">Password</label>
+    <input type="password" id="password" name="password" required autocomplete="new-password" minlength="8">
+    <p class="form-hint">Minimum 8 characters</p>
+  </div>
+
+  <div class="form-group">
+    <label for="confirmPassword">Confirm password</label>
+    <input type="password" id="confirmPassword" name="confirmPassword" required autocomplete="new-password">
+  </div>
+
+  <button type="submit" class="auth-submit">Create account</button>
+</form>
+
+<div class="auth-footer">
+  Already have an account? <a href="/login">Sign in</a>
+</div>