@olonjs/cli 3.0.82 → 3.0.84

package/assets/src_tenant_alpha.sh

@@ -596,7 +596,7 @@ cat << 'END_OF_FILE_CONTENT' > "package.json"
     "@tiptap/extension-link": "^2.11.5",
     "@tiptap/react": "^2.11.5",
     "@tiptap/starter-kit": "^2.11.5",
-    "@olonjs/core": "^1.0.70",
+    "@olonjs/core": "^1.0.72",
     "clsx": "^2.1.1",
     "lucide-react": "^0.474.0",
     "react": "^19.0.0",
@@ -941,6 +941,7 @@ import themeData from '@/data/config/theme.json';
 import menuData from '@/data/config/menu.json';
 import { getFilePages } from '@/lib/getFilePages';
 import { DopaDrawer } from '@/components/save-drawer/DopaDrawer';
+import { Skeleton } from '@/components/ui/skeleton';
 
 import tenantCss from './index.css?inline';
 
@@ -1194,6 +1195,16 @@ function cloudFingerprint(apiBase: string, apiKey: string): string {
   return `${normalizeApiBase(apiBase)}::${apiKey.slice(-8)}`;
 }
 
+function normalizeSlugForCache(slug: string): string {
+  return (
+    slug
+      .trim()
+      .toLowerCase()
+      .replace(/[^a-z0-9/_-]/g, '-')
+      .replace(/^\/+|\/+$/g, '') || 'home'
+  );
+}
+
 function readCachedCloudContent(fingerprint: string): CachedCloudContent | null {
   try {
     const raw = localStorage.getItem(CLOUD_CACHE_KEY);
@@ -1248,7 +1259,6 @@ function App() {
   const activeCloudSaveController = useRef<AbortController | null>(null);
   const contentLoadInFlight = useRef<Promise<void> | null>(null);
   const pendingCloudSave = useRef<{ state: ProjectState; slug: string } | null>(null);
-  const warmBootFromCloudCache = useRef(false);
   const cloudApiCandidates = useMemo(
     () => (isCloudMode && CLOUD_API_URL ? buildApiCandidates(CLOUD_API_URL) : []),
     [isCloudMode, CLOUD_API_URL]
@@ -1288,26 +1298,16 @@ function App() {
     const primaryApiBase = cloudApiCandidates[0] ?? normalizeApiBase(CLOUD_API_URL);
     const fingerprint = cloudFingerprint(primaryApiBase, CLOUD_API_KEY);
     const cached = readCachedCloudContent(fingerprint);
+    const cachedPages = cached ? toPagesRecord(cached.pages) : null;
+    const cachedSite = cached ? coerceSiteConfig(cached.siteConfig) : null;
+    const hasCachedFallback = Boolean((cachedPages && Object.keys(cachedPages).length > 0) || cachedSite);
     if (cached) {
-      const cachedPages = toPagesRecord(cached.pages);
-      const cachedSite = coerceSiteConfig(cached.siteConfig);
-      if (cachedPages && Object.keys(cachedPages).length > 0) {
-        setPages(cachedPages);
-      }
-      if (cachedSite) {
-        setSiteConfig(cachedSite);
-      }
-      setContentMode('cloud');
-      setContentFallback(null);
-      warmBootFromCloudCache.current = true;
-      setShowTopProgress(false);
-      setHasInitialCloudResolved(true);
       logBootstrapEvent('boot.cloud.cache_hit', { ageMs: Date.now() - cached.savedAt });
-    } else {
-      warmBootFromCloudCache.current = false;
-      setShowTopProgress(true);
-      setHasInitialCloudResolved(false);
     }
+    setContentMode('cloud');
+    setContentFallback(null);
+    setShowTopProgress(true);
+    setHasInitialCloudResolved(false);
     logBootstrapEvent('boot.start', { mode: 'cloud', apiCandidates: cloudApiCandidates.length });
 
     const loadCloudContent = async () => {
@@ -1320,6 +1320,7 @@ function App() {
             try {
               const res = await fetch(`${apiBase}/content`, {
                 method: 'GET',
+                cache: 'no-store',
                 headers: {
                   Authorization: `Bearer ${CLOUD_API_KEY}`,
                 },
@@ -1422,7 +1423,13 @@ function App() {
       } catch (error: unknown) {
         if (controller.signal.aborted) return;
         const failure = toCloudLoadFailure(error);
-        if (warmBootFromCloudCache.current) {
+        if (hasCachedFallback) {
+          if (cachedPages && Object.keys(cachedPages).length > 0) {
+            setPages(cachedPages);
+          }
+          if (cachedSite) {
+            setSiteConfig(cachedSite);
+          }
           setContentMode('cloud');
           setContentFallback({
             reasonCode: 'CLOUD_REFRESH_FAILED',
@@ -1589,14 +1596,26 @@ function App() {
           },
           body: JSON.stringify({
             slug,
-            type: 'page',
-            data: state.page,
+            page: state.page,
+            siteConfig: state.site,
           }),
         });
         const body = (await res.json().catch(() => ({}))) as { error?: string; code?: string };
         if (!res.ok) {
           throw new Error(body.error || body.code || `Hot save failed: ${res.status}`);
         }
+        const keyFingerprint = cloudFingerprint(apiBase, CLOUD_API_KEY);
+        const normalizedSlug = normalizeSlugForCache(slug);
+        const existing = readCachedCloudContent(keyFingerprint);
+        writeCachedCloudContent({
+          keyFingerprint,
+          savedAt: Date.now(),
+          siteConfig: state.site ?? null,
+          pages: {
+            ...(existing?.pages ?? {}),
+            [normalizedSlug]: state.page,
+          },
+        });
       },
       showLegacySave: !isCloudMode,
       showHotSave: isCloudMode,
@@ -1667,6 +1686,26 @@ function App() {
           </div>
         </>
       ) : null}
+      {isCloudMode && !hasInitialCloudResolved ? (
+        <div className="fixed inset-0 z-[1290] bg-background/80 backdrop-blur-sm">
+          <div className="mx-auto w-full max-w-[1600px] p-6">
+            <div className="grid gap-4 lg:grid-cols-[1fr_420px]">
+              <div className="space-y-4">
+                <Skeleton className="h-10 w-64" />
+                <Skeleton className="h-[220px] w-full rounded-xl" />
+                <Skeleton className="h-[220px] w-full rounded-xl" />
+              </div>
+              <div className="space-y-3 rounded-xl border border-border/50 bg-card/60 p-4">
+                <Skeleton className="h-8 w-32" />
+                <Skeleton className="h-5 w-full" />
+                <Skeleton className="h-5 w-5/6" />
+                <Skeleton className="h-5 w-4/6" />
+                <Skeleton className="h-24 w-full rounded-lg" />
+              </div>
+            </div>
+          </div>
+        </div>
+      ) : null}
       {shouldRenderEngine ? <JsonPagesEngine config={config} /> : null}
       {isCloudMode && (contentMode === 'error' || contentFallback?.reasonCode === 'CLOUD_REFRESH_FAILED') ? (
         <div
@@ -1741,102 +1780,6 @@ function App() {
 export default App;
 
 
-END_OF_FILE_CONTENT
-# SKIP: src/App.tsx:Zone.Identifier is binary and cannot be embedded as text.
-echo "Creating src/App_.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/App_.tsx"
-import { useState, useEffect } from 'react';
-import { JsonPagesEngine } from '@jsonpages/core';
-import type { LibraryImageEntry } from '@jsonpages/core';
-import { ComponentRegistry } from '@/lib/ComponentRegistry';
-import { SECTION_SCHEMAS } from '@/lib/schemas';
-import { addSectionConfig } from '@/lib/addSectionConfig';
-import { getHydratedData } from '@/lib/draftStorage';
-import type { JsonPagesConfig, ProjectState } from '@jsonpages/core';
-import type { SiteConfig, ThemeConfig, MenuConfig } from '@/types';
-
-import siteData from '@/data/config/site.json';
-import themeData from '@/data/config/theme.json';
-import menuData from '@/data/config/menu.json';
-import { getFilePages } from '@/lib/getFilePages';
-
-import fontsCss from './fonts.css?inline';
-import tenantCss from './index.css?inline';
-
-const themeConfig = themeData as unknown as ThemeConfig;
-const menuConfig = menuData as unknown as MenuConfig;
-const TENANT_ID = 'alpha';
-
-const filePages = getFilePages();
-const fileSiteConfig = siteData as unknown as SiteConfig;
-const MAX_UPLOAD_SIZE_BYTES = 5 * 1024 * 1024;
-
-function getInitialData() {
-  return getHydratedData(TENANT_ID, filePages, fileSiteConfig);
-}
-
-function App() {
-  const [{ pages, siteConfig }] = useState(getInitialData);
-  const [assetsManifest, setAssetsManifest] = useState<LibraryImageEntry[]>([]);
-
-  useEffect(() => {
-    fetch('/api/list-assets')
-      .then((r) => (r.ok ? r.json() : []))
-      .then((list: LibraryImageEntry[]) => setAssetsManifest(Array.isArray(list) ? list : []))
-      .catch(() => setAssetsManifest([]));
-  }, []);
-
-  const config: JsonPagesConfig = {
-    tenantId: TENANT_ID,
-    registry: ComponentRegistry as JsonPagesConfig['registry'],
-    schemas:  SECTION_SCHEMAS  as unknown as JsonPagesConfig['schemas'],
-    pages,
-    siteConfig,
-    themeConfig,
-    menuConfig,
-    themeCss: { tenant: fontsCss + '\n' + tenantCss },
-    addSection: addSectionConfig,
-    persistence: {
-      async saveToFile(state: ProjectState, slug: string): Promise<void> {
-        const res = await fetch('/api/save-to-file', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ projectState: state, slug }),
-        });
-        const body = (await res.json().catch(() => ({}))) as { error?: string };
-        if (!res.ok) throw new Error(body.error ?? `Save to file failed: ${res.status}`);
-      },
-    },
-    assets: {
-      assetsBaseUrl: '/assets',
-      assetsManifest,
-      async onAssetUpload(file: File): Promise<string> {
-        if (!file.type.startsWith('image/')) throw new Error('Invalid file type.');
-        if (file.size > MAX_UPLOAD_SIZE_BYTES) throw new Error(`File too large. Max ${MAX_UPLOAD_SIZE_BYTES / 1024 / 1024}MB.`);
-        const base64 = await new Promise<string>((resolve, reject) => {
-          const reader = new FileReader();
-          reader.onload  = () => resolve((reader.result as string).split(',')[1] ?? '');
-          reader.onerror = () => reject(reader.error);
-          reader.readAsDataURL(file);
-        });
-        const res = await fetch('/api/upload-asset', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ filename: file.name, mimeType: file.type || undefined, data: base64 }),
-        });
-        const body = (await res.json().catch(() => ({}))) as { url?: string; error?: string };
-        if (!res.ok) throw new Error(body.error || `Upload failed: ${res.status}`);
-        if (typeof body.url !== 'string') throw new Error('Invalid server response: missing url');
-        return body.url;
-      },
-    },
-  };
-
-  return <JsonPagesEngine config={config} />;
-}
-
-export default App;
-
 END_OF_FILE_CONTENT
 mkdir -p "src/components"
 echo "Creating src/components/NotFound.tsx..."
@@ -7186,6 +7129,26 @@ export { Separator }
 
 
 
+END_OF_FILE_CONTENT
+echo "Creating src/components/ui/skeleton.tsx..."
+cat << 'END_OF_FILE_CONTENT' > "src/components/ui/skeleton.tsx"
+import { cn } from '@/lib/utils';
+import type { HTMLAttributes } from 'react';
+
+function Skeleton({
+  className,
+  ...props
+}: HTMLAttributes<HTMLDivElement>) {
+  return (
+    <div
+      className={cn('animate-pulse rounded-md bg-muted', className)}
+      {...props}
+    />
+  );
+}
+
+export { Skeleton };
+
 END_OF_FILE_CONTENT
 echo "Creating src/components/ui/textarea.tsx..."
 cat << 'END_OF_FILE_CONTENT' > "src/components/ui/textarea.tsx"
@@ -9335,24 +9298,6 @@ ReactDOM.createRoot(document.getElementById('root')!).render(
 
 
 
-END_OF_FILE_CONTENT
-echo "Creating src/main_.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/main_.tsx"
-import '@/types'; // TBP: load type augmentation from capsule-driven types
-import React from 'react';
-import ReactDOM from 'react-dom/client';
-import App from './App';
-// ... resto del file
-
-ReactDOM.createRoot(document.getElementById('root')!).render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>
-);
-
-
-
-
 END_OF_FILE_CONTENT
 # SKIP: src/registry-types.ts is binary and cannot be embedded as text.
 mkdir -p "src/server"

package/assets/templates/agritourism/src_tenant.sh

@@ -596,7 +596,7 @@ cat << 'END_OF_FILE_CONTENT' > "package.json"
     "@tiptap/extension-link": "^2.11.5",
     "@tiptap/react": "^2.11.5",
     "@tiptap/starter-kit": "^2.11.5",
-    "@olonjs/core": "^1.0.70",
+    "@olonjs/core": "^1.0.72",
     "clsx": "^2.1.1",
     "lucide-react": "^0.474.0",
     "react": "^19.0.0",
@@ -1074,6 +1074,30 @@ function App() {
         const body = (await res.json().catch(() => ({}))) as { error?: string };
         if (!res.ok) throw new Error(body.error ?? `Save to file failed: ${res.status}`);
       },
+      async hotSave(state: ProjectState, slug: string): Promise<void> {
+        if (!isCloudMode || !CLOUD_API_URL || !CLOUD_API_KEY) {
+          throw new Error('Cloud mode is not configured for hot save.');
+        }
+        const apiBase = CLOUD_API_URL.replace(/\/$/, '');
+        const res = await fetch(`${apiBase}/hotSave`, {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+            Authorization: `Bearer ${CLOUD_API_KEY}`,
+          },
+          body: JSON.stringify({
+            slug,
+            page: state.page,
+            siteConfig: state.site,
+          }),
+        });
+        const body = (await res.json().catch(() => ({}))) as { error?: string; code?: string };
+        if (!res.ok) {
+          throw new Error(body.error || body.code || `Hot save failed: ${res.status}`);
+        }
+      },
+      showLegacySave: !isCloudMode,
+      showHotSave: isCloudMode,
     },
     assets: {
       assetsBaseUrl: '/assets',
@@ -1120,264 +1144,6 @@ function App() {
 
 export default App;
 
-END_OF_FILE_CONTENT
-echo "Creating src/App_.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/App_.tsx"
-import { useState, useEffect } from 'react';
-import { JsonPagesEngine } from '@jsonpages/core';
-import type { LibraryImageEntry } from '@jsonpages/core';
-import { ComponentRegistry } from '@/lib/ComponentRegistry';
-import { SECTION_SCHEMAS } from '@/lib/schemas';
-import { addSectionConfig } from '@/lib/addSectionConfig';
-import { getHydratedData } from '@/lib/draftStorage';
-import type { JsonPagesConfig, ProjectState } from '@jsonpages/core';
-import type { SiteConfig, ThemeConfig, MenuConfig } from '@/types';
-
-import siteData from '@/data/config/site.json';
-import themeData from '@/data/config/theme.json';
-import menuData from '@/data/config/menu.json';
-import { getFilePages } from '@/lib/getFilePages';
-
-import fontsCss from './fonts.css?inline';
-import tenantCss from './index.css?inline';
-
-const themeConfig = themeData as unknown as ThemeConfig;
-const menuConfig = menuData as unknown as MenuConfig;
-const TENANT_ID = 'alpha';
-
-const filePages = getFilePages();
-const fileSiteConfig = siteData as unknown as SiteConfig;
-const MAX_UPLOAD_SIZE_BYTES = 5 * 1024 * 1024;
-
-function getInitialData() {
-  return getHydratedData(TENANT_ID, filePages, fileSiteConfig);
-}
-
-function App() {
-  const [{ pages, siteConfig }] = useState(getInitialData);
-  const [assetsManifest, setAssetsManifest] = useState<LibraryImageEntry[]>([]);
-
-  useEffect(() => {
-    fetch('/api/list-assets')
-      .then((r) => (r.ok ? r.json() : []))
-      .then((list: LibraryImageEntry[]) => setAssetsManifest(Array.isArray(list) ? list : []))
-      .catch(() => setAssetsManifest([]));
-  }, []);
-
-  const config: JsonPagesConfig = {
-    tenantId: TENANT_ID,
-    registry: ComponentRegistry as JsonPagesConfig['registry'],
-    schemas:  SECTION_SCHEMAS  as unknown as JsonPagesConfig['schemas'],
-    pages,
-    siteConfig,
-    themeConfig,
-    menuConfig,
-    themeCss: { tenant: fontsCss + '\n' + tenantCss },
-    addSection: addSectionConfig,
-    persistence: {
-      async saveToFile(state: ProjectState, slug: string): Promise<void> {
-        const res = await fetch('/api/save-to-file', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ projectState: state, slug }),
-        });
-        const body = (await res.json().catch(() => ({}))) as { error?: string };
-        if (!res.ok) throw new Error(body.error ?? `Save to file failed: ${res.status}`);
-      },
-    },
-    assets: {
-      assetsBaseUrl: '/assets',
-      assetsManifest,
-      async onAssetUpload(file: File): Promise<string> {
-        if (!file.type.startsWith('image/')) throw new Error('Invalid file type.');
-        if (file.size > MAX_UPLOAD_SIZE_BYTES) throw new Error(`File too large. Max ${MAX_UPLOAD_SIZE_BYTES / 1024 / 1024}MB.`);
-        const base64 = await new Promise<string>((resolve, reject) => {
-          const reader = new FileReader();
-          reader.onload  = () => resolve((reader.result as string).split(',')[1] ?? '');
-          reader.onerror = () => reject(reader.error);
-          reader.readAsDataURL(file);
-        });
-        const res = await fetch('/api/upload-asset', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ filename: file.name, mimeType: file.type || undefined, data: base64 }),
-        });
-        const body = (await res.json().catch(() => ({}))) as { url?: string; error?: string };
-        if (!res.ok) throw new Error(body.error || `Upload failed: ${res.status}`);
-        if (typeof body.url !== 'string') throw new Error('Invalid server response: missing url');
-        return body.url;
-      },
-    },
-  };
-
-  return <JsonPagesEngine config={config} />;
-}
-
-export default App;
-
-END_OF_FILE_CONTENT
-echo "Creating src/_App.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/_App.tsx"
-/**
- * Thin Entry Point (Tenant).
- * Data from getHydratedData (file-backed or draft); assets from public/assets/images.
- * Supports Hybrid Persistence: Local Filesystem (Dev) or Cloud Bridge (Prod).
- */
-import { useState, useEffect } from 'react';
-import { JsonPagesEngine } from '@jsonpages/core';
-import type { LibraryImageEntry } from '@jsonpages/core';
-import { ComponentRegistry } from '@/lib/ComponentRegistry';
-import { SECTION_SCHEMAS } from '@/lib/schemas';
-import { addSectionConfig } from '@/lib/addSectionConfig';
-import { getHydratedData } from '@/lib/draftStorage';
-import type { JsonPagesConfig, ProjectState } from '@jsonpages/core';
-import type { SiteConfig, ThemeConfig, MenuConfig } from '@/types';
-
-import siteData from '@/data/config/site.json';
-import themeData from '@/data/config/theme.json';
-import menuData from '@/data/config/menu.json';
-import { getFilePages } from '@/lib/getFilePages';
-
-import fontsCss from './fonts.css?inline';
-import tenantCss from './index.css?inline';
-
-// Cloud Configuration (Injected by Vercel/Netlify Env Vars)
-const CLOUD_API_URL = import.meta.env.VITE_JSONPAGES_CLOUD_URL;
-const CLOUD_API_KEY = import.meta.env.VITE_JSONPAGES_API_KEY;
-
-const themeConfig = themeData as unknown as ThemeConfig;
-const menuConfig = menuData as unknown as MenuConfig;
-const TENANT_ID = 'alpha';
-
-const filePages = getFilePages();
-const fileSiteConfig = siteData as unknown as SiteConfig;
-const MAX_UPLOAD_SIZE_BYTES = 5 * 1024 * 1024;
-
-function getInitialData() {
-  return getHydratedData(TENANT_ID, filePages, fileSiteConfig);
-}
-
-function App() {
-  const [{ pages, siteConfig }] = useState(getInitialData);
-  const [assetsManifest, setAssetsManifest] = useState<LibraryImageEntry[]>([]);
-
-  useEffect(() => {
-    // In Cloud mode, listing assets might be different or disabled for MVP
-    // For now, we keep the local fetch which will fail gracefully on Vercel (404)
-    fetch('/api/list-assets')
-      .then((r) => (r.ok ? r.json() : []))
-      .then((list: LibraryImageEntry[]) => setAssetsManifest(Array.isArray(list) ? list : []))
-      .catch(() => setAssetsManifest([]));
-  }, []);
-  
-console.log("🔍 DEBUG ENV:", {
-  URL: import.meta.env.VITE_JSONPAGES_CLOUD_URL,
-  KEY: import.meta.env.VITE_JSONPAGES_API_KEY ? "PRESENT" : "MISSING"
-});
-  const config: JsonPagesConfig = {
-    tenantId: TENANT_ID,
-    registry: ComponentRegistry as JsonPagesConfig['registry'],
-    schemas: SECTION_SCHEMAS as unknown as JsonPagesConfig['schemas'],
-    pages,
-    siteConfig,
-    themeConfig,
-    menuConfig,
-    themeCss: { tenant: fontsCss + '\n' + tenantCss },
-    addSection: addSectionConfig,
-    persistence: {
-      async saveToFile(state: ProjectState, slug: string): Promise<void> {
-        
-        // ☁️ SCENARIO A: CLOUD BRIDGE (Production)
-        if (CLOUD_API_URL && CLOUD_API_KEY) {
-          console.log(`☁️ Saving ${slug} via Cloud Bridge...`);
-          
-          const res = await fetch(`${CLOUD_API_URL}/save`, {
-            method: 'POST',
-            headers: { 
-              'Content-Type': 'application/json',
-              'Authorization': `Bearer ${CLOUD_API_KEY}`
-            },
-            body: JSON.stringify({ 
-              // Mapping logical slug to physical path in repo
-              path: `src/data/pages/${slug}.json`, 
-              // We save the page config specifically
-              content: state.page, 
-              message: `Content update for ${slug} via Visual Editor`
-            }),
-          });
-
-          if (!res.ok) {
-            const err = await res.json().catch(() => ({}));
-            throw new Error(err.error || `Cloud save failed: ${res.status}`);
-          }
-          return;
-        }
-
-        // 💻 SCENARIO B: LOCAL FILESYSTEM (Development)
-        console.log(`💻 Saving ${slug} to Local Filesystem...`);
-        const res = await fetch('/api/save-to-file', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ projectState: state, slug }),
-        });
-        
-        const body = (await res.json().catch(() => ({}))) as { error?: string };
-        if (!res.ok) throw new Error(body.error ?? `Save to file failed: ${res.status}`);
-      },
-    },
-    assets: {
-      assetsBaseUrl: '/assets',
-      assetsManifest,
-      async onAssetUpload(file: File): Promise<string> {
-        // Note: Asset upload in Cloud Mode requires the R2 Bridge (Next Step in Roadmap)
-        // For now, this works in Local Mode.
-        if (!file.type.startsWith('image/')) throw new Error('Invalid file type.');
-        if (file.size > MAX_UPLOAD_SIZE_BYTES) throw new Error(`File too large. Max ${MAX_UPLOAD_SIZE_BYTES / 1024 / 1024}MB.`);
-        
-        const base64 = await new Promise<string>((resolve, reject) => {
-          const reader = new FileReader();
-          reader.onload  = () => resolve((reader.result as string).split(',')[1] ?? '');
-          reader.onerror = () => reject(reader.error);
-          reader.readAsDataURL(file);
-        });
-
-        const res = await fetch('/api/upload-asset', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ filename: file.name, mimeType: file.type || undefined, data: base64 }),
-        });
-        
-        const body = (await res.json().catch(() => ({}))) as { url?: string; error?: string };
-        if (!res.ok) throw new Error(body.error || `Upload failed: ${res.status}`);
-        if (typeof body.url !== 'string') throw new Error('Invalid server response: missing url');
-        return body.url;
-      },
-    },
-  };
-
-  return <JsonPagesEngine config={config} />;
-}
-
-export default App;
-
-END_OF_FILE_CONTENT
-echo "Creating src/_main.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/_main.tsx"
-import '@/types'; // TBP: load type augmentation from capsule-driven types
-import React from 'react';
-import ReactDOM from 'react-dom/client';
-import App from './App';
-// ... resto del file
-
-ReactDOM.createRoot(document.getElementById('root')!).render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>
-);
-
-
-
-
 END_OF_FILE_CONTENT
 mkdir -p "src/components"
 echo "Creating src/components/NotFound.tsx..."
