improvement(search): align cmd+k action icons + highlight with the design system (#5114)

* improvement(search): align cmd+k action icons + highlight with the design system

- Each Actions verb now uses the exact icon from its real location: Fit to view
  -> Scan (workflow-controls), Copy workflow link -> Duplicate (nav context menu),
  Invite teammates -> User (settings teammates nav). Run/Create/Import already matched.
- Remove the Toggle theme action and its now-dead useTheme wiring.
- Matched-text highlight now uses the design-system search tokens
  (--highlight-match-bg / --highlight-match-text), matching the SearchHighlight
  component used in knowledge-base and code search, instead of an ad-hoc font-semibold.

* improvement(search): use font-medium for matched-text emphasis in cmd+k

Drop the colored background highlight in favor of the design system's standard
emphasis weight (font-medium, used by Button/Label/Input/Table). Lighter than
the previous semibold and avoids a background, keeping the palette's clean,
undecorated text style.

Author: waleedlatif1

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

@@ -42,7 +42,7 @@ export const HighlightedText = memo(
       <>
         {buildSegments(text, positions).map((segment, index) =>
           segment.hit ? (
-            <span key={index} className='font-semibold text-[var(--text-body)]'>
+            <span key={index} className='font-medium'>
               {segment.text}
             </span>
           ) : (

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

@@ -3,28 +3,26 @@
 import { useCallback, useDeferredValue, useEffect, useMemo, useRef, useState } from 'react'
 import { createLogger } from '@sim/logger'
 import { Command } from 'cmdk'
+import { Scan } from 'lucide-react'
 import { useParams, useRouter } from 'next/navigation'
-import { useTheme } from 'next-themes'
 import { usePostHog } from 'posthog-js/react'
 import { createPortal } from 'react-dom'
 import { Library } from '@/components/emcn'
 import {
   Calendar,
   Database,
-  Expand,
+  Duplicate,
   File,
   FolderPlus,
   HelpCircle,
   Home,
   Integration,
-  Link,
-  Palette,
   Play,
   Plus,
   Settings,
   Table,
   Upload,
-  Users,
+  User,
 } from '@/components/emcn/icons'
 import { Search } from '@/components/emcn/icons/search'
 import { cn } from '@/lib/core/utils/cn'
@@ -102,7 +100,6 @@ export function SearchModal({
   const [mounted, setMounted] = useState(false)
   const { navigateToSettings } = useSettingsNavigation()
   const { config: permissionConfig } = usePermissionConfig()
-  const { resolvedTheme, setTheme } = useTheme()
   const invokeCommand = useInvokeGlobalCommand()
   const posthog = usePostHog()
 
@@ -201,7 +198,8 @@ export function SearchModal({
 
   /**
    * Verbs the palette can run directly. Entity navigation lives in the groups
-   * below; this list is for "do something" intents (create, import, toggle).
+   * below; this list is for "do something" intents (run, create, import, copy,
+   * invite).
    */
   const actions = useMemo((): ActionItem[] => {
     const list: ActionItem[] = []
@@ -248,7 +246,7 @@ export function SearchModal({
       id: 'fit-to-view',
       name: 'Fit workflow to view',
       keywords: 'zoom center recenter canvas reset',
-      icon: Expand,
+      icon: Scan,
       shortcut: '⌘⇧F',
       context: 'workflow',
       run: () => invokeCommand('fit-to-view'),
@@ -257,7 +255,7 @@ export function SearchModal({
       id: 'copy-workflow-url',
       name: 'Copy workflow link',
       keywords: 'url share clipboard',
-      icon: Link,
+      icon: Duplicate,
       context: 'workflow',
       run: () => {
         navigator.clipboard.writeText(window.location.href).catch((error) => {
@@ -269,18 +267,10 @@ export function SearchModal({
       id: 'invite-teammates',
       name: 'Invite teammates',
       keywords: 'members people add user organization',
-      icon: Users,
+      icon: User,
       context: 'global',
       run: () => navigateToSettings({ section: 'teammates' }),
     })
-    list.push({
-      id: 'toggle-theme',
-      name: 'Toggle theme',
-      keywords: 'dark light mode appearance color',
-      icon: Palette,
-      context: 'global',
-      run: () => setTheme(resolvedTheme === 'dark' ? 'light' : 'dark'),
-    })
     return list
   }, [
     canEdit,
@@ -289,8 +279,6 @@ export function SearchModal({
     onImportWorkflow,
     invokeCommand,
     navigateToSettings,
-    resolvedTheme,
-    setTheme,
   ])
 
   const [search, setSearch] = useState('')