@promptbook/cli 0.103.0-47 → 0.103.0-49

package/apps/agents-server/src/app/agents/[agentName]/api/feedback/route.ts

@@ -0,0 +1,54 @@
+import { $provideSupabaseForServer } from '@/src/database/$provideSupabaseForServer';
+import { NextRequest, NextResponse } from 'next/server';
+import { PROMPTBOOK_ENGINE_VERSION } from '../../../../../../../../src/version';
+import { $getTableName } from '../../../../../database/$getTableName';
+
+type FeedbackRequest = {
+    agentHash: string;
+    rating?: string;
+    textRating?: string;
+    chatThread?: string;
+    userNote?: string;
+    expectedAnswer?: string;
+};
+
+export async function POST(request: NextRequest, { params }: { params: Promise<{ agentName: string }> }) {
+    try {
+        const { agentName } = await params;
+        const body = (await request.json()) as FeedbackRequest;
+        const { agentHash, rating, textRating, chatThread, userNote, expectedAnswer } = body;
+
+        if (!agentHash) {
+            return NextResponse.json({ message: 'Missing agentHash' }, { status: 400 });
+        }
+
+        const supabase = $provideSupabaseForServer();
+
+        const { error } = await supabase.from(await $getTableName('ChatFeedback')).insert({
+            createdAt: new Date().toISOString(),
+            agentName,
+            agentHash,
+            rating,
+            textRating,
+            chatThread,
+            userNote,
+            expectedAnswer,
+            promptbookEngineVersion: PROMPTBOOK_ENGINE_VERSION,
+            // Telemetry fields can be populated here if available in headers
+            // For now we leave them null or let Supabase handle default if any (though schema has them nullable)
+            url: request.headers.get('referer') || undefined,
+            userAgent: request.headers.get('user-agent') || undefined,
+            ip: request.headers.get('x-forwarded-for') || undefined,
+        });
+
+        if (error) {
+            console.error('Error inserting feedback:', error);
+            return NextResponse.json({ message: 'Failed to save feedback' }, { status: 500 });
+        }
+
+        return NextResponse.json({ message: 'Feedback saved' }, { status: 201 });
+    } catch (error) {
+        console.error('Unexpected error in feedback route:', error);
+        return NextResponse.json({ message: 'Internal server error' }, { status: 500 });
+    }
+}

package/apps/agents-server/src/app/agents/[agentName]/api/modelRequirements/route.ts

