Load rule templates from API

2026-04-12 21:56:34 -06:00
parent cae4df261e
commit a39b4aa04b
17 changed files with 698 additions and 429 deletions
@@ -0,0 +1,33 @@
+/**
+ * Placeholder grid matching GovernanceTemplateGrid layout (loading state).
+ */
+export function GovernanceTemplateGridSkeleton({ count }: { count: number }) {
+  return (
+    <div
+      className="
+        flex flex-col gap-[18px]
+        min-[768px]:grid min-[768px]:grid-cols-2 min-[768px]:gap-[18px]
+        min-[1024px]:gap-[24px]
+      "
+      aria-busy
+      aria-label="Loading templates"
+    >
+      {Array.from({ length: count }, (_, i) => (
+        <div
+          key={i}
+          className="
+            flex min-h-[120px] animate-pulse flex-col gap-3 rounded-[var(--measures-radius-200,8px)]
+            bg-[var(--color-surface-default-secondary,#262626)] p-4
+            min-[640px]:min-h-[140px] min-[640px]:rounded-[var(--measures-radius-300,12px)]
+            min-[1024px]:min-h-[160px] min-[1024px]:rounded-[var(--radius-measures-radius-small)]
+          "
+        >
+          <div className="h-10 w-10 rounded bg-[var(--color-surface-default-tertiary,#404040)] min-[640px]:h-14 min-[640px]:w-14" />
+          <div className="h-4 w-[55%] max-w-[280px] rounded bg-[var(--color-surface-default-tertiary,#404040)]" />
+          <div className="h-3 w-full max-w-[400px] rounded bg-[var(--color-surface-default-tertiary,#404040)]" />
+          <div className="h-3 w-[72%] max-w-[360px] rounded bg-[var(--color-surface-default-tertiary,#404040)]" />
+        </div>
+      ))}
+    </div>
+  );
+}