@kapeta/local-cluster-service 0.65.0 → 0.66.0

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+# [0.66.0](https://github.com/kapetacom/local-cluster-service/compare/v0.65.0...v0.66.0) (2024-08-27)
+
+
+### Features
+
+* use new UI theme functionality [CORE-3289] ([#225](https://github.com/kapetacom/local-cluster-service/issues/225)) ([95d8078](https://github.com/kapetacom/local-cluster-service/commit/95d807877d585d4d62af3dd228ea9138ab989d55))
+
 # [0.65.0](https://github.com/kapetacom/local-cluster-service/compare/v0.64.3...v0.65.0) (2024-08-26)
 
 

package/dist/cjs/src/storm/PageGenerator.d.ts

@@ -11,12 +11,14 @@ export declare class PageQueue extends EventEmitter {
     private readonly systemId;
     private readonly references;
     private uiShells;
+    private theme;
     constructor(systemId: string, concurrency?: number);
     on(event: 'event', listener: (data: StormEvent) => void): this;
     on(event: 'page', listener: (data: StormEventPage) => void): this;
     emit(type: 'event', event: StormEvent): boolean;
     emit(type: 'page', event: StormEventPage): boolean;
     addUiShell(uiShell: UIShell): void;
+    setUiTheme(theme: string): void;
     addPrompt(initialPrompt: Omit<UIPagePrompt, 'shell_page'>, conversationId?: string, overwrite?: boolean): Promise<void>;
     private addPageGenerator;
     cancel(): void;

package/dist/cjs/src/storm/PageGenerator.js

@@ -18,6 +18,7 @@ class PageQueue extends node_events_1.EventEmitter {
     systemId;
     references = new Map();
     uiShells = [];
+    theme = '';
     constructor(systemId, concurrency = 5) {
         super();
         this.systemId = systemId;
@@ -32,6 +33,9 @@ class PageQueue extends node_events_1.EventEmitter {
     addUiShell(uiShell) {
         this.uiShells.push(uiShell);
     }
+    setUiTheme(theme) {
+        this.theme = theme;
+    }
     addPrompt(initialPrompt, conversationId = node_uuid_1.default.v4(), overwrite = false) {
         if (!overwrite && this.references.has(initialPrompt.path)) {
             console.log('Ignoring duplicate prompt', initialPrompt.path);
@@ -44,6 +48,7 @@ class PageQueue extends node_events_1.EventEmitter {
         const prompt = {
             ...initialPrompt,
             shell_page: this.uiShells.find((shell) => shell.screens.includes(initialPrompt.name))?.content,
+            theme: this.theme,
         };
         const generator = new PageGenerator(prompt, conversationId);
         this.references.set(prompt.path, generator);
@@ -84,6 +89,7 @@ class PageQueue extends node_events_1.EventEmitter {
                                     : ''),
                             description: reference.description,
                             filename: '',
+                            theme: this.theme,
                         });
                         break;
                 }

package/dist/cjs/src/storm/UIServer.js

@@ -12,6 +12,7 @@ const express_1 = __importDefault(require("express"));
 const page_utils_1 = require("./page-utils");
 const clusterService_1 = require("../clusterService");
 const http_1 = require("http");
+const path_1 = require("path");
 class UIServer {
     systemId;
     port = 50000;
@@ -28,6 +29,8 @@ class UIServer {
                     window.sessionStorage.clear();
                 </script>`);
         });
+        // Make it possible to serve static assets
+        app.use(express_1.default.static((0, path_1.join)((0, page_utils_1.getSystemBaseDir)(this.systemId), 'public'), { fallthrough: true }));
         app.all('/*', (req, res) => {
             (0, page_utils_1.readPageFromDisk)(this.systemId, req.params[0], req.method, res);
         });

package/dist/cjs/src/storm/page-utils.d.ts

@@ -2,14 +2,18 @@
  * Copyright 2023 Kapeta Inc.
  * SPDX-License-Identifier: BUSL-1.1
  */
-import { StormEventPage } from './events';
+import { StormEventFileDone, StormEventPage } from './events';
 import { Response } from 'express';
 import { ConversationItem } from './stream';
 export declare const SystemIdHeader = "System-Id";
 export declare function writePageToDisk(systemId: string, event: StormEventPage): Promise<{
     path: string;
 }>;
+export declare function writeAssetToDisk(systemId: string, event: StormEventFileDone): Promise<{
+    path: string;
+}>;
 export declare function hasPageOnDisk(systemId: string, method: string, path: string): boolean;
+export declare function getSystemBaseDir(systemId: string): string;
 export declare function resolveReadPath(systemId: string, path: string, method: string): string | null;
 export declare function readPageFromDiskAsString(systemId: string, path: string, method: string): string | null;
 export declare function readPageFromDisk(systemId: string, path: string, method: string, res: Response): void;

package/dist/cjs/src/storm/page-utils.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.writeConversationToFile = exports.readConversationFromFile = exports.readPageFromDisk = exports.readPageFromDiskAsString = exports.resolveReadPath = exports.hasPageOnDisk = exports.writePageToDisk = exports.SystemIdHeader = void 0;
+exports.writeConversationToFile = exports.readConversationFromFile = exports.readPageFromDisk = exports.readPageFromDiskAsString = exports.resolveReadPath = exports.getSystemBaseDir = exports.hasPageOnDisk = exports.writeAssetToDisk = exports.writePageToDisk = exports.SystemIdHeader = void 0;
 const node_os_1 = __importDefault(require("node:os"));
 const path_1 = __importDefault(require("path"));
 const fs_extra_1 = __importDefault(require("fs-extra"));
@@ -15,7 +15,7 @@ function normalizePath(path) {
         .replace(/\{[a-z]+}/gi, '*');
 }
 async function writePageToDisk(systemId, event) {
-    const baseDir = getBaseDir(systemId);
+    const baseDir = getSystemBaseDir(systemId);
     const filePath = getFilePath(event.payload.method);
     const path = path_1.default.join(baseDir, normalizePath(event.payload.path), filePath);
     await fs_extra_1.default.ensureDir(path_1.default.dirname(path));
@@ -26,21 +26,32 @@ async function writePageToDisk(systemId, event) {
     };
 }
 exports.writePageToDisk = writePageToDisk;
+async function writeAssetToDisk(systemId, event) {
+    const baseDir = getSystemBaseDir(systemId);
+    const path = path_1.default.join(baseDir, 'public', event.payload.filename);
+    await fs_extra_1.default.ensureDir(path_1.default.dirname(path));
+    await fs_extra_1.default.writeFile(path, event.payload.content);
+    return {
+        path,
+    };
+}
+exports.writeAssetToDisk = writeAssetToDisk;
 function hasPageOnDisk(systemId, method, path) {
-    const baseDir = getBaseDir(systemId);
+    const baseDir = getSystemBaseDir(systemId);
     const filePath = getFilePath(method);
     const fullPath = path_1.default.join(baseDir, normalizePath(path), filePath);
     return fs_extra_1.default.existsSync(fullPath);
 }
 exports.hasPageOnDisk = hasPageOnDisk;
-function getBaseDir(systemId) {
+function getSystemBaseDir(systemId) {
     return path_1.default.join(node_os_1.default.tmpdir(), 'ai-systems', systemId);
 }
+exports.getSystemBaseDir = getSystemBaseDir;
 function getFilePath(method) {
     return path_1.default.join(method.toLowerCase(), 'index.html');
 }
 function resolveReadPath(systemId, path, method) {
-    const baseDir = getBaseDir(systemId);
+    const baseDir = getSystemBaseDir(systemId);
     path = normalizePath(path);
     const filePath = getFilePath(method);
     const fullPath = path_1.default.join(baseDir, path, filePath);

package/dist/cjs/src/storm/routes.js

@@ -22,6 +22,7 @@ const node_uuid_1 = __importDefault(require("node-uuid"));
 const page_utils_1 = require("./page-utils");
 const UIServer_1 = require("./UIServer");
 const PageGenerator_1 = require("./PageGenerator");
+const crypto_1 = require("crypto");
 const UI_SERVERS = {};
 const router = (0, express_promise_router_1.default)();
 router.use('/', cors_1.corsHandler);
@@ -142,6 +143,8 @@ router.post('/:handle/ui/iterative', async (req, res) => {
                     title: landingPage.title,
                     filename: landingPage.filename,
                     storage_prefix: systemId + '_',
+                    // TODO: Add themes to this request type
+                    theme: '',
                 });
             }
             catch (e) {
@@ -177,11 +180,10 @@ router.post('/:handle/ui/iterative', async (req, res) => {
 router.post('/:handle/ui', async (req, res) => {
     const handle = req.params.handle;
     try {
-        const conversationId = req.headers[stormClient_1.ConversationIdHeader.toLowerCase()];
+        const outerConversationId = req.headers[stormClient_1.ConversationIdHeader.toLowerCase()] || (0, crypto_1.randomUUID)();
         const aiRequest = JSON.parse(req.stringBody ?? '{}');
         // Get user journeys
-        const userJourneysStream = await stormClient_1.stormClient.createUIUserJourneys(aiRequest, conversationId);
-        const outerConversationId = userJourneysStream.getConversationId();
+        const userJourneysStream = await stormClient_1.stormClient.createUIUserJourneys(aiRequest, outerConversationId);
         onRequestAborted(req, res, () => {
             userJourneysStream.abort();
         });
@@ -213,9 +215,50 @@ router.post('/:handle/ui', async (req, res) => {
             userJourneysStream.abort();
             sendError(error, res);
         });
+        let theme = '';
+        try {
+            const themeStream = await stormClient_1.stormClient.createTheme(aiRequest, outerConversationId);
+            onRequestAborted(req, res, () => {
+                themeStream.abort();
+            });
+            themeStream.on('data', (evt) => {
+                sendEvent(res, evt);
+                if (evt.type === 'FILE_DONE') {
+                    theme = evt.payload.content;
+                    (0, page_utils_1.writeAssetToDisk)(outerConversationId, evt).catch((err) => {
+                        sendEvent(res, {
+                            type: 'ERROR_INTERNAL',
+                            created: new Date().getTime(),
+                            payload: { error: err.message },
+                            reason: 'Failed to save theme',
+                        });
+                    });
+                }
+            });
+            themeStream.on('error', (error) => {
+                console.error(error);
+                sendEvent(res, {
+                    type: 'ERROR_INTERNAL',
+                    created: new Date().getTime(),
+                    payload: { error: error.message },
+                    reason: 'Failed to create theme',
+                });
+            });
+            await waitForStormStream(themeStream);
+        }
+        catch (e) {
+            console.error('Failed to generate theme', e);
+            sendEvent(res, {
+                type: 'ERROR_INTERNAL',
+                created: new Date().getTime(),
+                payload: { error: e.message },
+                reason: 'Failed to create theme',
+            });
+        }
         await waitForStormStream(userJourneysStream);
         // Get the UI shells
         const shellsStream = await stormClient_1.stormClient.createUIShells({
+            theme: theme ? `// filename: theme.css\n${theme}` : undefined,
             pages: Object.values(uniqueUserJourneyScreens).map((screen) => ({
                 name: screen.name,
                 title: screen.title,
@@ -224,11 +267,12 @@ router.post('/:handle/ui', async (req, res) => {
                 method: screen.method,
                 requirements: screen.requirements,
             })),
-        }, conversationId);
+        }, outerConversationId);
         onRequestAborted(req, res, () => {
             shellsStream.abort();
         });
         const queue = new PageGenerator_1.PageQueue(outerConversationId, 5);
+        queue.setUiTheme(theme);
         shellsStream.on('data', (data) => {
             console.log('Processing shell event', data);
             sendEvent(res, data);
@@ -279,6 +323,7 @@ router.post('/:handle/ui', async (req, res) => {
                 title: screen.title,
                 filename: screen.filename,
                 storage_prefix: outerConversationId + '_',
+                theme,
             }));
         }
         await queue.wait();

package/dist/cjs/src/storm/stormClient.d.ts

@@ -4,6 +4,7 @@ import { Page, StormEventPageUrl } from './events';
 export declare const STORM_ID = "storm";
 export declare const ConversationIdHeader = "Conversation-Id";
 export interface UIShellsPrompt {
+    theme?: string;
     pages: {
         name: string;
         title: string;
@@ -23,6 +24,7 @@ export interface UIPagePrompt {
     description: string;
     storage_prefix: string;
     shell_page?: string;
+    theme: string;
 }
 export interface UIPageSamplePrompt extends UIPagePrompt {
     variantId: string;
@@ -60,6 +62,7 @@ declare class StormClient {
     createMetadata(prompt: BasePromptRequest, conversationId?: string): Promise<StormStream>;
     createUIPages(prompt: string, conversationId?: string): Promise<StormStream>;
     createUIUserJourneys(prompt: BasePromptRequest, conversationId?: string): Promise<StormStream>;
+    createTheme(prompt: BasePromptRequest, conversationId?: string): Promise<StormStream>;
     createUIShells(prompt: UIShellsPrompt, conversationId?: string): Promise<StormStream>;
     createUILandingPages(prompt: BasePromptRequest, conversationId?: string): Promise<StormStream>;
     createUIPage(prompt: UIPagePrompt, conversationId?: string, history?: ConversationItem[]): Promise<StormStream>;

package/dist/cjs/src/storm/stormClient.js

@@ -92,6 +92,12 @@ class StormClient {
             conversationId,
         });
     }
+    createTheme(prompt, conversationId) {
+        return this.send('/v2/ui/theme', {
+            prompt: prompt,
+            conversationId,
+        });
+    }
     createUIShells(prompt, conversationId) {
         return this.send('/v2/ui/shells', {
             prompt: JSON.stringify(prompt),

package/dist/esm/src/storm/PageGenerator.d.ts

@@ -11,12 +11,14 @@ export declare class PageQueue extends EventEmitter {
     private readonly systemId;
     private readonly references;
     private uiShells;
+    private theme;
     constructor(systemId: string, concurrency?: number);
     on(event: 'event', listener: (data: StormEvent) => void): this;
     on(event: 'page', listener: (data: StormEventPage) => void): this;
     emit(type: 'event', event: StormEvent): boolean;
     emit(type: 'page', event: StormEventPage): boolean;
     addUiShell(uiShell: UIShell): void;
+    setUiTheme(theme: string): void;
     addPrompt(initialPrompt: Omit<UIPagePrompt, 'shell_page'>, conversationId?: string, overwrite?: boolean): Promise<void>;
     private addPageGenerator;
     cancel(): void;

package/dist/esm/src/storm/PageGenerator.js

@@ -18,6 +18,7 @@ class PageQueue extends node_events_1.EventEmitter {
     systemId;
     references = new Map();
     uiShells = [];
+    theme = '';
     constructor(systemId, concurrency = 5) {
         super();
         this.systemId = systemId;
@@ -32,6 +33,9 @@ class PageQueue extends node_events_1.EventEmitter {
     addUiShell(uiShell) {
         this.uiShells.push(uiShell);
     }
+    setUiTheme(theme) {
+        this.theme = theme;
+    }
     addPrompt(initialPrompt, conversationId = node_uuid_1.default.v4(), overwrite = false) {
         if (!overwrite && this.references.has(initialPrompt.path)) {
             console.log('Ignoring duplicate prompt', initialPrompt.path);
@@ -44,6 +48,7 @@ class PageQueue extends node_events_1.EventEmitter {
         const prompt = {
             ...initialPrompt,
             shell_page: this.uiShells.find((shell) => shell.screens.includes(initialPrompt.name))?.content,
+            theme: this.theme,
         };
         const generator = new PageGenerator(prompt, conversationId);
         this.references.set(prompt.path, generator);
@@ -84,6 +89,7 @@ class PageQueue extends node_events_1.EventEmitter {
                                     : ''),
                             description: reference.description,
                             filename: '',
+                            theme: this.theme,
                         });
                         break;
                 }

package/dist/esm/src/storm/UIServer.js

@@ -12,6 +12,7 @@ const express_1 = __importDefault(require("express"));
 const page_utils_1 = require("./page-utils");
 const clusterService_1 = require("../clusterService");
 const http_1 = require("http");
+const path_1 = require("path");
 class UIServer {
     systemId;
     port = 50000;
@@ -28,6 +29,8 @@ class UIServer {
                     window.sessionStorage.clear();
                 </script>`);
         });
+        // Make it possible to serve static assets
+        app.use(express_1.default.static((0, path_1.join)((0, page_utils_1.getSystemBaseDir)(this.systemId), 'public'), { fallthrough: true }));
         app.all('/*', (req, res) => {
             (0, page_utils_1.readPageFromDisk)(this.systemId, req.params[0], req.method, res);
         });

package/dist/esm/src/storm/page-utils.d.ts

@@ -2,14 +2,18 @@
  * Copyright 2023 Kapeta Inc.
  * SPDX-License-Identifier: BUSL-1.1
  */
-import { StormEventPage } from './events';
+import { StormEventFileDone, StormEventPage } from './events';
 import { Response } from 'express';
 import { ConversationItem } from './stream';
 export declare const SystemIdHeader = "System-Id";
 export declare function writePageToDisk(systemId: string, event: StormEventPage): Promise<{
     path: string;
 }>;
+export declare function writeAssetToDisk(systemId: string, event: StormEventFileDone): Promise<{
+    path: string;
+}>;
 export declare function hasPageOnDisk(systemId: string, method: string, path: string): boolean;
+export declare function getSystemBaseDir(systemId: string): string;
 export declare function resolveReadPath(systemId: string, path: string, method: string): string | null;
 export declare function readPageFromDiskAsString(systemId: string, path: string, method: string): string | null;
 export declare function readPageFromDisk(systemId: string, path: string, method: string, res: Response): void;

package/dist/esm/src/storm/page-utils.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.writeConversationToFile = exports.readConversationFromFile = exports.readPageFromDisk = exports.readPageFromDiskAsString = exports.resolveReadPath = exports.hasPageOnDisk = exports.writePageToDisk = exports.SystemIdHeader = void 0;
+exports.writeConversationToFile = exports.readConversationFromFile = exports.readPageFromDisk = exports.readPageFromDiskAsString = exports.resolveReadPath = exports.getSystemBaseDir = exports.hasPageOnDisk = exports.writeAssetToDisk = exports.writePageToDisk = exports.SystemIdHeader = void 0;
 const node_os_1 = __importDefault(require("node:os"));
 const path_1 = __importDefault(require("path"));
 const fs_extra_1 = __importDefault(require("fs-extra"));
@@ -15,7 +15,7 @@ function normalizePath(path) {
         .replace(/\{[a-z]+}/gi, '*');
 }
 async function writePageToDisk(systemId, event) {
-    const baseDir = getBaseDir(systemId);
+    const baseDir = getSystemBaseDir(systemId);
     const filePath = getFilePath(event.payload.method);
     const path = path_1.default.join(baseDir, normalizePath(event.payload.path), filePath);
     await fs_extra_1.default.ensureDir(path_1.default.dirname(path));
@@ -26,21 +26,32 @@ async function writePageToDisk(systemId, event) {
     };
 }
 exports.writePageToDisk = writePageToDisk;
+async function writeAssetToDisk(systemId, event) {
+    const baseDir = getSystemBaseDir(systemId);
+    const path = path_1.default.join(baseDir, 'public', event.payload.filename);
+    await fs_extra_1.default.ensureDir(path_1.default.dirname(path));
+    await fs_extra_1.default.writeFile(path, event.payload.content);
+    return {
+        path,
+    };
+}
+exports.writeAssetToDisk = writeAssetToDisk;
 function hasPageOnDisk(systemId, method, path) {
-    const baseDir = getBaseDir(systemId);
+    const baseDir = getSystemBaseDir(systemId);
     const filePath = getFilePath(method);
     const fullPath = path_1.default.join(baseDir, normalizePath(path), filePath);
     return fs_extra_1.default.existsSync(fullPath);
 }
 exports.hasPageOnDisk = hasPageOnDisk;
-function getBaseDir(systemId) {
+function getSystemBaseDir(systemId) {
     return path_1.default.join(node_os_1.default.tmpdir(), 'ai-systems', systemId);
 }
+exports.getSystemBaseDir = getSystemBaseDir;
 function getFilePath(method) {
     return path_1.default.join(method.toLowerCase(), 'index.html');
 }
 function resolveReadPath(systemId, path, method) {
-    const baseDir = getBaseDir(systemId);
+    const baseDir = getSystemBaseDir(systemId);
     path = normalizePath(path);
     const filePath = getFilePath(method);
     const fullPath = path_1.default.join(baseDir, path, filePath);

package/dist/esm/src/storm/routes.js

@@ -22,6 +22,7 @@ const node_uuid_1 = __importDefault(require("node-uuid"));
 const page_utils_1 = require("./page-utils");
 const UIServer_1 = require("./UIServer");
 const PageGenerator_1 = require("./PageGenerator");
+const crypto_1 = require("crypto");
 const UI_SERVERS = {};
 const router = (0, express_promise_router_1.default)();
 router.use('/', cors_1.corsHandler);
@@ -142,6 +143,8 @@ router.post('/:handle/ui/iterative', async (req, res) => {
                     title: landingPage.title,
                     filename: landingPage.filename,
                     storage_prefix: systemId + '_',
+                    // TODO: Add themes to this request type
+                    theme: '',
                 });
             }
             catch (e) {
@@ -177,11 +180,10 @@ router.post('/:handle/ui/iterative', async (req, res) => {
 router.post('/:handle/ui', async (req, res) => {
     const handle = req.params.handle;
     try {
-        const conversationId = req.headers[stormClient_1.ConversationIdHeader.toLowerCase()];
+        const outerConversationId = req.headers[stormClient_1.ConversationIdHeader.toLowerCase()] || (0, crypto_1.randomUUID)();
         const aiRequest = JSON.parse(req.stringBody ?? '{}');
         // Get user journeys
-        const userJourneysStream = await stormClient_1.stormClient.createUIUserJourneys(aiRequest, conversationId);
-        const outerConversationId = userJourneysStream.getConversationId();
+        const userJourneysStream = await stormClient_1.stormClient.createUIUserJourneys(aiRequest, outerConversationId);
         onRequestAborted(req, res, () => {
             userJourneysStream.abort();
         });
@@ -213,9 +215,50 @@ router.post('/:handle/ui', async (req, res) => {
             userJourneysStream.abort();
             sendError(error, res);
         });
+        let theme = '';
+        try {
+            const themeStream = await stormClient_1.stormClient.createTheme(aiRequest, outerConversationId);
+            onRequestAborted(req, res, () => {
+                themeStream.abort();
+            });
+            themeStream.on('data', (evt) => {
+                sendEvent(res, evt);
+                if (evt.type === 'FILE_DONE') {
+                    theme = evt.payload.content;
+                    (0, page_utils_1.writeAssetToDisk)(outerConversationId, evt).catch((err) => {
+                        sendEvent(res, {
+                            type: 'ERROR_INTERNAL',
+                            created: new Date().getTime(),
+                            payload: { error: err.message },
+                            reason: 'Failed to save theme',
+                        });
+                    });
+                }
+            });
+            themeStream.on('error', (error) => {
+                console.error(error);
+                sendEvent(res, {
+                    type: 'ERROR_INTERNAL',
+                    created: new Date().getTime(),
+                    payload: { error: error.message },
+                    reason: 'Failed to create theme',
+                });
+            });
+            await waitForStormStream(themeStream);
+        }
+        catch (e) {
+            console.error('Failed to generate theme', e);
+            sendEvent(res, {
+                type: 'ERROR_INTERNAL',
+                created: new Date().getTime(),
+                payload: { error: e.message },
+                reason: 'Failed to create theme',
+            });
+        }
         await waitForStormStream(userJourneysStream);
         // Get the UI shells
         const shellsStream = await stormClient_1.stormClient.createUIShells({
+            theme: theme ? `// filename: theme.css\n${theme}` : undefined,
             pages: Object.values(uniqueUserJourneyScreens).map((screen) => ({
                 name: screen.name,
                 title: screen.title,
@@ -224,11 +267,12 @@ router.post('/:handle/ui', async (req, res) => {
                 method: screen.method,
                 requirements: screen.requirements,
             })),
-        }, conversationId);
+        }, outerConversationId);
         onRequestAborted(req, res, () => {
             shellsStream.abort();
         });
         const queue = new PageGenerator_1.PageQueue(outerConversationId, 5);
+        queue.setUiTheme(theme);
         shellsStream.on('data', (data) => {
             console.log('Processing shell event', data);
             sendEvent(res, data);
@@ -279,6 +323,7 @@ router.post('/:handle/ui', async (req, res) => {
                 title: screen.title,
                 filename: screen.filename,
                 storage_prefix: outerConversationId + '_',
+                theme,
             }));
         }
         await queue.wait();

package/dist/esm/src/storm/stormClient.d.ts

@@ -4,6 +4,7 @@ import { Page, StormEventPageUrl } from './events';
 export declare const STORM_ID = "storm";
 export declare const ConversationIdHeader = "Conversation-Id";
 export interface UIShellsPrompt {
+    theme?: string;
     pages: {
         name: string;
         title: string;
@@ -23,6 +24,7 @@ export interface UIPagePrompt {
     description: string;
     storage_prefix: string;
     shell_page?: string;
+    theme: string;
 }
 export interface UIPageSamplePrompt extends UIPagePrompt {
     variantId: string;
@@ -60,6 +62,7 @@ declare class StormClient {
     createMetadata(prompt: BasePromptRequest, conversationId?: string): Promise<StormStream>;
     createUIPages(prompt: string, conversationId?: string): Promise<StormStream>;
     createUIUserJourneys(prompt: BasePromptRequest, conversationId?: string): Promise<StormStream>;
+    createTheme(prompt: BasePromptRequest, conversationId?: string): Promise<StormStream>;
     createUIShells(prompt: UIShellsPrompt, conversationId?: string): Promise<StormStream>;
     createUILandingPages(prompt: BasePromptRequest, conversationId?: string): Promise<StormStream>;
     createUIPage(prompt: UIPagePrompt, conversationId?: string, history?: ConversationItem[]): Promise<StormStream>;

package/dist/esm/src/storm/stormClient.js

@@ -92,6 +92,12 @@ class StormClient {
             conversationId,
         });
     }
+    createTheme(prompt, conversationId) {
+        return this.send('/v2/ui/theme', {
+            prompt: prompt,
+            conversationId,
+        });
+    }
     createUIShells(prompt, conversationId) {
         return this.send('/v2/ui/shells', {
             prompt: JSON.stringify(prompt),

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@kapeta/local-cluster-service",
-    "version": "0.65.0",
+    "version": "0.66.0",
     "description": "Manages configuration, ports and service discovery for locally running Kapeta systems",
     "type": "commonjs",
     "exports": {

package/src/storm/PageGenerator.ts

@@ -21,6 +21,7 @@ export class PageQueue extends EventEmitter {
     private readonly systemId: string;
     private readonly references: Map<string, PageGenerator> = new Map();
     private uiShells: UIShell[] = [];
+    private theme = '';
 
     constructor(systemId: string, concurrency: number = 5) {
         super();
@@ -45,6 +46,10 @@ export class PageQueue extends EventEmitter {
         this.uiShells.push(uiShell);
     }
 
+    public setUiTheme(theme: string) {
+        this.theme = theme;
+    }
+
     public addPrompt(
         initialPrompt: Omit<UIPagePrompt, 'shell_page'>,
         conversationId: string = uuid.v4(),
@@ -63,6 +68,7 @@ export class PageQueue extends EventEmitter {
         const prompt: UIPagePrompt = {
             ...initialPrompt,
             shell_page: this.uiShells.find((shell) => shell.screens.includes(initialPrompt.name))?.content,
+            theme: this.theme,
         };
 
         const generator = new PageGenerator(prompt, conversationId);
@@ -110,6 +116,7 @@ export class PageQueue extends EventEmitter {
                                     : ''),
                             description: reference.description,
                             filename: '',
+                            theme: this.theme,
                         });
                         break;
                 }

package/src/storm/UIServer.ts

@@ -3,10 +3,11 @@
  * SPDX-License-Identifier: BUSL-1.1
  */
 import express, { Express, Request, Response } from 'express';
-import { readPageFromDisk } from './page-utils';
+import { getSystemBaseDir, readPageFromDisk } from './page-utils';
 import { clusterService } from '../clusterService';
 import { createServer, Server } from 'http';
 import { StormEventPage } from './events';
+import { join } from 'path';
 
 export class UIServer {
     private readonly systemId: string;
@@ -30,6 +31,9 @@ export class UIServer {
             );
         });
 
+        // Make it possible to serve static assets
+        app.use(express.static(join(getSystemBaseDir(this.systemId), 'public'), { fallthrough: true }));
+
         app.all('/*', (req: Request, res: Response) => {
             readPageFromDisk(this.systemId, req.params[0], req.method, res);
         });

package/src/storm/page-utils.ts

@@ -2,7 +2,7 @@
  * Copyright 2023 Kapeta Inc.
  * SPDX-License-Identifier: BUSL-1.1
  */
-import { StormEventPage } from './events';
+import { StormEventFileDone, StormEventPage } from './events';
 import { Response } from 'express';
 import os from 'node:os';
 import Path from 'path';
@@ -21,7 +21,7 @@ function normalizePath(path: string) {
 }
 
 export async function writePageToDisk(systemId: string, event: StormEventPage) {
-    const baseDir = getBaseDir(systemId);
+    const baseDir = getSystemBaseDir(systemId);
     const filePath = getFilePath(event.payload.method);
     const path = Path.join(baseDir, normalizePath(event.payload.path), filePath);
     await FS.ensureDir(Path.dirname(path));
@@ -34,14 +34,25 @@ export async function writePageToDisk(systemId: string, event: StormEventPage) {
     };
 }
 
+export async function writeAssetToDisk(systemId: string, event: StormEventFileDone) {
+    const baseDir = getSystemBaseDir(systemId);
+    const path = Path.join(baseDir, 'public', event.payload.filename);
+    await FS.ensureDir(Path.dirname(path));
+    await FS.writeFile(path, event.payload.content);
+
+    return {
+        path,
+    };
+}
+
 export function hasPageOnDisk(systemId: string, method: string, path: string) {
-    const baseDir = getBaseDir(systemId);
+    const baseDir = getSystemBaseDir(systemId);
     const filePath = getFilePath(method);
     const fullPath = Path.join(baseDir, normalizePath(path), filePath);
     return FS.existsSync(fullPath);
 }
 
-function getBaseDir(systemId: string) {
+export function getSystemBaseDir(systemId: string) {
     return Path.join(os.tmpdir(), 'ai-systems', systemId);
 }
 
@@ -50,7 +61,7 @@ function getFilePath(method: string) {
 }
 
 export function resolveReadPath(systemId: string, path: string, method: string) {
-    const baseDir = getBaseDir(systemId);
+    const baseDir = getSystemBaseDir(systemId);
 
     path = normalizePath(path);
 

package/src/storm/routes.ts

@@ -35,9 +35,16 @@ import {
 import { StormCodegen } from './codegen';
 import { assetManager } from '../assetManager';
 import uuid from 'node-uuid';
-import { readPageFromDisk, readPageFromDiskAsString, SystemIdHeader, writePageToDisk } from './page-utils';
+import {
+    readPageFromDisk,
+    readPageFromDiskAsString,
+    SystemIdHeader,
+    writeAssetToDisk,
+    writePageToDisk,
+} from './page-utils';
 import { UIServer } from './UIServer';
 import { PageQueue } from './PageGenerator';
+import { randomUUID } from 'crypto';
 
 const UI_SERVERS: { [key: string]: UIServer } = {};
 const router = Router();
@@ -185,6 +192,8 @@ router.post('/:handle/ui/iterative', async (req: KapetaBodyRequest, res: Respons
                     title: landingPage.title,
                     filename: landingPage.filename,
                     storage_prefix: systemId + '_',
+                    // TODO: Add themes to this request type
+                    theme: '',
                 });
             } catch (e) {
                 console.error('Failed to process event', e);
@@ -226,13 +235,13 @@ router.post('/:handle/ui/iterative', async (req: KapetaBodyRequest, res: Respons
 router.post('/:handle/ui', async (req: KapetaBodyRequest, res: Response) => {
     const handle = req.params.handle as string;
     try {
-        const conversationId = req.headers[ConversationIdHeader.toLowerCase()] as string | undefined;
+        const outerConversationId =
+            (req.headers[ConversationIdHeader.toLowerCase()] as string | undefined) || randomUUID();
 
         const aiRequest: BasePromptRequest = JSON.parse(req.stringBody ?? '{}');
 
         // Get user journeys
-        const userJourneysStream = await stormClient.createUIUserJourneys(aiRequest, conversationId);
-        const outerConversationId = userJourneysStream.getConversationId();
+        const userJourneysStream = await stormClient.createUIUserJourneys(aiRequest, outerConversationId);
 
         onRequestAborted(req, res, () => {
             userJourneysStream.abort();
@@ -271,11 +280,53 @@ router.post('/:handle/ui', async (req: KapetaBodyRequest, res: Response) => {
             sendError(error, res);
         });
 
+        let theme = '';
+        try {
+            const themeStream = await stormClient.createTheme(aiRequest, outerConversationId);
+            onRequestAborted(req, res, () => {
+                themeStream.abort();
+            });
+
+            themeStream.on('data', (evt) => {
+                sendEvent(res, evt);
+                if (evt.type === 'FILE_DONE') {
+                    theme = evt.payload.content;
+                    writeAssetToDisk(outerConversationId, evt).catch((err) => {
+                        sendEvent(res, {
+                            type: 'ERROR_INTERNAL',
+                            created: new Date().getTime(),
+                            payload: { error: err.message },
+                            reason: 'Failed to save theme',
+                        });
+                    });
+                }
+            });
+            themeStream.on('error', (error) => {
+                console.error(error);
+                sendEvent(res, {
+                    type: 'ERROR_INTERNAL',
+                    created: new Date().getTime(),
+                    payload: { error: error.message },
+                    reason: 'Failed to create theme',
+                });
+            });
+            await waitForStormStream(themeStream);
+        } catch (e: any) {
+            console.error('Failed to generate theme', e);
+            sendEvent(res, {
+                type: 'ERROR_INTERNAL',
+                created: new Date().getTime(),
+                payload: { error: e.message },
+                reason: 'Failed to create theme',
+            });
+        }
+
         await waitForStormStream(userJourneysStream);
 
         // Get the UI shells
         const shellsStream = await stormClient.createUIShells(
             {
+                theme: theme ? `// filename: theme.css\n${theme}` : undefined,
                 pages: Object.values(uniqueUserJourneyScreens).map((screen) => ({
                     name: screen.name,
                     title: screen.title,
@@ -285,7 +336,7 @@ router.post('/:handle/ui', async (req: KapetaBodyRequest, res: Response) => {
                     requirements: screen.requirements,
                 })),
             },
-            conversationId
+            outerConversationId
         );
 
         onRequestAborted(req, res, () => {
@@ -293,6 +344,8 @@ router.post('/:handle/ui', async (req: KapetaBodyRequest, res: Response) => {
         });
 
         const queue = new PageQueue(outerConversationId, 5);
+        queue.setUiTheme(theme);
+
         shellsStream.on('data', (data: StormEvent) => {
             console.log('Processing shell event', data);
             sendEvent(res, data);
@@ -356,6 +409,7 @@ router.post('/:handle/ui', async (req: KapetaBodyRequest, res: Response) => {
                     title: screen.title,
                     filename: screen.filename,
                     storage_prefix: outerConversationId + '_',
+                    theme,
                 })
             );
         }

package/src/storm/stormClient.ts

@@ -22,6 +22,7 @@ export const STORM_ID = 'storm';
 export const ConversationIdHeader = 'Conversation-Id';
 
 export interface UIShellsPrompt {
+    theme?: string;
     pages: {
         name: string;
         title: string;
@@ -42,6 +43,8 @@ export interface UIPagePrompt {
     description: string;
     storage_prefix: string;
     shell_page?: string;
+    // contents of theme.css
+    theme: string;
 }
 
 export interface UIPageSamplePrompt extends UIPagePrompt {
@@ -185,6 +188,13 @@ class StormClient {
         });
     }
 
+    public createTheme(prompt: BasePromptRequest, conversationId?: string) {
+        return this.send('/v2/ui/theme', {
+            prompt: prompt,
+            conversationId,
+        });
+    }
+
     public createUIShells(prompt: UIShellsPrompt, conversationId?: string) {
         return this.send('/v2/ui/shells', {
             prompt: JSON.stringify(prompt),