@promptbook/cli 0.103.0-54 → 0.103.0-56

package/apps/agents-server/src/app/api/chat-feedback/export/route.ts

@@ -0,0 +1,55 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { $getTableName } from '../../../../database/$getTableName';
+import { $provideSupabase } from '../../../../database/$provideSupabase';
+import { convertToCsv } from '../../../../utils/convertToCsv';
+import { isUserAdmin } from '../../../../utils/isUserAdmin';
+
+/**
+ * Export chat feedback as CSV.
+ *
+ * Query params:
+ * - agentName: filter by agent name (optional)
+ */
+export async function GET(request: NextRequest) {
+    if (!(await isUserAdmin())) {
+        return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    try {
+        const searchParams = request.nextUrl.searchParams;
+        const agentName = searchParams.get('agentName');
+
+        const supabase = $provideSupabase();
+        const table = await $getTableName('ChatFeedback');
+
+        let query = supabase.from(table).select('*');
+
+        if (agentName) {
+            query = query.eq('agentName', agentName);
+        }
+
+        query = query.order('createdAt', { ascending: false });
+
+        const { data, error } = await query;
+
+        if (error) {
+            console.error('Export chat feedback error:', error);
+            return NextResponse.json({ error: 'Internal server error' }, { status: 500 });
+        }
+
+        const csv = convertToCsv((data || []) as Record<string, unknown>[]);
+        const filename = agentName
+            ? `chat-feedback-${agentName}-${new Date().toISOString()}.csv`
+            : `chat-feedback-${new Date().toISOString()}.csv`;
+
+        return new NextResponse(csv, {
+            headers: {
+                'Content-Type': 'text/csv',
+                'Content-Disposition': `attachment; filename="${filename}"`,
+            },
+        });
+    } catch (error) {
+        console.error('Export chat feedback error:', error);
+        return NextResponse.json({ error: 'Internal server error' }, { status: 500 });
+    }
+}

package/apps/agents-server/src/app/api/chat-history/export/route.ts

@@ -0,0 +1,55 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { $getTableName } from '../../../../database/$getTableName';
+import { $provideSupabase } from '../../../../database/$provideSupabase';
+import { convertToCsv } from '../../../../utils/convertToCsv';
+import { isUserAdmin } from '../../../../utils/isUserAdmin';
+
+/**
+ * Export chat history as CSV.
+ *
+ * Query params:
+ * - agentName: filter by agent name (optional)
+ */
+export async function GET(request: NextRequest) {
+    if (!(await isUserAdmin())) {
+        return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    try {
+        const searchParams = request.nextUrl.searchParams;
+        const agentName = searchParams.get('agentName');
+
+        const supabase = $provideSupabase();
+        const table = await $getTableName('ChatHistory');
+
+        let query = supabase.from(table).select('*');
+
+        if (agentName) {
+            query = query.eq('agentName', agentName);
+        }
+
+        query = query.order('createdAt', { ascending: false });
+
+        const { data, error } = await query;
+
+        if (error) {
+            console.error('Export chat history error:', error);
+            return NextResponse.json({ error: 'Internal server error' }, { status: 500 });
+        }
+
+        const csv = convertToCsv((data || []) as Record<string, unknown>[]);
+        const filename = agentName
+            ? `chat-history-${agentName}-${new Date().toISOString()}.csv`
+            : `chat-history-${new Date().toISOString()}.csv`;
+
+        return new NextResponse(csv, {
+            headers: {
+                'Content-Type': 'text/csv',
+                'Content-Disposition': `attachment; filename="${filename}"`,
+            },
+        });
+    } catch (error) {
+        console.error('Export chat history error:', error);
+        return NextResponse.json({ error: 'Internal server error' }, { status: 500 });
+    }
+}

package/apps/agents-server/src/app/api/openai/v1/chat/completions/route.ts

@@ -0,0 +1,6 @@
+import { handleChatCompletion } from '@/src/utils/handleChatCompletion';
+import { NextRequest } from 'next/server';
+
+export async function POST(request: NextRequest) {
+    return handleChatCompletion(request, {}, 'OpenAI API Chat Completion (Global)');
+}

package/apps/agents-server/src/app/api/openai/v1/models/route.ts

@@ -0,0 +1,65 @@
+import { $provideAgentCollectionForServer } from '@/src/tools/$provideAgentCollectionForServer';
+import { validateApiKey } from '@/src/utils/validateApiKey';
+import { NextRequest, NextResponse } from 'next/server';
+
+/**
+ * GET /api/openai/v1/models
+ *
+ * Lists all available agents as models for the OpenAI-compatible API.
+ */
+export async function GET(request: NextRequest) {
+    // Validate API key explicitly (in addition to middleware)
+    const apiKeyValidation = await validateApiKey(request);
+    if (!apiKeyValidation.isValid) {
+        return NextResponse.json(
+            {
+                error: {
+                    message: apiKeyValidation.error || 'Invalid API key',
+                    type: 'authentication_error',
+                },
+            },
+            { status: 401 },
+        );
+    }
+
+    try {
+        const collection = await $provideAgentCollectionForServer();
+        const agentNames = await collection.listAgents();
+
+        const models = agentNames.map((agentName) => ({
+            id: agentName,
+            object: 'model',
+            created: Math.floor(Date.now() / 1000), // We don't have creation date readily available in listAgents
+            owned_by: 'promptbook',
+            permission: [
+                {
+                    id: `modelperm-${agentName}`,
+                    object: 'model_permission',
+                    created: Math.floor(Date.now() / 1000),
+                    allow_create_engine: false,
+                    allow_sampling: true,
+                    allow_logprobs: false,
+                    allow_search_indices: false,
+                    allow_view: true,
+                    allow_fine_tuning: false,
+                    organization: '*',
+                    group: null,
+                    is_blocking: false,
+                },
+            ],
+            root: agentName,
+            parent: null,
+        }));
+
+        return NextResponse.json({
+            object: 'list',
+            data: models,
+        });
+    } catch (error) {
+        console.error('Error in models listing handler:', error);
+        return NextResponse.json(
+            { error: { message: (error as Error).message || 'Internal Server Error', type: 'server_error' } },
+            { status: 500 },
+        );
+    }
+}

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

@@ -1,7 +1,9 @@
 import { notFound } from 'next/navigation';
-import ReactMarkdown from 'react-markdown';
 import { BookCommitment } from '../../../../../../src/commitments/_base/BookCommitment';
 import { getVisibleCommitmentDefinitions } from '../../../utils/getVisibleCommitmentDefinitions';
+import { PrintButton } from '../../../components/PrintButton/PrintButton';
+import { PrintHeader } from '../../../components/PrintHeader/PrintHeader';
+import { DocumentationContent } from '../../../components/DocumentationContent/DocumentationContent';
 
 type DocPageProps = {
     params: Promise<{
@@ -25,38 +27,16 @@ 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">
-                <div className="bg-white rounded-xl shadow-lg border border-gray-200 overflow-hidden">
-                    <div className="p-8 border-b border-gray-100 bg-gray-50/50">
-                        <div className="flex items-center gap-4 mb-4">
-                            <h1 className="text-4xl font-bold text-gray-900 tracking-tight">
-                                <span className="mr-3">{primary.icon}</span>
-                                {primary.type}
-                                {aliases.length > 0 && (
-                                    <span className="text-gray-400 font-normal ml-4 text-2xl">
-                                        / {aliases.join(' / ')}
-                                    </span>
-                                )}
-                            </h1>
-                            <span className="px-3 py-1 rounded-full text-xs font-medium bg-blue-100 text-blue-700">
-                                Commitment
-                            </span>
-                        </div>
-                        {primary.description && (
-                            <p className="text-xl text-gray-600 leading-relaxed max-w-3xl">
-                                {primary.description}
-                            </p>
-                        )}
-                    </div>
-                    
-                    <div className="p-8">
-                        <article className="prose prose-lg prose-slate max-w-none prose-headings:font-bold prose-h2:text-2xl prose-h2:mt-8 prose-h2:mb-4 prose-p:text-gray-600 prose-pre:bg-gray-50 prose-pre:border prose-pre:border-gray-200 prose-pre:text-gray-800">
-                            <ReactMarkdown>
-                                {primary.documentation}
-                            </ReactMarkdown>
-                        </article>
-                    </div>
-                </div>
+                <PrintHeader title={primary.type} />
+                
+                <DocumentationContent 
+                    primary={primary} 
+                    aliases={aliases} 
+                    isPrintOnly={false} 
+                />
             </div>
         </div>
     );

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

@@ -1,33 +1,58 @@
 import Link from 'next/link';
 import { Card } from '../../components/Homepage/Card';
 import { Section } from '../../components/Homepage/Section';
+import { OpenMojiIcon } from '../../components/OpenMojiIcon/OpenMojiIcon';
 import { getVisibleCommitmentDefinitions } from '../../utils/getVisibleCommitmentDefinitions';
+import { PrintButton } from '../../components/PrintButton/PrintButton';
+import { PrintHeader } from '../../components/PrintHeader/PrintHeader';
+import { DocumentationContent } from '../../components/DocumentationContent/DocumentationContent';
 
 export default function DocsPage() {
     const groupedCommitments = getVisibleCommitmentDefinitions();
 
     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">
-                <Section title="Documentation">
+                <PrintHeader title="Full Documentation" />
+
+                {/* Screen view: Cards */}
+                <div className="print:hidden">
+                    <Section title="Documentation">
+                        {groupedCommitments.map(({ primary, aliases }) => (
+                            <Link key={primary.type} href={`/docs/${primary.type}`} className="block h-full group">
+                                <Card className="h-full group-hover:border-blue-500 transition-colors">
+                                    <h3 className="text-xl font-semibold mb-2 group-hover:text-blue-600 transition-colors">
+                                        <OpenMojiIcon icon={primary.icon} className="mr-2" />
+                                        {primary.type}
+                                        {aliases.length > 0 && (
+                                            <span className="text-gray-400 font-normal text-lg">
+                                                {' / '}
+                                                {aliases.join(' / ')}
+                                            </span>
+                                        )}
+                                    </h3>
+                                    {primary.description && <p className="text-gray-600 line-clamp-3">{primary.description}</p>}
+                                </Card>
+                            </Link>
+                        ))}
+                    </Section>
+                </div>
+
+                {/* Print view: Full Content */}
+                <div className="hidden print:block space-y-12">
                     {groupedCommitments.map(({ primary, aliases }) => (
-                        <Link key={primary.type} href={`/docs/${primary.type}`} className="block h-full group">
-                            <Card className="h-full group-hover:border-blue-500 transition-colors">
-                                <h3 className="text-xl font-semibold mb-2 group-hover:text-blue-600 transition-colors">
-                                    <span className="mr-2">{primary.icon}</span>
-                                    {primary.type}
-                                    {aliases.length > 0 && (
-                                        <span className="text-gray-400 font-normal text-lg">
-                                            {' / '}
-                                            {aliases.join(' / ')}
-                                        </span>
-                                    )}
-                                </h3>
-                                {primary.description && <p className="text-gray-600 line-clamp-3">{primary.description}</p>}
-                            </Card>
-                        </Link>
+                        <div key={primary.type} className="break-inside-avoid page-break-after-always">
+                            <DocumentationContent 
+                                primary={primary} 
+                                aliases={aliases} 
+                                isPrintOnly={true} 
+                            />
+                            <hr className="my-8 border-gray-200" />
+                        </div>
                     ))}
-                </Section>
+                </div>
             </div>
         </div>
     );

package/apps/agents-server/src/app/globals.css

@@ -54,6 +54,11 @@ body {
     font-family: var(--font-barlow-condensed), 'OpenMojiBlack', Arial, Helvetica, sans-serif;
 }
 
+/* Poppins font for agent names and headings */
+.font-poppins {
+    font-family: var(--font-poppins), 'Poppins', system-ui, -apple-system, sans-serif;
+}
+
 /* Custom utilities */
 .line-clamp-2 {
     display: -webkit-box;
@@ -135,6 +140,53 @@ textarea:focus-visible {
     animation: spin 1s linear infinite;
 }
 
+/* Tailwind CSS animation utilities */
+@keyframes fade-in {
+    from {
+        opacity: 0;
+    }
+    to {
+        opacity: 1;
+    }
+}
+
+@keyframes slide-in-from-top-2 {
+    from {
+        transform: translateY(-0.5rem);
+    }
+    to {
+        transform: translateY(0);
+    }
+}
+
+@keyframes zoom-in-95 {
+    from {
+        opacity: 0;
+        transform: scale(0.95);
+    }
+    to {
+        opacity: 1;
+        transform: scale(1);
+    }
+}
+
+.animate-in {
+    animation-duration: 200ms;
+    animation-fill-mode: both;
+}
+
+.fade-in {
+    animation-name: fade-in;
+}
+
+.slide-in-from-top-2 {
+    animation-name: slide-in-from-top-2;
+}
+
+.zoom-in-95 {
+    animation-name: zoom-in-95;
+}
+
 /* Gradient backgrounds */
 .bg-gradient-to-br {
     background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));
@@ -145,3 +197,80 @@ textarea:focus-visible {
     background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
     border: 1px solid #e2e8f0;
 }
+
+/* Print styles */
+@media print {
+    @page {
+        margin: 2cm;
+    }
+
+    /* Hide UI elements */
+    header,
+    footer,
+    nav,
+    aside,
+    button:not(.print:block),
+    .no-print,
+    [role="complementary"],
+    #portal-root {
+        display: none !important;
+    }
+
+    /* Reset layout */
+    body,
+    main {
+        padding: 0 !important;
+        margin: 0 !important;
+        background: white !important;
+        min-height: auto !important;
+        width: 100% !important;
+        color: black !important;
+    }
+
+    /* Remove shadows and backgrounds for clean print */
+    * {
+        box-shadow: none !important;
+        text-shadow: none !important;
+        background-color: transparent !important;
+        background-image: none !important;
+    }
+
+    /* Ensure text visibility */
+    h1, h2, h3, h4, h5, h6, p, li, span, div {
+        color: black !important;
+    }
+
+    /* Links */
+    a {
+        text-decoration: underline;
+        color: black !important;
+    }
+
+    /* Preserve borders */
+    .border, .border-b, .border-t, .border-l, .border-r {
+        border-color: #ddd !important;
+    }
+
+    /* Page break control */
+    h1, h2 {
+        break-after: avoid;
+        page-break-after: avoid;
+    }
+
+    p, li, pre, code {
+        break-inside: avoid;
+        page-break-inside: avoid;
+    }
+
+    /* Specific component overrides */
+    .card, .bg-white {
+        border: none !important;
+    }
+
+    /* Code blocks */
+    pre, code {
+        background-color: #f5f5f5 !important;
+        border: 1px solid #ddd !important;
+        white-space: pre-wrap !important;
+    }
+}

package/apps/agents-server/src/app/layout.tsx

@@ -1,7 +1,7 @@
 import faviconLogoImage from '@/public/favicon.ico';
 import { LayoutWrapper } from '@/src/components/LayoutWrapper/LayoutWrapper';
 import type { Metadata } from 'next';
-import { Barlow_Condensed } from 'next/font/google';
+import { Barlow_Condensed, Poppins } from 'next/font/google';
 import { getMetadata } from '../database/getMetadata';
 import { $provideAgentCollectionForServer } from '../tools/$provideAgentCollectionForServer';
 import { $provideServer } from '../tools/$provideServer';
@@ -15,6 +15,12 @@ const barlowCondensed = Barlow_Condensed({
     variable: '--font-barlow-condensed',
 });
 
+const poppins = Poppins({
+    subsets: ['latin'],
+    weight: ['400', '500', '600', '700', '800'],
+    variable: '--font-poppins',
+});
+
 export async function generateMetadata(): Promise<Metadata> {
     const { publicUrl } = await $provideServer();
     const serverName = (await getMetadata('SERVER_NAME')) || 'Promptbook Agents Server';
@@ -98,7 +104,7 @@ export default async function RootLayout({
                 {/* Default favicon as a fallback */}
                 <link rel="icon" href={serverFaviconUrl} type="image/x-icon" />
             </head>
-            <body className={`${barlowCondensed.variable} antialiased bg-white text-gray-900`}>
+            <body className={`${barlowCondensed.variable} ${poppins.variable} antialiased bg-white text-gray-900`}>
                 <LayoutWrapper
                     isAdmin={isAdmin}
                     currentUser={currentUser}

package/apps/agents-server/src/app/manifest.ts

@@ -41,7 +41,7 @@ export default async function manifest(): Promise<MetadataRoute.Manifest> {
         const description = agentProfile.meta.description || agentProfile.personaDescription || `Agent ${name}`;
 
         // Extract brand color from meta
-        const brandColor = Color.from(agentProfile.meta.color || PROMPTBOOK_COLOR);
+        const brandColor = Color.fromSafe(agentProfile.meta.color || PROMPTBOOK_COLOR);
         const theme_color = brandColor.toHex();
         const background_color = '#ffffff';
 

package/apps/agents-server/src/components/ChangePasswordDialog/ChangePasswordDialog.tsx

@@ -0,0 +1,41 @@
+'use client';
+
+import { X } from 'lucide-react';
+import { ChangePasswordForm } from '../ChangePasswordForm/ChangePasswordForm';
+import { Portal } from '../Portal/Portal';
+
+type ChangePasswordDialogProps = {
+    isOpen: boolean;
+    onClose: () => void;
+};
+
+export function ChangePasswordDialog(props: ChangePasswordDialogProps) {
+    const { isOpen, onClose } = props;
+
+    if (!isOpen) {
+        return null;
+    }
+
+    return (
+        <Portal>
+            <div className="fixed inset-0 z-[9999] flex items-center justify-center bg-black/50 backdrop-blur-sm animate-in fade-in duration-200">
+                <div className="relative w-full max-w-md bg-white rounded-lg shadow-lg border border-gray-200 p-6 animate-in zoom-in-95 duration-200">
+                    <button
+                        onClick={onClose}
+                        className="absolute top-4 right-4 text-gray-400 hover:text-gray-500 transition-colors"
+                    >
+                        <X className="w-5 h-5" />
+                        <span className="sr-only">Close</span>
+                    </button>
+
+                    <div className="mb-6">
+                        <h2 className="text-xl font-semibold text-gray-900">Change Password</h2>
+                        <p className="text-sm text-gray-500 mt-1">Update your password to keep your account secure</p>
+                    </div>
+
+                    <ChangePasswordForm onSuccess={onClose} />
+                </div>
+            </div>
+        </Portal>
+    );
+}