feat: add auto-discover tooltip for project actions and changed icon

Shows a tooltip explaining auto-discover behavior
Updates auto-discover action icons to use scan-2
Adds translated tooltip text for supported locales

packages/ui/src/components/layout/ProjectActionsButton.tsx

@@ -260,7 +260,7 @@ export const ProjectActionsButton = ({
     id: AUTO_DISCOVER_ACTION_ID,
     name: t('projectActions.actions.autoDiscover'),
     command: '',
-    icon: 'search',
+    icon: 'scan-2',
     autoOpenUrl: true,
   }), [t]);
 
@@ -450,7 +450,7 @@ export const ProjectActionsButton = ({
             id: AUTO_DISCOVER_ACTION_ID,
             name: t('projectActions.actions.autoDiscover'),
             command: devServer.command,
-            icon: 'search',
+            icon: 'scan-2',
             autoOpenUrl: true,
             openUrl: devServer.previewUrlHint || '',
           };
@@ -727,7 +727,7 @@ export const ProjectActionsButton = ({
 
   const selectedIconKey = (resolvedSelected.icon || 'play') as keyof typeof PROJECT_ACTION_ICON_MAP;
   const selectedIconName = resolvedSelected.id === AUTO_DISCOVER_ACTION_ID
-    ? 'search'
+    ? 'scan-2'
     : PROJECT_ACTION_ICON_MAP[selectedIconKey] || 'play';
   const selectedRunKey = toProjectActionRunKey(normalizedDirectory, resolvedSelected.id);
   const selectedRunning = projectActionRuns[selectedRunKey];
@@ -740,31 +740,39 @@ export const ProjectActionsButton = ({
     }
     openContextPreview(selectedRunning.directory, selectedRunPreviewUrl);
   };
+  const isAutoDiscoverSelected = resolvedSelected.id === AUTO_DISCOVER_ACTION_ID;
 
   if (compact) {
     return (
       <div className="inline-flex items-center">
-        <button
+        <Tooltip>
-          type="button"
+          <TooltipTrigger asChild>
-          disabled={isLoading || isStoppingSelected}
+            <button
-          className={cn(
+              type="button"
-            'app-region-no-drag inline-flex h-9 w-9 items-center justify-center rounded-[10px] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[50px] p-2',
+              disabled={isLoading || isStoppingSelected}
-            'typography-ui-label font-medium text-muted-foreground hover:bg-interactive-hover hover:text-foreground transition-colors',
+              className={cn(
-            'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary',
+                'app-region-no-drag inline-flex h-9 w-9 items-center justify-center rounded-[10px] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[50px] p-2',
-            'disabled:cursor-not-allowed',
+                'typography-ui-label font-medium text-muted-foreground hover:bg-interactive-hover hover:text-foreground transition-colors',
-            className
+                'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary',
-          )}
+                'disabled:cursor-not-allowed',
-          onClick={handlePrimaryClick}
+                className
-          aria-label={selectedRunning
+              )}
-            ? t('projectActions.actions.stopNamedAria', { name: resolvedSelected.name })
+              onClick={handlePrimaryClick}
-            : t('projectActions.actions.runNamedAria', { name: resolvedSelected.name })}
+              aria-label={selectedRunning
-        >
+                ? t('projectActions.actions.stopNamedAria', { name: resolvedSelected.name })
-          {isStoppingSelected || isWaitingForSelectedPreview
+                : t('projectActions.actions.runNamedAria', { name: resolvedSelected.name })}
-            ? <Icon name="loader-4" className="h-5 w-5 animate-spin text-[var(--status-warning)]" />
+            >
-            : selectedRunning
+              {isStoppingSelected || isWaitingForSelectedPreview
-              ? <Icon name="stop" className="h-5 w-5 text-[var(--status-warning)]" />
+                ? <Icon name="loader-4" className="h-5 w-5 animate-spin text-[var(--status-warning)]" />
-              : <Icon name={selectedIconName} className="h-5 w-5" />}
+                : selectedRunning
-        </button>
+                  ? <Icon name="stop" className="h-5 w-5 text-[var(--status-warning)]" />
+                  : <Icon name={selectedIconName} className="h-5 w-5" />}
+            </button>
+          </TooltipTrigger>
+          {isAutoDiscoverSelected ? (
+            <TooltipContent sideOffset={6}>{t('projectActions.actions.autoDiscoverTooltip')}</TooltipContent>
+          ) : null}
+        </Tooltip>
         {showSelectedPreviewButton ? (
           <Tooltip>
             <TooltipTrigger asChild>
@@ -799,7 +807,7 @@ export const ProjectActionsButton = ({
             {displayActions.map((entry) => {
               const iconKey = (entry.icon || 'play') as keyof typeof PROJECT_ACTION_ICON_MAP;
               const iconName = entry.id === AUTO_DISCOVER_ACTION_ID
-                ? 'search'
+                ? 'scan-2'
                 : PROJECT_ACTION_ICON_MAP[iconKey] || 'play';
               const runKey = toProjectActionRunKey(normalizedDirectory, entry.id);
               const runState = projectActionRuns[runKey];
@@ -840,27 +848,34 @@ export const ProjectActionsButton = ({
         className
       )}
     >
-      <button
+      <Tooltip>
-        type="button"
+        <TooltipTrigger asChild>
-        onClick={handlePrimaryClick}
+          <button
-        disabled={isLoading || isStoppingSelected}
+            type="button"
-        className={cn(
+            onClick={handlePrimaryClick}
-          'inline-flex h-full items-center justify-center typography-ui-label font-medium text-foreground hover:bg-interactive-hover',
+            disabled={isLoading || isStoppingSelected}
-          compact ? 'w-9 px-0' : 'px-2.5',
+            className={cn(
-          'transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary disabled:cursor-not-allowed'
+              'inline-flex h-full items-center justify-center typography-ui-label font-medium text-foreground hover:bg-interactive-hover',
-        )}
+              compact ? 'w-9 px-0' : 'px-2.5',
-        aria-label={selectedRunning
+              'transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary disabled:cursor-not-allowed'
-          ? t('projectActions.actions.stopNamedAria', { name: resolvedSelected.name })
+            )}
-          : t('projectActions.actions.runNamedAria', { name: resolvedSelected.name })}
+            aria-label={selectedRunning
-      >
+              ? t('projectActions.actions.stopNamedAria', { name: resolvedSelected.name })
-        <span className="inline-flex h-4 w-4 shrink-0 items-center justify-center">
+              : t('projectActions.actions.runNamedAria', { name: resolvedSelected.name })}
-          {isStoppingSelected || isWaitingForSelectedPreview
+          >
-            ? <Icon name="loader-4" className="h-4 w-4 animate-spin text-[var(--status-warning)]" />
+            <span className="inline-flex h-4 w-4 shrink-0 items-center justify-center">
-            : selectedRunning
+              {isStoppingSelected || isWaitingForSelectedPreview
-              ? <Icon name="stop" className="h-4 w-4 text-[var(--status-warning)]" />
+                ? <Icon name="loader-4" className="h-4 w-4 animate-spin text-[var(--status-warning)]" />
-              : <Icon name={selectedIconName} className="h-4 w-4" />}
+                : selectedRunning
-        </span>
+                  ? <Icon name="stop" className="h-4 w-4 text-[var(--status-warning)]" />
-      </button>
+                  : <Icon name={selectedIconName} className="h-4 w-4" />}
+            </span>
+          </button>
+        </TooltipTrigger>
+        {isAutoDiscoverSelected ? (
+          <TooltipContent sideOffset={6}>{t('projectActions.actions.autoDiscoverTooltip')}</TooltipContent>
+        ) : null}
+      </Tooltip>
 
       {showSelectedPreviewButton ? (
         <Tooltip>
@@ -905,7 +920,7 @@ export const ProjectActionsButton = ({
           {displayActions.map((entry) => {
             const iconKey = (entry.icon || 'play') as keyof typeof PROJECT_ACTION_ICON_MAP;
             const iconName = entry.id === AUTO_DISCOVER_ACTION_ID
-              ? 'search'
+              ? 'scan-2'
               : PROJECT_ACTION_ICON_MAP[iconKey] || 'play';
             const runKey = toProjectActionRunKey(normalizedDirectory, entry.id);
             const runState = projectActionRuns[runKey];

packages/ui/src/lib/i18n/messages/en.ts

@@ -2354,6 +2354,7 @@ export const dict = {
   'projectActions.actions.addAction': 'Add action',
   'projectActions.actions.addNewAction': 'Add new action',
   'projectActions.actions.autoDiscover': 'Auto-discover',
+  'projectActions.actions.autoDiscoverTooltip': 'Automatically discover and run the development server',
   'projectActions.actions.chooseActionAria': 'Choose project action',
   'projectActions.actions.openPreview': 'Open Preview',
   'projectActions.actions.runNamedAria': 'Run {name}',

packages/ui/src/lib/i18n/messages/es.ts

@@ -2320,6 +2320,7 @@ export const dict: Record<I18nKey, string> = {
   "projectActions.actions.addAction": "Añadir acción",
   "projectActions.actions.addNewAction": "Añadir nueva acción",
   "projectActions.actions.autoDiscover": "Autodetectar",
+  "projectActions.actions.autoDiscoverTooltip": "Detecta y ejecuta automáticamente el servidor de desarrollo",
   "projectActions.actions.chooseActionAria": "Elegir acción del proyecto",
   "projectActions.actions.openPreview": "Abrir Preview",
   "projectActions.actions.runNamedAria": "Ejecutar {name}",

packages/ui/src/lib/i18n/messages/fr.ts

@@ -2123,6 +2123,7 @@ export const dict = {
   'projectActions.actions.addAction': 'Ajouter une action',
   'projectActions.actions.addNewAction': 'Ajouter une nouvelle action',
   'projectActions.actions.autoDiscover': 'Découverte automatique',
+  'projectActions.actions.autoDiscoverTooltip': 'Détecte et lance automatiquement le serveur de développement',
   'projectActions.actions.chooseActionAria': 'Choisir l\'action du projet',
   'projectActions.actions.openPreview': 'Ouvrir l\'aperçu',
   'projectActions.actions.runNamedAria': 'Exécutez {name}',

packages/ui/src/lib/i18n/messages/ja.ts

@@ -2353,6 +2353,7 @@ export const dict: Record<I18nKey, string> = {
   'projectActions.actions.addAction': 'アクションを追加',
   'projectActions.actions.addNewAction': '新しいアクションを追加',
   'projectActions.actions.autoDiscover': '自動検出',
+  'projectActions.actions.autoDiscoverTooltip': '開発サーバーを自動的に検出して実行します',
   'projectActions.actions.chooseActionAria': 'プロジェクトアクションを選択',
   'projectActions.actions.openPreview': 'プレビューを開く',
   'projectActions.actions.runNamedAria': '{name}を実行',

packages/ui/src/lib/i18n/messages/ko.ts

@@ -2354,6 +2354,7 @@ export const dict: Record<I18nKey, string> = {
   'projectActions.actions.addAction': '작업 추가',
   'projectActions.actions.addNewAction': '새 작업 추가',
   'projectActions.actions.autoDiscover': '자동 검색',
+  'projectActions.actions.autoDiscoverTooltip': '개발 서버를 자동으로 검색하고 실행합니다',
   'projectActions.actions.chooseActionAria': '프로젝트 작업 선택',
   'projectActions.actions.openPreview': '미리보기 열기',
   'projectActions.actions.runNamedAria': '실행 {name}',

packages/ui/src/lib/i18n/messages/pl.ts

@@ -2329,6 +2329,7 @@ export const dict: Record<I18nKey, string> = {
   'projectActions.actions.addActionAria': 'Dodaj akcję',
   'projectActions.actions.addNewAction': 'Dodaj nową akcję',
   'projectActions.actions.autoDiscover': 'Wykryj automatycznie',
+  'projectActions.actions.autoDiscoverTooltip': 'Automatycznie wykrywa i uruchamia serwer deweloperski',
   'projectActions.actions.chooseActionAria': 'Wybierz akcję projektu',
   'projectActions.actions.openPreview': 'Otwórz podgląd',
   'projectActions.actions.runNamedAria': 'Uruchom {name}',

packages/ui/src/lib/i18n/messages/pt-BR.ts

@@ -2320,6 +2320,7 @@ export const dict: Record<I18nKey, string> = {
   "projectActions.actions.addAction": "Adicionar ação",
   "projectActions.actions.addNewAction": "Adicionar nova ação",
   "projectActions.actions.autoDiscover": "Detectar automaticamente",
+  "projectActions.actions.autoDiscoverTooltip": "Detecta e executa automaticamente o servidor de desenvolvimento",
   "projectActions.actions.chooseActionAria": "Escolher ação do projeto",
   "projectActions.actions.openPreview": "Abrir Preview",
   "projectActions.actions.runNamedAria": "Executar {name}",

packages/ui/src/lib/i18n/messages/uk.ts

@@ -2320,6 +2320,7 @@ export const dict: Record<I18nKey, string> = {
   "projectActions.actions.addAction": "Додати дію",
   "projectActions.actions.addNewAction": "Додати нову дію",
   "projectActions.actions.autoDiscover": "Автовиявлення",
+  "projectActions.actions.autoDiscoverTooltip": "Автоматично знаходить і запускає сервер розробки",
   "projectActions.actions.chooseActionAria": "Вибрати дію проєкту",
   "projectActions.actions.openPreview": "Відкрити Preview",
   "projectActions.actions.runNamedAria": "Запустити {name}",

packages/ui/src/lib/i18n/messages/zh-CN.ts

@@ -2320,6 +2320,7 @@ export const dict: Record<I18nKey, string> = {
   'projectActions.actions.addAction': '添加操作',
   'projectActions.actions.addNewAction': '添加新操作',
   'projectActions.actions.autoDiscover': '自动发现',
+  'projectActions.actions.autoDiscoverTooltip': '自动发现并运行开发服务器',
   'projectActions.actions.chooseActionAria': '选择项目操作',
   'projectActions.actions.openPreview': '打开 Preview',
   'projectActions.actions.runNamedAria': '运行 {name}',

packages/ui/src/lib/i18n/messages/zh-TW.ts

@@ -2324,6 +2324,7 @@ export const dict: Record<I18nKey, string> = {
   'projectActions.actions.addAction': '新增操作',
   'projectActions.actions.addNewAction': '新增新操作',
   'projectActions.actions.autoDiscover': '自動發現',
+  'projectActions.actions.autoDiscoverTooltip': '自動探索並執行開發伺服器',
   'projectActions.actions.chooseActionAria': '選擇專案操作',
   'projectActions.actions.openPreview': '開啟預覽',
   'projectActions.actions.runNamedAria': '執行 {name}',