@@ -10909,24 +10675,6 @@ ReactDOM.createRoot(document.getElementById('root')!).render(
 
 
 
-END_OF_FILE_CONTENT
-echo "Creating src/main_.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/main_.tsx"
-import '@/types'; // TBP: load type augmentation from capsule-driven types
-import React from 'react';
-import ReactDOM from 'react-dom/client';
-import App from './App';
-// ... resto del file
-
-ReactDOM.createRoot(document.getElementById('root')!).render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>
-);
-
-
-
-
 END_OF_FILE_CONTENT
 # SKIP: src/registry-types.ts is binary and cannot be embedded as text.
 mkdir -p "src/server"

package/assets/templates/alpha/src_tenant.sh

@@ -596,7 +596,7 @@ cat << 'END_OF_FILE_CONTENT' > "package.json"
     "@tiptap/extension-link": "^2.11.5",
     "@tiptap/react": "^2.11.5",
     "@tiptap/starter-kit": "^2.11.5",
-    "@olonjs/core": "^1.0.70",
+    "@olonjs/core": "^1.0.72",
     "clsx": "^2.1.1",
     "lucide-react": "^0.474.0",
     "react": "^19.0.0",
@@ -941,6 +941,7 @@ import themeData from '@/data/config/theme.json';
 import menuData from '@/data/config/menu.json';
 import { getFilePages } from '@/lib/getFilePages';
 import { DopaDrawer } from '@/components/save-drawer/DopaDrawer';
