@rslsp1/fa-app-tools 1.3.5 → 1.3.7

package/dist/index.d.mts

@@ -369,6 +369,7 @@ interface ProjectSyncTabProps {
     hfToken?: string;
     onHfLoad?: (file: File) => void;
     onProjectExportBase64?: () => Promise<string>;
+    onHfInitialSync?: (onProgress: (done: number, total: number) => void) => Promise<void>;
 }
 declare const ProjectSyncTab: React.FC<ProjectSyncTabProps>;
 
@@ -478,6 +479,6 @@ declare function hfLoadMetadata(token: string): Promise<any[]>;
 declare function hfUploadImage(base64: string, id: string, token: string, mimeType?: string): Promise<void>;
 declare function hfLoadImageAsBase64(id: string, token: string): Promise<string | null>;
 
-declare const LIB_VERSION = "1.3.5";
+declare const LIB_VERSION = "1.3.7";
 
 export { AvatarArchitectApp, type AvatarArchitectAppProps, CollapsibleCard, CompactDropdown, type ExtractedCharacter, FaToolsBadge, type FlowSdk, GLOBAL_STYLES, type Generation, type HFMetadataEntry, HistoryPanel, InspectPanel, LIB_VERSION, LabBlend, LabCompare, type LabFrame, LabImagePicker, type LabItem, LabLoop, LabRemix, type LabServices, LabsTab, ListView, type MediaItem, MediaLibrary, PillButton, type ProjectMeta, type ProjectSettings, ProjectSyncTab, PromptTab, SectionLabel, type SelectedLabImage, type SelectedTag, SetupPanel, type SyncDiff, TagManagerPanel, type TagOption, type WorkspaceTags, autoLabel, buildBlendInstruction, buildCompareInstruction, buildFallbackPrompt, buildGenerationPrompt, buildImageGenerationOptions, buildLoopInstruction, buildPromptTabPayload, buildReferenceImageMediaIds, buildRemixInstruction, buildScanInstruction, cleanAiResponse, createFlowServices, exportProjectToZip, formatTreeToMarkdown, frameToGeneration, getFormattedTimestamp, getHFToken, groupGenerationsToLabItems, hfDeleteProject, hfDownloadProject, hfListProjects, hfLoadImageAsBase64, hfLoadMetadata, hfLoadTags, hfSaveMetadata, hfSaveTags, hfUploadImage, hfUploadProjectForm, importProjectFromZip, injectXMPMetadata, interpretSdkError, parsePromptFile, parsePromptResponse, setHFToken, useKeyboardNavigation, useOnClickOutside };

package/dist/index.d.ts

@@ -369,6 +369,7 @@ interface ProjectSyncTabProps {
     hfToken?: string;
     onHfLoad?: (file: File) => void;
     onProjectExportBase64?: () => Promise<string>;
+    onHfInitialSync?: (onProgress: (done: number, total: number) => void) => Promise<void>;
 }
 declare const ProjectSyncTab: React.FC<ProjectSyncTabProps>;
 
@@ -478,6 +479,6 @@ declare function hfLoadMetadata(token: string): Promise<any[]>;
 declare function hfUploadImage(base64: string, id: string, token: string, mimeType?: string): Promise<void>;
 declare function hfLoadImageAsBase64(id: string, token: string): Promise<string | null>;
 
-declare const LIB_VERSION = "1.3.5";
+declare const LIB_VERSION = "1.3.7";
 
 export { AvatarArchitectApp, type AvatarArchitectAppProps, CollapsibleCard, CompactDropdown, type ExtractedCharacter, FaToolsBadge, type FlowSdk, GLOBAL_STYLES, type Generation, type HFMetadataEntry, HistoryPanel, InspectPanel, LIB_VERSION, LabBlend, LabCompare, type LabFrame, LabImagePicker, type LabItem, LabLoop, LabRemix, type LabServices, LabsTab, ListView, type MediaItem, MediaLibrary, PillButton, type ProjectMeta, type ProjectSettings, ProjectSyncTab, PromptTab, SectionLabel, type SelectedLabImage, type SelectedTag, SetupPanel, type SyncDiff, TagManagerPanel, type TagOption, type WorkspaceTags, autoLabel, buildBlendInstruction, buildCompareInstruction, buildFallbackPrompt, buildGenerationPrompt, buildImageGenerationOptions, buildLoopInstruction, buildPromptTabPayload, buildReferenceImageMediaIds, buildRemixInstruction, buildScanInstruction, cleanAiResponse, createFlowServices, exportProjectToZip, formatTreeToMarkdown, frameToGeneration, getFormattedTimestamp, getHFToken, groupGenerationsToLabItems, hfDeleteProject, hfDownloadProject, hfListProjects, hfLoadImageAsBase64, hfLoadMetadata, hfLoadTags, hfSaveMetadata, hfSaveTags, hfUploadImage, hfUploadProjectForm, importProjectFromZip, injectXMPMetadata, interpretSdkError, parsePromptFile, parsePromptResponse, setHFToken, useKeyboardNavigation, useOnClickOutside };