@@ -17,10 +17,10 @@ export async function GET(request: Request, { params }: { params: Promise<{ agen
         return new Response(
             JSON.stringify(
                 modelRequirements,
-                // <- TODO: !!! Rename `serializeError` to `errorToJson`
+                // <- TODO: [🐱‍🚀] Rename `serializeError` to `errorToJson`
                 null,
                 4,
-                // <- TODO: !!! Allow to configure pretty print for agent server
+                // <- TODO: [🐱‍🚀] Allow to configure pretty print for agent server
             ),
             {
                 status: 200,
@@ -35,13 +35,13 @@ export async function GET(request: Request, { params }: { params: Promise<{ agen
         return new Response(
             JSON.stringify(
                 serializeError(error),
-                // <- TODO: !!! Rename `serializeError` to `errorToJson`
+                // <- TODO: [🐱‍🚀] Rename `serializeError` to `errorToJson`
                 null,
                 4,
-                // <- TODO: !!! Allow to configure pretty print for agent server
+                // <- TODO: [🐱‍🚀] Allow to configure pretty print for agent server
             ),
             {
-                status: 400, // <- TODO: !!! Make `errorToHttpStatusCode`
+                status: 400, // <- TODO: [🐱‍🚀] Make `errorToHttpStatusCode`
                 headers: { 'Content-Type': 'application/json' },
             },
         );
@@ -50,4 +50,4 @@ export async function GET(request: Request, { params }: { params: Promise<{ agen
 
 /**
  * TODO: [🍞] DRY - Make some common utility for API on one agent
- */
+ */

package/apps/agents-server/src/app/agents/[agentName]/api/modelRequirements/systemMessage/route.ts

@@ -27,13 +27,13 @@ export async function GET(request: Request, { params }: { params: Promise<{ agen
         return new Response(
             JSON.stringify(
                 serializeError(error),
-                // <- TODO: !!! Rename `serializeError` to `errorToJson`
+                // <- TODO: [🐱‍🚀] Rename `serializeError` to `errorToJson`
                 null,
                 4,
-                // <- TODO: !!! Allow to configure pretty print for agent server
+                // <- TODO: [🐱‍🚀] Allow to configure pretty print for agent server
             ),
             {
-                status: 400, // <- TODO: !!! Make `errorToHttpStatusCode`
+                status: 400, // <- TODO: [🐱‍🚀] Make `errorToHttpStatusCode`
                 headers: { 'Content-Type': 'application/json' },
             },
         );

package/apps/agents-server/src/app/agents/[agentName]/api/profile/route.ts

@@ -17,10 +17,10 @@ export async function GET(request: Request, { params }: { params: Promise<{ agen
         return new Response(
             JSON.stringify(
                 agentProfile,
-                // <- TODO: !!! Rename `serializeError` to `errorToJson`
+                // <- TODO: [🐱‍🚀] Rename `serializeError` to `errorToJson`
                 null,
                 4,
-                // <- TODO: !!! Allow to configure pretty print for agent server
+                // <- TODO: [🐱‍🚀] Allow to configure pretty print for agent server
             ),
             {
                 status: 200,
@@ -35,20 +35,19 @@ export async function GET(request: Request, { params }: { params: Promise<{ agen
         return new Response(
             JSON.stringify(
                 serializeError(error),
-                // <- TODO: !!! Rename `serializeError` to `errorToJson`
+                // <- TODO: [🐱‍🚀] Rename `serializeError` to `errorToJson`
                 null,
                 4,
-                // <- TODO: !!! Allow to configure pretty print for agent server
+                // <- TODO: [🐱‍🚀] Allow to configure pretty print for agent server
             ),
             {
-                status: 400, // <- TODO: !!! Make `errorToHttpStatusCode`
+                status: 400, // <- TODO: [🐱‍🚀] Make `errorToHttpStatusCode`
                 headers: { 'Content-Type': 'application/json' },
             },
         );
     }
 }
 
-
 /**
  * TODO: [🍞] DRY - Make some common utility for API on one agent
- */
+ */

package/apps/agents-server/src/app/agents/[agentName]/book/BookEditorWrapper.tsx

@@ -9,7 +9,7 @@ type BookEditorWrapperProps = {
     initialAgentSource: string_book;
 };
 
-// TODO: !!!! Rename to BookEditorSavingWrapper
+// TODO: [🐱‍🚀] Rename to BookEditorSavingWrapper
 
 export function BookEditorWrapper({ agentName, initialAgentSource }: BookEditorWrapperProps) {
     const [agentSource, setAgentSource] = useState<string_book>(initialAgentSource);
@@ -18,7 +18,7 @@ export function BookEditorWrapper({ agentName, initialAgentSource }: BookEditorW
     // Debounce timer ref so we can clear previous pending save
     const debounceTimerRef = useRef<number | null>(null);
     // Configurable debounce delay (ms) - tweak if needed
-    const DEBOUNCE_DELAY = 600;
+    const DEBOUNCE_DELAY = 1000;
 
     const performSave = async (sourceToSave: string_book) => {
         setSaveStatus('saving');
@@ -88,6 +88,7 @@ export function BookEditorWrapper({ agentName, initialAgentSource }: BookEditorW
 
             <BookEditor
                 className="w-full h-full"
+                isBorderRadiusDisabled
                 height={null}
                 value={agentSource}
                 onChange={handleChange}
@@ -125,16 +126,14 @@ export function BookEditorWrapper({ agentName, initialAgentSource }: BookEditorW
 
                     return shortFileUrl;
                 }}
-                // <- TODO: !!!! Create two-state solution for `<BookEditor onFileUpload={...} />`
             />
         </div>
     );
 }
 
 /**
+ * TODO: Prompt: Use `import { debounce } from '@promptbook-local/utils';` instead of custom debounce implementation
  * TODO: [🚗] Transfer the saving logic to `<BookEditor/>` be aware of CRDT / yjs approach to be implementable in future
- * DONE: Implement debouncing for auto-save (600ms delay) ✅
- * TODO: !!! Add error handling and retry logic
- * TODO: !!! Show save status indicator
- * TODO: !!!!! Add file upload capability
+ * TODO: [🐱‍🚀] Add error handling and retry logic
+ * TODO: [🐱‍🚀] Show save status indicator
  */

package/apps/agents-server/src/app/agents/[agentName]/book/page.tsx

@@ -1,6 +1,8 @@
 'use server';
 
+import { ForbiddenPage } from '@/src/components/ForbiddenPage/ForbiddenPage';
 import { $provideAgentCollectionForServer } from '@/src/tools/$provideAgentCollectionForServer';
+import { isUserAdmin } from '@/src/utils/isUserAdmin';
 import { headers } from 'next/headers';
 import { $sideEffect } from '../../../../../../../src/utils/organization/$sideEffect';
 import { BookEditorWrapper } from './BookEditorWrapper';
@@ -8,15 +10,20 @@ import { BookEditorWrapper } from './BookEditorWrapper';
 export default async function AgentBookPage({ params }: { params: Promise<{ agentName: string }> }) {
     $sideEffect(headers());
 
+    if (!(await isUserAdmin())) {
+        /* <- TODO: [👹] Here should be user permissions */
+        return <ForbiddenPage />;
+    }
+
     let { agentName } = await params;
     agentName = decodeURIComponent(agentName);
     const collection = await $provideAgentCollectionForServer();
     const agentSource = await collection.getAgentSource(decodeURIComponent(agentName));
 
     return (
-        <main className={`w-screen h-screen`}>
+        <div className={`w-screen h-[calc(100vh-60px)]`}>
             <BookEditorWrapper agentName={agentName} initialAgentSource={agentSource} />
-        </main>
+        </div>
     );
 }
 

package/apps/agents-server/src/app/agents/[agentName]/book+chat/AgentBookAndChat.tsx

@@ -0,0 +1,23 @@
+'use client';
+
+import { ResizablePanelsAuto } from '@common/components/ResizablePanelsAuto/ResizablePanelsAuto';
+import { string_agent_url, string_book } from '@promptbook-local/types';
+import { BookEditorWrapper } from '../book/BookEditorWrapper';
+import { AgentChatWrapper } from '../AgentChatWrapper';
+
+type AgentBookAndChatProps = {
+    agentName: string;
+    initialAgentSource: string_book;
+    agentUrl: string_agent_url;
+};
+
+export function AgentBookAndChat(props: AgentBookAndChatProps) {
+    const { agentName, initialAgentSource, agentUrl } = props;
+
+    return (
+        <ResizablePanelsAuto name={`agent-book-and-chat-${agentName}`} className="w-full h-full">
+            <BookEditorWrapper agentName={agentName} initialAgentSource={initialAgentSource} />
+            <AgentChatWrapper agentUrl={agentUrl} />
+        </ResizablePanelsAuto>
+    );
+}

package/apps/agents-server/src/app/agents/[agentName]/book+chat/{AgentBookAndChatComponent.tsx → AgentBookAndChatComponent.tsx.todo}

@@ -16,7 +16,7 @@ export function AgentBookAndChatComponent() {
 
     const [agentSource, setAgentSource] = useStateInLocalStorage<string_book>(
         'marigold-agentSource-1',
-        // TODO: !!! Uplad image to ptbk.io CDN
+        // TODO: [🐱‍🚀] Uplad image to ptbk.io CDN
         () => book`
             Marigold
 
@@ -53,7 +53,7 @@ export function AgentBookAndChatComponent() {
 
     const agent = useMemo(() => {
         /*/
-        // TODO: !!! Try working with `RemoteLlmExecutionTools`
+        // TODO: [🐱‍🚀] Try working with `RemoteLlmExecutionTools`
         const llm = new RemoteLlmExecutionTools({
             remoteServerUrl: 'https://promptbook.s5.ptbk.io/',
             identification: {
@@ -66,7 +66,7 @@ export function AgentBookAndChatComponent() {
         /**/
         const llm = new OpenAiAssistantExecutionTools({
             dangerouslyAllowBrowser: true,
-            isCreatingNewAssistantsAllowed: true, // <- TODO: !!! Test without whether warning is shown
+            isCreatingNewAssistantsAllowed: true, // <- TODO: [🐱‍🚀] Test without whether warning is shown
             apiKey,
             assistantId: 'asst_xI94Elk27nssnwAUkG2Cmok8', // <- TODO: [🧠] Make dynamic
             isVerbose: true,
@@ -84,8 +84,6 @@ export function AgentBookAndChatComponent() {
         return agent;
     }, [agentSource, setAgentSource, apiKey]);
 
-
-
     return (
         <div className="min-h-screen relative">
             {/* Floating API Key Configuration */}
@@ -139,17 +137,17 @@ export function AgentBookAndChatComponent() {
             <ResizablePanelsAuto name="two-editors">
                 <BookEditor
                     className="w-full h-full"
+                    isBorderRadiusDisabled
                     height={null}
                     value={agentSource}
                     onChange={setAgentSource}
                     // className={styles.BookEditor}
                     isVerbose={false}
-                    isBorderRadiusDisabled
                     onFileUpload={(file) => {
                         return file.name;
                     }}
                 />
-        
+
                 <AgentChat className={`h-full flex flex-col`} {...{ agent }} />
             </ResizablePanelsAuto>
         </div>
@@ -157,6 +155,6 @@ export function AgentBookAndChatComponent() {
 }
 
 /**
- * TODO: !!!! Make self-learning book createAgentLlmExecutionTools, use bidirectional agentSource
+ * TODO: [🐱‍🚀] Make self-learning book createAgentLlmExecutionTools, use bidirectional agentSource
  * TODO: [🚗] Components and pages here should be just tiny UI wraper around proper agent logic and conponents
  */

package/apps/agents-server/src/app/agents/[agentName]/book+chat/page.tsx

@@ -1,21 +1,32 @@
-'use client';
+'use server';
 
-import dynamic from 'next/dynamic';
+import { ForbiddenPage } from '@/src/components/ForbiddenPage/ForbiddenPage';
+import { $provideAgentCollectionForServer } from '@/src/tools/$provideAgentCollectionForServer';
+import { isUserAdmin } from '@/src/utils/isUserAdmin';
+import { headers } from 'next/headers';
+import { $sideEffect } from '../../../../../../../src/utils/organization/$sideEffect';
+import { generateAgentMetadata } from '../generateAgentMetadata';
+import { AgentBookAndChat } from './AgentBookAndChat';
 
-const SelfLearningBook = dynamic(
-    () => import('./AgentBookAndChatComponent').then((module) => module.AgentBookAndChatComponent),
-    {
-        ssr: false,
-    },
-);
+export const generateMetadata = generateAgentMetadata;
 
-export default function AgentBookAndChatPage() {
-    return <SelfLearningBook />;
-}
+export default async function AgentBookAndChatPage({ params }: { params: Promise<{ agentName: string }> }) {
+    $sideEffect(headers());
+
+    if (!(await isUserAdmin())) {
+        /* <- TODO: [👹] Here should be user permissions */
+        return <ForbiddenPage />;
+    }
 
-/**
- * TODO: !!! Private / public / open agents
- * TODO: !!! Allow http://localhost:4440/agents/agent-123.book to download the agent book file
- * TODO: !!! BOOK_MIME_TYPE in config
- * TODO: [🚗] Components and pages here should be just tiny UI wraper around proper agent logic and conponents
- */
+    let { agentName } = await params;
+    agentName = decodeURIComponent(agentName);
+    const collection = await $provideAgentCollectionForServer();
+    const agentSource = await collection.getAgentSource(agentName);
+    const agentUrl = `/agents/${agentName}`;
+
+    return (
+        <div className={`w-screen h-[calc(100vh-60px)]`}>
+            <AgentBookAndChat agentName={agentName} initialAgentSource={agentSource} agentUrl={agentUrl} />
+        </div>
+    );
+}

package/apps/agents-server/src/app/agents/[agentName]/book+chat/page.tsx.todo

@@ -0,0 +1,21 @@
+'use client';
+
+import dynamic from 'next/dynamic';
+
+const SelfLearningBook = dynamic(
+    () => import('./AgentBookAndChatComponent').then((module) => module.AgentBookAndChatComponent),
+    {
+        ssr: false,
+    },
+);
+
+export default function AgentBookAndChatPage() {
+    return <SelfLearningBook />;
+}
+
+/**
+ * TODO: [🐱‍🚀] Private / public / open agents
+ * TODO: [🐱‍🚀] Allow http://localhost:4440/agents/agent-123.book to download the agent book file
+ * TODO: [🐱‍🚀] BOOK_MIME_TYPE in config
+ * TODO: [🚗] Components and pages here should be just tiny UI wraper around proper agent logic and conponents
+ */

package/apps/agents-server/src/app/agents/[agentName]/chat/AgentChatWrapper.tsx

@@ -3,14 +3,14 @@
 import { usePromise } from '@common/hooks/usePromise';
 import { AgentChat } from '@promptbook-local/components';
 import { RemoteAgent } from '@promptbook-local/core';
-import { useMemo } from 'react';
+import { useCallback, useMemo } from 'react';
 import { string_agent_url } from '../../../../../../../src/types/typeAliases';
 
 type AgentChatWrapperProps = {
     agentUrl: string_agent_url;
 };
 
-// TODO: !!!! Rename to AgentChatSomethingWrapper
+// TODO: [🐱‍🚀] Rename to AgentChatSomethingWrapper
 
 export function AgentChatWrapper(props: AgentChatWrapperProps) {
     const { agentUrl } = props;
@@ -26,11 +26,41 @@ export function AgentChatWrapper(props: AgentChatWrapperProps) {
 
     const { value: agent } = usePromise(agentPromise, [agentPromise]);
 
+    const handleFeedback = useCallback(
+        async (feedback: {
+            rating: number;
+            textRating?: string;
+            chatThread?: string;
+            userNote?: string;
+            expectedAnswer?: string | null;
+        }) => {
+            if (!agent) {
+                return;
+            }
+
+            await fetch(`${agentUrl}/api/feedback`, {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                    rating: feedback.rating.toString(),
+                    textRating: feedback.textRating,
+                    chatThread: feedback.chatThread,
+                    userNote: feedback.textRating, // Mapping textRating to userNote as well if needed, or just textRating
+                    expectedAnswer: feedback.expectedAnswer,
+                    agentHash: agent.agentHash,
+                }),
+            });
+        },
+        [agent, agentUrl],
+    );
+
     if (!agent) {
-        return <>{/* <- TODO: !!! <PromptbookLoading /> */}</>;
+        return <>{/* <- TODO: [🐱‍🚀] <PromptbookLoading /> */}</>;
     }
 
-    return <AgentChat className={`w-full h-full`} agent={agent} />;
+    return <AgentChat className={`w-full h-full`} agent={agent} onFeedback={handleFeedback} />;
 }
 
 /**

package/apps/agents-server/src/app/agents/[agentName]/chat/page.tsx

@@ -2,7 +2,10 @@
 
 import { headers } from 'next/headers';
 import { $sideEffect } from '../../../../../../../src/utils/organization/$sideEffect';
-import { AgentChatWrapper } from './AgentChatWrapper';
+import { generateAgentMetadata } from '../generateAgentMetadata';
+import { AgentChatWrapper } from '../AgentChatWrapper';
+
+export const generateMetadata = generateAgentMetadata;
 
 export default async function AgentChatPage({ params }: { params: Promise<{ agentName: string }> }) {
     $sideEffect(headers());

package/apps/agents-server/src/app/agents/[agentName]/generateAgentMetadata.ts

@@ -0,0 +1,42 @@
+import { $provideAgentCollectionForServer } from '@/src/tools/$provideAgentCollectionForServer';
+import { parseAgentSource } from '@promptbook-local/core';
+import { Metadata } from 'next';
+
+export async function generateAgentMetadata({ params }: { params: Promise<{ agentName: string }> }): Promise<Metadata> {
+    let { agentName } = await params;
+    agentName = decodeURIComponent(agentName);
+
+    try {
+        const collection = await $provideAgentCollectionForServer();
+        const agentSource = await collection.getAgentSource(agentName);
+        const agentProfile = parseAgentSource(agentSource);
+
+        const title = agentProfile.meta.title || agentProfile.agentName;
+        const description = agentProfile.meta.description || agentProfile.personaDescription || undefined;
+
+        // Extract image from meta
+        const image = agentProfile.meta.image;
+
+        return {
+            title,
+            description,
+            openGraph: {
+                title,
+                description,
+                type: 'website',
+                images: image ? [{ url: image }] : undefined,
+            },
+            twitter: {
+                card: 'summary_large_image',
+                title,
+                description,
+                images: image ? [image] : undefined,
+            },
+        };
+    } catch (error) {
+        console.warn(`Failed to generate metadata for agent ${agentName}`, error);
+        return {
+            title: agentName,
+        };
+    }
+}