@kyro-cms/admin 0.5.4 → 0.6.0

package/src/lib/globals.ts

@@ -1,24 +1,69 @@
-import projectConfig from "kyro:config";
 import type { BaseAdapter } from "../../../src/registry/types.js";
 
+export interface GlobalOptions {
+  draft?: boolean;
+  /** Astro request object — used to pass auth cookies to the API endpoint */
+  request?: Request;
+}
+
 /**
  * Fetches a global document by its slug.
- * Works only in environments where kyro:config is available (Astro server).
+ * Uses the API endpoint when an Astro request is provided (works for all dialects),
+ * falling back to the direct adapter approach.
  */
-export async function getGlobal(slug: string, options?: { draft?: boolean }) {
-  const db = (projectConfig as Record<string, unknown>).adapter as BaseAdapter;
+export async function getGlobal(slug: string, options?: GlobalOptions) {
+  // Strategy 1: Use the API endpoint (works for all dialects, adapter agnostic)
+  if (options?.request) {
+    try {
+      const apiPath = (globalThis as any).__KYRO_API_PATH__ || "/api";
+      const cookie = options.request.headers.get("cookie") || "";
+      const res = await fetch(`${apiPath}/globals/${slug}`, {
+        headers: { Cookie: cookie },
+      });
+      if (res.ok) {
+        const json = await res.json();
+        const doc = json.data || null;
+        if (!doc) return null;
+        // Resolve media fields via the same API endpoint
+        const mediaFields = ["siteLogo", "siteFavicon", "siteOgImage"];
+        for (const field of mediaFields) {
+          if (typeof doc[field] === "string" && doc[field].length > 0) {
+            try {
+              const mediaRes = await fetch(`${apiPath}/media/${doc[field]}`, {
+                headers: { Cookie: cookie },
+              });
+              if (mediaRes.ok) {
+                doc[field] = await mediaRes.json();
+              }
+            } catch { /* media field stays as ID string */ }
+          }
+        }
+        return doc;
+      }
+    } catch { /* fall through to adapter */ }
+  }
+
+  // Strategy 2: Direct adapter access (fallback for non-request contexts)
+  const global = globalThis as any;
+  const projectConfig = global.__KYRO_ADMIN_PROJECT_CONFIG__;
+  if (!projectConfig) return null;
+
+  const db = projectConfig.adapter as BaseAdapter | undefined;
   if (!db) return null;
 
   try {
+    // Initialize adapter if needed (DrizzleAdapter needs schema/globals maps)
+    if (typeof db.init === "function" && !global.__KYRO_ADAPTER_READY__) {
+      await db.init(projectConfig.collections || [], projectConfig.globals || []);
+      global.__KYRO_ADAPTER_READY__ = true;
+    }
     const doc = await db.findOne({
       collection: `_globals_${slug}`,
       where: {},
       draft: options?.draft ?? false,
     });
-
     if (!doc) return null;
 
-    // Auto-resolve media IDs for common branding fields
     const mediaFields = ["siteLogo", "siteFavicon", "siteOgImage"];
     for (const field of mediaFields) {
       if (typeof doc[field] === "string" && doc[field].length > 0) {
@@ -27,24 +72,15 @@ export async function getGlobal(slug: string, options?: { draft?: boolean }) {
             collection: "media",
             id: doc[field],
           });
-          if (mediaDoc) {
-            doc[field] = mediaDoc;
-          }
-        } catch (e) {
-          console.warn(`Failed to resolve media for field "${field}":`, e);
-        }
+          if (mediaDoc) doc[field] = mediaDoc;
+        } catch { /* media field stays as ID string */ }
       }
     }
-
     return doc;
-  } catch (e) {
-    return null;
-  }
+  } catch { return null; }
 }
 
-/**
- * Convenience helper to get the site settings.
- */
-export async function getSiteSettings(options?: { draft?: boolean }) {
+/** Convenience helper to get the site settings. */
+export async function getSiteSettings(options?: GlobalOptions) {
   return await getGlobal("site-settings", options);
 }

package/src/pages/index.astro

@@ -13,7 +13,7 @@ const authItems = authCollections.map((slug) => ({
 ---
 
 <AdminLayout title="Dashboard">
-  <div class="flex-1 overflow-y-auto pr-12 space-y-8">
+  <div class="flex-1 overflow-y-auto  space-y-8">
     <!-- Header -->
     <div class="surface-tile p-6 flex items-center justify-between gap-8">
       <div class="relative flex-1 max-w-2xl">

package/src/pages/roles/index.astro

@@ -60,7 +60,7 @@ const permissions: Record<string, string[]> = {
 ---
 
 <AdminLayout title="Roles">
-  <div class="flex-1 overflow-y-auto pr-12 space-y-8">
+  <div class="flex-1 overflow-y-auto  space-y-8">
     <!-- Header -->
     <div class="surface-tile p-6">
       <h1

package/src/pages/users/[id].astro

@@ -28,7 +28,7 @@ if (id) {
 
 <AdminLayout title={user ? user.email : "User"}>
   {error ? (
-    <div class="flex-1 overflow-y-auto pr-12 space-y-8">
+    <div class="flex-1 overflow-y-auto  space-y-8">
       <div class="surface-tile p-8">
         <div class="text-center">
           <p class="text-lg font-bold text-red-500">{error}</p>
@@ -44,7 +44,7 @@ if (id) {
       adminPath={adminPath}
     />
   ) : (
-    <div class="flex-1 overflow-y-auto pr-12 space-y-8">
+    <div class="flex-1 overflow-y-auto  space-y-8">
       <div class="surface-tile p-8 text-center">
         <p class="text-lg font-bold text-[var(--kyro-text-secondary)]">Loading...</p>
       </div>

package/src/styles/main.css

@@ -1502,6 +1502,23 @@
     color: var(--kyro-gray-500);
   }
 
+  /* Shimmer Loading Effect */
+  @keyframes shimmer {
+    0% { background-position: -200% 0; }
+    100% { background-position: 200% 0; }
+  }
+
+  .kyro-shimmer {
+    background: linear-gradient(
+      90deg,
+      var(--kyro-surface-accent) 25%,
+      var(--kyro-border) 50%,
+      var(--kyro-surface-accent) 75%
+    );
+    background-size: 200% 100%;
+    animation: shimmer 1.5s ease-in-out infinite;
+  }
+
   /* Modal — Monochrome */
   .kyro-modal-overlay {
     position: fixed;