@widgetic/creator 0.3.49

package/dist/stores/websocketStore.js

@@ -0,0 +1,289 @@
+/**
+ * WebSocket Store
+ *
+ * Manages WebSocket connection for real-time events:
+ * - Code generation status (operation progress)
+ * - Widget publish status (build completion)
+ * - Dynamic Worker preview readiness
+ */
+import { writable, get } from 'svelte/store';
+// =============================================================================
+// Stores
+// =============================================================================
+export const connectionState = writable({
+    connected: false,
+    joinedRooms: [],
+    error: null
+});
+export const dynamicWorkerPreviewStatus = writable({
+    widgetId: null,
+    previewUrl: null,
+    buildTimeMs: null,
+    timestamp: null
+});
+export const widgetPublishStatus = writable({
+    widgetId: null,
+    status: null,
+    version: undefined,
+    artifactUrl: undefined,
+    message: undefined,
+    error: undefined,
+    timestamp: null
+});
+export const codeGenerationStatus = writable({
+    operationId: null,
+    status: null,
+    previousStatus: null,
+    progress: 0,
+    error: null,
+    timestamp: null
+});
+export const agentHarnessOutput = writable(null);
+// =============================================================================
+// Socket.IO Connection
+// =============================================================================
+let socket = null;
+let socketImportPromise = null;
+let currentAuthToken = null;
+let lastTokenUsed = null;
+let activeUserId = null;
+/** Runtime API root for embedded hosts (site PUBLIC_API_URL). Overrides VITE_API_URL. */
+let runtimeApiUrl = null;
+const showLogs = true;
+export function setAuthToken(token) {
+    currentAuthToken = token;
+    if (token !== lastTokenUsed && socket) {
+        if (showLogs)
+            console.log('[WsStore] Token changed, will recreate socket on next connect');
+        if (socket.connected) {
+            socket.disconnect();
+        }
+        socket = null;
+        socketImportPromise = null;
+    }
+}
+/** Prefer host-provided API URL so embedded creator does not socket.io to localhost:3000. */
+export function setWebsocketApiUrl(apiUrl) {
+    const normalized = apiUrl ? String(apiUrl).replace(/\/+$/, '') : null;
+    if (normalized === runtimeApiUrl)
+        return;
+    runtimeApiUrl = normalized;
+    if (socket) {
+        if (showLogs)
+            console.log('[WsStore] API URL changed, recreating socket on next connect:', runtimeApiUrl);
+        if (socket.connected) {
+            socket.disconnect();
+        }
+        socket = null;
+        socketImportPromise = null;
+    }
+}
+async function getSocket() {
+    if (socket && currentAuthToken !== lastTokenUsed) {
+        if (showLogs)
+            console.log('[WsStore] Recreating socket with new token');
+        if (socket.connected) {
+            socket.disconnect();
+        }
+        socket = null;
+        socketImportPromise = null;
+    }
+    if (socket)
+        return socket;
+    if (!socketImportPromise) {
+        socketImportPromise = import('socket.io-client').then(({ io }) => {
+            // Prefer runtime override (embedded hosts), then build-time VITE_API_URL
+            const apiUrl = (runtimeApiUrl || import.meta.env.VITE_API_URL || 'http://localhost:3000').replace(/\/+$/, '');
+            lastTokenUsed = currentAuthToken;
+            if (showLogs)
+                console.log('[WsStore] Creating socket with auth token:', currentAuthToken ? 'present' : 'missing', 'api:', apiUrl);
+            socket = io(apiUrl, {
+                autoConnect: false,
+                transports: ['websocket', 'polling'],
+                reconnection: true,
+                reconnectionAttempts: 5,
+                reconnectionDelay: 1000,
+                auth: currentAuthToken ? { token: currentAuthToken } : undefined
+            });
+            setupSocketListeners(socket);
+            return socket;
+        }).catch(err => {
+            console.error('[WsStore] Failed to load socket.io-client:', err);
+            return null;
+        });
+    }
+    return socketImportPromise;
+}
+function setupSocketListeners(sock) {
+    if (!sock)
+        return;
+    sock.on('connect', () => {
+        if (showLogs)
+            console.log('[WsStore] WebSocket connected');
+        connectionState.update(s => ({ ...s, connected: true, error: null }));
+        if (activeUserId) {
+            sock.emit('joinRoom', { room: `user-${activeUserId}` });
+            if (showLogs)
+                console.log('[WsStore] Re-joining user room after reconnect:', `user-${activeUserId}`);
+        }
+    });
+    sock.on('disconnect', (reason) => {
+        if (showLogs)
+            console.log('[WsStore] WebSocket disconnected:', reason);
+        connectionState.update(s => ({ ...s, connected: false, joinedRooms: [] }));
+    });
+    sock.on('connect_error', (err) => {
+        if (showLogs)
+            console.error('[WsStore] WebSocket connection error:', err.message);
+        connectionState.update(s => ({ ...s, connected: false, error: err.message }));
+    });
+    // =========================================================================
+    // Widget Publish Events
+    // =========================================================================
+    sock.on('widget_publish_status', (data) => {
+        if (showLogs)
+            console.log('[WsStore] Widget publish status received:', data);
+        widgetPublishStatus.set({
+            widgetId: data.widgetId ?? null,
+            status: data.status ?? null,
+            version: data.version,
+            artifactUrl: data.artifactUrl,
+            message: data.message,
+            error: data.error,
+            timestamp: new Date().toISOString()
+        });
+    });
+    sock.on('publish:complete', (data) => {
+        if (showLogs)
+            console.log('[WsStore] Publish complete received:', data);
+        widgetPublishStatus.set({
+            widgetId: data.widgetId ?? null,
+            status: 'success',
+            version: data.versionPublished,
+            artifactUrl: data.artifactUrl,
+            message: data.message,
+            error: undefined,
+            timestamp: new Date().toISOString()
+        });
+    });
+    sock.on('build:error', (data) => {
+        if (showLogs)
+            console.log('[WsStore] Build error received:', data);
+        widgetPublishStatus.set({
+            widgetId: data.widgetId ?? null,
+            status: 'failure',
+            version: data.version,
+            artifactUrl: undefined,
+            message: data.message ?? 'Build failed.',
+            error: data.error,
+            timestamp: new Date().toISOString()
+        });
+    });
+    // =========================================================================
+    // Code Generation Status
+    // =========================================================================
+    sock.on('code_generation_status', (data) => {
+        if (showLogs)
+            console.log('[WsStore] Code generation status received:', data);
+        codeGenerationStatus.set({
+            operationId: data.operationId ?? null,
+            status: data.status ?? null,
+            previousStatus: data.previousStatus ?? null,
+            progress: data.progress ?? 0,
+            error: data.error ?? null,
+            timestamp: data.timestamp ?? new Date().toISOString()
+        });
+    });
+    // =========================================================================
+    // Dynamic Worker Preview
+    // =========================================================================
+    sock.on('vmConsole:aiderOutput', (data) => {
+        const output = typeof data?.output === 'string' ? data.output.trim() : '';
+        if (!output)
+            return;
+        if (showLogs)
+            console.log('[WsStore] Agent harness output:', output.slice(0, 120));
+        agentHarnessOutput.set({
+            output,
+            timestamp: new Date().toISOString()
+        });
+    });
+    sock.on('dynamic_worker_preview_ready', (data) => {
+        if (showLogs)
+            console.log('[WsStore] Dynamic Worker preview ready!', {
+                widgetId: data.widgetId,
+                previewUrl: data.previewUrl?.substring(0, 60) + '...',
+                buildTimeMs: data.buildTimeMs
+            });
+        dynamicWorkerPreviewStatus.set({
+            widgetId: data.widgetId,
+            previewUrl: data.previewUrl,
+            buildTimeMs: data.buildTimeMs,
+            timestamp: new Date().toISOString()
+        });
+    });
+}
+// =============================================================================
+// Public Functions
+// =============================================================================
+/**
+ * Connect to WebSocket and join user room for receiving events.
+ */
+export async function connectWebSocket(userId) {
+    const sock = await getSocket();
+    if (!sock) {
+        if (showLogs)
+            console.error('[WsStore] Socket not available');
+        return false;
+    }
+    if (userId)
+        activeUserId = userId;
+    if (!sock.connected) {
+        sock.connect();
+    }
+    return new Promise((resolve) => {
+        const timeout = setTimeout(() => {
+            if (showLogs)
+                console.error('[WsStore] Connection timeout');
+            resolve(false);
+        }, 5000);
+        const tryJoin = () => {
+            if (sock.connected) {
+                clearTimeout(timeout);
+                if (userId) {
+                    sock.emit('joinRoom', { room: `user-${userId}` });
+                    if (showLogs)
+                        console.log('[WsStore] Joined user room:', `user-${userId}`);
+                }
+                connectionState.set({
+                    connected: true,
+                    joinedRooms: userId ? [`user-${userId}`] : [],
+                    error: null
+                });
+                resolve(true);
+            }
+            else {
+                sock.once('connect', tryJoin);
+            }
+        };
+        tryJoin();
+    });
+}
+/**
+ * Disconnect from WebSocket.
+ */
+export async function disconnectWebSocket() {
+    const sock = await getSocket();
+    if (!sock)
+        return;
+    const state = get(connectionState);
+    if (state.joinedRooms.length > 0) {
+        state.joinedRooms.forEach(room => {
+            sock.emit('leave', room);
+        });
+    }
+    connectionState.update(s => ({
+        ...s,
+        joinedRooms: []
+    }));
+}

