Fix/UI Cursor pointer on docs

apps/docs/components/docs-layout/sidebar-components.tsx

@@ -84,7 +84,7 @@ export function SidebarFolder({
         <button
           onClick={() => setOpen(!open)}
           className={cn(
-            'flex w-full items-center justify-between rounded-md px-2.5 py-1.5 text-left font-medium text-[13px] leading-tight transition-colors',
+            'cursor-pointer flex w-full items-center justify-between rounded-md px-2.5 py-1.5 text-left font-medium text-[13px] leading-tight transition-colors',
             'hover:bg-gray-100/60 dark:hover:bg-gray-800/40',
             'text-gray-800 dark:text-gray-200'
           )}

apps/docs/components/ui/language-dropdown.tsx

@@ -82,7 +82,7 @@ export function LanguageDropdown() {
         aria-haspopup='listbox'
         aria-expanded={isOpen}
         aria-controls='language-menu'
-        className='flex items-center gap-1.5 rounded-xl px-3 py-2 font-normal text-[0.9375rem] text-foreground/60 leading-[1.4] transition-colors hover:bg-foreground/8 hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring'
+        className='cursor-pointer flex items-center gap-1.5 rounded-xl px-3 py-2 font-normal text-[0.9375rem] text-foreground/60 leading-[1.4] transition-colors hover:bg-foreground/8 hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring'
         style={{
           fontFamily:
             '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',
@@ -110,7 +110,7 @@ export function LanguageDropdown() {
                 }}
                 role='option'
                 aria-selected={currentLang === code}
-                className={`flex w-full items-center gap-3 px-3 py-3 text-base transition-colors first:rounded-t-xl last:rounded-b-xl hover:bg-muted/80 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring md:gap-2 md:px-2.5 md:py-2 md:text-sm ${
+                className={`cursor-pointer flex w-full items-center gap-3 px-3 py-3 text-base transition-colors first:rounded-t-xl last:rounded-b-xl hover:bg-muted/80 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring md:gap-2 md:px-2.5 md:py-2 md:text-sm ${
                   currentLang === code ? 'bg-muted/60 font-medium text-primary' : 'text-foreground'
                 }`}
               >

apps/docs/components/ui/theme-toggle.tsx

@@ -23,7 +23,7 @@ export function ThemeToggle() {
   return (
     <button
       onClick={() => setTheme(theme === 'dark' ? 'light' : 'dark')}
-      className='flex items-center justify-center rounded-md p-1 text-muted-foreground transition-colors hover:text-foreground'
+      className='flex items-center cursor-pointer justify-center rounded-md p-1 text-muted-foreground transition-colors hover:text-foreground'
       aria-label='Toggle theme'
     >
       {theme === 'dark' ? <Moon className='h-4 w-4' /> : <Sun className='h-4 w-4' />}

apps/sim/app/globals.css

@@ -11,7 +11,7 @@
   --panel-width: 244px;
   --toolbar-triggers-height: 300px;
   --editor-connections-height: 200px;
-  --terminal-height: 145px;
+  --terminal-height: 196px;
 }
 
 .sidebar-container {

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/chat/chat.tsx

@@ -569,7 +569,7 @@ export function Chat() {
 
   return (
     <div
-      className='fixed z-30 flex flex-col overflow-hidden rounded-[6px] bg-[var(--surface-1)] px-[10px] pt-[2px] pb-[8px]'
+      className='fixed z-30 flex flex-col overflow-hidden rounded-[6px] border border-[var(--border)] bg-[var(--surface-1)] px-[10px] pt-[2px] pb-[8px]'
       style={{
         left: `${actualPosition.x}px`,
         top: `${actualPosition.y}px`,
@@ -619,6 +619,7 @@ export function Chat() {
               side='bottom'
               align='end'
               sideOffset={8}
+              maxHeight={100}
               style={{ width: '110px', minWidth: '110px' }}
             >
               <PopoverScrollArea>

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/chat/components/output-select/output-select.tsx

@@ -288,36 +288,41 @@ export function OutputSelect({
       <PopoverContent
         ref={popoverRef}
         side='bottom'
-        align='start'
+        align='end'
         sideOffset={4}
-        maxHeight={280}
+        maxHeight={140}
+        maxWidth={140}
+        minWidth={140}
         onOpenAutoFocus={(e) => e.preventDefault()}
         onCloseAutoFocus={(e) => e.preventDefault()}
       >
         <PopoverScrollArea className='space-y-[2px]'>
           {Object.entries(groupedOutputs).map(([blockName, outputs]) => (
             <div key={blockName}>
               <PopoverSection>{blockName}</PopoverSection>
-              {outputs.map((output) => (
-                <PopoverItem
-                  key={output.id}
-                  active={isSelectedValue(output)}
-                  onClick={() => handleOutputSelection(output.label)}
-                >
-                  <div
-                    className='flex h-[14px] w-[14px] flex-shrink-0 items-center justify-center rounded'
-                    style={{
-                      backgroundColor: getOutputColor(output.blockId, output.blockType),
-                    }}
+
+              <div className='flex flex-col gap-[2px]'>
+                {outputs.map((output) => (
+                  <PopoverItem
+                    key={output.id}
+                    active={isSelectedValue(output)}
+                    onClick={() => handleOutputSelection(output.label)}
                   >
-                    <span className='font-bold text-[10px] text-white'>
-                      {blockName.charAt(0).toUpperCase()}
-                    </span>
-                  </div>
-                  <span className='min-w-0 flex-1 truncate'>{output.path}</span>
-                  {isSelectedValue(output) && <Check className='h-3 w-3 flex-shrink-0' />}
-                </PopoverItem>
-              ))}
+                    <div
+                      className='flex h-[14px] w-[14px] flex-shrink-0 items-center justify-center rounded'
+                      style={{
+                        backgroundColor: getOutputColor(output.blockId, output.blockType),
+                      }}
+                    >
+                      <span className='font-bold text-[10px] text-white'>
+                        {blockName.charAt(0).toUpperCase()}
+                      </span>
+                    </div>
+                    <span className='min-w-0 flex-1 truncate'>{output.path}</span>
+                    {isSelectedValue(output) && <Check className='h-3 w-3 flex-shrink-0' />}
+                  </PopoverItem>
+                ))}
+              </div>
             </div>
           ))}
         </PopoverScrollArea>

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/terminal/terminal.tsx

@@ -42,7 +42,7 @@ import { useOutputPanelResize, useTerminalFilters, useTerminalResize } from './h
  */
 const MIN_HEIGHT = 30
 const NEAR_MIN_THRESHOLD = 40
-const DEFAULT_EXPANDED_HEIGHT = 300
+const DEFAULT_EXPANDED_HEIGHT = 196
 
 /**
  * Column width constants - numeric values for calculations

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/hooks/use-child-deployment.ts

@@ -35,19 +35,12 @@ export function useChildDeployment(childWorkflowId: string | undefined): UseChil
     try {
       setIsLoading(true)
 
-      // Fetch both deployment versions and workflow metadata in parallel
-      const [deploymentsRes, workflowRes] = await Promise.all([
-        fetch(`/api/workflows/${wfId}/deployments`, {
-          cache: 'no-store',
-          headers: { 'Cache-Control': 'no-cache' },
-        }),
-        fetch(`/api/workflows/${wfId}`, {
-          cache: 'no-store',
-          headers: { 'Cache-Control': 'no-cache' },
-        }),
-      ])
+      const statusRes = await fetch(`/api/workflows/${wfId}/status`, {
+        cache: 'no-store',
+        headers: { 'Cache-Control': 'no-cache' },
+      })
 
-      if (!deploymentsRes.ok || !workflowRes.ok) {
+      if (!statusRes.ok) {
         if (!cancelled) {
           setActiveVersion(null)
           setIsDeployed(null)
@@ -56,32 +49,30 @@ export function useChildDeployment(childWorkflowId: string | undefined): UseChil
         return
       }
 
-      const deploymentsJson = await deploymentsRes.json()
-      const workflowJson = await workflowRes.json()
+      const statusData = await statusRes.json()
 
-      const versions = Array.isArray(deploymentsJson?.data?.versions)
-        ? deploymentsJson.data.versions
-        : Array.isArray(deploymentsJson?.versions)
-          ? deploymentsJson.versions
-          : []
+      const deploymentsRes = await fetch(`/api/workflows/${wfId}/deployments`, {
+        cache: 'no-store',
+        headers: { 'Cache-Control': 'no-cache' },
+      })
 
-      const active = versions.find((v: any) => v.isActive)
-      const workflowUpdatedAt = workflowJson?.data?.updatedAt || workflowJson?.updatedAt
+      let activeVersion = null
+      if (deploymentsRes.ok) {
+        const deploymentsJson = await deploymentsRes.json()
+        const versions = Array.isArray(deploymentsJson?.data?.versions)
+          ? deploymentsJson.data.versions
+          : Array.isArray(deploymentsJson?.versions)
+            ? deploymentsJson.versions
+            : []
 
-      if (!cancelled) {
-        const v = active ? Number(active.version) : null
-        const deployed = v != null
-        setActiveVersion(v)
-        setIsDeployed(deployed)
+        const active = versions.find((v: any) => v.isActive)
+        activeVersion = active ? Number(active.version) : null
+      }
 
-        // Check if workflow has been updated since deployment
-        if (deployed && active?.createdAt && workflowUpdatedAt) {
-          const deploymentTime = new Date(active.createdAt).getTime()
-          const updateTime = new Date(workflowUpdatedAt).getTime()
-          setNeedsRedeploy(updateTime > deploymentTime)
-        } else {
-          setNeedsRedeploy(false)
-        }
+      if (!cancelled) {
+        setActiveVersion(activeVersion)
+        setIsDeployed(statusData.isDeployed || false)
+        setNeedsRedeploy(statusData.needsRedeployment || false)
       }
     } catch {
       if (!cancelled) {

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/workflow-block.tsx

@@ -1,6 +1,6 @@
 import { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { useParams } from 'next/navigation'
-import { Handle, type NodeProps, Position } from 'reactflow'
+import { Handle, type NodeProps, Position, useUpdateNodeInternals } from 'reactflow'
 import { Badge } from '@/components/emcn/components/badge/badge'
 import { Tooltip } from '@/components/emcn/components/tooltip/tooltip'
 import { getEnv, isTruthy } from '@/lib/env'
@@ -689,6 +689,16 @@ export const WorkflowBlock = memo(function WorkflowBlock({
     ],
   })
 
+  /**
+   * Notify React Flow when handle orientation changes so it can recalculate edge paths.
+   * This is necessary because toggling handles doesn't change block dimensions,
+   * so useBlockDimensions won't trigger updateNodeInternals.
+   */
+  const updateNodeInternals = useUpdateNodeInternals()
+  useEffect(() => {
+    updateNodeInternals(id)
+  }, [horizontalHandles, id, updateNodeInternals])
+
   const showWebhookIndicator = (isStarterBlock || isWebhookTriggerBlock) && isWebhookConfigured
   const shouldShowScheduleBadge =
     type === 'schedule' && !isLoadingScheduleInfo && scheduleInfo !== null

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/search-modal/search-modal.tsx

@@ -331,16 +331,35 @@ export function SearchModal({
     return items
   }, [workspaces, workflows, pages, blocks, triggers, tools, docs])
 
-  // Filter items based on search query
-  const filteredItems = useMemo(() => {
-    if (!searchQuery.trim()) return allItems
+  const sectionOrder = useMemo<SearchItem['type'][]>(
+    () => ['workspace', 'workflow', 'page', 'tool', 'trigger', 'block', 'doc'],
+    []
+  )
 
-    const query = searchQuery.toLowerCase()
-    return allItems.filter(
-      (item) =>
-        item.name.toLowerCase().includes(query) || item.description?.toLowerCase().includes(query)
+  // Filter items based on search query and enforce section ordering
+  const filteredItems = useMemo(() => {
+    const orderMap = sectionOrder.reduce<Record<SearchItem['type'], number>>(
+      (acc, type, index) => {
+        acc[type] = index
+        return acc
+      },
+      {} as Record<SearchItem['type'], number>
     )
-  }, [allItems, searchQuery])
+
+    const baseItems = !searchQuery.trim()
+      ? allItems
+      : allItems.filter(
+          (item) =>
+            item.name.toLowerCase().includes(searchQuery.toLowerCase()) ||
+            item.description?.toLowerCase().includes(searchQuery.toLowerCase())
+        )
+
+    return [...baseItems].sort((a, b) => {
+      const aOrder = orderMap[a.type] ?? Number.MAX_SAFE_INTEGER
+      const bOrder = orderMap[b.type] ?? Number.MAX_SAFE_INTEGER
+      return aOrder - bOrder
+    })
+  }, [allItems, searchQuery, sectionOrder])
 
   // Reset selected index when filtered items change
   useEffect(() => {
@@ -469,7 +488,7 @@ export function SearchModal({
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogPortal>
         <DialogOverlay
-          className='bg-white/80 dark:bg-[#1b1b1b]/90'
+          className='z-40 bg-white/80 dark:bg-[#1b1b1b]/90'
           style={{ backdropFilter: 'blur(4px)' }}
         />
         <DialogPrimitive.Content className='fixed top-[15%] left-[50%] z-50 flex w-[500px] translate-x-[-50%] flex-col gap-[12px] p-0 focus:outline-none focus-visible:outline-none'>
@@ -493,7 +512,8 @@ export function SearchModal({
           {/* Floating results container */}
           {filteredItems.length > 0 ? (
             <div className='scrollbar-thin scrollbar-thumb-border scrollbar-track-transparent max-h-[400px] overflow-y-auto rounded-[10px] py-[10px] shadow-sm'>
-              {Object.entries(groupedItems).map(([type, items]) => {
+              {sectionOrder.map((type) => {
+                const items = groupedItems[type] || []
                 if (items.length === 0) return null
 
                 return (

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/settings-modal/components/subscription/subscription.tsx

@@ -670,7 +670,7 @@ export function Subscription({ onOpenChange }: SubscriptionProps) {
                 <SelectTrigger className='h-8 w-[200px] justify-between text-left text-xs'>
                   <SelectValue placeholder='Select admin' />
                 </SelectTrigger>
-                <SelectContent align='start'>
+                <SelectContent align='start' className='z-50'>
                   <SelectGroup>
                     <SelectLabel className='px-3 py-1 text-[11px] text-muted-foreground uppercase'>
                       Workspace admins

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components-new/usage-indicator/usage-indicator.tsx

@@ -62,11 +62,14 @@ export function UsageIndicator({ onClick }: UsageIndicatorProps) {
 
   if (isLoading) {
     return (
-      <div className='flex flex-shrink-0 flex-col gap-[10px] border-t px-[13.5px] pt-[10px] pb-[8px] dark:border-[var(--border)]'>
+      <div className='flex flex-shrink-0 flex-col gap-[8px] border-t pt-[12px] pr-[13.5px] pb-[10px] pl-[12px] dark:border-[var(--border)]'>
         {/* Top row skeleton */}
         <div className='flex items-center justify-between'>
-          <Skeleton className='h-[16px] w-[120px] rounded-[4px]' />
-          <Skeleton className='h-[16px] w-[50px] rounded-[4px]' />
+          <div className='flex items-center gap-[6px]'>
+            <Skeleton className='h-[14px] w-[40px] rounded-[4px]' />
+            <Skeleton className='h-[14px] w-[70px] rounded-[4px]' />
+          </div>
+          <Skeleton className='h-[12px] w-[50px] rounded-[4px]' />
         </div>
 
         {/* Pills skeleton */}
@@ -121,25 +124,25 @@ export function UsageIndicator({ onClick }: UsageIndicatorProps) {
   }
 
   return (
-    <div className='flex flex-shrink-0 flex-col gap-[10px] border-t px-[13.5px] pt-[8px] pb-[8px] dark:border-[var(--border)]'>
+    <div className='flex flex-shrink-0 flex-col gap-[8px] border-t px-[13.5px] pt-[8px] pb-[10px] dark:border-[var(--border)]'>
       {/* Top row */}
       <div className='flex items-center justify-between'>
         <div className='flex items-center gap-[6px]'>
           <span className='font-medium text-[#FFFFFF] text-[12px]'>{PLAN_NAMES[planType]}</span>
-          <div className='h-[14px] w-[1.5px] bg-[#4A4A4A]' />
+          <div className='h-[14px] w-[1.5px] bg-[var(--divider)]' />
           <div className='flex items-center gap-[4px]'>
             {isBlocked ? (
               <>
-                <span className='font-medium text-[#B1B1B1] text-[12px]'>Over</span>
-                <span className='font-medium text-[#B1B1B1] text-[12px]'>limit</span>
+                <span className='font-medium text-[12px] text-[var(--text-tertiary)]'>Over</span>
+                <span className='font-medium text-[12px] text-[var(--text-tertiary)]'>limit</span>
               </>
             ) : (
               <>
-                <span className='font-medium text-[#B1B1B1] text-[12px] tabular-nums'>
+                <span className='font-medium text-[12px] text-[var(--text-tertiary)] tabular-nums'>
                   ${usage.current.toFixed(2)}
                 </span>
-                <span className='font-medium text-[#B1B1B1] text-[12px]'>/</span>
-                <span className='font-medium text-[#B1B1B1] text-[12px] tabular-nums'>
+                <span className='font-medium text-[12px] text-[var(--text-tertiary)]'>/</span>
+                <span className='font-medium text-[12px] text-[var(--text-tertiary)] tabular-nums'>
                   ${usage.limit}
                 </span>
               </>
@@ -149,7 +152,7 @@ export function UsageIndicator({ onClick }: UsageIndicatorProps) {
         {showUpgradeButton && (
           <Button
             variant='ghost'
-            className='!h-auto !px-1 !py-0 -mx-1 mt-[-2px] text-[#D4D4D4]'
+            className='!h-auto !px-1 !py-0 -mx-1 mt-[-2px] text-[var(--text-secondary)]'
             onClick={handleClick}
           >
             Upgrade

apps/sim/blocks/blocks/function.ts

@@ -33,6 +33,7 @@ export const FunctionBlock: BlockConfig<CodeExecutionOutput> = {
     },
     {
       id: 'code',
+      title: 'Code',
       type: 'code',
       wandConfig: {
         enabled: true,