connect to agent works

Gigentic · Dec 22, 2024 · 3629dbc · 3629dbc
1 parent 0b9309e
commit 3629dbc
Show file tree

Hide file tree

Showing 4 changed files with 56 additions and 22 deletions.
diff --git a/web/app/actions.tsx b/web/app/actions.tsx
@@ -96,7 +96,7 @@ export async function sendMessage(
   // Only initialize meme agent if we're in meme agent mode
   if (!isMemeAgentChat && message === 'init meme agent') {
     console.log('Initializing meme agent...');
-    history.update([
+    history.done([
       ...currentMessages,
       {
         role: 'system',
@@ -108,7 +108,7 @@ export async function sendMessage(
 
     return {
       id: Date.now(),
-      role: 'assistant',
+      role: 'assistant' as const,
       display: (
         <AgentMessage>
           👋 Connected to Meme Coin Recommender. How can I help you analyze meme
@@ -123,16 +123,21 @@ export async function sendMessage(
   console.log('Is meme agent mode?', isMemeAgent);
 
   if (isMemeAgent) {
-    // Add the user message to history while preserving existing messages
-    const updatedMessages = [
-      ...currentMessages,
-      {
-        role: 'user',
-        content: message,
-        name: 'meme_agent',
-      },
-    ];
-    history.update(updatedMessages as AIState);
+    try {
+      // Add the user message to history
+      history.done([
+        ...currentMessages,
+        {
+          role: 'user',
+          content: message,
+          name: 'meme_agent',
+        },
+      ]);
+    } catch (error) {
+      console.error('Error adding user message to history:', error);
+    }
+
+    console.log('history', history.get());
 
     try {
       const controller = new AbortController();

diff --git a/web/components/service-discovery/freelancer-profile-card.tsx b/web/components/service-discovery/freelancer-profile-card.tsx
@@ -1,4 +1,5 @@
 'use client';
+import Image from 'next/image';
 
 import {
   Card,
@@ -9,7 +10,7 @@ import {
 } from '@gigentic-frontend/ui-kit/ui';
 import { Badge } from '@gigentic-frontend/ui-kit/ui';
 import { Button } from '@gigentic-frontend/ui-kit/ui';
-import { Star, MessageSquare, Zap, Lock } from 'lucide-react';
+import { Star, MessageSquare, Zap, Lock, UserIcon } from 'lucide-react';
 import { useSelectFreelancer } from '@/hooks/services/use-freelancer-query';
 import { useRouter } from 'next/navigation';
 import type { Freelancer } from '@/types/freelancer';
@@ -78,7 +79,20 @@ export default function FreelancerProfileCard(
       <Card>
         <CardHeader className="flex flex-row items-center gap-4">
           <div className="w-16 h-16">
-            <svg
+            <div className="flex h-12 w-12 shrink-0 select-none items-center justify-center rounded-md border shadow-sm bg-background overflow-hidden">
+              {isMemeAgent ? (
+                <Image
+                  src="/images/doge-agent-big.png"
+                  alt="Doge Agent"
+                  width={48}
+                  height={48}
+                  className="object-cover"
+                />
+              ) : (
+                <UserIcon className="h-6 w-6" />
+              )}
+            </div>
+            {/* <svg
               className="w-12 h-12 text-gray-400"
               fill="currentColor"
               viewBox="0 0 20 20"
@@ -89,7 +103,7 @@ export default function FreelancerProfileCard(
                 d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z"
                 clipRule="evenodd"
               />
-            </svg>
+            </svg> */}
           </div>
           <div className="flex flex-col flex-grow">
             <div className="flex justify-between items-center">
@@ -125,7 +139,7 @@ export default function FreelancerProfileCard(
           </Button>
           <Button className="w-full" onClick={handlePayEscrow}>
             <Lock className="w-4 h-4 mr-2" />
-            Pay into Escrow
+            Connect to ASSISTERR Agent
           </Button>
         </CardFooter>
       </Card>

diff --git a/web/components/service-discovery/llm/message.tsx b/web/components/service-discovery/llm/message.tsx
@@ -1,5 +1,6 @@
 import { UserIcon, SparkleIcon } from 'lucide-react';
 import Image from 'next/image';
+import { Fragment } from 'react';
 
 export function UserMessage({ children }: { children: React.ReactNode }) {
   return (
@@ -77,12 +78,26 @@ export function AgentMessage({
   children: React.ReactNode;
   className?: string;
 }) {
+  // Convert string content to formatted JSX
+  const formatContent = (content: string) => {
+    return content.split('*').map((part, index) => {
+      // Even indices are normal text, odd indices are bold
+      if (index % 2 === 1) {
+        return <strong key={index}>{part}</strong>;
+      }
+      // Split normal text by newlines and add line breaks
+      return part.split('\n').map((line, i, arr) => (
+        <Fragment key={`${index}-${i}`}>
+          {line}
+          {i < arr.length - 1 && <br />}
+        </Fragment>
+      ));
+    });
+  };
+
   return (
     <div className="group relative flex items-start">
-      <div
-        className="flex h-8 w-8 shrink-0 select-none items-center justify-center
-            rounded-md border shadow-sm bg-background overflow-hidden"
-      >
+      <div className="flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-md border shadow-sm bg-background overflow-hidden">
         <Image
           src="/images/doge-agent.png"
           alt="Doge Agent"
@@ -91,8 +106,8 @@ export function AgentMessage({
           className="object-cover"
         />
       </div>
-      <div className="ml-4 flex-1 space-y-2 overflow-hidden px-1">
-        {children}
+      <div className="ml-4 flex-1 space-y-2 overflow-hidden px-1 whitespace-pre-wrap">
+        {typeof children === 'string' ? formatContent(children) : children}
       </div>
     </div>
   );

diff --git a/web/public/images/doge-agent-big.png b/web/public/images/doge-agent-big.png