package/dist/syncSiteAuth.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Sync creator session from site auth (localStorage.session.accessToken).
+ * Used when CreatorApp is embedded in Frontend/site on the same origin.
+ *
+ * Dexie L1 owner is applied only when enableLocalCache was turned on via
+ * setEnableLocalCache (CreatorApp prop). Site's authStore owns cache in the
+ * site bundle; creator has a separate in-memory owner and must opt in.
+ */
+export declare function syncSessionFromSiteAuth(): boolean;

package/dist/syncSiteAuth.js

@@ -0,0 +1,53 @@
+import { decodeJWT } from './pageHelpers';
+import { setSession } from './stores/userSession';
+import { syncLocalCacheOwner } from './localCacheGate.js';
+/**
+ * Sync creator session from site auth (localStorage.session.accessToken).
+ * Used when CreatorApp is embedded in Frontend/site on the same origin.
+ *
+ * Dexie L1 owner is applied only when enableLocalCache was turned on via
+ * setEnableLocalCache (CreatorApp prop). Site's authStore owns cache in the
+ * site bundle; creator has a separate in-memory owner and must opt in.
+ */
+export function syncSessionFromSiteAuth() {
+    if (typeof window === 'undefined')
+        return false;
+    try {
+        const sessionStr = localStorage.getItem('session');
+        if (!sessionStr) {
+            console.warn('[CreatorApp] No site session found in localStorage');
+            syncLocalCacheOwner(null);
+            return false;
+        }
+        const session = JSON.parse(sessionStr);
+        const token = session?.accessToken || session?.access_token;
+        if (!token) {
+            console.warn('[CreatorApp] Site session has no access token');
+            syncLocalCacheOwner(null);
+            return false;
+        }
+        const decoded = decodeJWT(token);
+        const user = decoded
+            ? {
+                id: decoded.sub || decoded.user_id || decoded.id || 'site-user',
+                email: decoded.email || decoded.user_metadata?.email || session?.user?.email,
+                name: decoded.user_metadata?.name ||
+                    decoded.user_metadata?.full_name ||
+                    decoded.name ||
+                    session?.user?.name ||
+                    'User',
+                role: decoded.role || 'user',
+                avatar: decoded.user_metadata?.avatar_url || decoded.user_metadata?.picture
+            }
+            : session?.user || { id: 'site-user', email: 'user@widgetic.com', name: 'User' };
+        // setSession → syncLocalCacheOwner when enableLocalCache is on
+        setSession(user, token);
+        console.log('[CreatorApp] Session synced from site auth');
+        return true;
+    }
+    catch (error) {
+        console.error('[CreatorApp] Failed to sync session from site:', error);
+        syncLocalCacheOwner(null);
+        return false;
+    }
+}

