create-nextblock 0.2.33 → 0.2.35

package/templates/nextblock-template/app/cms/media/page.tsx

@@ -1,120 +1,120 @@
-// app/cms/media/page.tsx
-import React from 'react';
-import { createClient } from "@nextblock-cms/db/server";
-// import Link from "next/link"; // Unused, MediaGridClient handles item links
-import type { Database } from "@nextblock-cms/db";
-// DropdownMenu related imports are now handled within MediaGridClient or its sub-components if needed individually.
-
-type Media = Database['public']['Tables']['media']['Row'];
-// If page.tsx itself doesn't directly use DropdownMenu, these can be removed from here.
-// For now, assuming MediaGridClient handles its own dropdowns.
-import MediaUploadForm from "./components/MediaUploadForm";
-// MediaImage and DeleteMediaButtonClient are used by MediaGridClient, not directly here anymore.
-import MediaGridClient from "./components/MediaGridClient"; // Import the new client component
-import FolderNavigator from "./components/FolderNavigator";
-
-async function getMediaItems(folder?: string, folderPrefix?: string, search?: string): Promise<Media[]> {
-  const supabase = createClient();
-  let query = supabase
-    .from("media")
-    .select("*")
-    .order("created_at", { ascending: false });
-
-  if (folder && folder.trim()) {
-    query = query.eq('folder', folder);
-  } else if (folderPrefix && folderPrefix.trim()) {
-    query = query.ilike('folder', `${folderPrefix}%`);
-  }
-
-  if (search && search.trim()) {
-    const term = search.trim();
-    query = query.or(`file_name.ilike.%${term}%,description.ilike.%${term}%`);
-  }
-
-  const { data, error } = await query;
-
-  if (error) {
-    console.error("Error fetching media items:", error);
-    return [];
-  }
-  return data || [];
-}
-
-async function getDistinctFolders(search?: string): Promise<string[]> {
-  const supabase = createClient();
-  const { data, error } = await supabase
-    .from("media")
-    .select("folder")
-    .order("folder", { ascending: true });
-  if (error) {
-    console.error("Error fetching folders:", error);
-    return [];
-  }
-  let folders = (data || [])
-    .map((r) => r.folder)
-    .filter((f): f is string => typeof f === 'string' && f.length > 0);
-  if (search && search.trim()) {
-    const t = search.trim().toLowerCase();
-    folders = folders.filter((f: string) => f.toLowerCase().includes(t));
-  }
-  // Ensure trailing slash for consistency
-  return Array.from(new Set(folders.map((f: string) => (f.endsWith('/') ? f : f + '/'))));
-}
-
-async function getFolderCounts(): Promise<Record<string, number>> {
-  const supabase = createClient();
-  const { data, error } = await supabase
-    .from("media")
-    .select("folder");
-  if (error) {
-    console.error("Error fetching folder counts:", error);
-    return {};
-  }
-  const counts: Record<string, number> = {};
-  (data || []).forEach((row) => {
-    const f: string | null = row.folder;
-    if (!f || typeof f !== 'string' || f.length === 0) return;
-    const norm = f.endsWith('/') ? f : `${f}/`;
-    // accumulate counts for each prefix in the path
-    const parts = norm.replace(/^\/+/, '').split('/').filter(Boolean);
-    let prefix = '';
-    for (let i = 0; i < parts.length; i++) {
-      prefix += (i === 0 ? '' : '/') + parts[i];
-      const key = `${prefix}/`;
-      counts[key] = (counts[key] || 0) + 1;
-    }
-  });
-  return counts;
-}
-
-const R2_BASE_URL = process.env.NEXT_PUBLIC_R2_BASE_URL || "";
-
-export default async function CmsMediaLibraryPage(props: { searchParams?: Promise<{ folder?: string; folderPrefix?: string; q?: string }> }) {
-  const searchParams = (await props.searchParams) || {};
-  const selectedFolder = searchParams.folder;
-  const selectedFolderPrefix = searchParams.folderPrefix;
-  const searchQuery = searchParams.q;
-  const [mediaItems, folders, folderCounts] = await Promise.all([
-    getMediaItems(selectedFolder, selectedFolderPrefix, searchQuery),
-    getDistinctFolders(searchQuery),
-    getFolderCounts(),
-  ]);
-
-  return (
-    <div className="w-full max-w-screen-2xl mx-auto px-4 overflow-x-hidden space-y-6">
-      <div className="flex justify-between items-center">
-        <h1 className="text-2xl font-semibold">Media Library</h1>
-      </div>
-
-      <MediaUploadForm />
-
-      {/* Compact folder navigator with top tabs and subfolder pills */}
-      <div className="mt-2">
-        <FolderNavigator basePath="/cms/media" folders={folders} selectedFolder={selectedFolder || ''} selectedPrefix={selectedFolderPrefix || ''} counts={folderCounts} searchTerm={searchQuery || ''} />
-      </div>
-
-      {/* The media grid and empty state are now handled by MediaGridClient */}
-      <MediaGridClient initialMediaItems={mediaItems} r2BaseUrl={R2_BASE_URL} />
-    </div>
-  );
-}
+// app/cms/media/page.tsx
+import React from 'react';
+import { createClient } from "@nextblock-cms/db/server";
+// import Link from "next/link"; // Unused, MediaGridClient handles item links
+import type { Database } from "@nextblock-cms/db";
+// DropdownMenu related imports are now handled within MediaGridClient or its sub-components if needed individually.
+
+type Media = Database['public']['Tables']['media']['Row'];
+// If page.tsx itself doesn't directly use DropdownMenu, these can be removed from here.
+// For now, assuming MediaGridClient handles its own dropdowns.
+import MediaUploadForm from "./components/MediaUploadForm";
+// MediaImage and DeleteMediaButtonClient are used by MediaGridClient, not directly here anymore.
+import MediaGridClient from "./components/MediaGridClient"; // Import the new client component
+import FolderNavigator from "./components/FolderNavigator";
+
+async function getMediaItems(folder?: string, folderPrefix?: string, search?: string): Promise<Media[]> {
+  const supabase = createClient();
+  let query = supabase
+    .from("media")
+    .select("*")
+    .order("created_at", { ascending: false });
+
+  if (folder && folder.trim()) {
+    query = query.eq('folder', folder);
+  } else if (folderPrefix && folderPrefix.trim()) {
+    query = query.ilike('folder', `${folderPrefix}%`);
+  }
+
+  if (search && search.trim()) {
+    const term = search.trim();
+    query = query.or(`file_name.ilike.%${term}%,description.ilike.%${term}%`);
+  }
+
+  const { data, error } = await query;
+
+  if (error) {
+    console.error("Error fetching media items:", error);
+    return [];
+  }
+  return data || [];
+}
+
+async function getDistinctFolders(search?: string): Promise<string[]> {
+  const supabase = createClient();
+  const { data, error } = await supabase
+    .from("media")
+    .select("folder")
+    .order("folder", { ascending: true });
+  if (error) {
+    console.error("Error fetching folders:", error);
+    return [];
+  }
+  let folders = (data || [])
+    .map((r: any) => r.folder)
+    .filter((f: any) => typeof f === 'string' && f.length > 0);
+  if (search && search.trim()) {
+    const t = search.trim().toLowerCase();
+    folders = folders.filter((f: string) => f.toLowerCase().includes(t));
+  }
+  // Ensure trailing slash for consistency
+  return Array.from(new Set(folders.map((f: string) => (f.endsWith('/') ? f : f + '/'))));
+}
+
+async function getFolderCounts(): Promise<Record<string, number>> {
+  const supabase = createClient();
+  const { data, error } = await supabase
+    .from("media")
+    .select("folder");
+  if (error) {
+    console.error("Error fetching folder counts:", error);
+    return {};
+  }
+  const counts: Record<string, number> = {};
+  (data || []).forEach((row: any) => {
+    const f: string | null = row.folder;
+    if (!f || typeof f !== 'string' || f.length === 0) return;
+    const norm = f.endsWith('/') ? f : `${f}/`;
+    // accumulate counts for each prefix in the path
+    const parts = norm.replace(/^\/+/, '').split('/').filter(Boolean);
+    let prefix = '';
+    for (let i = 0; i < parts.length; i++) {
+      prefix += (i === 0 ? '' : '/') + parts[i];
+      const key = `${prefix}/`;
+      counts[key] = (counts[key] || 0) + 1;
+    }
+  });
+  return counts;
+}
+
+const R2_BASE_URL = process.env.NEXT_PUBLIC_R2_BASE_URL || "";
+
+export default async function CmsMediaLibraryPage(props: { searchParams?: Promise<{ folder?: string; folderPrefix?: string; q?: string }> }) {
+  const searchParams = (await props.searchParams) || {};
+  const selectedFolder = searchParams.folder;
+  const selectedFolderPrefix = searchParams.folderPrefix;
+  const searchQuery = searchParams.q;
+  const [mediaItems, folders, folderCounts] = await Promise.all([
+    getMediaItems(selectedFolder, selectedFolderPrefix, searchQuery),
+    getDistinctFolders(searchQuery),
+    getFolderCounts(),
+  ]);
+
+  return (
+    <div className="w-full max-w-screen-2xl mx-auto px-4 overflow-x-hidden space-y-6">
+      <div className="flex justify-between items-center">
+        <h1 className="text-2xl font-semibold">Media Library</h1>
+      </div>
+
+      <MediaUploadForm />
+
+      {/* Compact folder navigator with top tabs and subfolder pills */}
+      <div className="mt-2">
+        <FolderNavigator basePath="/cms/media" folders={folders} selectedFolder={selectedFolder || ''} selectedPrefix={selectedFolderPrefix || ''} counts={folderCounts} searchTerm={searchQuery || ''} />
+      </div>
+
+      {/* The media grid and empty state are now handled by MediaGridClient */}
+      <MediaGridClient initialMediaItems={mediaItems} r2BaseUrl={R2_BASE_URL} />
+    </div>
+  );
+}

