@promptbook/cli 0.104.0-0 → 0.104.0-10

package/apps/agents-server/src/app/api/embed.js/route.ts

@@ -1,3 +1,4 @@
+import { spaceTrim } from '@promptbook-local/utils';
 import { NextRequest, NextResponse } from 'next/server';
 
 export async function GET(request: NextRequest) {
@@ -5,84 +6,103 @@ export async function GET(request: NextRequest) {
     const host = request.nextUrl.host;
     const baseUrl = `${protocol}//${host}`;
 
-    const script = `
-(function() {
-    if (customElements.get('promptbook-agent')) {
-        return;
-    }
+    const script = spaceTrim(`
+        console.info('[🔌] Promptbook integration script from ${baseUrl}');
 
-    class PromptbookAgentElement extends HTMLElement {
-        constructor() {
-            super();
-            this.iframe = null;
-        }
+        (function() {
+            if (customElements.get('promptbook-agent-integration')) {
+                return;
+            }
 
-        static get observedAttributes() {
-            return ['agent-url'];
-        }
+            class PromptbookAgentIntegrationElement extends HTMLElement {
+                constructor() {
+                    super();
+                    console.info('[🔌] Initializing <promptbook-agent-integration/>',this);
+                    this.iframe = null;
+                }
 
-        connectedCallback() {
-            this.render();
-            window.addEventListener('message', this.handleMessage.bind(this));
-        }
+                static get observedAttributes() {
+                    return ['agent-url', 'meta'];
+                }
 
-        disconnectedCallback() {
-            window.removeEventListener('message', this.handleMessage.bind(this));
-        }
+                connectedCallback() {
+                    this.render();
+                    window.addEventListener('message', this.handleMessage.bind(this));
+                }
 
-        attributeChangedCallback(name, oldValue, newValue) {
-            if (name === 'agent-url' && oldValue !== newValue) {
-                this.render();
-            }
-        }
+                disconnectedCallback() {
+                    window.removeEventListener('message', this.handleMessage.bind(this));
+                }
 
-        handleMessage(event) {
-            if (event.data && event.data.type === 'PROMPTBOOK_AGENT_RESIZE') {
-                if (event.data.isOpen) {
-                    this.iframe.style.width = '450px';
-                    this.iframe.style.height = '650px';
-                    this.iframe.style.maxHeight = '90vh';
-                    this.iframe.style.maxWidth = '90vw';
-                    this.iframe.style.boxShadow = '0 4px 12px rgba(0,0,0,0.15)';
-                    this.iframe.style.borderRadius = '12px';
-                } else {
-                    this.iframe.style.width = '60px';
-                    this.iframe.style.height = '60px';
-                    this.iframe.style.boxShadow = 'none';
-                    this.iframe.style.borderRadius = '0';
+                attributeChangedCallback(name, oldValue, newValue) {
+                    if ((name === 'agent-url' || name === 'meta') && oldValue !== newValue) {
+                        this.render();
+                    }
                 }
-            }
-        }
 
-        render() {
-            const agentUrl = this.getAttribute('agent-url');
-            if (!agentUrl) return;
+                handleMessage(event) {
+                    if (event.data && event.data.type === 'PROMPTBOOK_AGENT_RESIZE') {
+                        if (event.data.isOpen) {
+                            // Match PromptbookAgentSeamlessIntegration.module.css dimensions
+                            // Window is 380x600 + 20px padding on each side
+                            this.iframe.style.width = '420px';
+                            this.iframe.style.height = '640px';
+                            this.iframe.style.maxHeight = 'calc(80vh + 40px)';
+                            this.iframe.style.maxWidth = 'calc(100vw - 20px)';
+                        } else {
+                            // Closed state - button area with padding and shadow space
+                            // Button is ~140px wide + 20px right margin + shadow space
+                            this.iframe.style.width = '180px';
+                            this.iframe.style.height = '100px';
+                            this.iframe.style.maxHeight = 'none';
+                            this.iframe.style.maxWidth = 'none';
+                        }
+                    }
+                }
 
-            if (!this.iframe) {
-                this.attachShadow({ mode: 'open' });
-                this.iframe = document.createElement('iframe');
-                this.iframe.style.border = 'none';
-                this.iframe.style.position = 'fixed';
-                this.iframe.style.bottom = '20px';
-                this.iframe.style.right = '20px';
-                this.iframe.style.width = '60px';
-                this.iframe.style.height = '60px';
-                this.iframe.style.zIndex = '2147483647'; // Max z-index
-                this.iframe.style.transition = 'width 0.3s ease, height 0.3s ease';
-                this.iframe.style.backgroundColor = 'transparent';
-                this.iframe.setAttribute('allow', 'microphone'); // Allow microphone if needed for voice
-                this.shadowRoot.appendChild(this.iframe);
-            }
+                render() {
+                    const agentUrl = this.getAttribute('agent-url');
+                    if (!agentUrl) return;
 
-            // Construct embed URL pointing to the Next.js page we created
-            const embedUrl = '${baseUrl}/embed?agentUrl=' + encodeURIComponent(agentUrl);
-            this.iframe.src = embedUrl;
-        }
-    }
+                    if (!this.iframe) {
+                        this.attachShadow({ mode: 'open' });
+                        this.iframe = document.createElement('iframe');
+                        this.iframe.style.border = 'none';
+                        this.iframe.style.position = 'fixed';
+                        this.iframe.style.bottom = '0';
+                        this.iframe.style.right = '0';
+                        // Initial size for the closed button state (with padding and shadow space)
+                        this.iframe.style.width = '180px';
+                        this.iframe.style.height = '100px';
+                        this.iframe.style.zIndex = '2147483647'; // Max z-index
+                        this.iframe.style.transition = 'width 0.3s ease, height 0.3s ease';
+                        this.iframe.style.backgroundColor = 'transparent';
+                        this.iframe.setAttribute('allow', 'microphone'); // Allow microphone if needed for voice
+                        this.shadowRoot.appendChild(this.iframe);
+                    }
+
+                    // Construct embed URL pointing to the Next.js page we created
+                    let embedUrl = '${baseUrl}/embed?agentUrl=' + encodeURIComponent(agentUrl);
+                    
+                    // Add meta parameter if provided
+                    const metaAttr = this.getAttribute('meta');
+                    if (metaAttr) {
+                        try {
+                            // Validate that it's valid JSON
+                            JSON.parse(metaAttr);
+                            embedUrl += '&meta=' + encodeURIComponent(metaAttr);
+                        } catch (e) {
+                            console.error('[🔌] Invalid meta JSON:', e);
+                        }
+                    }
+                    
+                    this.iframe.src = embedUrl;
+                }
+            }
 
-    customElements.define('promptbook-agent', PromptbookAgentElement);
-})();
-    `;
+            customElements.define('promptbook-agent-integration', PromptbookAgentIntegrationElement);
+        })();
+    `);
 
     return new NextResponse(script, {
         headers: {

package/apps/agents-server/src/app/api/federated-agents/route.ts

@@ -1,10 +1,22 @@
 import { NextResponse } from 'next/server';
 import { getFederatedServersFromMetadata } from '../../../utils/getFederatedServersFromMetadata';
+import { getMetadata } from '../../../database/getMetadata';
+import { getCurrentUser } from '../../../utils/getCurrentUser';
 
 export const dynamic = 'force-dynamic';
 
 export async function GET() {
     try {
+        const currentUser = await getCurrentUser();
+        const showFederatedServersPublicly = ((await getMetadata('SHOW_FEDERATED_SERVERS_PUBLICLY')) || 'false') === 'true';
+
+        // Only show federated servers if user is authenticated or if SHOW_FEDERATED_SERVERS_PUBLICLY is true
+        if (!currentUser && !showFederatedServersPublicly) {
+            return NextResponse.json({
+                federatedServers: [],
+            });
+        }
+
         const federatedServers = await getFederatedServersFromMetadata();
 
         return NextResponse.json({

package/apps/agents-server/src/app/api/images/[filename]/route.ts

@@ -0,0 +1,107 @@
+import { $getTableName } from '@/src/database/$getTableName';
+import { serializeError } from '@promptbook-local/utils';
+import { NextRequest, NextResponse } from 'next/server';
+import { assertsError } from '../../../../../../../src/errors/assertsError';
+import type { LlmExecutionTools } from '../../../../../../../src/execution/LlmExecutionTools';
+import { getSingleLlmExecutionTools } from '../../../../../../../src/llm-providers/_multiple/getSingleLlmExecutionTools';
+import { string_url } from '../../../../../../../src/types/typeAliases';
+import { $provideSupabaseForServer } from '../../../../database/$provideSupabaseForServer';
+import { $provideCdnForServer } from '../../../../tools/$provideCdnForServer';
+import { $provideExecutionToolsForServer } from '../../../../tools/$provideExecutionToolsForServer';
+import { filenameToPrompt } from '../../../../utils/normalization/filenameToPrompt';
+
+export async function GET(request: NextRequest, { params }: { params: Promise<{ filename: string }> }) {
+    try {
+        const { filename } = await params;
+
+        if (!filename) {
+            return NextResponse.json({ error: 'Filename is required' }, { status: 400 });
+        }
+
+        const supabase = $provideSupabaseForServer();
+
+        // Check if image already exists in database
+        const { data: existingImage, error: selectError } = await supabase
+            .from(await $getTableName(`Image`))
+            .select('cdnUrl')
+            .eq('filename', filename)
+            .single();
+
+        if (selectError && selectError.code !== 'PGRST116') {
+            // PGRST116 is "not found"
+            throw selectError;
+        }
+
+        if (existingImage) {
+            // Image exists, redirect to CDN
+            return NextResponse.redirect(existingImage.cdnUrl as string_url);
+        }
+
+        // Image doesn't exist, generate it
+        const prompt = filenameToPrompt(filename);
+
+        const executionTools = await $provideExecutionToolsForServer();
+        const llmTools = getSingleLlmExecutionTools(executionTools.llm) as LlmExecutionTools;
+
+        if (!llmTools.callImageGenerationModel) {
+            throw new Error('Image generation is not supported by the current LLM configuration');
+        }
+
+        const imageResult = await llmTools.callImageGenerationModel({
+            title: `Generate image for ${filename}`,
+            content: prompt,
+            parameters: {},
+            modelRequirements: {
+                modelVariant: 'IMAGE_GENERATION',
+                modelName: 'dall-e-3', // Use DALL-E 3 for high quality
+            },
+        });
+
+        if (!imageResult.content) {
+            throw new Error('Failed to generate image: no content returned');
+        }
+
+        // Download the generated image
+        const imageResponse = await fetch(imageResult.content);
+        if (!imageResponse.ok) {
+            throw new Error(`Failed to download generated image: ${imageResponse.status}`);
+        }
+
+        const imageBuffer = await imageResponse.arrayBuffer();
+        const buffer = Buffer.from(imageBuffer);
+
+        // Upload to CDN
+        const cdn = $provideCdnForServer();
+        const cdnKey = `generated-images/${filename}`;
+        await cdn.setItem(cdnKey, {
+            type: 'image/png', // DALL-E generates PNG
+            data: buffer,
+        });
+
+        const cdnUrl = cdn.getItemUrl(cdnKey);
+
+        // Save to database
+        const { error: insertError } = await supabase.from(await $getTableName(`Image`)).insert({
+            filename,
+            prompt,
+            cdnUrl: cdnUrl.href,
+            cdnKey,
+        });
+
+        if (insertError) {
+            throw insertError;
+        }
+
+        // Redirect to the newly created image
+        return NextResponse.redirect(cdnUrl.href as string_url);
+    } catch (error) {
+        assertsError(error);
+
+        console.error('Error serving image:', error);
+
+        return new Response(JSON.stringify(serializeError(error), null, 4), {
+            status: 500,
+            headers: { 'Content-Type': 'application/json' },
+        });
+    }
+}

package/apps/agents-server/src/app/api/messages/route.ts

@@ -0,0 +1,102 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { $getTableName } from '../../../database/$getTableName';
+import { $provideSupabase } from '../../../database/$provideSupabase';
+import { isUserAdmin } from '../../../utils/isUserAdmin';
+
+const DEFAULT_PAGE_SIZE = 20;
+const MAX_PAGE_SIZE = 100;
+
+function parsePositiveInt(value: string | null, fallback: number): number {
+    if (!value) return fallback;
+    const parsed = parseInt(value, 10);
+    if (Number.isNaN(parsed) || parsed <= 0) return fallback;
+    return parsed;
+}
+
+/**
+ * List messages with filters, search and pagination.
+ */
+export async function GET(request: NextRequest) {
+    if (!(await isUserAdmin())) {
+        return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    try {
+        const searchParams = request.nextUrl.searchParams;
+
+        const page = parsePositiveInt(searchParams.get('page'), 1);
+        const pageSize = Math.min(MAX_PAGE_SIZE, parsePositiveInt(searchParams.get('pageSize'), DEFAULT_PAGE_SIZE));
+        const search = searchParams.get('search')?.trim() || '';
+        const channel = searchParams.get('channel');
+        const direction = searchParams.get('direction');
+
+        const supabase = $provideSupabase();
+
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        let query = supabase.from(await $getTableName('Message')).select('*', { count: 'exact' });
+
+        if (channel) {
+            query = query.eq('channel', channel);
+        }
+
+        if (direction) {
+            query = query.eq('direction', direction);
+        }
+
+        if (search) {
+            // Search in content, subject (if in metadata?), sender/recipient emails
+            // Note: sender and recipients are JSONB, so ilike might not work directly on them unless cast to text
+            // Content is TEXT.
+            const escaped = search.replace(/%/g, '\\%').replace(/_/g, '\\_');
+            // Assuming simple search on content for now to avoid complexity with JSONB search in generic supabase client
+            query = query.ilike('content', `%${escaped}%`);
+        }
+
+        // Default sort by createdAt desc
+        query = query.order('createdAt', { ascending: false });
+
+        const from = (page - 1) * pageSize;
+        const to = from + pageSize - 1;
+
+        query = query.range(from, to);
+
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        const { data: messages, error, count } = (await query) as { data: any[]; error: any; count: number };
+
+        if (error) {
+            console.error('List messages error:', error);
+            return NextResponse.json({ error: 'Internal server error' }, { status: 500 });
+        }
+
+        // Fetch attempts for these messages
+        if (messages && messages.length > 0) {
+            const messageIds = messages.map((m) => m.id);
+            const { data: attempts, error: attemptsError } = await supabase
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                .from(await $getTableName('MessageSendAttempt'))
+                .select('*')
+                .in('messageId', messageIds);
+
+            if (attemptsError) {
+                console.error('Fetch message attempts error:', attemptsError);
+                // We don't fail the whole request, just log it.
+            } else {
+                // Attach attempts to messages
+                for (const message of messages) {
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    (message as any).sendAttempts = attempts?.filter((a: any) => a.messageId === message.id) || [];
+                }
+            }
+        }
+
+        return NextResponse.json({
+            items: messages ?? [],
+            total: count ?? 0,
+            page,
+            pageSize,
+        });
+    } catch (error) {
+        console.error('List messages error:', error);
+        return NextResponse.json({ error: 'Internal server error' }, { status: 500 });
+    }
+}

package/apps/agents-server/src/app/api/metadata/route.ts

@@ -1,9 +1,12 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { keepUnused } from '../../../../../../src/utils/organization/keepUnused';
 import { $getTableName } from '../../../database/$getTableName';
 import { $provideSupabase } from '../../../database/$provideSupabase';
 import { isUserAdmin } from '../../../utils/isUserAdmin';
-import { NextRequest, NextResponse } from 'next/server';
 
 export async function GET(request: NextRequest) {
+    keepUnused(request);
+
     if (!(await isUserAdmin())) {
         return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
     }
@@ -36,11 +39,7 @@ export async function POST(request: NextRequest) {
         const supabase = $provideSupabase();
         const table = await $getTableName('Metadata');
 
-        const { data, error } = await supabase
-            .from(table)
-            .insert({ key, value, note })
-            .select()
-            .single();
+        const { data, error } = await supabase.from(table).insert({ key, value, note }).select().single();
 
         if (error) {
             return NextResponse.json({ error: error.message }, { status: 500 });

package/apps/agents-server/src/app/api/upload/route.ts

@@ -1,70 +1,144 @@
-import { nextRequestToNodeRequest } from '@/src/utils/cdn/utils/nextRequestToNodeRequest';
-import { TODO_any } from '@promptbook-local/types';
+import { $getTableName } from '@/src/database/$getTableName';
+import { $provideSupabase } from '@/src/database/$provideSupabase';
 import { serializeError } from '@promptbook-local/utils';
-import formidable from 'formidable';
-import { readFile } from 'fs/promises';
+import { handleUpload, type HandleUploadBody } from '@vercel/blob/client';
 import { NextRequest, NextResponse } from 'next/server';
-import { forTime } from 'waitasecond';
 import { assertsError } from '../../../../../../src/errors/assertsError';
-import { string_url } from '../../../../../../src/types/typeAliases';
-import { keepUnused } from '../../../../../../src/utils/organization/keepUnused';
-import { $provideCdnForServer } from '../../../../src/tools/$provideCdnForServer';
-import { getUserFileCdnKey } from '../../../../src/utils/cdn/utils/getUserFileCdnKey';
-import { validateMimeType } from '../../../../src/utils/validators/validateMimeType';
+import { getUserIdFromRequest } from '../../../../src/utils/getUserIdFromRequest';
 import { getMetadata } from '../../../database/getMetadata';
 
 export async function POST(request: NextRequest) {
     try {
-        await forTime(1);
-        // await forTime(5000);
+        const body = (await request.json()) as HandleUploadBody;
+        const userId = await getUserIdFromRequest(request);
+        const supabase = $provideSupabase();
 
-        const nodeRequest = await nextRequestToNodeRequest(request);
-        let maxFileSizeMb = Number((await getMetadata('MAX_FILE_UPLOAD_SIZE_MB')) || '50'); // <- TODO: [🌲] To /config.ts
+        // Handle Vercel Blob client upload protocol
+        const jsonResponse = await handleUpload({
+            body,
+            request,
+            token: process.env.VERCEL_BLOB_READ_WRITE_TOKEN!,
+            onBeforeGenerateToken: async (pathname, clientPayload) => {
+                // Authenticate user and validate upload
 
-        if (Number.isNaN(maxFileSizeMb)) {
-            maxFileSizeMb = 50; // <- TODO: [🌲] To /config.ts
-        }
+                // Parse client payload for additional metadata
+                const payload = clientPayload ? JSON.parse(clientPayload) : {};
+                const { purpose, contentType } = payload;
 
-        const maxFileSize = maxFileSizeMb * 1024 * 1024;
+                let maxFileSizeMb = Number((await getMetadata('MAX_FILE_UPLOAD_SIZE_MB')) || '50'); // <- TODO: [🌲] To /config.ts
+                if (Number.isNaN(maxFileSizeMb)) {
+                    maxFileSizeMb = 50; // <- TODO: [🌲] To /config.ts
+                }
+                const maxFileSize = maxFileSizeMb * 1024 * 1024;
+
+                // Generate the proper path with prefix
+                // Note: With client uploads, we use the original filename provided by the client
+                // The file will be stored at: {pathPrefix}/user/files/{filename}
+                const pathPrefix = process.env.NEXT_PUBLIC_CDN_PATH_PREFIX || '';
 
-        const files = await new Promise<formidable.Files>((resolve, reject) => {
-            const form = formidable({ maxFileSize });
-            form.parse(nodeRequest as TODO_any, (error, fields, files) => {
-                keepUnused(fields);
+                // Create a DB record at the start of the upload to track it
+                const uploadPurpose = purpose || 'GENERIC_UPLOAD';
+                const { data: insertedFile, error: insertError } = await supabase
+                    .from(await $getTableName('File'))
+                    .insert({
+                        userId: userId || null,
+                        fileName: pathname,
+                        fileSize: 0, // <- Will be updated when upload completes
+                        fileType: contentType || 'application/octet-stream',
+                        storageUrl: null, // <- To be updated on completion
+                        shortUrl: null, // <- To be updated on completion
+                        purpose: uploadPurpose,
+                        status: 'UPLOADING',
+                    })
+                    .select('id')
+                    .single();
 
-                if (error) {
-                    return reject(error);
+                if (insertError) {
+                    console.error('🔼 Failed to create file record:', insertError);
                 }
-                resolve(files);
-            });
-        });
 
-        const uploadedFiles = files.file;
+                console.info('🔼 Upload started, tracking file:', {
+                    pathname,
+                    fileId: insertedFile?.id,
+                    purpose: uploadPurpose,
+                });
 
-        if (!uploadedFiles || uploadedFiles.length !== 1) {
-            return NextResponse.json(
-                { message: 'In form data there is not EXACTLY one "file" field' },
-                { status: 400 },
-            );
-        }
+                return {
+                    allowedContentTypes: contentType ? [contentType] : undefined,
+                    maximumSizeInBytes: maxFileSize,
+                    addRandomSuffix: true, // Add random suffix to avoid filename collisions since we can't hash content
+                    tokenPayload: JSON.stringify({
+                        userId: userId || null,
+                        purpose: uploadPurpose,
+                        fileId: insertedFile?.id || null,
+                        uploadPath: pathname,
+                        pathPrefix,
+                    }),
+                };
+            },
+            onUploadCompleted: async ({ blob, tokenPayload }) => {
+                // !!!!
+                // ⚠️ IMPORTANT: This callback is a WEBHOOK called by Vercel's servers AFTER the upload completes
+                // - It runs in a DIFFERENT request context (not the original user request)
+                // - It WON'T work in local development (Vercel can't reach localhost)
+                // - All data must come from tokenPayload (userId, fileId, etc.)
+                // - Need to create a fresh supabase client here
+                console.info('🔼 Upload completed (webhook callback):', { blob, tokenPayload });
 
-        const uploadedFile = uploadedFiles[0]!;
-        const fileBuffer = await readFile(uploadedFile.filepath);
-        const cdn = $provideCdnForServer();
-        const key = getUserFileCdnKey(fileBuffer, uploadedFile.originalFilename || uploadedFile.newFilename);
+                try {
+                    const payload = tokenPayload ? JSON.parse(tokenPayload) : {};
+                    const { fileId, userId: tokenUserId, purpose: tokenPurpose, uploadPath } = payload;
 
-        await cdn.setItem(key, {
-            type: validateMimeType(uploadedFile.mimetype),
-            data: fileBuffer,
-        });
+                    // Create fresh supabase client for this webhook context
+                    const supabase = $provideSupabase();
+
+                    if (fileId) {
+                        // Update the existing record by ID
+                        const { error: updateError } = await supabase
+                            .from(await $getTableName('File'))
+                            .update({
+                                userId: tokenUserId || null,
+                                fileSize: 0, // <- !!!!
+                                fileType: blob.contentType,
+                                storageUrl: blob.url,
+                                // <- TODO: !!!! Split between storageUrl and shortUrl
+                                purpose: tokenPurpose || 'GENERIC_UPLOAD',
+                                status: 'COMPLETED',
+                            })
+                            .eq('id', fileId);
 
-        const fileUrl = cdn.getItemUrl(key);
+                        if (updateError) {
+                            console.error('🔼 Failed to update file record:', updateError);
+                        } else {
+                            console.info('🔼 File record updated successfully:', { fileId, shortUrl: blob.url });
+                        }
+                    } else if (uploadPath) {
+                        // Fallback: Update by uploadPath if fileId is not available
+                        const { error: updateError } = await supabase
+                            .from(await $getTableName('File'))
+                            .update({
+                                fileSize: 0, // <- !!!!
+                                fileType: blob.contentType,
+                                storageUrl: blob.url,
+                                status: 'COMPLETED',
+                            })
+                            .eq('id', fileId);
 
-        return NextResponse.json({ fileUrl: fileUrl.href as string_url }, { status: 201 });
+                        if (updateError) {
+                            console.error('🔼 Failed to update file record by uploadPath:', updateError);
+                        }
+                    }
+                } catch (error) {
+                    console.error('🔼 Error in onUploadCompleted:', error);
+                }
+            },
+        });
+
+        return NextResponse.json(jsonResponse);
     } catch (error) {
         assertsError(error);
 
-        console.error(error);
+        console.error('🔼', error);
 
         return new Response(
             JSON.stringify(
@@ -81,3 +155,12 @@ export async function POST(request: NextRequest) {
         );
     }
 }
+
+/**
+ * TODO: !!!! Change uploaded URLs from `storageUrl` to `shortUrl`
+ * TODO: !!!! Record both `storageUrl` (actual storage location) and `shortUrl` in `File` table
+ * TODO: !!!! Record `purpose` in `File` table
+ * TODO: !!!! Record `userId` in `File` table
+ * TODO: !!!! Record all things into `File` table
+ * TODO: !!!! File type (mime type) of `.book` files should be `application/book` <- [🧠] !!!! Best mime type?!
+ */

package/apps/agents-server/src/app/docs/[docId]/page.tsx

@@ -1,7 +1,7 @@
 import { notFound } from 'next/navigation';
 import { BookCommitment } from '../../../../../../src/commitments/_base/BookCommitment';
 import { getVisibleCommitmentDefinitions } from '../../../utils/getVisibleCommitmentDefinitions';
-import { PrintButton } from '../../../components/PrintButton/PrintButton';
+import { DocsToolbar } from '../../../components/DocsToolbar/DocsToolbar';
 import { PrintHeader } from '../../../components/PrintHeader/PrintHeader';
 import { DocumentationContent } from '../../../components/DocumentationContent/DocumentationContent';
 
@@ -27,9 +27,8 @@ export default async function DocPage(props: DocPageProps) {
 
     return (
         <div className="min-h-screen bg-gradient-to-br from-blue-50 via-white to-purple-50">
-            <PrintButton />
-            
             <div className="container mx-auto px-4 py-16">
+                <DocsToolbar />
                 <PrintHeader title={primary.type} />
                 
                 <DocumentationContent