+import { Skeleton } from '@/components/ui/skeleton';
 
 import tenantCss from './index.css?inline';
 
@@ -1194,6 +1195,16 @@ function cloudFingerprint(apiBase: string, apiKey: string): string {
   return `${normalizeApiBase(apiBase)}::${apiKey.slice(-8)}`;
 }
 
+function normalizeSlugForCache(slug: string): string {
+  return (
+    slug
+      .trim()
+      .toLowerCase()
+      .replace(/[^a-z0-9/_-]/g, '-')
+      .replace(/^\/+|\/+$/g, '') || 'home'
+  );
+}
+
 function readCachedCloudContent(fingerprint: string): CachedCloudContent | null {
   try {
     const raw = localStorage.getItem(CLOUD_CACHE_KEY);
@@ -1248,7 +1259,6 @@ function App() {
   const activeCloudSaveController = useRef<AbortController | null>(null);
   const contentLoadInFlight = useRef<Promise<void> | null>(null);
   const pendingCloudSave = useRef<{ state: ProjectState; slug: string } | null>(null);
-  const warmBootFromCloudCache = useRef(false);
   const cloudApiCandidates = useMemo(
     () => (isCloudMode && CLOUD_API_URL ? buildApiCandidates(CLOUD_API_URL) : []),
     [isCloudMode, CLOUD_API_URL]
@@ -1288,26 +1298,16 @@ function App() {
     const primaryApiBase = cloudApiCandidates[0] ?? normalizeApiBase(CLOUD_API_URL);
     const fingerprint = cloudFingerprint(primaryApiBase, CLOUD_API_KEY);
     const cached = readCachedCloudContent(fingerprint);
+    const cachedPages = cached ? toPagesRecord(cached.pages) : null;
+    const cachedSite = cached ? coerceSiteConfig(cached.siteConfig) : null;
+    const hasCachedFallback = Boolean((cachedPages && Object.keys(cachedPages).length > 0) || cachedSite);
     if (cached) {
-      const cachedPages = toPagesRecord(cached.pages);
-      const cachedSite = coerceSiteConfig(cached.siteConfig);
-      if (cachedPages && Object.keys(cachedPages).length > 0) {
-        setPages(cachedPages);
-      }
-      if (cachedSite) {
-        setSiteConfig(cachedSite);
-      }
-      setContentMode('cloud');
-      setContentFallback(null);
-      warmBootFromCloudCache.current = true;
-      setShowTopProgress(false);
-      setHasInitialCloudResolved(true);
       logBootstrapEvent('boot.cloud.cache_hit', { ageMs: Date.now() - cached.savedAt });
-    } else {
-      warmBootFromCloudCache.current = false;
-      setShowTopProgress(true);
-      setHasInitialCloudResolved(false);
     }
+    setContentMode('cloud');
+    setContentFallback(null);
+    setShowTopProgress(true);
+    setHasInitialCloudResolved(false);
     logBootstrapEvent('boot.start', { mode: 'cloud', apiCandidates: cloudApiCandidates.length });
 
     const loadCloudContent = async () => {
@@ -1320,6 +1320,7 @@ function App() {
             try {
               const res = await fetch(`${apiBase}/content`, {
                 method: 'GET',
+                cache: 'no-store',
                 headers: {
                   Authorization: `Bearer ${CLOUD_API_KEY}`,
                 },
@@ -1422,7 +1423,13 @@ function App() {
       } catch (error: unknown) {
         if (controller.signal.aborted) return;
         const failure = toCloudLoadFailure(error);
-        if (warmBootFromCloudCache.current) {
+        if (hasCachedFallback) {
+          if (cachedPages && Object.keys(cachedPages).length > 0) {
+            setPages(cachedPages);
+          }
+          if (cachedSite) {
+            setSiteConfig(cachedSite);
+          }
           setContentMode('cloud');
           setContentFallback({
             reasonCode: 'CLOUD_REFRESH_FAILED',
@@ -1589,14 +1596,26 @@ function App() {
           },
           body: JSON.stringify({
             slug,
-            type: 'page',
-            data: state.page,
+            page: state.page,
+            siteConfig: state.site,
           }),
         });
         const body = (await res.json().catch(() => ({}))) as { error?: string; code?: string };
         if (!res.ok) {
           throw new Error(body.error || body.code || `Hot save failed: ${res.status}`);
         }
+        const keyFingerprint = cloudFingerprint(apiBase, CLOUD_API_KEY);
+        const normalizedSlug = normalizeSlugForCache(slug);
+        const existing = readCachedCloudContent(keyFingerprint);
+        writeCachedCloudContent({
+          keyFingerprint,
+          savedAt: Date.now(),
+          siteConfig: state.site ?? null,
+          pages: {
+            ...(existing?.pages ?? {}),
+            [normalizedSlug]: state.page,
+          },
+        });
       },
       showLegacySave: !isCloudMode,
       showHotSave: isCloudMode,
@@ -1667,6 +1686,26 @@ function App() {
           </div>
         </>
       ) : null}
+      {isCloudMode && !hasInitialCloudResolved ? (
+        <div className="fixed inset-0 z-[1290] bg-background/80 backdrop-blur-sm">
+          <div className="mx-auto w-full max-w-[1600px] p-6">
+            <div className="grid gap-4 lg:grid-cols-[1fr_420px]">
+              <div className="space-y-4">
+                <Skeleton className="h-10 w-64" />
+                <Skeleton className="h-[220px] w-full rounded-xl" />
+                <Skeleton className="h-[220px] w-full rounded-xl" />
+              </div>
+              <div className="space-y-3 rounded-xl border border-border/50 bg-card/60 p-4">
+                <Skeleton className="h-8 w-32" />
+                <Skeleton className="h-5 w-full" />
+                <Skeleton className="h-5 w-5/6" />
+                <Skeleton className="h-5 w-4/6" />
+                <Skeleton className="h-24 w-full rounded-lg" />
+              </div>
+            </div>
+          </div>
+        </div>
+      ) : null}
       {shouldRenderEngine ? <JsonPagesEngine config={config} /> : null}
       {isCloudMode && (contentMode === 'error' || contentFallback?.reasonCode === 'CLOUD_REFRESH_FAILED') ? (
         <div
@@ -1741,102 +1780,6 @@ function App() {
 export default App;
 
 
-END_OF_FILE_CONTENT
-# SKIP: src/App.tsx:Zone.Identifier is binary and cannot be embedded as text.
-echo "Creating src/App_.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/App_.tsx"
-import { useState, useEffect } from 'react';
-import { JsonPagesEngine } from '@jsonpages/core';
-import type { LibraryImageEntry } from '@jsonpages/core';
-import { ComponentRegistry } from '@/lib/ComponentRegistry';
-import { SECTION_SCHEMAS } from '@/lib/schemas';
-import { addSectionConfig } from '@/lib/addSectionConfig';
-import { getHydratedData } from '@/lib/draftStorage';
-import type { JsonPagesConfig, ProjectState } from '@jsonpages/core';
-import type { SiteConfig, ThemeConfig, MenuConfig } from '@/types';
-
-import siteData from '@/data/config/site.json';
-import themeData from '@/data/config/theme.json';
-import menuData from '@/data/config/menu.json';
-import { getFilePages } from '@/lib/getFilePages';
-
-import fontsCss from './fonts.css?inline';
-import tenantCss from './index.css?inline';
-
-const themeConfig = themeData as unknown as ThemeConfig;
-const menuConfig = menuData as unknown as MenuConfig;
-const TENANT_ID = 'alpha';
-
-const filePages = getFilePages();
-const fileSiteConfig = siteData as unknown as SiteConfig;
-const MAX_UPLOAD_SIZE_BYTES = 5 * 1024 * 1024;
-
-function getInitialData() {
-  return getHydratedData(TENANT_ID, filePages, fileSiteConfig);
-}
-
-function App() {
-  const [{ pages, siteConfig }] = useState(getInitialData);
-  const [assetsManifest, setAssetsManifest] = useState<LibraryImageEntry[]>([]);
-
-  useEffect(() => {
-    fetch('/api/list-assets')
-      .then((r) => (r.ok ? r.json() : []))
-      .then((list: LibraryImageEntry[]) => setAssetsManifest(Array.isArray(list) ? list : []))
-      .catch(() => setAssetsManifest([]));
-  }, []);
-
-  const config: JsonPagesConfig = {
-    tenantId: TENANT_ID,
-    registry: ComponentRegistry as JsonPagesConfig['registry'],
-    schemas:  SECTION_SCHEMAS  as unknown as JsonPagesConfig['schemas'],
-    pages,
-    siteConfig,
-    themeConfig,
-    menuConfig,
-    themeCss: { tenant: fontsCss + '\n' + tenantCss },
-    addSection: addSectionConfig,
-    persistence: {
-      async saveToFile(state: ProjectState, slug: string): Promise<void> {
-        const res = await fetch('/api/save-to-file', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ projectState: state, slug }),
-        });
-        const body = (await res.json().catch(() => ({}))) as { error?: string };
-        if (!res.ok) throw new Error(body.error ?? `Save to file failed: ${res.status}`);
-      },
-    },
-    assets: {
-      assetsBaseUrl: '/assets',
-      assetsManifest,
-      async onAssetUpload(file: File): Promise<string> {
-        if (!file.type.startsWith('image/')) throw new Error('Invalid file type.');
-        if (file.size > MAX_UPLOAD_SIZE_BYTES) throw new Error(`File too large. Max ${MAX_UPLOAD_SIZE_BYTES / 1024 / 1024}MB.`);
-        const base64 = await new Promise<string>((resolve, reject) => {
-          const reader = new FileReader();
-          reader.onload  = () => resolve((reader.result as string).split(',')[1] ?? '');
-          reader.onerror = () => reject(reader.error);
-          reader.readAsDataURL(file);
-        });
-        const res = await fetch('/api/upload-asset', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ filename: file.name, mimeType: file.type || undefined, data: base64 }),
-        });
-        const body = (await res.json().catch(() => ({}))) as { url?: string; error?: string };
-        if (!res.ok) throw new Error(body.error || `Upload failed: ${res.status}`);
-        if (typeof body.url !== 'string') throw new Error('Invalid server response: missing url');
-        return body.url;
-      },
-    },
-  };
-
-  return <JsonPagesEngine config={config} />;
-}
-
-export default App;
-
 END_OF_FILE_CONTENT
 mkdir -p "src/components"
 echo "Creating src/components/NotFound.tsx..."
@@ -7186,6 +7129,26 @@ export { Separator }
 
 
 
+END_OF_FILE_CONTENT
+echo "Creating src/components/ui/skeleton.tsx..."
+cat << 'END_OF_FILE_CONTENT' > "src/components/ui/skeleton.tsx"
+import { cn } from '@/lib/utils';
+import type { HTMLAttributes } from 'react';
+
+function Skeleton({
+  className,
+  ...props
+}: HTMLAttributes<HTMLDivElement>) {
+  return (
+    <div
+      className={cn('animate-pulse rounded-md bg-muted', className)}
+      {...props}
+    />
+  );
+}
+
+export { Skeleton };
+
 END_OF_FILE_CONTENT
 echo "Creating src/components/ui/textarea.tsx..."
 cat << 'END_OF_FILE_CONTENT' > "src/components/ui/textarea.tsx"
@@ -9335,24 +9298,6 @@ ReactDOM.createRoot(document.getElementById('root')!).render(
 
 
 
-END_OF_FILE_CONTENT
-echo "Creating src/main_.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/main_.tsx"
-import '@/types'; // TBP: load type augmentation from capsule-driven types
-import React from 'react';
-import ReactDOM from 'react-dom/client';
-import App from './App';
-// ... resto del file
-
-ReactDOM.createRoot(document.getElementById('root')!).render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>
-);
-
-
-
-
 END_OF_FILE_CONTENT
 # SKIP: src/registry-types.ts is binary and cannot be embedded as text.
 mkdir -p "src/server"

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@olonjs/cli",
-    "version": "3.0.82",
+    "version": "3.0.84",
     "description": "The Sovereign CLI Engine for OlonJS.",
     "type": "module",
     "bin": {