@acms-subir/core 0.1.0 → 0.3.0

package/src/pages/admin/pages/index.astro

@@ -1,8 +1,9 @@
 ---
 import Admin from '../../../layouts/Admin.astro';
 import Modal from '../../../components/Modal.astro';
+import ContentList, { type ContentItem } from '../../../components/ContentList.astro';
 import { getRepo } from '../../../lib/repo';
-import { slugify } from '../../../lib/schema';
+import { slugify, type Status } from '../../../lib/schema';
 import { I18N, localeHomeUrl } from '../../../lib/i18n';
 
 const repo = await getRepo(Astro.locals);
@@ -19,21 +20,44 @@ if (Astro.request.method === 'POST') {
     const page = await repo.createPage({ title, slug });
     return Astro.redirect(`/admin/pages/${page.id}`);
   }
-  if (op === 'delete') {
-    await repo.deletePage(String(form.get('id')));
+  if (op === 'bulk') {
+    const to = String(form.get('to'));
+    for (const id of form.getAll('ids').map(String).filter(Boolean)) {
+      if (to === 'delete') await repo.deletePage(id);
+      else if (to === 'published' || to === 'draft' || to === 'archived') await repo.updatePage(id, { status: to as Status });
+    }
     return Astro.redirect('/admin/pages');
   }
 }
 
-const pages = await repo.listPages();
+const [pages, settings] = await Promise.all([repo.listPages(), repo.getSettings()]);
 const showNew = Astro.url.searchParams.has('new');
-const fmt = (ts: number) => new Date(ts).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' });
+const items: ContentItem[] = [...pages]
+  .sort((a, b) => Number(b.isHome) - Number(a.isHome) || b.updatedAt - a.updatedAt)
+  .map((p) => {
+    const path = p.isHome ? localeHomeUrl(p.locale) : `/${p.slug}`;
+    return {
+      id: p.id,
+      href: `/admin/pages/${p.id}`,
+      title: p.title,
+      sub: path,
+      meta: p.isHome ? 'Home page' : '',
+      at: p.updatedAt,
+      status: p.status,
+      edited: Boolean(p.draft),
+      viewHref: p.status === 'published' ? path : undefined,
+      badges: I18N.enabled ? [(p.locale || I18N.defaultLocale).toUpperCase()] : [],
+    };
+  });
 ---
 
 <Admin title="Pages" section="pages">
   <div class="page-head">
-    <h1>Pages</h1>
-    <button class="btn primary" type="button" data-modal="new-page">New page</button>
+    <div>
+      <h1>Pages</h1>
+      <p class="sub">{pages.length} {pages.length === 1 ? 'page' : 'pages'} · static pages and your home page</p>
+    </div>
+    <div class="page-actions"><a class="btn" href="/admin/ai?kind=pages">Create from document</a><button class="btn primary" type="button" data-modal="new-page">New page</button></div>
   </div>
 
   <Modal id="new-page" title="New page" open={showNew}>
@@ -54,47 +78,17 @@ const fmt = (ts: number) => new Date(ts).toLocaleDateString('en-US', { month: 's
         <button class="btn ghost" type="button" data-close>Cancel</button>
         <button class="btn primary" type="submit">Create page</button>
       </div>
-      <p class="hint" style="margin:12px 0 0">Creates a draft and opens the editor.</p>
+      <p class="hint modal-note">Creates a draft and opens the editor.</p>
     </form>
   </Modal>
 
-  <div class="card">
-    <table class="list">
-      <thead><tr><th>Title</th><th>Status</th><th>Updated</th><th></th></tr></thead>
-      <tbody>
-        {pages.map((p) => (
-          <tr>
-            <td>
-              <a class="t-title" href={`/admin/pages/${p.id}`}>{p.title}</a>
-              <div class="t-sub">{p.isHome ? localeHomeUrl(p.locale) : `/${p.slug}`}</div>
-            </td>
-            <td>
-              <span class={`pill ${p.status}`}>{p.status}</span>
-              {p.isHome && <span class="pill home">home</span>}
-              {I18N.enabled && <span class="pill lang">{(p.locale || I18N.defaultLocale).toUpperCase()}</span>}
-            </td>
-            <td class="t-sub">{fmt(p.updatedAt)}</td>
-            <td style="text-align:right">
-              <form class="inline-form" method="post" onsubmit="return confirm('Delete this page?')">
-                <input type="hidden" name="op" value="delete" />
-                <input type="hidden" name="id" value={p.id} />
-                <button class="btn sm ghost danger" type="submit">Delete</button>
-              </form>
-            </td>
-          </tr>
-        ))}
-        {pages.length === 0 && (
-          <tr>
-            <td colspan="4">
-              <div class="empty-state">
-                <b>No pages yet</b>
-                <p>Your site's static pages — about, contact, landing pages — live here.</p>
-                <button class="btn primary" type="button" data-modal="new-page">New page</button>
-              </div>
-            </td>
-          </tr>
-        )}
-      </tbody>
-    </table>
-  </div>
+  {pages.length === 0 ? (
+    <div class="empty-state">
+      <b>No pages yet</b>
+      <p>Your site's static pages — about, contact, landing pages — live here.</p>
+      <button class="btn primary" type="button" data-modal="new-page">New page</button>
+    </div>
+  ) : (
+    <ContentList items={items} noun="page" timeZone={settings.timezone || undefined} groupByMonth={false} />
+  )}
 </Admin>