package/templates/nextblock-template/app/cms/revisions/JsonDiffView.tsx

@@ -1,87 +1,86 @@
-"use client";
-
-import React, { useMemo } from 'react';
-import { compare, type Operation } from 'fast-json-patch';
-
-interface JsonDiffViewProps {
-  oldValue: string;
-  newValue: string;
-  leftTitle?: string;
-  rightTitle?: string;
-}
-
-function getByPointer(obj: unknown, pointer: string): unknown {
-  if (!pointer || pointer === '/') return obj;
-  const parts = pointer.split('/').slice(1).map(p => p.replace(/~1/g, '/').replace(/~0/g, '~'));
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  let cur = obj as any;
-  for (const part of parts) {
-    if (cur == null) return undefined;
-    cur = cur[part];
-  }
-  return cur;
-}
-
-function safeStringify(v: unknown): string {
-  try {
-    return JSON.stringify(v, null, 2);
-  } catch {
-    return String(v);
-  }
-}
-
-export default function JsonDiffView({ oldValue, newValue, leftTitle = 'Current', rightTitle = 'Selected' }: JsonDiffViewProps) {
-  const { ops, oldObj } = useMemo(() => {
-    let a: unknown = null, b: unknown = null;
-    try { a = JSON.parse(oldValue); } catch { a = oldValue; }
-    try { b = JSON.parse(newValue); } catch { b = newValue; }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const operations: Operation[] = compare(a as any, b as any);
-    return { ops: operations, oldObj: a };
-  }, [oldValue, newValue]);
-
-  return (
-    <div className="border rounded">
-      <div className="flex items-center justify-between px-3 py-2 border-b text-sm text-muted-foreground">
-        <div>{leftTitle}</div>
-        <div>{rightTitle}</div>
-      </div>
-      <div className="p-3 text-sm space-y-2">
-        <div className="flex items-center gap-3 text-xs text-muted-foreground">
-          <span className="inline-flex items-center gap-1"><span className="inline-block w-3 h-3 rounded bg-green-200 border border-green-300" /> Current</span>
-          <span className="inline-flex items-center gap-1"><span className="inline-block w-3 h-3 rounded bg-red-200 border border-red-300" /> Selected Version</span>
-        </div>
-        {ops.length === 0 && (
-          <div className="text-muted-foreground">No differences.</div>
-        )}
-        {ops.map((op, idx) => {
-          const oldAtPath = op.op !== 'add' ? getByPointer(oldObj, op.path) : undefined;
-          const oldStr = op.op !== 'add' ? safeStringify(oldAtPath) : '';
-          const newStr = op.op !== 'remove' && 'value' in op ? safeStringify((op as { value: unknown }).value) : '';
-          return (
-            <div key={idx} className="rounded border">
-              <div className="px-2 py-1 border-b flex items-center gap-2 text-xs">
-                <span className="uppercase tracking-wide font-semibold">{op.op}</span>
-                <code className="text-muted-foreground break-all">{op.path || '/'}</code>
-              </div>
-              <div className="grid grid-cols-1 md:grid-cols-2">
-                {op.op !== 'add' && (
-                  <div className="p-2 border-r md:border-r">
-                    <div className="text-xs text-muted-foreground mb-1">Current</div>
-                    <pre className="whitespace-pre-wrap break-words text-green-800 bg-green-50 rounded p-2 m-0">{oldStr}</pre>
-                  </div>
-                )}
-                {op.op !== 'remove' && (
-                  <div className="p-2">
-                    <div className="text-xs text-muted-foreground mb-1">Selected Version</div>
-                    <pre className="whitespace-pre-wrap break-words text-red-800 bg-red-50 rounded p-2 m-0">{newStr}</pre>
-                  </div>
-                )}
-              </div>
-            </div>
-          );
-        })}
-      </div>
-    </div>
-  );
-}
+// apps/nextblock/app/cms/revisions/JsonDiffView.tsx
+"use client";
+
+import React, { useMemo } from 'react';
+import { compare, type Operation } from 'fast-json-patch';
+
+interface JsonDiffViewProps {
+  oldValue: string;
+  newValue: string;
+  leftTitle?: string;
+  rightTitle?: string;
+}
+
+function getByPointer(obj: any, pointer: string): any {
+  if (!pointer || pointer === '/') return obj;
+  const parts = pointer.split('/').slice(1).map(p => p.replace(/~1/g, '/').replace(/~0/g, '~'));
+  let cur = obj;
+  for (const part of parts) {
+    if (cur == null) return undefined;
+    cur = cur[part];
+  }
+  return cur;
+}
+
+function safeStringify(v: any): string {
+  try {
+    return JSON.stringify(v, null, 2);
+  } catch {
+    return String(v);
+  }
+}
+
+export default function JsonDiffView({ oldValue, newValue, leftTitle = 'Current', rightTitle = 'Selected' }: JsonDiffViewProps) {
+  const { ops, oldObj } = useMemo(() => {
+    let a: any = null, b: any = null;
+    try { a = JSON.parse(oldValue); } catch { a = oldValue; }
+    try { b = JSON.parse(newValue); } catch { b = newValue; }
+    const operations: Operation[] = compare(a, b);
+    return { ops: operations, oldObj: a };
+  }, [oldValue, newValue]);
+
+  return (
+    <div className="border rounded">
+      <div className="flex items-center justify-between px-3 py-2 border-b text-sm text-muted-foreground">
+        <div>{leftTitle}</div>
+        <div>{rightTitle}</div>
+      </div>
+      <div className="p-3 text-sm space-y-2">
+        <div className="flex items-center gap-3 text-xs text-muted-foreground">
+          <span className="inline-flex items-center gap-1"><span className="inline-block w-3 h-3 rounded bg-green-200 border border-green-300" /> Current</span>
+          <span className="inline-flex items-center gap-1"><span className="inline-block w-3 h-3 rounded bg-red-200 border border-red-300" /> Selected Version</span>
+        </div>
+        {ops.length === 0 && (
+          <div className="text-muted-foreground">No differences.</div>
+        )}
+        {ops.map((op, idx) => {
+          const oldAtPath = op.op !== 'add' ? getByPointer(oldObj, op.path) : undefined;
+          const oldStr = op.op !== 'add' ? safeStringify(oldAtPath) : '';
+          const newStr = op.op !== 'remove' ? safeStringify((op as any).value) : '';
+          return (
+            <div key={idx} className="rounded border">
+              <div className="px-2 py-1 border-b flex items-center gap-2 text-xs">
+                <span className="uppercase tracking-wide font-semibold">{op.op}</span>
+                <code className="text-muted-foreground break-all">{op.path || '/'}</code>
+              </div>
+              <div className="grid grid-cols-1 md:grid-cols-2">
+                {op.op !== 'add' && (
+                  <div className="p-2 border-r md:border-r">
+                    <div className="text-xs text-muted-foreground mb-1">Current</div>
+                    <pre className="whitespace-pre-wrap break-words text-green-800 bg-green-50 rounded p-2 m-0">{oldStr}</pre>
+                  </div>
+                )}
+                {op.op !== 'remove' && (
+                  <div className="p-2">
+                    <div className="text-xs text-muted-foreground mb-1">Selected Version</div>
+                    <pre className="whitespace-pre-wrap break-words text-red-800 bg-red-50 rounded p-2 m-0">{newStr}</pre>
+                  </div>
+                )}
+              </div>
+            </div>
+          );
+        })}
+      </div>
+    </div>
+  );
+}

