artifacty 0.8.0 → 0.10.0

package/src/lib/render.js

@@ -2,7 +2,7 @@ import { EDITOR_CLIENT_PATH, VIEWER_CLIENT_PATH, editorImportMapJson } from "./e
 import { createI18n, DEFAULT_LOCALE, editorMessages, localizedHref, switchLocaleHref } from "./i18n.js";
 import { ARTIFACT_FORMATS, ARTIFACT_TYPES } from "./storage.js";
 
-export function renderDashboard({ artifacts, baseUrl, filters = {}, pagination, locale = DEFAULT_LOCALE, currentPath = "/" }) {
+export function renderDashboard({ artifacts, baseUrl, filters = {}, pagination, locale = DEFAULT_LOCALE, currentPath = "/", user = null }) {
   const view = viewContext(locale, currentPath);
   const total = pagination?.total ?? artifacts.length;
   const start = artifacts.length ? (pagination?.offset ?? 0) + 1 : 0;
@@ -48,6 +48,7 @@ export function renderDashboard({ artifacts, baseUrl, filters = {}, pagination,
           <a href="${view.href("/new")}">${view.text("nav.new")}</a>
           <a href="${view.href("/import")}">${view.text("nav.import")}</a>
           <a href="/api/artifacts">${view.text("nav.api")}</a>
+          ${authNav(user)}
           ${languageSwitcher(view)}
         </nav>
       </header>
@@ -249,6 +250,263 @@ export function renderImportArtifactPage({ baseUrl, authToken = "", locale = DEF
   });
 }
 
+export function renderLoginPage({ baseUrl, setup = false, error = "", locale = DEFAULT_LOCALE, currentPath = "/login" }) {
+  const view = viewContext(locale, currentPath);
+  const title = setup ? "Create admin account" : "Sign in";
+  return pageShell({
+    title,
+    body: `
+      <header class="topbar">
+        <div>
+          <h1>${escapeHtml(title)}</h1>
+          <p>${escapeHtml(baseUrl)}</p>
+        </div>
+        <nav>
+          <a href="${view.href("/")}">${view.text("nav.index")}</a>
+          ${languageSwitcher(view)}
+        </nav>
+      </header>
+      <main class="artifact-editor auth-panel">
+        ${error ? `<p class="auth-error">${escapeHtml(error)}</p>` : ""}
+        ${setup ? `<p class="muted">No users exist yet. The first account becomes an administrator.</p>` : ""}
+        <form class="editor-form auth-form" method="post" action="/login">
+          <section class="editor-fields">
+            <label class="field">
+              <span>Email</span>
+              <input type="email" name="email" autocomplete="username" required>
+            </label>
+            ${setup ? `<label class="field">
+              <span>Name</span>
+              <input name="name" autocomplete="name">
+            </label>` : ""}
+            <label class="field">
+              <span>Password</span>
+              <input type="password" name="password" autocomplete="${setup ? "new-password" : "current-password"}" minlength="8" required>
+            </label>
+          </section>
+          <footer class="editor-actions">
+            <button type="submit">${setup ? "Create admin" : "Sign in"}</button>
+          </footer>
+        </form>
+      </main>
+    `,
+    locale: view.locale
+  });
+}
+
+export function renderAccountPage({ baseUrl, user, tokens = [], createdToken = "", locale = DEFAULT_LOCALE, currentPath = "/account" }) {
+  const view = viewContext(locale, currentPath);
+  const rows = tokens.map((token) => `
+    <tr>
+      <td>${escapeHtml(token.name)}</td>
+      <td>${escapeHtml(token.createdAt)}</td>
+      <td>${token.lastUsedAt ? escapeHtml(token.lastUsedAt) : "Never"}</td>
+      <td>${token.revokedAt ? escapeHtml(token.revokedAt) : "Active"}</td>
+      <td>
+        ${token.revokedAt ? "" : `<form method="post" action="/account/tokens/${encodeURIComponent(token.id)}/revoke">
+          <button type="submit">Revoke</button>
+        </form>`}
+      </td>
+    </tr>
+  `).join("");
+
+  return pageShell({
+    title: "Account",
+    body: `
+      <header class="topbar">
+        <div>
+          <h1>Account</h1>
+          <p>${escapeHtml(user.email)} · ${escapeHtml(user.role)} · ${escapeHtml(baseUrl)}</p>
+        </div>
+        <nav>
+          <a href="${view.href("/")}">${view.text("nav.index")}</a>
+          ${user.role === "admin" ? `<a href="/admin/users">Users</a>` : ""}
+          <a href="/account/password">Password</a>
+          <form class="nav-form" method="post" action="/logout"><button type="submit">Sign out</button></form>
+          ${languageSwitcher(view)}
+        </nav>
+      </header>
+      <main class="artifact-view">
+        ${createdToken ? `<section class="token-once">
+          <h2>New API token</h2>
+          <p>Copy this token now. Artifacty stores only its hash and cannot show it again.</p>
+          <pre class="artifact-code"><code>${escapeHtml(createdToken)}</code></pre>
+        </section>` : ""}
+        <section class="meta-card">
+          <h2>Profile</h2>
+          <p><strong>${escapeHtml(user.name)}</strong></p>
+          <p>${escapeHtml(user.email)}</p>
+          <p>Role: ${escapeHtml(user.role)}</p>
+        </section>
+        <section class="meta-card">
+          <h2>Create API token</h2>
+          <form class="inline-action" method="post" action="/account/tokens">
+            <input name="name" placeholder="Token name" autocomplete="off" required>
+            <button type="submit">Create token</button>
+          </form>
+        </section>
+        <section class="meta-card">
+          <h2>API tokens</h2>
+          <table class="data-table">
+            <thead><tr><th>Name</th><th>Created</th><th>Last used</th><th>Status</th><th></th></tr></thead>
+            <tbody>${rows || `<tr><td colspan="5">No API tokens.</td></tr>`}</tbody>
+          </table>
+        </section>
+      </main>
+    `,
+    locale: view.locale
+  });
+}
+
+export function renderPasswordPage({ baseUrl, user, required = false, error = "", success = "", locale = DEFAULT_LOCALE, currentPath = "/account/password" }) {
+  const view = viewContext(locale, currentPath);
+  return pageShell({
+    title: "Change Password",
+    body: `
+      <header class="topbar">
+        <div>
+          <h1>Change Password</h1>
+          <p>${escapeHtml(user.email)} · ${escapeHtml(baseUrl)}</p>
+        </div>
+        <nav>
+          <a href="${view.href("/")}">${view.text("nav.index")}</a>
+          ${required ? "" : `<a href="/account">Account</a>`}
+          <form class="nav-form" method="post" action="/logout"><button type="submit">Sign out</button></form>
+          ${languageSwitcher(view)}
+        </nav>
+      </header>
+      <main class="artifact-editor auth-panel">
+        ${required ? `<p class="auth-warning">Password change is required before continuing.</p>` : ""}
+        ${error ? `<p class="auth-error">${escapeHtml(error)}</p>` : ""}
+        ${success ? `<p class="auth-success">${escapeHtml(success)}</p>` : ""}
+        <form class="editor-form auth-form" method="post" action="/account/password">
+          <section class="editor-fields">
+            <label class="field">
+              <span>Current password</span>
+              <input type="password" name="currentPassword" autocomplete="current-password" required>
+            </label>
+            <label class="field">
+              <span>New password</span>
+              <input type="password" name="newPassword" autocomplete="new-password" minlength="8" required>
+            </label>
+            <label class="field">
+              <span>Confirm password</span>
+              <input type="password" name="confirmPassword" autocomplete="new-password" minlength="8" required>
+            </label>
+          </section>
+          <footer class="editor-actions">
+            <button type="submit">Change password</button>
+          </footer>
+        </form>
+      </main>
+    `,
+    locale: view.locale
+  });
+}
+
+export function renderAdminUsersPage({ baseUrl, user, users = [], importResult = null, importError = "", locale = DEFAULT_LOCALE, currentPath = "/admin/users" }) {
+  const view = viewContext(locale, currentPath);
+  const rows = users.map((item) => `
+    <tr>
+      <td>${escapeHtml(item.email)}</td>
+      <td>${escapeHtml(item.name)}</td>
+      <td>${escapeHtml(item.role)}</td>
+      <td>${item.active ? "Active" : "Disabled"}${item.passwordResetRequired ? " · Reset required" : ""}</td>
+      <td>${escapeHtml(item.createdAt)}</td>
+      <td>
+        ${item.id === user.id ? "" : `<form method="post" action="/admin/users/${encodeURIComponent(item.id)}/${item.active ? "disable" : "enable"}">
+          <button type="submit">${item.active ? "Disable" : "Enable"}</button>
+        </form>`}
+      </td>
+    </tr>
+  `).join("");
+  const createdRows = (importResult?.created || []).map((item) => `
+    <tr>
+      <td>${escapeHtml(item.user.email)}</td>
+      <td>${escapeHtml(item.user.role)}</td>
+      <td>${item.user.passwordResetRequired ? "Yes" : "No"}</td>
+      <td>${item.passwordGenerated ? `<code>${escapeHtml(item.temporaryPassword)}</code>` : "Provided in CSV"}</td>
+    </tr>
+  `).join("");
+  const skippedRows = (importResult?.skipped || []).map((item) => `
+    <tr><td>${escapeHtml(item.row)}</td><td>${escapeHtml(item.email)}</td><td>${escapeHtml(item.reason)}</td></tr>
+  `).join("");
+  const failedRows = (importResult?.failed || []).map((item) => `
+    <tr><td>${escapeHtml(item.row)}</td><td>${escapeHtml(item.email)}</td><td>${escapeHtml(item.error)}</td></tr>
+  `).join("");
+  const importSummary = importResult ? `
+    <section class="meta-card">
+      <h2>Import results</h2>
+      <p class="muted">${importResult.created.length} created, ${importResult.skipped.length} skipped, ${importResult.failed.length} failed.</p>
+      ${createdRows ? `<table class="data-table">
+        <thead><tr><th>Email</th><th>Role</th><th>Reset required</th><th>Temporary password</th></tr></thead>
+        <tbody>${createdRows}</tbody>
+      </table>` : ""}
+      ${skippedRows ? `<h3>Skipped</h3><table class="data-table">
+        <thead><tr><th>Row</th><th>Email</th><th>Reason</th></tr></thead>
+        <tbody>${skippedRows}</tbody>
+      </table>` : ""}
+      ${failedRows ? `<h3>Failed</h3><table class="data-table">
+        <thead><tr><th>Row</th><th>Email</th><th>Error</th></tr></thead>
+        <tbody>${failedRows}</tbody>
+      </table>` : ""}
+    </section>
+  ` : "";
+
+  return pageShell({
+    title: "Users",
+    body: `
+      <header class="topbar">
+        <div>
+          <h1>Users</h1>
+          <p>${escapeHtml(baseUrl)}</p>
+        </div>
+        <nav>
+          <a href="${view.href("/")}">${view.text("nav.index")}</a>
+          <a href="/account">Account</a>
+          ${languageSwitcher(view)}
+        </nav>
+      </header>
+      <main class="artifact-view">
+        <section class="meta-card">
+          <h2>Create user</h2>
+          <form class="editor-form auth-form" method="post" action="/admin/users">
+            <section class="editor-fields">
+              <label class="field"><span>Email</span><input type="email" name="email" required></label>
+              <label class="field"><span>Name</span><input name="name"></label>
+              <label class="field"><span>Role</span><select name="role"><option value="user">user</option><option value="admin">admin</option></select></label>
+              <label class="field"><span>Password</span><input type="password" name="password" minlength="8" required></label>
+              <label class="check-field"><input type="checkbox" name="passwordResetRequired"> Require password change</label>
+            </section>
+            <footer class="editor-actions"><button type="submit">Create user</button></footer>
+          </form>
+        </section>
+        <section class="meta-card">
+          <h2>Import users from CSV</h2>
+          <p class="muted">Use headers: email, name, role, password, password_reset_required. Missing passwords are generated and must be changed at first sign-in.</p>
+          ${importError ? `<p class="auth-error">${escapeHtml(importError)}</p>` : ""}
+          <form class="editor-form" method="post" action="/admin/users/import">
+            <label class="field content-field">
+              <span>CSV</span>
+              <textarea class="compact-textarea" name="csv" spellcheck="false" placeholder="email,name,role&#10;user@example.com,User,user" required></textarea>
+            </label>
+            <footer class="editor-actions"><button type="submit">Import users</button></footer>
+          </form>
+        </section>
+        ${importSummary}
+        <section class="meta-card">
+          <h2>Existing users</h2>
+          <table class="data-table">
+            <thead><tr><th>Email</th><th>Name</th><th>Role</th><th>Status</th><th>Created</th><th></th></tr></thead>
+            <tbody>${rows}</tbody>
+          </table>
+        </section>
+      </main>
+    `,
+    locale: view.locale
+  });
+}
+
 export function renderArtifactPage({ artifact, version, content, baseUrl, authToken = "", locale = DEFAULT_LOCALE, currentPath = "/" }) {
   const view = viewContext(locale, currentPath);
   const versionLinks = artifact.versions
@@ -726,6 +984,25 @@ export function pageShell({ title, body, head = "", afterBody = "", locale = DEF
     .inline-action {
       margin-bottom: 12px;
     }
+    .nav-form {
+      display: inline-flex;
+      margin: 0;
+    }
+    .nav-form button {
+      min-height: 0;
+      padding: 0;
+      border: 0;
+      background: transparent;
+      color: inherit;
+      font: inherit;
+      font-weight: inherit;
+    }
+    .nav-form button:hover {
+      background: transparent;
+      border: 0;
+      color: var(--text);
+      text-decoration: underline;
+    }
     .diff-form {
       grid-template-columns: 160px 160px auto;
       width: fit-content;
@@ -788,6 +1065,76 @@ export function pageShell({ title, body, head = "", afterBody = "", locale = DEF
       display: grid;
       gap: 16px;
     }
+    .auth-panel {
+      max-width: 720px;
+      margin: 0 auto;
+    }
+    .auth-form .editor-fields {
+      grid-template-columns: minmax(220px, 1fr);
+    }
+    .auth-error,
+    .auth-success,
+    .auth-warning,
+    .token-once {
+      border: 1px solid var(--line);
+      border-radius: 8px;
+      padding: 12px 14px;
+      background: var(--panel);
+    }
+    .auth-error {
+      color: #991b1b;
+      background: #fef2f2;
+      border-color: #fecaca;
+    }
+    .auth-success {
+      color: #166534;
+      background: #f0fdf4;
+      border-color: #bbf7d0;
+    }
+    .auth-warning {
+      color: #92400e;
+      background: #fffbeb;
+      border-color: #fde68a;
+    }
+    .muted {
+      color: var(--muted);
+    }
+    .meta-card {
+      display: grid;
+      gap: 10px;
+      margin-bottom: 16px;
+      border: 1px solid var(--line);
+      border-radius: 8px;
+      padding: 16px;
+      background: var(--panel);
+    }
+    .meta-card h2,
+    .token-once h2 {
+      margin: 0;
+      font-size: 18px;
+    }
+    .data-table {
+      width: 100%;
+      border-collapse: collapse;
+      font-size: 13px;
+    }
+    .data-table th,
+    .data-table td {
+      padding: 9px 10px;
+      border-bottom: 1px solid var(--line);
+      text-align: left;
+      vertical-align: middle;
+    }
+    .data-table th {
+      color: var(--faint);
+      font-family: var(--mono);
+      font-size: 11.5px;
+      letter-spacing: 0.06em;
+      text-transform: uppercase;
+    }
+    .data-table form {
+      margin: 0;
+    }
     .editor-fields {
       display: grid;
       grid-template-columns: minmax(220px, 1fr) 180px 180px minmax(160px, 240px);
@@ -807,6 +1154,19 @@ export function pageShell({ title, body, head = "", afterBody = "", locale = DEF
       text-transform: uppercase;
       color: var(--faint);
     }
+    .check-field {
+      display: flex;
+      gap: 8px;
+      align-items: center;
+      min-height: 38px;
+      color: var(--muted);
+      font-size: 13px;
+    }
+    .check-field input {
+      width: auto;
+      min-height: 0;
+      padding: 0;
+    }
     input,
     select,
     textarea {
@@ -835,6 +1195,9 @@ export function pageShell({ title, body, head = "", afterBody = "", locale = DEF
       white-space: pre;
       overflow: auto;
     }
+    .compact-textarea {
+      min-height: 160px;
+    }
     .textarea-enhanced {
       display: none;
     }
@@ -1573,6 +1936,13 @@ function languageSwitcher(view) {
   return `<span class="language-switcher">${english}${korean}</span>`;
 }
 
+function authNav(user) {
+  if (!user) {
+    return `<a href="/login">Sign in</a>`;
+  }
+  return `${user.role === "admin" ? `<a href="/admin/users">Users</a>` : ""}<a href="/account">Account</a>`;
+}
+
 export function escapeHtml(value) {
   return String(value)
     .replaceAll("&", "&amp;")

package/src/lib/security.js

@@ -57,6 +57,10 @@ export function requireToken({ request, url, body = {}, config = securityConfig(
   }
 }
 
+export function requestToken({ request, url, body = {} }) {
+  return extractToken({ request, url, body });
+}
+
 export function scanForSecrets(content) {
   const text = String(content ?? "");
   const findings = [];

package/src/lib/service.js

@@ -230,6 +230,7 @@ function serviceConfig(options = {}) {
     apiToken: options.apiToken || "",
     shareMode: options.shareMode || "",
     allowSecrets: Boolean(options.allowSecrets),
+    mcpHttp: Boolean(options.mcpHttp),
     taskName: options.taskName || DEFAULT_TASK_NAME
   };
 }
@@ -251,6 +252,9 @@ function serverArgs(config, options = {}) {
   if (config.allowSecrets) {
     args.push("--allow-secrets");
   }
+  if (config.mcpHttp) {
+    args.push("--mcp-http");
+  }
   if (options.includeApiTokenArg && config.apiToken) {
     args.push("--api-token", config.apiToken);
   }