package/dist/utils/creatorDraftStorage.d.ts

@@ -0,0 +1,17 @@
+export interface WidgetDraft {
+    promptText: string;
+    chatDraft: string;
+    images: string[];
+}
+export declare function saveWidgetDraft(widgetId: string, draft: Partial<WidgetDraft>): Promise<void>;
+export declare function readWidgetDraft(widgetId: string): Promise<Partial<WidgetDraft> | null>;
+export declare function deleteWidgetDraft(widgetId: string): Promise<void>;
+/** Bulk-read all drafts for the owner (keyed by widgetId). */
+export declare function readAllWidgetDrafts(): Promise<Record<string, WidgetDraft>>;
+/** Copy one widget's draft to another (duplicate-widget support). */
+export declare function copyWidgetDraft(sourceWidgetId: string, targetWidgetId: string): Promise<void>;
+export declare function saveCanvasState(canvasId: string | null, json: string): void;
+export declare function readCanvasState(canvasId: string | null): Promise<string | null>;
+export declare function saveActiveGeneration(widgetId: string, operationId: string): void;
+export declare function readActiveGeneration(widgetId: string): Promise<string | null>;
+export declare function clearActiveGeneration(widgetId: string): Promise<void>;

package/dist/utils/creatorDraftStorage.js

@@ -0,0 +1,87 @@
+/**
+ * Durable draft + selection storage for the widget creator.
+ *
+ * Replaces the per-widget localStorage family (prompt text, prompt images,
+ * chat drafts, canvas-state fallback JSON, active generation id) with the
+ * shared L1 store. Keys are owner-scoped inside @widgetic/cache-layer.
+ * Cross-tab generation/publishing flags intentionally remain in
+ * localStorage — they must be visible to other tabs, not just this one.
+ */
+import { deleteEntity, getCacheOwner, readAllEntitiesForKind, readEntity, writeEntity } from '@widgetic/cache-layer';
+const DRAFT_KIND = 'creatorDrafts';
+const CANVAS_KIND = 'creatorCanvasState';
+const GENERATION_KIND = 'creatorActiveGeneration';
+function ownerIdOrNull() {
+    return getCacheOwner();
+}
+export async function saveWidgetDraft(widgetId, draft) {
+    const ownerId = ownerIdOrNull();
+    if (!ownerId)
+        return;
+    const existing = (await readEntity(ownerId, DRAFT_KIND, widgetId)) ?? {
+        promptText: '',
+        chatDraft: '',
+        images: []
+    };
+    await writeEntity(ownerId, DRAFT_KIND, widgetId, { ...existing, ...draft });
+}
+export async function readWidgetDraft(widgetId) {
+    const ownerId = ownerIdOrNull();
+    if (!ownerId)
+        return null;
+    return readEntity(ownerId, DRAFT_KIND, widgetId);
+}
+export async function deleteWidgetDraft(widgetId) {
+    const ownerId = ownerIdOrNull();
+    if (!ownerId)
+        return;
+    await deleteEntity(ownerId, DRAFT_KIND, widgetId);
+}
+/** Bulk-read all drafts for the owner (keyed by widgetId). */
+export async function readAllWidgetDrafts() {
+    const ownerId = ownerIdOrNull();
+    if (!ownerId)
+        return {};
+    return readAllEntitiesForKind(ownerId, DRAFT_KIND);
+}
+/** Copy one widget's draft to another (duplicate-widget support). */
+export async function copyWidgetDraft(sourceWidgetId, targetWidgetId) {
+    const source = await readWidgetDraft(sourceWidgetId);
+    if (!source)
+        return;
+    await saveWidgetDraft(targetWidgetId, source);
+}
+// ─── Canvas state fallback ───────────────────────────────────────
+export function saveCanvasState(canvasId, json) {
+    const ownerId = ownerIdOrNull();
+    if (!ownerId)
+        return;
+    void writeEntity(ownerId, CANVAS_KIND, canvasId ?? 'default', json).catch((error) => {
+        console.warn('[creatorDraftStorage] Failed to persist canvas state:', error);
+    });
+}
+export async function readCanvasState(canvasId) {
+    const ownerId = ownerIdOrNull();
+    if (!ownerId)
+        return null;
+    return readEntity(ownerId, CANVAS_KIND, canvasId ?? 'default');
+}
+// ─── Active generation id ────────────────────────────────────────
+export function saveActiveGeneration(widgetId, operationId) {
+    const ownerId = ownerIdOrNull();
+    if (!ownerId)
+        return;
+    void writeEntity(ownerId, GENERATION_KIND, widgetId, operationId);
+}
+export async function readActiveGeneration(widgetId) {
+    const ownerId = ownerIdOrNull();
+    if (!ownerId)
+        return null;
+    return readEntity(ownerId, GENERATION_KIND, widgetId);
+}
+export async function clearActiveGeneration(widgetId) {
+    const ownerId = ownerIdOrNull();
+    if (!ownerId)
+        return;
+    await deleteEntity(ownerId, GENERATION_KIND, widgetId);
+}