package/templates/nextblock-template/app/cms/revisions/RevisionHistoryButton.tsx

@@ -54,24 +54,18 @@ export default function RevisionHistoryButton({ parentType, parentId }: Revision
       try {
         if (parentType === 'page') {
           const res = await listPageRevisions(parentId);
-          if ('error' in res) {
-            setError(res.error ?? 'Unknown error');
-            setRevisions(null);
-            setCurrentVersion(null);
-          } else {
-            setRevisions(res.revisions as unknown as RevisionItem[]);
-            setCurrentVersion(res.currentVersion ?? null);
-          }
+        if ('error' in res) {
+          setError(res.error ?? 'Unknown error');
+          setRevisions(null);
+          setCurrentVersion(null);
+        } else {
+          setRevisions(res.revisions as unknown as RevisionItem[]);
+          setCurrentVersion((res as any).currentVersion ?? null);
+        }
         } else {
           const res = await listPostRevisions(parentId);
-          if ('error' in res) {
-            setError(res.error ?? 'Unknown error');
-            setRevisions(null);
-            setCurrentVersion(null);
-          } else {
-            setRevisions(res.revisions as unknown as RevisionItem[]);
-            setCurrentVersion(res.currentVersion ?? null);
-          }
+          if ('error' in res) { setError(res.error ?? 'Unknown error'); setRevisions(null); setCurrentVersion(null); }
+          else { setRevisions(res.revisions as unknown as RevisionItem[]); setCurrentVersion((res as any).currentVersion ?? null); }
         }
       } catch (e: unknown) {
         setError(e instanceof Error ? e.message : 'Failed to load revisions');