diff --git a/packages/browseros-agent/apps/agent/entrypoints/app/ai-settings/LlmProvidersHeader.tsx b/packages/browseros-agent/apps/agent/entrypoints/app/ai-settings/LlmProvidersHeader.tsx index 920c4e93b..e9708668b 100644 --- a/packages/browseros-agent/apps/agent/entrypoints/app/ai-settings/LlmProvidersHeader.tsx +++ b/packages/browseros-agent/apps/agent/entrypoints/app/ai-settings/LlmProvidersHeader.tsx @@ -1,4 +1,4 @@ -import { Plus } from 'lucide-react' +import { HelpCircle, Plus } from 'lucide-react' import type { FC } from 'react' import ProductLogoSvg from '@/assets/product_logo.svg' import { Button } from '@/components/ui/button' @@ -9,6 +9,13 @@ import { SelectTrigger, SelectValue, } from '@/components/ui/select' +import { + Tooltip, + TooltipContent, + TooltipProvider, + TooltipTrigger, +} from '@/components/ui/tooltip' +import { bringYourOwnLlmHelpUrl } from '@/lib/constants/productUrls' import type { LlmProviderConfig } from '@/lib/llm-providers/types' interface LlmProvidersHeaderProps { @@ -34,7 +41,24 @@ export const LlmProvidersHeader: FC = ({ BrowserOS
-

LLM Providers

+
+

LLM Providers

+ + + + + + + + Learn more about LLM providers + + +

Add your provider and choose the default LLM

diff --git a/packages/browseros-agent/apps/agent/entrypoints/app/connect-mcp/ConnectMCP.tsx b/packages/browseros-agent/apps/agent/entrypoints/app/connect-mcp/ConnectMCP.tsx index 0a0f4f26f..d2fe7db8d 100644 --- a/packages/browseros-agent/apps/agent/entrypoints/app/connect-mcp/ConnectMCP.tsx +++ b/packages/browseros-agent/apps/agent/entrypoints/app/connect-mcp/ConnectMCP.tsx @@ -1,11 +1,18 @@ -import { Check, Loader2, Plus, Server, Trash2 } from 'lucide-react' +import { Check, HelpCircle, Loader2, Plus, Server, Trash2 } from 'lucide-react' import { type FC, useState } from 'react' import { toast } from 'sonner' import { Button } from '@/components/ui/button' +import { + Tooltip, + TooltipContent, + TooltipProvider, + TooltipTrigger, +} from '@/components/ui/tooltip' import { CUSTOM_MCP_ADDED_EVENT, MANAGED_MCP_ADDED_EVENT, } from '@/lib/constants/analyticsEvents' +import { connectAppsHelpUrl } from '@/lib/constants/productUrls' import { useMcpServers } from '@/lib/mcp/mcpServerStorage' import { useSyncRemoteIntegrations } from '@/lib/mcp/useSyncRemoteIntegrations' import { track } from '@/lib/metrics/track' @@ -218,7 +225,24 @@ export const ConnectMCP: FC = () => {
-

Connected Apps

+
+

Connected Apps

+ + + + + + + + Learn more about Connect Apps + + +

Connect BrowserOS assistant to apps to send email, schedule calendar events, write docs, and more diff --git a/packages/browseros-agent/apps/agent/entrypoints/app/llm-hub/LlmHubHeader.tsx b/packages/browseros-agent/apps/agent/entrypoints/app/llm-hub/LlmHubHeader.tsx index e98d24418..9e4b47639 100644 --- a/packages/browseros-agent/apps/agent/entrypoints/app/llm-hub/LlmHubHeader.tsx +++ b/packages/browseros-agent/apps/agent/entrypoints/app/llm-hub/LlmHubHeader.tsx @@ -1,5 +1,12 @@ -import { MessageSquare } from 'lucide-react' +import { HelpCircle, MessageSquare } from 'lucide-react' import type { FC } from 'react' +import { + Tooltip, + TooltipContent, + TooltipProvider, + TooltipTrigger, +} from '@/components/ui/tooltip' +import { llmChatHubHelpUrl } from '@/lib/constants/productUrls' export const LlmHubHeader: FC = () => { return ( @@ -9,7 +16,24 @@ export const LlmHubHeader: FC = () => {

-

LLM Chat & Hub

+
+

LLM Chat & Hub

+ + + + + + + + Learn more about Chat & Hub + + +

Curate and configure your favourite LLM chat providers

diff --git a/packages/browseros-agent/apps/agent/entrypoints/app/mcp-settings/MCPServerHeader.tsx b/packages/browseros-agent/apps/agent/entrypoints/app/mcp-settings/MCPServerHeader.tsx index 208f861b8..65f3dbb56 100644 --- a/packages/browseros-agent/apps/agent/entrypoints/app/mcp-settings/MCPServerHeader.tsx +++ b/packages/browseros-agent/apps/agent/entrypoints/app/mcp-settings/MCPServerHeader.tsx @@ -1,6 +1,7 @@ import { Check, Copy, ExternalLink, Globe, Server } from 'lucide-react' import { type FC, useState } from 'react' import { Button } from '@/components/ui/button' +import { mcpClientsHelpUrl } from '@/lib/constants/productUrls' interface MCPServerHeaderProps { serverUrl: string | null @@ -11,8 +12,6 @@ interface MCPServerHeaderProps { remoteAccessEnabled?: boolean } -const DOCS_URL = 'https://docs.browseros.com/features/use-with-claude-code' - export const MCPServerHeader: FC = ({ serverUrl, isLoading, @@ -45,7 +44,7 @@ export const MCPServerHeader: FC = ({

{title}

{ return ( @@ -9,7 +16,24 @@ export const MemoryHeader: FC = () => {
-

Agent Memory

+
+

Agent Memory

+ + + +
+ + + + Learn more about memory + + +

Facts your agent remembers about you — your name, preferences, projects, and tools. Edit directly or teach through conversation. diff --git a/packages/browseros-agent/apps/agent/entrypoints/app/skills/SkillsPage.tsx b/packages/browseros-agent/apps/agent/entrypoints/app/skills/SkillsPage.tsx index 831b14647..7bbac2dd4 100644 --- a/packages/browseros-agent/apps/agent/entrypoints/app/skills/SkillsPage.tsx +++ b/packages/browseros-agent/apps/agent/entrypoints/app/skills/SkillsPage.tsx @@ -1,4 +1,11 @@ -import { AlertCircle, Pencil, Plus, Trash2, Wand2 } from 'lucide-react' +import { + AlertCircle, + HelpCircle, + Pencil, + Plus, + Trash2, + Wand2, +} from 'lucide-react' import { type FC, useEffect, useState } from 'react' import { toast } from 'sonner' import { @@ -26,6 +33,13 @@ import { Label } from '@/components/ui/label' import { MarkdownEditor } from '@/components/ui/MarkdownEditor' import { Switch } from '@/components/ui/switch' import { Textarea } from '@/components/ui/textarea' +import { + Tooltip, + TooltipContent, + TooltipProvider, + TooltipTrigger, +} from '@/components/ui/tooltip' +import { skillsHelpUrl } from '@/lib/constants/productUrls' import { type SkillDetail, type SkillMeta, useSkills } from './useSkills' const loadingSkillCards = [ @@ -174,7 +188,24 @@ const SkillsHeader: FC<{ return (

-

Skills

+
+

Skills

+ + + + + + + + Learn more about skills + + +

Define reusable instructions that extend how your agent responds.

diff --git a/packages/browseros-agent/apps/agent/entrypoints/app/soul/SoulHeader.tsx b/packages/browseros-agent/apps/agent/entrypoints/app/soul/SoulHeader.tsx index 9ed1c239a..a8491b44f 100644 --- a/packages/browseros-agent/apps/agent/entrypoints/app/soul/SoulHeader.tsx +++ b/packages/browseros-agent/apps/agent/entrypoints/app/soul/SoulHeader.tsx @@ -1,5 +1,12 @@ -import { Sparkles } from 'lucide-react' +import { HelpCircle, Sparkles } from 'lucide-react' import type { FC } from 'react' +import { + Tooltip, + TooltipContent, + TooltipProvider, + TooltipTrigger, +} from '@/components/ui/tooltip' +import { soulHelpUrl } from '@/lib/constants/productUrls' export const SoulHeader: FC = () => { return ( @@ -9,7 +16,24 @@ export const SoulHeader: FC = () => {
-

Agent Soul

+
+

Agent Soul

+ + + + + + + + Learn more about SOUL.md + + +

Your agent's personality, tone, and behavioral rules. The soul evolves as your agent learns how you like to interact. diff --git a/packages/browseros-agent/apps/agent/lib/constants/productUrls.ts b/packages/browseros-agent/apps/agent/lib/constants/productUrls.ts index 34c38a5fb..6877e1cb3 100644 --- a/packages/browseros-agent/apps/agent/lib/constants/productUrls.ts +++ b/packages/browseros-agent/apps/agent/lib/constants/productUrls.ts @@ -59,3 +59,42 @@ export const workflowsHelpUrl = 'https://docs.browseros.com/features/workflows' */ export const scheduledTasksHelpUrl = 'https://docs.browseros.com/features/scheduled-tasks' + +/** + * @public + */ +export const skillsHelpUrl = 'https://docs.browseros.com/features/skills' + +/** + * @public + */ +export const connectAppsHelpUrl = + 'https://docs.browseros.com/features/connect-mcps' + +/** + * @public + */ +export const memoryHelpUrl = 'https://docs.browseros.com/features/memory' + +/** + * @public + */ +export const soulHelpUrl = 'https://docs.browseros.com/features/soul' + +/** + * @public + */ +export const bringYourOwnLlmHelpUrl = + 'https://docs.browseros.com/features/bring-your-own-llm' + +/** + * @public + */ +export const llmChatHubHelpUrl = + 'https://docs.browseros.com/features/llm-chat-hub' + +/** + * @public + */ +export const mcpClientsHelpUrl = + 'https://docs.browseros.com/features/use-with-claude-code'