package/dist/index.js

@@ -1883,7 +1883,8 @@ var ProjectSyncTab = ({
   onExecuteSync,
   hfToken,
   onHfLoad,
-  onProjectExportBase64
+  onProjectExportBase64,
+  onHfInitialSync
 }) => {
   const projectInputRef = (0, import_react13.useRef)(null);
   const workspaceInputRef = (0, import_react13.useRef)(null);
@@ -1943,6 +1944,8 @@ var ProjectSyncTab = ({
   const [hfSaving, setHfSaving] = (0, import_react13.useState)(false);
   const [hfError, setHfError] = (0, import_react13.useState)(null);
   const [hfSaveName, setHfSaveName] = (0, import_react13.useState)("");
+  const [hfSyncProgress, setHfSyncProgress] = (0, import_react13.useState)(null);
+  const [hfSyncing, setHfSyncing] = (0, import_react13.useState)(false);
   const loadHfProjects = async (token) => {
     setHfLoading(true);
     setHfError(null);
@@ -2090,6 +2093,38 @@ var ProjectSyncTab = ({
           }
         )
       ] }),
+      onHfInitialSync && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+          PillButton,
+          {
+            variant: "outline",
+            icon: "cloud_sync",
+            loading: hfSyncing,
+            onClick: async () => {
+              setHfSyncing(true);
+              setHfError(null);
+              setHfSyncProgress({ done: 0, total: 0 });
+              try {
+                await onHfInitialSync((done, total) => setHfSyncProgress({ done, total }));
+                setHfSyncProgress(null);
+              } catch (e) {
+                setHfError(e.message);
+                setHfSyncProgress(null);
+              } finally {
+                setHfSyncing(false);
+              }
+            },
+            children: hfSyncing && hfSyncProgress ? `${hfSyncProgress.done} / ${hfSyncProgress.total} Bilder` : "Initial-Sync nach HF"
+          }
+        ),
+        hfSyncing && hfSyncProgress && hfSyncProgress.total > 0 && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "w-full h-1 bg-white/10 rounded-full overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+          "div",
+          {
+            className: "h-full bg-blue-400 rounded-full transition-all",
+            style: { width: `${Math.round(hfSyncProgress.done / hfSyncProgress.total * 100)}%` }
+          }
+        ) })
+      ] }),
       hfError && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-[10px] text-red-400 font-mono px-1", children: hfError }),
       !hfLoading && hfProjects.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "text-[10px] text-white/20 px-2", children: "Noch nichts auf HF gespeichert." }),
       hfProjects.map((p) => /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex items-center gap-2 px-3 py-2 rounded-xl bg-white/5 border border-white/5", children: [
@@ -3924,6 +3959,32 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
     await onServerDelete(id);
     await fetchServerProjects();
   };
+  const handleHfInitialSync = async (onProgress) => {
+    if (!hfToken) return;
+    const gens = galleryItems.filter((g) => g.base64 && g.status === "done");
+    const total = gens.length;
+    onProgress(0, total);
+    let done = 0;
+    for (const gen of gens) {
+      const raw = gen.base64.includes(",") ? gen.base64.split(",")[1] : gen.base64;
+      const mimeType = gen.base64.startsWith("data:image/png") ? "image/png" : "image/jpeg";
+      await hfUploadImage(raw, gen.id, hfToken, mimeType);
+      done++;
+      onProgress(done, total);
+    }
+    const metaEntries = gens.map((g) => ({
+      id: g.id,
+      prompt: g.prompt || void 0,
+      seed: g.seed,
+      model: g.model,
+      tags: g.tags || [],
+      timestamp: g.timestamp,
+      mimeType: g.base64.startsWith("data:image/png") ? "image/png" : "image/jpeg"
+    }));
+    await hfSaveMetadata(metaEntries, hfToken);
+    setHfMetadata(metaEntries);
+    if (workspaceTags) await hfSaveTags(workspaceTags, hfToken);
+  };
   const handleComputeSyncDiff = async () => {
     if (!onFetchServerProjects || !onServerLoad) throw new Error("Server nicht konfiguriert");
     const projects = await onFetchServerProjects();
@@ -3969,8 +4030,30 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
       if (tags?.by_category) setWorkspaceTags(tags);
     }).catch(() => {
     });
