@fonderie/vue-admin-screens 0.5.0 → 0.7.0

package/dist/index.cjs

@@ -27,6 +27,7 @@ __export(index_exports, {
   CatalogScreen: () => CatalogScreen,
   ConfigScreen: () => ConfigScreen,
   DoctorScreen: () => DoctorScreen,
+  MigrationsScreen: () => MigrationsScreen,
   ModulesScreen: () => ModulesScreen,
   RoutesScreen: () => RoutesScreen,
   SubscriberScreen: () => SubscriberScreen,
@@ -38,7 +39,7 @@ module.exports = __toCommonJS(index_exports);
 // src/screens/AdminShell.ts
 var import_vue_config_admin_screens = require("@fonderie/vue-config-admin-screens");
 var import_vue_courier_admin_screens = require("@fonderie/vue-courier-admin-screens");
-var import_vue13 = require("vue");
+var import_vue14 = require("vue");
 
 // src/styles.ts
 var styles = {
@@ -416,52 +417,133 @@ var RoutesScreen = (0, import_vue7.defineComponent)({
   }
 });
 
-// src/screens/TokensScreen.ts
+// src/screens/MigrationsScreen.ts
 var import_vue_admin7 = require("@fonderie/vue-admin");
 var import_vue8 = require("vue");
+function why(m, everApplied) {
+  if (m.pending.length === 0) return null;
+  if (m.blockedBy) return `Apply "${m.blockedBy}" first \u2014 it runs before this one and is behind.`;
+  if (everApplied && m.pending.some((p) => p.impact === "destructive"))
+    return "Contains a migration that deletes data. No down-migration brings it back \u2014 apply this one through CI or `npm run migrate`.";
+  return null;
+}
+var MigrationsScreen = (0, import_vue8.defineComponent)({
+  name: "FonderieMigrationsScreen",
+  props: { client: { type: Object, required: true } },
+  setup(props) {
+    const { report, isLoading, error, refresh, apply } = (0, import_vue_admin7.useAdminMigrations)(props.client);
+    const section = (m, everApplied) => {
+      const blocked = why(m, everApplied);
+      const files = m.pending.map((p) => p.file);
+      return (0, import_vue8.h)("section", { style: { marginBottom: "24px" } }, [
+        (0, import_vue8.h)("h2", { style: styles.subtitle }, `${m.name} \u2014 ${m.pending.length} pending`),
+        (0, import_vue8.h)(
+          "ul",
+          m.pending.map(
+            (p) => (0, import_vue8.h)("li", [
+              (0, import_vue8.h)("code", p.file),
+              " ",
+              (0, import_vue8.h)(
+                "span",
+                { style: p.impact === "destructive" ? styles.bad : styles.advice },
+                p.impact
+              ),
+              p.destructive.length > 0 ? (0, import_vue8.h)(
+                "ul",
+                p.destructive.map((s) => (0, import_vue8.h)("li", [(0, import_vue8.h)("code", s.slice(0, 120))]))
+              ) : null
+            ])
+          )
+        ),
+        blocked ? (0, import_vue8.h)("p", { style: styles.advice }, blocked) : (0, import_vue8.h)(
+          "button",
+          {
+            type: "button",
+            style: styles.button,
+            disabled: isLoading.value || !m.appliable,
+            onClick: () => {
+              if (window.confirm(
+                `Apply ${m.pending.length} migration(s) to "${m.name}"? This changes the database schema.`
+              ))
+                void apply(m.name, files).catch(() => {
+                });
+            }
+          },
+          `Apply ${m.pending.length} migration${m.pending.length === 1 ? "" : "s"}`
+        )
+      ]);
+    };
+    return () => page(
+      "Migrations",
+      { isLoading, error },
+      () => {
+        const r = report.value;
+        if (!r) return null;
+        const behind = r.modules.filter((m) => m.pending.length > 0);
+        if (behind.length === 0) return (0, import_vue8.h)("p", { style: styles.ok }, "Every module is up to date.");
+        return [
+          r.everApplied ? null : (0, import_vue8.h)(
+            "p",
+            { style: styles.advice },
+            "This database has never been migrated \u2014 treating it as a first install, so nothing is held back."
+          ),
+          ...behind.map((m) => section(m, r.everApplied))
+        ].filter(Boolean);
+      },
+      [refreshButton("Refresh", isLoading.value, () => void refresh())],
+      {
+        errorText: (e) => e.status === 403 ? "Applying migrations needs a token with the write scope." : e.explanation
+      }
+    );
+  }
+});
+
+// src/screens/TokensScreen.ts
+var import_vue_admin8 = require("@fonderie/vue-admin");
+var import_vue9 = require("vue");
 var ALL = ["read", "write", "secrets"];
-var TokensScreen = (0, import_vue8.defineComponent)({
+var TokensScreen = (0, import_vue9.defineComponent)({
   name: "FonderieTokensScreen",
   props: { client: { type: Object, required: true } },
   setup(props) {
-    const { report, isLoading, error, issue, revoke } = (0, import_vue_admin7.useAdminTokens)(props.client);
-    const name = (0, import_vue8.ref)("");
-    const scopes = (0, import_vue8.ref)(["read"]);
-    const days = (0, import_vue8.ref)("");
-    const minted = (0, import_vue8.ref)(null);
+    const { report, isLoading, error, issue, revoke } = (0, import_vue_admin8.useAdminTokens)(props.client);
+    const name = (0, import_vue9.ref)("");
+    const scopes = (0, import_vue9.ref)(["read"]);
+    const days = (0, import_vue9.ref)("");
+    const minted = (0, import_vue9.ref)(null);
     const toggle = (s) => scopes.value = scopes.value.includes(s) ? scopes.value.filter((x) => x !== s) : [...scopes.value, s];
     return () => {
       const r = report.value;
-      return (0, import_vue8.h)("div", { style: styles.container }, [
-        (0, import_vue8.h)("h1", { style: styles.title }, "Access"),
-        error.value ? (0, import_vue8.h)(
+      return (0, import_vue9.h)("div", { style: styles.container }, [
+        (0, import_vue9.h)("h1", { style: styles.title }, "Access"),
+        error.value ? (0, import_vue9.h)(
           "p",
           { style: styles.error, role: "alert" },
           error.value.status === 401 ? "Issuing and revoking need the root token (the one in your deployment config)." : error.value.explanation
         ) : null,
-        (0, import_vue8.h)("h2", { style: styles.subtitle }, "Root token"),
-        r ? (0, import_vue8.h)("p", [
-          (0, import_vue8.h)(
+        (0, import_vue9.h)("h2", { style: styles.subtitle }, "Root token"),
+        r ? (0, import_vue9.h)("p", [
+          (0, import_vue9.h)(
             "span",
             { style: r.admin.ok ? styles.ok : styles.bad },
             r.admin.ok ? "strong" : "weak"
           ),
           ...r.admin.problems.map(
-            (p) => (0, import_vue8.h)("div", { key: p.message, style: styles.bad }, p.message)
+            (p) => (0, import_vue9.h)("div", { key: p.message, style: styles.bad }, p.message)
           )
         ]) : null,
-        (0, import_vue8.h)("h2", { style: styles.subtitle }, "Issued tokens"),
-        r?.issued === null ? (0, import_vue8.h)(
+        (0, import_vue9.h)("h2", { style: styles.subtitle }, "Issued tokens"),
+        r?.issued === null ? (0, import_vue9.h)(
           "p",
           { style: styles.muted },
           "Issuing is off \u2014 give AdminModule a store and run its migrations."
         ) : [
-          minted.value ? (0, import_vue8.h)("p", { style: styles.ok }, [
+          minted.value ? (0, import_vue9.h)("p", { style: styles.ok }, [
             "Copy this now \u2014 it is never shown again. ",
-            (0, import_vue8.h)("span", { style: styles.mono }, minted.value.token),
+            (0, import_vue9.h)("span", { style: styles.mono }, minted.value.token),
             ` (${minted.value.name})`
           ]) : null,
-          (0, import_vue8.h)(
+          (0, import_vue9.h)(
             "form",
             {
               style: styles.toolbar,
@@ -481,7 +563,7 @@ var TokensScreen = (0, import_vue8.defineComponent)({
               }
             },
             [
-              (0, import_vue8.h)("input", {
+              (0, import_vue9.h)("input", {
                 value: name.value,
                 onInput: (e) => name.value = e.target.value,
                 placeholder: "name",
@@ -489,8 +571,8 @@ var TokensScreen = (0, import_vue8.defineComponent)({
                 "aria-label": "Name"
               }),
               ...ALL.map(
-                (s) => (0, import_vue8.h)("label", { key: s, style: { ...styles.badge, cursor: "pointer" } }, [
-                  (0, import_vue8.h)("input", {
+                (s) => (0, import_vue9.h)("label", { key: s, style: { ...styles.badge, cursor: "pointer" } }, [
+                  (0, import_vue9.h)("input", {
                     type: "checkbox",
                     checked: scopes.value.includes(s),
                     onChange: () => toggle(s)
@@ -498,14 +580,14 @@ var TokensScreen = (0, import_vue8.defineComponent)({
                   ` ${s}`
                 ])
               ),
-              (0, import_vue8.h)("input", {
+              (0, import_vue9.h)("input", {
                 value: days.value,
                 onInput: (e) => days.value = e.target.value,
                 placeholder: "days (optional)",
                 style: { ...styles.button, cursor: "text", width: "140px" },
                 "aria-label": "Days"
               }),
-              (0, import_vue8.h)(
+              (0, import_vue9.h)(
                 "button",
                 {
                   type: "submit",
@@ -519,10 +601,10 @@ var TokensScreen = (0, import_vue8.defineComponent)({
           r?.issued && r.issued.length > 0 ? table(
             ["Name", "Scopes", "Created", "Expires", "Last used", ""],
             r.issued.map(
-              (t) => (0, import_vue8.h)("tr", { key: t.id }, [
+              (t) => (0, import_vue9.h)("tr", { key: t.id }, [
                 td([
                   t.name,
-                  t.revokedAt ? (0, import_vue8.h)("span", { style: styles.badge }, " revoked") : ""
+                  t.revokedAt ? (0, import_vue9.h)("span", { style: styles.badge }, " revoked") : ""
                 ]),
                 td(t.scopes.join(", "), styles.mono),
                 td(
@@ -538,7 +620,7 @@ var TokensScreen = (0, import_vue8.defineComponent)({
                   styles.muted
                 ),
                 td(
-                  t.revokedAt ? "" : (0, import_vue8.h)(
+                  t.revokedAt ? "" : (0, import_vue9.h)(
                     "button",
                     {
                       type: "button",
@@ -556,21 +638,21 @@ var TokensScreen = (0, import_vue8.defineComponent)({
                 )
               ])
             )
-          ) : (0, import_vue8.h)("p", { style: styles.muted }, "None issued.")
+          ) : (0, import_vue9.h)("p", { style: styles.muted }, "None issued.")
         ],
-        (0, import_vue8.h)("h2", { style: styles.subtitle }, "Legacy per-brick tokens"),
-        r && r.legacy.length === 0 ? (0, import_vue8.h)(
+        (0, import_vue9.h)("h2", { style: styles.subtitle }, "Legacy per-brick tokens"),
+        r && r.legacy.length === 0 ? (0, import_vue9.h)(
           "p",
           { style: styles.muted },
           "None \u2014 every brick's admin surface goes through this token."
-        ) : (0, import_vue8.h)(
+        ) : (0, import_vue9.h)(
           "ul",
           { style: styles.list },
           (r?.legacy ?? []).map(
-            (l) => (0, import_vue8.h)("li", { key: l.module, style: styles.row }, [
-              (0, import_vue8.h)("span", { style: styles.mono }, l.module),
+            (l) => (0, import_vue9.h)("li", { key: l.module, style: styles.row }, [
+              (0, import_vue9.h)("span", { style: styles.mono }, l.module),
               " ",
-              (0, import_vue8.h)(
+              (0, import_vue9.h)(
                 "span",
                 { style: styles.muted },
                 "still registers its standalone routes with its own token (deprecated)"
@@ -584,38 +666,50 @@ var TokensScreen = (0, import_vue8.defineComponent)({
 });
 
 // src/screens/UsersScreen.ts
-var import_vue_admin8 = require("@fonderie/vue-admin");
-var import_vue9 = require("vue");
-var UsersScreen = (0, import_vue9.defineComponent)({
+var import_vue_admin9 = require("@fonderie/vue-admin");
+var import_vue10 = require("vue");
+var UsersScreen = (0, import_vue10.defineComponent)({
   name: "FonderieUsersScreen",
-  props: { client: { type: Object, required: true } },
+  props: {
+    client: { type: Object, required: true },
+    pageSize: { type: Number, default: 50 }
+  },
   setup(props) {
-    const input = (0, import_vue9.ref)("");
-    const email = (0, import_vue9.ref)("");
-    const { user, isLoading, error, suspend, unsuspend, revokeSessions } = (0, import_vue_admin8.useAdminUser)(
+    const input = (0, import_vue10.ref)("");
+    const email = (0, import_vue10.ref)("");
+    const selectedId = (0, import_vue10.ref)("");
+    const list = (0, import_vue_admin9.useAdminUsers)(props.client, { limit: props.pageSize });
+    const { user, isLoading, error, suspend, unsuspend, revokeSessions } = (0, import_vue_admin9.useAdminUser)(
       props.client,
-      { email }
+      { email, id: selectedId }
     );
-    const userId = (0, import_vue9.computed)(() => user.value?.id ?? null);
-    const sessions = (0, import_vue_admin8.useAdminUserSessions)(props.client, userId);
-    const history = (0, import_vue_admin8.useAdminLoginHistory)(props.client, userId, { limit: 20 });
-    const yesNo = (v) => (0, import_vue9.h)("span", { style: v ? styles.ok : styles.muted }, v ? "yes" : "no");
-    const row = (k, v) => (0, import_vue9.h)("tr", [td(k), td(v)]);
+    const userId = (0, import_vue10.computed)(() => user.value?.id ?? null);
+    const sessions = (0, import_vue_admin9.useAdminUserSessions)(props.client, userId);
+    const history = (0, import_vue_admin9.useAdminLoginHistory)(props.client, userId, { limit: 20 });
+    const showList = (0, import_vue10.computed)(() => !email.value && !selectedId.value);
+    const yesNo = (v) => (0, import_vue10.h)("span", { style: v ? styles.ok : styles.muted }, v ? "yes" : "no");
+    const row = (k, v) => (0, import_vue10.h)("tr", [td(k), td(v)]);
+    const clear = () => {
+      email.value = "";
+      selectedId.value = "";
+      input.value = "";
+    };
     return () => {
       const u = user.value;
-      return (0, import_vue9.h)("div", { style: styles.container }, [
-        (0, import_vue9.h)("h1", { style: styles.title }, "Users"),
-        (0, import_vue9.h)(
+      return (0, import_vue10.h)("div", { style: styles.container }, [
+        (0, import_vue10.h)("h1", { style: styles.title }, "Users"),
+        (0, import_vue10.h)(
           "form",
           {
             style: styles.toolbar,
             onSubmit: (e) => {
               e.preventDefault();
+              selectedId.value = "";
               email.value = input.value.trim();
             }
           },
           [
-            (0, import_vue9.h)("input", {
+            (0, import_vue10.h)("input", {
               type: "email",
               value: input.value,
               onInput: (e) => input.value = e.target.value,
@@ -623,28 +717,67 @@ var UsersScreen = (0, import_vue9.defineComponent)({
               style: { ...styles.button, cursor: "text", minWidth: "280px" },
               "aria-label": "Email"
             }),
-            (0, import_vue9.h)(
+            (0, import_vue10.h)(
               "button",
               { type: "submit", style: styles.button, disabled: isLoading.value },
               "Look up"
-            )
+            ),
+            showList.value ? refreshButton("Refresh", list.isLoading.value, () => void list.refresh()) : refreshButton("\u2190 All users", false, clear)
           ]
         ),
-        error.value ? (0, import_vue9.h)(
+        showList.value ? (0, import_vue10.h)("div", [
+          list.error.value ? (0, import_vue10.h)("p", { style: styles.error, role: "alert" }, list.error.value.explanation) : null,
+          list.users.value.length === 0 && !list.isLoading.value ? (0, import_vue10.h)("p", { style: styles.muted }, "No users yet.") : table(
+            ["Email", "Name", "Created", "Status"],
+            list.users.value.map(
+              (u2) => (0, import_vue10.h)("tr", { key: u2.id }, [
+                td(
+                  (0, import_vue10.h)(
+                    "button",
+                    {
+                      type: "button",
+                      style: { ...styles.navItem, padding: 0 },
+                      onClick: () => selectedId.value = u2.id
+                    },
+                    u2.email
+                  )
+                ),
+                td(
+                  `${u2.firstName ?? ""} ${u2.lastName ?? ""}`.trim() || (0, import_vue10.h)("span", { style: styles.muted }, "\u2014")
+                ),
+                td(new Date(u2.createdAt).toLocaleDateString()),
+                td(
+                  u2.suspended ? (0, import_vue10.h)("span", { style: styles.badge }, "suspended") : u2.deletedAt ? (0, import_vue10.h)("span", { style: styles.badge }, "deleted") : (0, import_vue10.h)("span", { style: styles.muted }, "active")
+                )
+              ])
+            )
+          ),
+          list.isLoading.value ? (0, import_vue10.h)("p", { style: styles.status }, "Loading\u2026") : null,
+          list.hasMore.value && !list.isLoading.value ? (0, import_vue10.h)(
+            "button",
+            {
+              type: "button",
+              style: { ...styles.button, marginTop: "8px" },
+              onClick: () => void list.loadMore()
+            },
+            "Load more"
+          ) : null
+        ]) : null,
+        error.value ? (0, import_vue10.h)(
           "p",
           { style: styles.error, role: "alert" },
           error.value.status === 404 ? "No user with that email." : error.value.explanation
         ) : null,
         u ? [
-          (0, import_vue9.h)("h2", { style: styles.subtitle }, [
+          (0, import_vue10.h)("h2", { style: styles.subtitle }, [
             u.firstName || u.lastName ? `${u.firstName} ${u.lastName}`.trim() : u.email,
             " ",
-            u.suspended ? (0, import_vue9.h)("span", { style: styles.badge }, "suspended") : null,
-            u.deletedAt ? (0, import_vue9.h)("span", { style: styles.badge }, "deleted") : null
+            u.suspended ? (0, import_vue10.h)("span", { style: styles.badge }, "suspended") : null,
+            u.deletedAt ? (0, import_vue10.h)("span", { style: styles.badge }, "deleted") : null
           ]),
-          (0, import_vue9.h)("table", { style: styles.table }, [
-            (0, import_vue9.h)("tbody", [
-              row("id", (0, import_vue9.h)("span", { style: styles.mono }, u.id)),
+          (0, import_vue10.h)("table", { style: styles.table }, [
+            (0, import_vue10.h)("tbody", [
+              row("id", (0, import_vue10.h)("span", { style: styles.mono }, u.id)),
               row("email", [u.email, " \xB7 verified ", yesNo(u.isEmailVerified)]),
               row("MFA", yesNo(u.mfaEnabled)),
               row(
@@ -653,12 +786,12 @@ var UsersScreen = (0, import_vue9.defineComponent)({
               ),
               row(
                 "last login",
-                u.lastLogin ? new Date(u.lastLogin).toLocaleString() : (0, import_vue9.h)("span", { style: styles.muted }, "never")
+                u.lastLogin ? new Date(u.lastLogin).toLocaleString() : (0, import_vue10.h)("span", { style: styles.muted }, "never")
               ),
               row("created", new Date(u.createdAt).toLocaleString())
             ])
           ]),
-          (0, import_vue9.h)("div", { style: { ...styles.toolbar, marginTop: "12px" } }, [
+          (0, import_vue10.h)("div", { style: { ...styles.toolbar, marginTop: "12px" } }, [
             u.suspended ? refreshButton("Unsuspend", isLoading.value, () => void unsuspend()) : refreshButton("Suspend", isLoading.value, () => void suspend()),
             refreshButton(
               "Sign out everywhere",
@@ -666,17 +799,17 @@ var UsersScreen = (0, import_vue9.defineComponent)({
               () => void revokeSessions().then(() => sessions.refresh())
             )
           ]),
-          (0, import_vue9.h)("h2", { style: styles.subtitle }, "Live sessions"),
-          sessions.sessions.value.length === 0 ? (0, import_vue9.h)("p", { style: styles.muted }, "None.") : (0, import_vue9.h)(
+          (0, import_vue10.h)("h2", { style: styles.subtitle }, "Live sessions"),
+          sessions.sessions.value.length === 0 ? (0, import_vue10.h)("p", { style: styles.muted }, "None.") : (0, import_vue10.h)(
             "ul",
             { style: styles.list },
             sessions.sessions.value.map(
-              (s) => (0, import_vue9.h)("li", { key: s.id, style: styles.row }, [
-                (0, import_vue9.h)("span", { style: styles.mono }, s.ipAddress ?? "\u2014"),
+              (s) => (0, import_vue10.h)("li", { key: s.id, style: styles.row }, [
+                (0, import_vue10.h)("span", { style: styles.mono }, s.ipAddress ?? "\u2014"),
                 " ",
-                (0, import_vue9.h)("span", { style: styles.muted }, s.userAgent ?? ""),
+                (0, import_vue10.h)("span", { style: styles.muted }, s.userAgent ?? ""),
                 " ",
-                (0, import_vue9.h)(
+                (0, import_vue10.h)(
                   "span",
                   { style: styles.muted },
                   `since ${new Date(s.createdAt).toLocaleString()}`
@@ -684,25 +817,25 @@ var UsersScreen = (0, import_vue9.defineComponent)({
               ])
             )
           ),
-          (0, import_vue9.h)("h2", { style: styles.subtitle }, "Recent sign-ins"),
-          history.events.value.length === 0 && !history.isLoading.value ? (0, import_vue9.h)("p", { style: styles.muted }, "None recorded.") : (0, import_vue9.h)(
+          (0, import_vue10.h)("h2", { style: styles.subtitle }, "Recent sign-ins"),
+          history.events.value.length === 0 && !history.isLoading.value ? (0, import_vue10.h)("p", { style: styles.muted }, "None recorded.") : (0, import_vue10.h)(
             "ul",
             { style: styles.list },
             history.events.value.map(
-              (e) => (0, import_vue9.h)("li", { key: e.id, style: styles.row }, [
-                (0, import_vue9.h)(
+              (e) => (0, import_vue10.h)("li", { key: e.id, style: styles.row }, [
+                (0, import_vue10.h)(
                   "span",
                   { style: e.outcome === "success" ? styles.ok : styles.bad },
                   e.outcome
                 ),
                 " ",
-                (0, import_vue9.h)("span", { style: styles.muted }, e.method),
+                (0, import_vue10.h)("span", { style: styles.muted }, e.method),
                 " ",
-                (0, import_vue9.h)("span", { style: styles.muted }, new Date(e.createdAt).toLocaleString())
+                (0, import_vue10.h)("span", { style: styles.muted }, new Date(e.createdAt).toLocaleString())
               ])
             )
           ),
-          history.hasMore.value && !history.isLoading.value ? (0, import_vue9.h)(
+          history.hasMore.value && !history.isLoading.value ? (0, import_vue10.h)(
             "button",
             {
               type: "button",
@@ -718,26 +851,26 @@ var UsersScreen = (0, import_vue9.defineComponent)({
 });
 
 // src/screens/CatalogScreen.ts
-var import_vue_admin9 = require("@fonderie/vue-admin");
-var import_vue10 = require("vue");
-var CatalogScreen = (0, import_vue10.defineComponent)({
+var import_vue_admin10 = require("@fonderie/vue-admin");
+var import_vue11 = require("vue");
+var CatalogScreen = (0, import_vue11.defineComponent)({
   name: "FonderieCatalogScreen",
   props: { client: { type: Object, required: true } },
   setup(props) {
-    const { catalog, isLoading, error, refresh, deletePlan } = (0, import_vue_admin9.useAdminCatalog)(props.client);
+    const { catalog, isLoading, error, refresh, deletePlan } = (0, import_vue_admin10.useAdminCatalog)(props.client);
     const money = (v) => v == null ? "\u2014" : (v / 100).toFixed(2);
     return () => {
       const c = catalog.value;
-      return (0, import_vue10.h)("div", { style: styles.container }, [
-        (0, import_vue10.h)("div", { style: styles.toolbar }, [
-          (0, import_vue10.h)("h1", { style: { ...styles.title, marginBottom: 0 } }, "Catalog"),
+      return (0, import_vue11.h)("div", { style: styles.container }, [
+        (0, import_vue11.h)("div", { style: styles.toolbar }, [
+          (0, import_vue11.h)("h1", { style: { ...styles.title, marginBottom: 0 } }, "Catalog"),
           refreshButton("Refresh", isLoading.value, () => void refresh())
         ]),
-        error.value ? (0, import_vue10.h)("p", { style: styles.error, role: "alert" }, error.value.explanation) : null,
-        isLoading.value && !c ? (0, import_vue10.h)("p", { style: styles.status }, "Loading\u2026") : null,
+        error.value ? (0, import_vue11.h)("p", { style: styles.error, role: "alert" }, error.value.explanation) : null,
+        isLoading.value && !c ? (0, import_vue11.h)("p", { style: styles.status }, "Loading\u2026") : null,
         c ? [
-          (0, import_vue10.h)("h2", { style: styles.subtitle }, "Configured (code)"),
-          (0, import_vue10.h)(
+          (0, import_vue11.h)("h2", { style: styles.subtitle }, "Configured (code)"),
+          (0, import_vue11.h)(
             "pre",
             {
               style: {
@@ -749,14 +882,14 @@ var CatalogScreen = (0, import_vue10.defineComponent)({
             },
             JSON.stringify(c.configured, null, 2)
           ),
-          (0, import_vue10.h)("h2", { style: styles.subtitle }, "Stored (database)"),
-          c.stored.length === 0 ? (0, import_vue10.h)("p", { style: styles.muted }, "No stored plans.") : table(
+          (0, import_vue11.h)("h2", { style: styles.subtitle }, "Stored (database)"),
+          c.stored.length === 0 ? (0, import_vue11.h)("p", { style: styles.muted }, "No stored plans.") : table(
             ["Plan", "Tier", "Seats", "Monthly", "Yearly", "Trial", ""],
             c.stored.map(
-              (p) => (0, import_vue10.h)("tr", { key: p.id }, [
+              (p) => (0, import_vue11.h)("tr", { key: p.id }, [
                 td([
-                  (0, import_vue10.h)("strong", p.name),
-                  p.description ? (0, import_vue10.h)("div", { style: styles.muted }, p.description) : ""
+                  (0, import_vue11.h)("strong", p.name),
+                  p.description ? (0, import_vue11.h)("div", { style: styles.muted }, p.description) : ""
                 ]),
                 td(String(p.tier)),
                 td(p.seats == null ? "\u221E" : String(p.seats)),
@@ -764,7 +897,7 @@ var CatalogScreen = (0, import_vue10.defineComponent)({
                 td(money(p.pricing?.yearly)),
                 td(p.trialDays ? `${p.trialDays} d` : "\u2014"),
                 td(
-                  (0, import_vue10.h)(
+                  (0, import_vue11.h)(
                     "button",
                     {
                       type: "button",
@@ -788,20 +921,30 @@ var CatalogScreen = (0, import_vue10.defineComponent)({
 });
 
 // src/screens/SubscriberScreen.ts
-var import_vue_admin10 = require("@fonderie/vue-admin");
-var import_vue11 = require("vue");
-var SubscriberScreen = (0, import_vue11.defineComponent)({
+var import_vue_admin11 = require("@fonderie/vue-admin");
+var import_vue12 = require("vue");
+var SubscriberScreen = (0, import_vue12.defineComponent)({
   name: "FonderieSubscriberScreen",
-  props: { client: { type: Object, required: true } },
+  props: {
+    client: { type: Object, required: true },
+    pageSize: { type: Number, default: 50 }
+  },
   setup(props) {
-    const type = (0, import_vue11.ref)("user");
-    const idInput = (0, import_vue11.ref)("");
-    const subscriber = (0, import_vue11.ref)(null);
-    const { subscription, wallet, ledger, hasMoreLedger, isLoading, error, loadMoreLedger, grant } = (0, import_vue_admin10.useAdminSubscriber)(props.client, subscriber, { limit: 20 });
-    const amount = (0, import_vue11.ref)("");
-    const note = (0, import_vue11.ref)("");
-    const granted = (0, import_vue11.ref)(null);
-    const input = (model, placeholder, extra = {}) => (0, import_vue11.h)("input", {
+    const type = (0, import_vue12.ref)("user");
+    const idInput = (0, import_vue12.ref)("");
+    const subscriber = (0, import_vue12.ref)(null);
+    const list = (0, import_vue_admin11.useAdminSubscribers)(props.client, { limit: props.pageSize });
+    const { subscription, wallet, ledger, hasMoreLedger, isLoading, error, loadMoreLedger, grant } = (0, import_vue_admin11.useAdminSubscriber)(props.client, subscriber, { limit: 20 });
+    const open = (t, id) => {
+      granted.value = null;
+      type.value = t;
+      idInput.value = id;
+      subscriber.value = { type: t, id };
+    };
+    const amount = (0, import_vue12.ref)("");
+    const note = (0, import_vue12.ref)("");
+    const granted = (0, import_vue12.ref)(null);
+    const input = (model, placeholder, extra = {}) => (0, import_vue12.h)("input", {
       value: model.value,
       onInput: (e) => model.value = e.target.value,
       placeholder,
@@ -811,9 +954,9 @@ var SubscriberScreen = (0, import_vue11.defineComponent)({
     return () => {
       const s = subscription.value;
       const w = wallet.value;
-      return (0, import_vue11.h)("div", { style: styles.container }, [
-        (0, import_vue11.h)("h1", { style: styles.title }, "Subscriber"),
-        (0, import_vue11.h)(
+      return (0, import_vue12.h)("div", { style: styles.container }, [
+        (0, import_vue12.h)("h1", { style: styles.title }, "Subscriber"),
+        (0, import_vue12.h)(
           "form",
           {
             style: styles.toolbar,
@@ -824,7 +967,7 @@ var SubscriberScreen = (0, import_vue11.defineComponent)({
             }
           },
           [
-            (0, import_vue11.h)(
+            (0, import_vue12.h)(
               "select",
               {
                 value: type.value,
@@ -833,49 +976,109 @@ var SubscriberScreen = (0, import_vue11.defineComponent)({
                 "aria-label": "Type"
               },
               [
-                (0, import_vue11.h)("option", { value: "user" }, "user"),
-                (0, import_vue11.h)("option", { value: "workspace" }, "workspace")
+                (0, import_vue12.h)("option", { value: "user" }, "user"),
+                (0, import_vue12.h)("option", { value: "workspace" }, "workspace")
               ]
             ),
             input(idInput, "subscriber id", { minWidth: "280px" }),
-            (0, import_vue11.h)(
+            (0, import_vue12.h)(
               "button",
               { type: "submit", style: styles.button, disabled: isLoading.value },
               "Look up"
+            ),
+            subscriber.value ? (0, import_vue12.h)(
+              "button",
+              {
+                type: "button",
+                style: styles.button,
+                onClick: () => {
+                  subscriber.value = null;
+                  idInput.value = "";
+                  granted.value = null;
+                }
+              },
+              "\u2190 All subscribers"
+            ) : (0, import_vue12.h)(
+              "button",
+              {
+                type: "button",
+                style: styles.button,
+                disabled: list.isLoading.value,
+                onClick: () => void list.refresh()
+              },
+              "Refresh"
             )
           ]
         ),
-        error.value ? (0, import_vue11.h)("p", { style: styles.error, role: "alert" }, error.value.explanation) : null,
+        !subscriber.value ? (0, import_vue12.h)("div", [
+          list.error.value ? (0, import_vue12.h)("p", { style: styles.error, role: "alert" }, list.error.value.explanation) : null,
+          list.subscriptions.value.length === 0 && !list.isLoading.value ? (0, import_vue12.h)("p", { style: styles.muted }, "No subscribers yet.") : table(
+            ["Subscriber", "Plan", "Status", "Renews"],
+            list.subscriptions.value.map(
+              (sub) => (0, import_vue12.h)("tr", { key: sub.id }, [
+                td(
+                  (0, import_vue12.h)(
+                    "button",
+                    {
+                      type: "button",
+                      style: { ...styles.navItem, padding: 0, ...styles.mono },
+                      onClick: () => open(sub.subscriberType, sub.subscriberId)
+                    },
+                    `${sub.subscriberType}/${sub.subscriberId}`
+                  )
+                ),
+                td(`${sub.plan} \xB7 ${sub.interval}`),
+                td(
+                  sub.cancelAtPeriodEnd ? [sub.status, " ", (0, import_vue12.h)("span", { style: styles.badge }, "cancels")] : sub.status
+                ),
+                td(
+                  sub.currentPeriodEnd ? new Date(sub.currentPeriodEnd).toLocaleDateString() : (0, import_vue12.h)("span", { style: styles.muted }, "\u2014")
+                )
+              ])
+            )
+          ),
+          list.isLoading.value ? (0, import_vue12.h)("p", { style: styles.status }, "Loading\u2026") : null,
+          list.hasMore.value && !list.isLoading.value ? (0, import_vue12.h)(
+            "button",
+            {
+              type: "button",
+              style: { ...styles.button, marginTop: "8px" },
+              onClick: () => void list.loadMore()
+            },
+            "Load more"
+          ) : null
+        ]) : null,
+        error.value ? (0, import_vue12.h)("p", { style: styles.error, role: "alert" }, error.value.explanation) : null,
         subscriber.value && !isLoading.value ? [
-          (0, import_vue11.h)("h2", { style: styles.subtitle }, "Subscription"),
-          s ? (0, import_vue11.h)("table", { style: styles.table }, [
-            (0, import_vue11.h)("tbody", [
-              (0, import_vue11.h)("tr", [td("plan"), td([(0, import_vue11.h)("strong", s.plan), ` \xB7 ${s.interval}`])]),
-              (0, import_vue11.h)("tr", [
+          (0, import_vue12.h)("h2", { style: styles.subtitle }, "Subscription"),
+          s ? (0, import_vue12.h)("table", { style: styles.table }, [
+            (0, import_vue12.h)("tbody", [
+              (0, import_vue12.h)("tr", [td("plan"), td([(0, import_vue12.h)("strong", s.plan), ` \xB7 ${s.interval}`])]),
+              (0, import_vue12.h)("tr", [
                 td("status"),
                 td(`${s.status}${s.cancelAtPeriodEnd ? " \xB7 cancels at period end" : ""}`)
               ]),
-              (0, import_vue11.h)("tr", [
+              (0, import_vue12.h)("tr", [
                 td("period"),
                 td(
                   `${s.currentPeriodStart ? new Date(s.currentPeriodStart).toLocaleDateString() : "\u2014"} \u2192 ${s.currentPeriodEnd ? new Date(s.currentPeriodEnd).toLocaleDateString() : "\u2014"}`
                 )
               ]),
-              (0, import_vue11.h)("tr", [td("provider"), td(s.providerSubscriptionId ?? "\u2014", styles.mono)])
+              (0, import_vue12.h)("tr", [td("provider"), td(s.providerSubscriptionId ?? "\u2014", styles.mono)])
             ])
-          ]) : (0, import_vue11.h)("p", { style: styles.muted }, "No subscription."),
-          (0, import_vue11.h)("h2", { style: styles.subtitle }, "Wallet"),
+          ]) : (0, import_vue12.h)("p", { style: styles.muted }, "No subscription."),
+          (0, import_vue12.h)("h2", { style: styles.subtitle }, "Wallet"),
           w ? [
-            (0, import_vue11.h)("p", [
-              (0, import_vue11.h)("strong", w.balance),
+            (0, import_vue12.h)("p", [
+              (0, import_vue12.h)("strong", w.balance),
               ` ${w.currency} `,
-              (0, import_vue11.h)(
+              (0, import_vue12.h)(
                 "span",
                 { style: styles.muted },
                 `(granted ${w.granted ?? "0"} \xB7 purchased ${w.purchased ?? "0"}) \xB7 minor units, precision ${w.precision}`
               )
             ]),
-            (0, import_vue11.h)(
+            (0, import_vue12.h)(
               "form",
               {
                 style: styles.toolbar,
@@ -900,7 +1103,7 @@ var SubscriberScreen = (0, import_vue11.defineComponent)({
               [
                 input(amount, "amount (minor units)"),
                 input(note, "reason (optional)", { minWidth: "220px" }),
-                (0, import_vue11.h)(
+                (0, import_vue12.h)(
                   "button",
                   {
                     type: "submit",
@@ -909,14 +1112,14 @@ var SubscriberScreen = (0, import_vue11.defineComponent)({
                   },
                   "Grant"
                 ),
-                granted.value ? (0, import_vue11.h)("span", { style: styles.ok }, granted.value) : null
+                granted.value ? (0, import_vue12.h)("span", { style: styles.ok }, granted.value) : null
               ]
             ),
-            (0, import_vue11.h)("h2", { style: styles.subtitle }, "Ledger"),
-            ledger.value.length === 0 ? (0, import_vue11.h)("p", { style: styles.muted }, "Nothing moved yet.") : table(
+            (0, import_vue12.h)("h2", { style: styles.subtitle }, "Ledger"),
+            ledger.value.length === 0 ? (0, import_vue12.h)("p", { style: styles.muted }, "Nothing moved yet.") : table(
               ["When", "Kind", "Amount", "Note"],
               ledger.value.map(
-                (t) => (0, import_vue11.h)("tr", { key: t.id }, [
+                (t) => (0, import_vue12.h)("tr", { key: t.id }, [
                   td(new Date(t.createdAt).toLocaleString(), styles.muted),
                   td(t.type),
                   td(t.amount, styles.mono),
@@ -924,7 +1127,7 @@ var SubscriberScreen = (0, import_vue11.defineComponent)({
                 ])
               )
             ),
-            hasMoreLedger.value ? (0, import_vue11.h)(
+            hasMoreLedger.value ? (0, import_vue12.h)(
               "button",
               {
                 type: "button",
@@ -933,7 +1136,7 @@ var SubscriberScreen = (0, import_vue11.defineComponent)({
               },
               "Load more"
             ) : null
-          ] : (0, import_vue11.h)(
+          ] : (0, import_vue12.h)(
             "p",
             { style: styles.muted },
             "No wallet \u2014 billing has no wallet configuration."
@@ -945,31 +1148,31 @@ var SubscriberScreen = (0, import_vue11.defineComponent)({
 });
 
 // src/screens/AuditScreen.ts
-var import_vue_admin11 = require("@fonderie/vue-admin");
-var import_vue12 = require("vue");
-var AuditScreen = (0, import_vue12.defineComponent)({
+var import_vue_admin12 = require("@fonderie/vue-admin");
+var import_vue13 = require("vue");
+var AuditScreen = (0, import_vue13.defineComponent)({
   name: "FonderieAuditScreen",
   props: {
     client: { type: Object, required: true },
     pageSize: { type: Number, default: 50 }
   },
   setup(props) {
-    const draft = (0, import_vue12.ref)({ workspaceId: "", type: "", actorId: "" });
-    const query = (0, import_vue12.ref)({ limit: props.pageSize });
-    const { events, hasMore, isLoading, error, refresh, loadMore } = (0, import_vue_admin11.useAdminAudit)(
+    const draft = (0, import_vue13.ref)({ workspaceId: "", type: "", actorId: "" });
+    const query = (0, import_vue13.ref)({ limit: props.pageSize });
+    const { events, hasMore, isLoading, error, refresh, loadMore } = (0, import_vue_admin12.useAdminAudit)(
       props.client,
       query
     );
-    const field = (key, placeholder) => (0, import_vue12.h)("input", {
+    const field = (key, placeholder) => (0, import_vue13.h)("input", {
       value: draft.value[key],
       onInput: (e) => draft.value = { ...draft.value, [key]: e.target.value },
       placeholder,
       style: { ...styles.button, cursor: "text" },
       "aria-label": placeholder
     });
-    return () => (0, import_vue12.h)("div", { style: styles.container }, [
-      (0, import_vue12.h)("h1", { style: styles.title }, "Audit"),
-      (0, import_vue12.h)(
+    return () => (0, import_vue13.h)("div", { style: styles.container }, [
+      (0, import_vue13.h)("h1", { style: styles.title }, "Audit"),
+      (0, import_vue13.h)(
         "form",
         {
           style: styles.toolbar,
@@ -988,7 +1191,7 @@ var AuditScreen = (0, import_vue12.defineComponent)({
           field("workspaceId", "workspace id (all if empty)"),
           field("type", "event type"),
           field("actorId", "actor id"),
-          (0, import_vue12.h)(
+          (0, import_vue13.h)(
             "button",
             { type: "submit", style: styles.button, disabled: isLoading.value },
             "Filter"
@@ -996,11 +1199,11 @@ var AuditScreen = (0, import_vue12.defineComponent)({
           refreshButton("Refresh", isLoading.value, () => void refresh())
         ]
       ),
-      error.value ? (0, import_vue12.h)("p", { style: styles.error, role: "alert" }, error.value.explanation) : null,
-      events.value.length === 0 && !isLoading.value ? (0, import_vue12.h)("p", { style: styles.muted }, "Nothing recorded for this filter.") : table(
+      error.value ? (0, import_vue13.h)("p", { style: styles.error, role: "alert" }, error.value.explanation) : null,
+      events.value.length === 0 && !isLoading.value ? (0, import_vue13.h)("p", { style: styles.muted }, "Nothing recorded for this filter.") : table(
         ["When", "Type", "Workspace", "Actor", "Request"],
         events.value.map(
-          (e) => (0, import_vue12.h)("tr", { key: e.id }, [
+          (e) => (0, import_vue13.h)("tr", { key: e.id }, [
             td(new Date(e.createdAt).toLocaleString(), styles.muted),
             td(e.type, styles.mono),
             td(String(e.payload["workspaceId"] ?? "\u2014"), styles.mono),
@@ -1009,8 +1212,8 @@ var AuditScreen = (0, import_vue12.defineComponent)({
           ])
         )
       ),
-      isLoading.value ? (0, import_vue12.h)("p", { style: styles.status }, "Loading\u2026") : null,
-      hasMore.value && !isLoading.value ? (0, import_vue12.h)(
+      isLoading.value ? (0, import_vue13.h)("p", { style: styles.status }, "Loading\u2026") : null,
+      hasMore.value && !isLoading.value ? (0, import_vue13.h)(
         "button",
         {
           type: "button",
@@ -1050,11 +1253,12 @@ var NAV = [
     items: [
       { page: "audit", label: "Audit", needs: "audit" },
       { page: "log", label: "Admin log" },
-      { page: "tokens", label: "Access" }
+      { page: "tokens", label: "Access" },
+      { page: "migrations", label: "Migrations" }
     ]
   }
 ];
-var AdminShell = (0, import_vue13.defineComponent)({
+var AdminShell = (0, import_vue14.defineComponent)({
   name: "FonderieAdminShell",
   props: {
     client: { type: Object, required: true },
@@ -1075,15 +1279,15 @@ var AdminShell = (0, import_vue13.defineComponent)({
   },
   emits: { navigate: (_page) => true },
   setup(props, { emit }) {
-    const own = (0, import_vue13.ref)("attention");
-    const current = (0, import_vue13.computed)(() => props.page ?? own.value);
-    const editing = (0, import_vue13.ref)(null);
+    const own = (0, import_vue14.ref)("attention");
+    const current = (0, import_vue14.computed)(() => props.page ?? own.value);
+    const editing = (0, import_vue14.ref)(null);
     const go = (p) => {
       editing.value = null;
       emit("navigate", p);
       if (props.page === void 0) own.value = p;
     };
-    const back = () => (0, import_vue13.h)(
+    const back = () => (0, import_vue14.h)(
       "button",
       { type: "button", style: styles.button, onClick: () => editing.value = null },
       "\u2190 Back"
@@ -1092,43 +1296,45 @@ var AdminShell = (0, import_vue13.defineComponent)({
       const c = props.client;
       switch (current.value) {
         case "attention":
-          return (0, import_vue13.h)(AttentionScreen, { client: c });
+          return (0, import_vue14.h)(AttentionScreen, { client: c });
         case "modules":
-          return (0, import_vue13.h)(ModulesScreen, { client: c });
+          return (0, import_vue14.h)(ModulesScreen, { client: c });
         case "doctor":
-          return (0, import_vue13.h)(DoctorScreen, { client: c });
+          return (0, import_vue14.h)(DoctorScreen, { client: c });
         case "config":
-          return (0, import_vue13.h)(ConfigScreen, { client: c });
+          return (0, import_vue14.h)(ConfigScreen, { client: c });
         case "routes":
-          return (0, import_vue13.h)(RoutesScreen, { client: c });
+          return (0, import_vue14.h)(RoutesScreen, { client: c });
         case "tokens":
-          return (0, import_vue13.h)(TokensScreen, { client: c });
+          return (0, import_vue14.h)(TokensScreen, { client: c });
+        case "migrations":
+          return (0, import_vue14.h)(MigrationsScreen, { client: c });
         case "log":
-          return (0, import_vue13.h)(AdminLogScreen, { client: c });
+          return (0, import_vue14.h)(AdminLogScreen, { client: c });
         case "catalog":
-          return props.billingClient ? (0, import_vue13.h)(CatalogScreen, { client: props.billingClient }) : (0, import_vue13.h)(
+          return props.billingClient ? (0, import_vue14.h)(CatalogScreen, { client: props.billingClient }) : (0, import_vue14.h)(
             "p",
             { style: styles.status },
             "Pass a BillingAdminClient to see the catalog here."
           );
         case "subscriber":
-          return props.billingClient ? (0, import_vue13.h)(SubscriberScreen, { client: props.billingClient }) : (0, import_vue13.h)(
+          return props.billingClient ? (0, import_vue14.h)(SubscriberScreen, { client: props.billingClient }) : (0, import_vue14.h)(
             "p",
             { style: styles.status },
             "Pass a BillingAdminClient to look up subscribers here."
           );
         case "audit":
-          return props.auditClient ? (0, import_vue13.h)(AuditScreen, { client: props.auditClient }) : (0, import_vue13.h)(
+          return props.auditClient ? (0, import_vue14.h)(AuditScreen, { client: props.auditClient }) : (0, import_vue14.h)(
             "p",
             { style: styles.status },
             "Pass an AuditAdminClient to see the audit trail here."
           );
         case "users":
-          return props.authClient ? (0, import_vue13.h)(UsersScreen, { client: props.authClient }) : (0, import_vue13.h)("p", { style: styles.status }, "Pass an AuthAdminClient to look up users here.");
+          return props.authClient ? (0, import_vue14.h)(UsersScreen, { client: props.authClient }) : (0, import_vue14.h)("p", { style: styles.status }, "Pass an AuthAdminClient to look up users here.");
         case "settings": {
           const cc = props.configClient;
           if (!cc)
-            return (0, import_vue13.h)(
+            return (0, import_vue14.h)(
               "p",
               { style: styles.status },
               "Pass a ConfigAdminClient to manage config and secrets here."
@@ -1137,7 +1343,7 @@ var AdminShell = (0, import_vue13.defineComponent)({
           if (e && e.kind !== "template")
             return [
               back(),
-              (0, import_vue13.h)(import_vue_config_admin_screens.ConfigEditorScreen, {
+              (0, import_vue14.h)(import_vue_config_admin_screens.ConfigEditorScreen, {
                 client: cc,
                 kind: e.kind,
                 configKey: e.key,
@@ -1145,7 +1351,7 @@ var AdminShell = (0, import_vue13.defineComponent)({
                 onSaved: () => editing.value = null
               })
             ];
-          return (0, import_vue13.h)(import_vue_config_admin_screens.ConfigListScreen, {
+          return (0, import_vue14.h)(import_vue_config_admin_screens.ConfigListScreen, {
             client: cc,
             ...props.environment !== void 0 ? { environment: props.environment } : {},
             "onSelect-config": (key) => editing.value = { kind: "config", key },
@@ -1155,7 +1361,7 @@ var AdminShell = (0, import_vue13.defineComponent)({
         case "templates": {
           const kc = props.courierClient;
           if (!kc)
-            return (0, import_vue13.h)(
+            return (0, import_vue14.h)(
               "p",
               { style: styles.status },
               "Pass a CourierAdminClient to manage templates here."
@@ -1164,21 +1370,21 @@ var AdminShell = (0, import_vue13.defineComponent)({
           if (e?.kind === "template")
             return [
               back(),
-              (0, import_vue13.h)(import_vue_courier_admin_screens.TemplateEditorScreen, {
+              (0, import_vue14.h)(import_vue_courier_admin_screens.TemplateEditorScreen, {
                 client: kc,
                 type: e.type,
                 onSaved: () => editing.value = null
               })
             ];
-          return (0, import_vue13.h)(import_vue_courier_admin_screens.TemplateListScreen, {
+          return (0, import_vue14.h)(import_vue_courier_admin_screens.TemplateListScreen, {
             client: kc,
             "onSelect-template": (t) => editing.value = { kind: "template", type: t.type }
           });
         }
       }
     };
-    return () => (0, import_vue13.h)("div", { style: styles.shell }, [
-      (0, import_vue13.h)(
+    return () => (0, import_vue14.h)("div", { style: styles.shell }, [
+      (0, import_vue14.h)(
         "nav",
         { style: styles.nav, "aria-label": "Admin" },
         NAV.map((g) => {
@@ -1186,10 +1392,10 @@ var AdminShell = (0, import_vue13.defineComponent)({
             (i) => !i.needs || (i.needs === "config" ? props.configClient : i.needs === "courier" ? props.courierClient : i.needs === "auth" ? props.authClient : i.needs === "billing" ? props.billingClient : props.auditClient)
           );
           if (items.length === 0) return null;
-          return (0, import_vue13.h)("div", { key: g.group }, [
-            (0, import_vue13.h)("div", { style: styles.navGroup }, g.group),
+          return (0, import_vue14.h)("div", { key: g.group }, [
+            (0, import_vue14.h)("div", { style: styles.navGroup }, g.group),
             ...items.map(
-              (i) => (0, import_vue13.h)(
+              (i) => (0, import_vue14.h)(
                 "button",
                 {
                   key: i.page,
@@ -1207,7 +1413,7 @@ var AdminShell = (0, import_vue13.defineComponent)({
           ]);
         })
       ),
-      (0, import_vue13.h)("main", { style: styles.main }, body())
+      (0, import_vue14.h)("main", { style: styles.main }, body())
     ]);
   }
 });
@@ -1220,6 +1426,7 @@ var AdminShell = (0, import_vue13.defineComponent)({
   CatalogScreen,
   ConfigScreen,
   DoctorScreen,
+  MigrationsScreen,
   ModulesScreen,
   RoutesScreen,
   SubscriberScreen,