diff --git a/components/ai_chat/resources/page/state/conversation_context.tsx b/components/ai_chat/resources/page/state/conversation_context.tsx index 8f9698565629..f067a9788984 100644 --- a/components/ai_chat/resources/page/state/conversation_context.tsx +++ b/components/ai_chat/resources/page/state/conversation_context.tsx @@ -557,9 +557,16 @@ export function useConversation() { return React.useContext(ConversationReactContext) } +export function useIsNewConversation() { + const conversationContext = useConversation() + const aiChatContext = useAIChat() + + // A conversation is new if it isn't in the list of visible conversations. + return !aiChatContext.visibleConversations.find(c => c.uuid === conversationContext.conversationUuid) +} + export function useSupportsAttachments() { const aiChatContext = useAIChat() - const conversationContext = useConversation() - return aiChatContext.isStandalone - && !aiChatContext.visibleConversations.find(c => c.uuid === conversationContext.conversationUuid) + const isNew = useIsNewConversation() + return aiChatContext.isStandalone && isNew } diff --git a/components/ai_chat/resources/page/stories/components_panel.tsx b/components/ai_chat/resources/page/stories/components_panel.tsx index 17593817847d..15cdb1376ff1 100644 --- a/components/ai_chat/resources/page/stories/components_panel.tsx +++ b/components/ai_chat/resources/page/stories/components_panel.tsx @@ -31,6 +31,7 @@ import ErrorRateLimit from '../components/alerts/error_rate_limit' import ErrorServiceOverloaded from '../components/alerts/error_service_overloaded' import LongConversationInfo from '../components/alerts/long_conversation_info' import WarningPremiumDisconnected from '../components/alerts/warning_premium_disconnected' +import Attachments from '../components/attachments' const eventTemplate: Mojom.ConversationEntryEvent = { completionEvent: undefined, @@ -425,6 +426,8 @@ type CustomArgs = { shouldShowLongPageWarning: boolean shouldShowRefinedWarning: boolean isGenerating: boolean + showAttachments: boolean + isNewConversation: boolean } const args: CustomArgs = { @@ -455,6 +458,8 @@ const args: CustomArgs = { shouldShowLongPageWarning: false, shouldShowRefinedWarning: false, isGenerating: false, + showAttachments: true, + isNewConversation: false, } const meta: Meta = { @@ -490,7 +495,7 @@ const meta: Meta = { const [, setArgs] = useArgs() return ( - + ) } @@ -549,14 +554,34 @@ function StoryContext(props: React.PropsWithChildren<{ args: CustomArgs, setArgs isHistoryFeatureEnabled: options.args.isHistoryEnabled, isStandalone: options.args.isStandalone, allActions: ACTIONS_LIST, - tabs: [], - goPremium: () => {}, - managePremium: () => {}, - handleAgreeClick: () => {}, - enableStoragePref: () => {}, - dismissStorageNotice: () => {}, - dismissPremiumPrompt: () => {}, - userRefreshPremiumSession: () => {}, + tabs: [{ + id: 1, + contentId: 1, + url: { url: 'https://www.example.com' }, + title: 'Example', + }, { + id: 2, + contentId: 2, + url: { url: 'https://topos.nz' }, + title: 'NZ Topo', + }, { + id: 3, + contentId: 3, + url: { url: 'https://brave.com' }, + title: 'Brave', + }, { + id: 4, + contentId: 4, + url: { url: 'https://search.brave.com' }, + title: 'Brave Search', + }], + goPremium: () => { }, + managePremium: () => { }, + handleAgreeClick: () => { }, + enableStoragePref: () => { }, + dismissStorageNotice: () => { }, + dismissPremiumPrompt: () => { }, + userRefreshPremiumSession: () => { }, setEditingConversationId: (id: string | null) => setArgs({ editingConversationId: id }), setDeletingConversationId: (id: string | null) => setArgs({ deletingConversationId: id }), showSidebar: showSidebar, @@ -565,10 +590,10 @@ function StoryContext(props: React.PropsWithChildren<{ args: CustomArgs, setArgs const activeChatContext: SelectedChatDetails = { selectedConversationId: CONVERSATIONS[0].uuid, - updateSelectedConversationId: () => {}, + updateSelectedConversationId: () => { }, callbackRouter: undefined!, conversationHandler: undefined!, - createNewConversation: () => {}, + createNewConversation: () => { }, isTabAssociated: options.args.isDefaultConversation } @@ -576,7 +601,9 @@ function StoryContext(props: React.PropsWithChildren<{ args: CustomArgs, setArgs const conversationContext: ConversationContext = { historyInitialized: true, - conversationUuid: CONVERSATIONS[1].uuid, + conversationUuid: options.args.isNewConversation + ? 'new-conversation' + : CONVERSATIONS[1].uuid, conversationHistory: options.args.hasConversation ? HISTORY : [], associatedContentInfo: associatedContent, allModels: MODELS, @@ -600,22 +627,22 @@ function StoryContext(props: React.PropsWithChildren<{ args: CustomArgs, setArgs isCharLimitExceeded: inputText.length > 70, inputTextCharCountDisplay: `${inputText.length} / 70`, setInputText, - setCurrentModel: () => {}, + setCurrentModel: () => { }, switchToBasicModel, - generateSuggestedQuestions: () => {}, - dismissLongConversationInfo: () => {}, - updateShouldSendPageContents: () => {}, - retryAPIRequest: () => {}, - handleResetError: () => {}, - handleStopGenerating: async () => {}, - submitInputTextToAPI: () => {}, - resetSelectedActionType: () => {}, - handleActionTypeClick: () => {}, - setIsToolsMenuOpen: () => {}, - handleFeedbackFormCancel: () => {}, - handleFeedbackFormSubmit: () => {}, - setShowAttachments: () => {}, - showAttachments: false, + generateSuggestedQuestions: () => { }, + dismissLongConversationInfo: () => { }, + updateShouldSendPageContents: () => { }, + retryAPIRequest: () => { }, + handleResetError: () => { }, + handleStopGenerating: async () => { }, + submitInputTextToAPI: () => { }, + resetSelectedActionType: () => { }, + handleActionTypeClick: () => { }, + setIsToolsMenuOpen: () => { }, + handleFeedbackFormCancel: () => { }, + handleFeedbackFormSubmit: () => { }, + setShowAttachments: (show: boolean) => setArgs({ showAttachments: show }), + showAttachments: options.args.showAttachments, } const conversationEntriesContext: UntrustedConversationContext = { @@ -698,6 +725,34 @@ export const _FullPage = { } } +export const _NewFullpageConversation = { + args: { + isNewConversation: true, + isStandalone: true, + conversationUuid: undefined, + hasConversation: false, + hasSiteInfo: false, + }, + render: () => { + return
+ +
+ } +} +export const _AttachmentsPanel = { + args: { + isStandalone: true, + isDefaultConversation: false + }, + render: () => { + return ( +
+ +
+ ) + } +} + export const _Loading = { args: { initialized: false