diff --git a/apps/studio/components/ui/AIAssistantPanel/AIAssistant.tsx b/apps/studio/components/ui/AIAssistantPanel/AIAssistant.tsx index 656f1bb78c1..770c3719efa 100644 --- a/apps/studio/components/ui/AIAssistantPanel/AIAssistant.tsx +++ b/apps/studio/components/ui/AIAssistantPanel/AIAssistant.tsx @@ -3,9 +3,9 @@ import type { Message as MessageType } from 'ai/react' import { useChat } from 'ai/react' import { AnimatePresence, motion } from 'framer-motion' import { last } from 'lodash' -import { ArrowDown, FileText, Info, RefreshCw, X, Plus } from 'lucide-react' +import { ArrowDown, FileText, Info, Plus, RefreshCw, X } from 'lucide-react' import { useRouter } from 'next/router' -import { memo, useEffect, useMemo, useRef, useState, useCallback } from 'react' +import { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react' import { toast } from 'sonner' import { useParams, useSearchParamsShallow } from 'common/hooks' @@ -24,6 +24,7 @@ import { useOrgOptedIntoAi } from 'hooks/misc/useOrgOptedIntoAi' import { useSelectedOrganization } from 'hooks/misc/useSelectedOrganization' import { useSelectedProject } from 'hooks/misc/useSelectedProject' import { useFlag } from 'hooks/ui/useFlag' +import { useAssistant } from 'hooks/useAssistant' import { BASE_PATH, IS_PLATFORM, OPT_IN_TAGS } from 'lib/constants' import uuidv4 from 'lib/uuid' import { useAppStateSnapshot } from 'state/app-state' @@ -39,23 +40,33 @@ import { } from 'ui' import { Admonition, AssistantChatForm, GenericSkeletonLoader } from 'ui-patterns' import ConfirmationModal from 'ui-patterns/Dialogs/ConfirmationModal' +import { ButtonTooltip } from '../ButtonTooltip' import DotGrid from '../DotGrid' +import { AIAssistantChatSelector } from './AIAssistantChatSelector' import AIOnboarding from './AIOnboarding' import CollapsibleCodeBlock from './CollapsibleCodeBlock' import { Message } from './Message' import { useAutoScroll } from './hooks' -import { AIAssistantChatSelector } from './AIAssistantChatSelector' -import { useAssistant } from 'hooks/useAssistant' const MemoizedMessage = memo( - ({ message, isLoading }: { message: MessageType; isLoading: boolean }) => { + ({ + message, + isLoading, + onResults, + }: { + message: MessageType + isLoading: boolean + onResults: ({ title, results }: { title?: string; results: any[] }) => void + }) => { return ( ) } @@ -83,6 +94,7 @@ export const AIAssistant = ({ className }: AIAssistantProps) => { const { messages: assistantMessages, saveMessage, + updateMessage, clearMessages, closeAssistant, clearSqlSnippets, @@ -180,6 +192,7 @@ export const AIAssistant = ({ className }: AIAssistantProps) => { key={message.id} message={message} isLoading={isChatLoading && message.id === chatMessages[chatMessages.length - 1].id} + onResults={(props) => updateMessage({ id: message.id, ...props })} /> ) }), @@ -302,36 +315,32 @@ export const AIAssistant = ({ className }: AIAssistantProps) => {
- - -
{!includeSchemaMetadata && selectedOrganization && ( diff --git a/apps/studio/components/ui/AIAssistantPanel/AIAssistantChatSelector.tsx b/apps/studio/components/ui/AIAssistantPanel/AIAssistantChatSelector.tsx index ad60060f628..d5abf36daaa 100644 --- a/apps/studio/components/ui/AIAssistantPanel/AIAssistantChatSelector.tsx +++ b/apps/studio/components/ui/AIAssistantPanel/AIAssistantChatSelector.tsx @@ -1,7 +1,7 @@ -import { useState } from 'react' -import { Check, Edit, MessageSquare, Trash, X } from 'lucide-react' import { useAssistant } from 'hooks/useAssistant' +import { Check, Edit, MessageSquare, Trash, X } from 'lucide-react' import { useRouter } from 'next/router' +import { useState } from 'react' import { Button, cn, @@ -16,6 +16,7 @@ import { PopoverContent_Shadcn_, PopoverTrigger_Shadcn_, } from 'ui' +import { ButtonTooltip } from '../ButtonTooltip' interface AIAssistantChatSelectorProps { className?: string @@ -86,11 +87,12 @@ export const AIAssistantChatSelector = ({ className }: AIAssistantChatSelectorPr return ( -