feat: added help icons to workflows and schedule pages (#261)

* feat: added help icons to workflows and schedule pages

* fix: lint issue

apps/agent/entrypoints/app/scheduled-tasks/ScheduledTasksHeader.tsx

@@ -1,6 +1,13 @@
-import { CalendarClock, Plus } from 'lucide-react'
+import { CalendarClock, HelpCircle, Plus } from 'lucide-react'
 import type { FC } from 'react'
 import { Button } from '@/components/ui/button'
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from '@/components/ui/tooltip'
+import { scheduledTasksHelpUrl } from '@/lib/constants/productUrls'
 
 interface ScheduledTasksHeaderProps {
   onAddClick: () => void
@@ -16,7 +23,26 @@ export const ScheduledTasksHeader: FC<ScheduledTasksHeaderProps> = ({
           <CalendarClock className="h-6 w-6 text-[var(--accent-orange)]" />
         </div>
         <div className="flex-1">
-          <h2 className="mb-1 font-semibold text-xl">Scheduled Tasks</h2>
+          <div className="mb-1 flex items-center gap-2">
+            <h2 className="font-semibold text-xl">Scheduled Tasks</h2>
+            <TooltipProvider delayDuration={0}>
+              <Tooltip>
+                <TooltipTrigger asChild>
+                  <a
+                    href={scheduledTasksHelpUrl}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    className="rounded-full p-1 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground"
+                  >
+                    <HelpCircle className="h-4 w-4" />
+                  </a>
+                </TooltipTrigger>
+                <TooltipContent>
+                  Learn more about scheduled tasks
+                </TooltipContent>
+              </Tooltip>
+            </TooltipProvider>
+          </div>
           <p className="text-muted-foreground text-sm">
             Automate recurring browser tasks
           </p>

apps/agent/entrypoints/app/workflows/WorkflowsHeader.tsx

@@ -1,7 +1,14 @@
-import { Plus, Workflow } from 'lucide-react'
+import { HelpCircle, Plus, Workflow } from 'lucide-react'
 import type { FC } from 'react'
 import { NavLink } from 'react-router'
 import { Button } from '@/components/ui/button'
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from '@/components/ui/tooltip'
+import { workflowsHelpUrl } from '@/lib/constants/productUrls'
 
 export const WorkflowsHeader: FC = () => {
   return (
@@ -11,7 +18,24 @@ export const WorkflowsHeader: FC = () => {
           <Workflow className="h-6 w-6 text-[var(--accent-orange)]" />
         </div>
         <div className="flex-1">
-          <h2 className="mb-1 font-semibold text-xl">Workflows</h2>
+          <div className="mb-1 flex items-center gap-2">
+            <h2 className="font-semibold text-xl">Workflows</h2>
+            <TooltipProvider delayDuration={0}>
+              <Tooltip>
+                <TooltipTrigger asChild>
+                  <a
+                    href={workflowsHelpUrl}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    className="rounded-full p-1 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground"
+                  >
+                    <HelpCircle className="h-4 w-4" />
+                  </a>
+                </TooltipTrigger>
+                <TooltipContent>Learn more about workflows</TooltipContent>
+              </Tooltip>
+            </TooltipProvider>
+          </div>
           <p className="text-muted-foreground text-sm">
             Create and manage browser automation workflows
           </p>

apps/agent/entrypoints/sidepanel/index/useChatSession.ts

@@ -346,7 +346,7 @@ export const useChatSession = () => {
   const resetConversation = () => {
     track(CONVERSATION_RESET_EVENT, { message_count: messages.length })
     stop()
-    const oldConversationId = conversationIdRef.current
+    const _oldConversationId = conversationIdRef.current
     setConversationId(crypto.randomUUID())
     setMessages([])
     setTextToAction(new Map())

apps/agent/lib/constants/productUrls.ts

@@ -48,3 +48,13 @@ export const productVideoUrl = 'https://youtu.be/J-lFhTP-7is'
  * @public
  */
 export const productRepositoryShortUrl = 'https://git.new/browseros'
+
+/**
+ * @public
+ */
+export const workflowsHelpUrl = 'https://docs.browseros.com'
+
+/**
+ * @public
+ */
+export const scheduledTasksHelpUrl = 'https://docs.browseros.com'