package/dist/utils/embedCode.d.ts

@@ -0,0 +1,51 @@
+/**
+ * Embed code generation utilities for the Embed step.
+ *
+ * Two formats are supported:
+ *  - `iframe`: classic `<iframe>` pointing at the published widget HTML on the CDN.
+ *  - `web-component`: customer-facing `<widgetic>` host tag. The embed SDK
+ *    scans for this tag and hydrates it. (Autonomous custom elements must
+ *    contain a hyphen, so the SDK does not `define("widgetic")` — it finds
+ *    `<widgetic>` in the DOM and renders into it.)
+ *
+ * The SDK script is served from `cdn.widgetic.com/sdks/browser/embed-sdk.js`
+ * (R2 custom domain on the `widgets` bucket — see AGENTS.md embed architecture).
+ */
+export type EmbedFormat = 'iframe' | 'web-component';
+export declare const EMBED_FORMATS: EmbedFormat[];
+export declare const EMBED_FORMAT_LABELS: Record<EmbedFormat, string>;
+export interface EmbedCodeParams {
+    /** Direct widget HTML URL on the CDN (or API proxy in dev). */
+    embedSrc: string;
+    /** Composition id, if a composition is selected. */
+    compositionId?: string | null;
+    /** Embed width in pixels. */
+    width: number;
+    /** Embed height in pixels. */
+    height: number;
+    /** CDN base URL for the embed SDK script. Defaults to https://cdn.widgetic.com */
+    sdkBaseUrl?: string;
+}
+/**
+ * Build the iframe embed snippet. Backward compatible with the previous
+ * hardcoded block in `CreatorApp.svelte`.
+ */
+export declare function generateIframeEmbedCode({ embedSrc, width, height }: EmbedCodeParams): string;
+/**
+ * Build the Web Component embed snippet using `<widgetic>`.
+ * Requires a composition id — the custom element loader fetches the
+ * composition + widget module from the CDN via the embed-sdk batch API.
+ *
+ * If no composition is selected we fall back to the iframe format
+ * (caller should check `compositionId` before calling this).
+ */
+export declare function generateWebComponentEmbedCode({ compositionId, width, height, sdkBaseUrl }: EmbedCodeParams): string;
+/**
+ * Pick the right embed code for the requested format, with fallback to
+ * iframe when the Web Component format is requested but no composition
+ * is selected (custom element requires `composition-id`).
+ */
+export declare function generateEmbedCode(format: EmbedFormat, params: EmbedCodeParams): {
+    code: string;
+    effectiveFormat: EmbedFormat;
+};