-    hfLoadMetadata(hfToken).then((entries) => {
-      if (Array.isArray(entries)) setHfMetadata(entries);
+    hfLoadMetadata(hfToken).then(async (entries) => {
+      if (!Array.isArray(entries) || entries.length === 0) return;
+      setHfMetadata(entries);
+      const skeletons = entries.map((e) => ({
+        id: e.id,
+        nodeId: e.id,
+        prompt: e.prompt,
+        seed: e.seed,
+        model: e.model,
+        tags: e.tags || [],
+        timestamp: e.timestamp,
+        status: "done"
+      }));
+      setGalleryItems(skeletons);
+      for (const entry of entries) {
+        hfLoadImageAsBase64(entry.id, hfToken).then((b64) => {
+          if (!b64) return;
+          const prefix = `data:${entry.mimeType || "image/jpeg"};base64,`;
+          setGalleryItems((prev) => prev.map(
+            (g) => g.id === entry.id ? { ...g, base64: prefix + b64 } : g
+          ));
+        }).catch(() => {
+        });
+      }
     }).catch(() => {
     });
   }, [hfToken]);
@@ -4436,7 +4519,8 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
               onProjectExportBase64: async () => {
                 const { base64 } = await exportProjectToZip(nodes, edges, history, galleryItems, { aspectRatio, selectedModel, seed, seedMode }, workspaceTags, recentLabItems.map((i) => i.id));
                 return base64;
-              }
+              },
+              onHfInitialSync: hfToken ? handleHfInitialSync : void 0
             }
           ),
           activeTab === "tags" && workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
@@ -4765,7 +4849,8 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
             onProjectExportBase64: async () => {
               const { base64 } = await Promise.resolve().then(() => (init_project(), project_exports)).then((m) => m.exportProjectToZip(nodes, edges, history, galleryItems, { aspectRatio, selectedModel, seed, seedMode }, workspaceTags, recentLabItems.map((i) => i.id)));
               return base64;
-            }
+            },
+            onHfInitialSync: hfToken ? handleHfInitialSync : void 0
           }
         )
       ] })
@@ -4775,7 +4860,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
 
 // src/index.ts
 init_hfStateService();
-var LIB_VERSION = "1.3.5";
+var LIB_VERSION = "1.3.7";
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   AvatarArchitectApp,

package/dist/index.mjs

@@ -1333,7 +1333,8 @@ var ProjectSyncTab = ({
   onExecuteSync,
   hfToken,
   onHfLoad,
-  onProjectExportBase64
+  onProjectExportBase64,
+  onHfInitialSync
 }) => {
   const projectInputRef = useRef5(null);
   const workspaceInputRef = useRef5(null);
@@ -1393,6 +1394,8 @@ var ProjectSyncTab = ({
   const [hfSaving, setHfSaving] = useState6(false);
   const [hfError, setHfError] = useState6(null);
   const [hfSaveName, setHfSaveName] = useState6("");
+  const [hfSyncProgress, setHfSyncProgress] = useState6(null);
+  const [hfSyncing, setHfSyncing] = useState6(false);
   const loadHfProjects = async (token) => {
     setHfLoading(true);
     setHfError(null);
@@ -1540,6 +1543,38 @@ var ProjectSyncTab = ({
           }
         )
       ] }),
+      onHfInitialSync && /* @__PURE__ */ jsxs10("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ jsx12(
+          PillButton,
+          {
+            variant: "outline",
+            icon: "cloud_sync",
+            loading: hfSyncing,
+            onClick: async () => {
+              setHfSyncing(true);
+              setHfError(null);
+              setHfSyncProgress({ done: 0, total: 0 });
+              try {
+                await onHfInitialSync((done, total) => setHfSyncProgress({ done, total }));
+                setHfSyncProgress(null);
+              } catch (e) {
+                setHfError(e.message);
+                setHfSyncProgress(null);
+              } finally {
+                setHfSyncing(false);
+              }
+            },
+            children: hfSyncing && hfSyncProgress ? `${hfSyncProgress.done} / ${hfSyncProgress.total} Bilder` : "Initial-Sync nach HF"
+          }
+        ),
+        hfSyncing && hfSyncProgress && hfSyncProgress.total > 0 && /* @__PURE__ */ jsx12("div", { className: "w-full h-1 bg-white/10 rounded-full overflow-hidden", children: /* @__PURE__ */ jsx12(
+          "div",
+          {
+            className: "h-full bg-blue-400 rounded-full transition-all",
+            style: { width: `${Math.round(hfSyncProgress.done / hfSyncProgress.total * 100)}%` }
+          }
+        ) })
+      ] }),
       hfError && /* @__PURE__ */ jsx12("p", { className: "text-[10px] text-red-400 font-mono px-1", children: hfError }),
       !hfLoading && hfProjects.length === 0 && /* @__PURE__ */ jsx12("p", { className: "text-[10px] text-white/20 px-2", children: "Noch nichts auf HF gespeichert." }),
       hfProjects.map((p) => /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2 px-3 py-2 rounded-xl bg-white/5 border border-white/5", children: [
@@ -3367,6 +3402,32 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
     await onServerDelete(id);
     await fetchServerProjects();
   };
