diff --git a/apps/desktop/src/components/main/sidebar/banner/component.tsx b/apps/desktop/src/components/main/sidebar/banner/component.tsx index efe6fafafc..c2ce8a2fe0 100644 --- a/apps/desktop/src/components/main/sidebar/banner/component.tsx +++ b/apps/desktop/src/components/main/sidebar/banner/component.tsx @@ -33,20 +33,18 @@ export function Banner({ )} - {banner.icon && ( + {(banner.icon || banner.title) && (
{banner.icon} -

- {banner.title} -

+ {banner.title && ( +

+ {banner.title} +

+ )}
)} - {!banner.icon && ( -

{banner.title}

- )} - -

{banner.description}

+
{banner.description}
{banner.primaryAction && ( diff --git a/apps/desktop/src/components/main/sidebar/banner/index.tsx b/apps/desktop/src/components/main/sidebar/banner/index.tsx index 9379712d02..436e108dd4 100644 --- a/apps/desktop/src/components/main/sidebar/banner/index.tsx +++ b/apps/desktop/src/components/main/sidebar/banner/index.tsx @@ -29,7 +29,14 @@ export function BannerArea({ const hasLLMConfigured = !!(current_llm_provider && current_llm_model); const hasSttConfigured = !!(current_stt_provider && current_stt_model); + const currentTab = useTabs((state) => state.currentTab); + const isAiTranscriptionTabActive = + currentTab?.type === "ai" && currentTab.state?.tab === "transcription"; + const isAiIntelligenceTabActive = + currentTab?.type === "ai" && currentTab.state?.tab === "intelligence"; + const openNew = useTabs((state) => state.openNew); + const updateAiTabState = useTabs((state) => state.updateAiTabState); const handleSignIn = useCallback(async () => { await auth?.signIn(); @@ -37,9 +44,13 @@ export function BannerArea({ const openAiTab = useCallback( (tab: "intelligence" | "transcription") => { - openNew({ type: "ai", state: { tab } }); + if (currentTab?.type === "ai") { + updateAiTabState(currentTab, { tab }); + } else { + openNew({ type: "ai", state: { tab } }); + } }, - [openNew], + [currentTab, openNew, updateAiTabState], ); const handleOpenLLMSettings = useCallback(() => { @@ -56,6 +67,8 @@ export function BannerArea({ isAuthenticated, hasLLMConfigured, hasSttConfigured, + isAiTranscriptionTabActive, + isAiIntelligenceTabActive, onSignIn: handleSignIn, onOpenLLMSettings: handleOpenLLMSettings, onOpenSTTSettings: handleOpenSTTSettings, @@ -64,6 +77,8 @@ export function BannerArea({ isAuthenticated, hasLLMConfigured, hasSttConfigured, + isAiTranscriptionTabActive, + isAiIntelligenceTabActive, handleSignIn, handleOpenLLMSettings, handleOpenSTTSettings, diff --git a/apps/desktop/src/components/main/sidebar/banner/registry.tsx b/apps/desktop/src/components/main/sidebar/banner/registry.tsx index 0a3294ffcf..16add99f7b 100644 --- a/apps/desktop/src/components/main/sidebar/banner/registry.tsx +++ b/apps/desktop/src/components/main/sidebar/banner/registry.tsx @@ -1,5 +1,3 @@ -import { AudioLinesIcon, SparklesIcon } from "lucide-react"; - import type { BannerCondition, BannerType } from "./types"; type BannerRegistryEntry = { @@ -11,6 +9,8 @@ type BannerRegistryParams = { isAuthenticated: boolean; hasLLMConfigured: boolean; hasSttConfigured: boolean; + isAiTranscriptionTabActive: boolean; + isAiIntelligenceTabActive: boolean; onSignIn: () => void | Promise; onOpenLLMSettings: () => void; onOpenSTTSettings: () => void; @@ -20,6 +20,8 @@ export function createBannerRegistry({ isAuthenticated, hasLLMConfigured, hasSttConfigured, + isAiTranscriptionTabActive, + isAiIntelligenceTabActive, onSignIn, onOpenLLMSettings, onOpenSTTSettings, @@ -29,32 +31,37 @@ export function createBannerRegistry({ { banner: { id: "missing-stt", - icon: , - title: "Missing AI model", - description: - "A transcription model is needed to make Hyprnote listen to your conversations.", + description: ( + <> + Transcription model is needed + to make Hyprnote listen to your conversations. + + ), primaryAction: { - label: "Go to settings", + label: "Configure transcription", onClick: onOpenSTTSettings, }, dismissible: false, }, - condition: () => !hasSttConfigured, + condition: () => !hasSttConfigured && !isAiTranscriptionTabActive, }, { banner: { id: "missing-llm", - icon: , - title: "Add intelligence", - description: - "Language model is needed to make Hyprnote summarize and chat about your conversations", + description: ( + <> + Language model is needed to + make Hyprnote summarize and chat about your conversations. + + ), primaryAction: { - label: "Go to settings", + label: "Add intelligence", onClick: onOpenLLMSettings, }, dismissible: false, }, - condition: () => !hasLLMConfigured, + condition: () => + hasSttConfigured && !hasLLMConfigured && !isAiIntelligenceTabActive, }, { banner: { diff --git a/apps/desktop/src/components/main/sidebar/banner/types.ts b/apps/desktop/src/components/main/sidebar/banner/types.ts index 37f6b8a8e9..f32cdab22d 100644 --- a/apps/desktop/src/components/main/sidebar/banner/types.ts +++ b/apps/desktop/src/components/main/sidebar/banner/types.ts @@ -8,8 +8,8 @@ export type BannerAction = { export type BannerType = { id: string; icon?: ReactNode; - title: string; - description: string; + title?: string; + description: ReactNode; primaryAction?: BannerAction; secondaryAction?: BannerAction; dismissible: boolean;