package/dist/utils/embedCode.js

@@ -0,0 +1,69 @@
+/**
+ * Embed code generation utilities for the Embed step.
+ *
+ * Two formats are supported:
+ *  - `iframe`: classic `<iframe>` pointing at the published widget HTML on the CDN.
+ *  - `web-component`: customer-facing `<widgetic>` host tag. The embed SDK
+ *    scans for this tag and hydrates it. (Autonomous custom elements must
+ *    contain a hyphen, so the SDK does not `define("widgetic")` — it finds
+ *    `<widgetic>` in the DOM and renders into it.)
+ *
+ * The SDK script is served from `cdn.widgetic.com/sdks/browser/embed-sdk.js`
+ * (R2 custom domain on the `widgets` bucket — see AGENTS.md embed architecture).
+ */
+export const EMBED_FORMATS = ['iframe', 'web-component'];
+export const EMBED_FORMAT_LABELS = {
+    iframe: 'iframe',
+    'web-component': 'Web Component'
+};
+/**
+ * Build the iframe embed snippet. Backward compatible with the previous
+ * hardcoded block in `CreatorApp.svelte`.
+ */
+export function generateIframeEmbedCode({ embedSrc, width, height }) {
+    return `<iframe src="${embedSrc}" width="${width}" height="${height}" frameborder="0" allowfullscreen></iframe>`;
+}
+/**
+ * Build the Web Component embed snippet using `<widgetic>`.
+ * Requires a composition id — the custom element loader fetches the
+ * composition + widget module from the CDN via the embed-sdk batch API.
+ *
+ * If no composition is selected we fall back to the iframe format
+ * (caller should check `compositionId` before calling this).
+ */
+export function generateWebComponentEmbedCode({ compositionId, width, height, sdkBaseUrl = 'https://cdn.widgetic.com' }) {
+    if (!compositionId) {
+        // Defensive: caller should have fallen back to iframe already.
+        return '';
+    }
+    return `<script src="${sdkBaseUrl}/sdks/browser/embed-sdk.js" async></script>
+<widgetic
+  composition-id="${compositionId}"
+  width="${width}"
+  height="${height}"
+  render-mode="custom-element">
+</widgetic>`;
+}
+/**
+ * Pick the right embed code for the requested format, with fallback to
+ * iframe when the Web Component format is requested but no composition
+ * is selected (custom element requires `composition-id`).
+ */
+export function generateEmbedCode(format, params) {
+    if (format === 'web-component') {
+        if (!params.compositionId) {
+            return {
+                code: generateIframeEmbedCode(params),
+                effectiveFormat: 'iframe'
+            };
+        }
+        return {
+            code: generateWebComponentEmbedCode(params),
+            effectiveFormat: 'web-component'
+        };
+    }
+    return {
+        code: generateIframeEmbedCode(params),
+        effectiveFormat: 'iframe'
+    };
+}