+  const handleHfInitialSync = async (onProgress) => {
+    if (!hfToken) return;
+    const gens = galleryItems.filter((g) => g.base64 && g.status === "done");
+    const total = gens.length;
+    onProgress(0, total);
+    let done = 0;
+    for (const gen of gens) {
+      const raw = gen.base64.includes(",") ? gen.base64.split(",")[1] : gen.base64;
+      const mimeType = gen.base64.startsWith("data:image/png") ? "image/png" : "image/jpeg";
+      await hfUploadImage(raw, gen.id, hfToken, mimeType);
+      done++;
+      onProgress(done, total);
+    }
+    const metaEntries = gens.map((g) => ({
+      id: g.id,
+      prompt: g.prompt || void 0,
+      seed: g.seed,
+      model: g.model,
+      tags: g.tags || [],
+      timestamp: g.timestamp,
+      mimeType: g.base64.startsWith("data:image/png") ? "image/png" : "image/jpeg"
+    }));
+    await hfSaveMetadata(metaEntries, hfToken);
+    setHfMetadata(metaEntries);
+    if (workspaceTags) await hfSaveTags(workspaceTags, hfToken);
+  };
   const handleComputeSyncDiff = async () => {
     if (!onFetchServerProjects || !onServerLoad) throw new Error("Server nicht konfiguriert");
     const projects = await onFetchServerProjects();
@@ -3412,8 +3473,30 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
       if (tags?.by_category) setWorkspaceTags(tags);
     }).catch(() => {
     });
-    hfLoadMetadata(hfToken).then((entries) => {
-      if (Array.isArray(entries)) setHfMetadata(entries);
+    hfLoadMetadata(hfToken).then(async (entries) => {
+      if (!Array.isArray(entries) || entries.length === 0) return;
+      setHfMetadata(entries);
+      const skeletons = entries.map((e) => ({
+        id: e.id,
+        nodeId: e.id,
+        prompt: e.prompt,
+        seed: e.seed,
+        model: e.model,
+        tags: e.tags || [],
+        timestamp: e.timestamp,
+        status: "done"
+      }));
+      setGalleryItems(skeletons);
+      for (const entry of entries) {
+        hfLoadImageAsBase64(entry.id, hfToken).then((b64) => {
+          if (!b64) return;
+          const prefix = `data:${entry.mimeType || "image/jpeg"};base64,`;
+          setGalleryItems((prev) => prev.map(
+            (g) => g.id === entry.id ? { ...g, base64: prefix + b64 } : g
+          ));
+        }).catch(() => {
+        });
+      }
     }).catch(() => {
     });
   }, [hfToken]);
@@ -3879,7 +3962,8 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
               onProjectExportBase64: async () => {
                 const { base64 } = await exportProjectToZip(nodes, edges, history, galleryItems, { aspectRatio, selectedModel, seed, seedMode }, workspaceTags, recentLabItems.map((i) => i.id));
                 return base64;
-              }
+              },
+              onHfInitialSync: hfToken ? handleHfInitialSync : void 0
             }
           ),
           activeTab === "tags" && workspaceTags && /* @__PURE__ */ jsx20(
@@ -4208,7 +4292,8 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
             onProjectExportBase64: async () => {
               const { base64 } = await import("./project-O4ORKXY5.mjs").then((m) => m.exportProjectToZip(nodes, edges, history, galleryItems, { aspectRatio, selectedModel, seed, seedMode }, workspaceTags, recentLabItems.map((i) => i.id)));
               return base64;
-            }
+            },
+            onHfInitialSync: hfToken ? handleHfInitialSync : void 0
           }
         )
       ] })
@@ -4217,7 +4302,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
 }
 
 // src/index.ts
-var LIB_VERSION = "1.3.5";
+var LIB_VERSION = "1.3.7";
 export {
   AvatarArchitectApp,
   CollapsibleCard,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rslsp1/fa-app-tools",
-  "version": "1.3.5",
+  "version": "1.3.7",
   "description": "Shared tools and hooks for Fine Art flow apps",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",