package/dist/utils/models.d.ts

@@ -0,0 +1,4 @@
+export declare function generateAudioFromText(description: string, duration?: any): Promise<any>;
+export declare function generateImageFromText(str: string, imgWidth: number, imgHeight: number, genMetaObj: any): Promise<any>;
+export declare function generateSuperprompt(str: string): Promise<any>;
+export declare function wakeUpImageGenModel(): Promise<any>;

package/dist/utils/models.js

@@ -0,0 +1,94 @@
+// local endoints methods(proxy)
+// genenerate audio from text using Baseten model
+export async function generateAudioFromText(description, duration = 5) {
+    // return { data: "https://replicate.delivery/pbxt/EKK8MxXO69LfeEhhWsy7FA2ku3KTvxrYFO2WxvLochuk1tUSA/output.wav" };
+    // basten model id
+    const model_id = "7qrj60r3"; // audio-gen model deployment id from the service we use to host models
+    // call the model
+    const result = await callModel({ prompts: [description], duration: Number(duration), model_host: 'baseten', model_id });
+    console.log('Audio Gen Model response data:', result);
+    // if no error return the data
+    if (!result.error && result.status !== 'error' && result.data) {
+        let res = result.data.length > 0 ? result.data[0] : result.data;
+        // add the audio data type
+        res = 'data:audio/mpeg;base64,' + res;
+        // return the audio data object
+        return { data: res };
+    }
+    // if error return the error
+    return result;
+}
+// generate images from text calling an AI Model
+const img_gen_model_id = "1vn88"; // image-gen model deployment id from the service we use to host models
+export async function generateImageFromText(str, imgWidth, imgHeight, genMetaObj) {
+    // create the model input
+    let input = {
+        prompt: str,
+        // image size
+        width: imgWidth, height: imgHeight,
+        // other params
+        ...genMetaObj,
+        // model id
+        model_id: img_gen_model_id
+    };
+    console.log('Model call input:', input);
+    // call the model
+    let response = await callModel(input);
+    console.log('Image Gen Model response:', response);
+    // check if no result
+    if (!response)
+        response = { error: 'No data generated!' };
+    // if no error add image header and return the data
+    if (!response.error && response.data) {
+        // TODO: check if it's an array of images and use first: response.data[0]
+        // console.log("Model data response:", response.data.length);
+        // let res = response.data.length > 0 ? response.data[0] : response.data;
+        // add the image data type
+        // res = 'data:image/png;base64,' + res;
+        let res = 'data:image/png;base64,' + response.data;
+        // return the image data object
+        return { data: res };
+    }
+    // if error return the error
+    return response;
+}
+let super_prompt_model_id = "oc3j2"; // superprompt-gen model deployment id from the service we use to host models
+export async function generateSuperprompt(str) {
+    // call the model
+    let input = { prompt: str, lcm: true, model_host: 'groq', model_id: super_prompt_model_id };
+    // console.log('Model call input:', input);
+    const result = await callModel(input);
+    // console.log('Model response data:', result);
+    // if no error modify and return the data
+    if (!result.error && result.data) {
+        // TODO: check if it's an array of results then use first: results.data[0]
+        // console.log("Model data result:", result.data.length);
+        // let res = result.data.length > 0 ? result.data[0] : result.data;
+        // read the response data
+        let res = result.data;
+        // return the image data object
+        return { data: res };
+    }
+    // if error return the error
+    return result;
+}
+export async function wakeUpImageGenModel() {
+    // call the model
+    const result = await callModel({ model_id: img_gen_model_id, method: 'wake' });
+    // if no error return the data
+    return result;
+}
+async function callModel(input) {
+    // read model host service name
+    let model_host = input.model_host || 'beam';
+    // make a request to local endpoint that calls the model on server side
+    const response = await fetch(`/api/call-${model_host}-model`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify(input),
+    });
+    // read the data from the response
+    const data = await response.json();
+    // return response data
+    return data;
+}