improvement(preview): error paths, loops, workflow

apps/docs/app/global.css

@@ -377,6 +377,16 @@ aside[data-sidebar] > *:not([data-sidebar-viewport]) {
   button[aria-label="Toggle Sidebar"],
   button[aria-label="Collapse Sidebar"],
   /* Hide nav title/logo in sidebar on desktop - target all possible locations */
+    /* Lower specificity selectors first (attribute selectors) */
+    [data-sidebar-header],
+  [data-sidebar] [data-title],
+  aside[data-sidebar] a[href="/"],
+  aside[data-sidebar] a[href="/"] img,
+  aside[data-sidebar] > a:first-child,
+  aside[data-sidebar] > div > a:first-child,
+  aside[data-sidebar] img[alt="Sim"],
+  aside[data-sidebar] svg[aria-label="Sim"],
+  /* Higher specificity selectors (ID selectors) */
     #nd-sidebar
     a[href="/"],
   #nd-sidebar a[href="/"] img,
@@ -385,14 +395,6 @@ aside[data-sidebar] > *:not([data-sidebar-viewport]) {
   #nd-sidebar > div:first-child > a:first-child,
   #nd-sidebar img[alt="Sim"],
   #nd-sidebar svg[aria-label="Sim"],
-  aside[data-sidebar] a[href="/"],
-  aside[data-sidebar] a[href="/"] img,
-  aside[data-sidebar] > a:first-child,
-  aside[data-sidebar] > div > a:first-child,
-  aside[data-sidebar] img[alt="Sim"],
-  aside[data-sidebar] svg[aria-label="Sim"],
-  [data-sidebar-header],
-  [data-sidebar] [data-title],
   /* Hide theme toggle at bottom of sidebar on desktop */
     #nd-sidebar
     > footer,

apps/docs/content/docs/de/mcp/deploy-workflows.mdx

@@ -17,7 +17,7 @@ MCP-Server gruppieren Ihre Workflow-Tools zusammen. Erstellen und verwalten Sie
   <Video src="mcp/mcp-server.mp4" width={700} height={450} />
 </div>
 
-1. Navigieren Sie zu **Einstellungen → Bereitgestellte MCPs**
+1. Navigieren Sie zu **Einstellungen → MCP-Server**
 2. Klicken Sie auf **Server erstellen**
 3. Geben Sie einen Namen und eine optionale Beschreibung ein
 4. Kopieren Sie die Server-URL zur Verwendung in Ihren MCP-Clients
@@ -79,7 +79,7 @@ Füge deinen API-Key-Header (`X-API-Key`) für authentifizierten Zugriff hinzu,
 
 ## Server-Verwaltung
 
-In der Server-Detailansicht unter **Einstellungen → Bereitgestellte MCPs** können Sie:
+In der Server-Detailansicht unter **Einstellungen → MCP-Server** können Sie:
 
 - **Tools anzeigen**: Alle Workflows sehen, die einem Server hinzugefügt wurden
 - **URL kopieren**: Die Server-URL für MCP-Clients abrufen

apps/docs/content/docs/de/mcp/index.mdx

@@ -27,7 +27,7 @@ MCP-Server stellen Sammlungen von Tools bereit, die Ihre Agenten nutzen können.
 </div>
 
 1. Navigieren Sie zu Ihren Workspace-Einstellungen
-2. Gehen Sie zum Abschnitt **Bereitgestellte MCPs**
+2. Gehen Sie zum Abschnitt **MCP-Server**
 3. Klicken Sie auf **MCP-Server hinzufügen**
 4. Geben Sie die Server-Konfigurationsdetails ein
 5. Speichern Sie die Konfiguration

apps/docs/content/docs/en/mcp/deploy-workflows.mdx

@@ -16,7 +16,7 @@ MCP servers group your workflow tools together. Create and manage them in worksp
   <Video src="mcp/mcp-server.mp4" width={700} height={450} />
 </div>
 
-1. Navigate to **Settings → Deployed MCPs**
+1. Navigate to **Settings → MCP Servers**
 2. Click **Create Server**
 3. Enter a name and optional description
 4. Copy the server URL for use in your MCP clients
@@ -78,7 +78,7 @@ Include your API key header (`X-API-Key`) for authenticated access when using mc
 
 ## Server Management
 
-From the server detail view in **Settings → Deployed MCPs**, you can:
+From the server detail view in **Settings → MCP Servers**, you can:
 
 - **View tools**: See all workflows added to a server
 - **Copy URL**: Get the server URL for MCP clients

apps/docs/content/docs/en/mcp/index.mdx

@@ -27,7 +27,7 @@ MCP servers provide collections of tools that your agents can use. Configure the
 </div>
 
 1. Navigate to your workspace settings
-2. Go to the **Deployed MCPs** section
+2. Go to the **MCP Servers** section
 3. Click **Add MCP Server**
 4. Enter the server configuration details
 5. Save the configuration

apps/docs/content/docs/es/mcp/deploy-workflows.mdx

@@ -17,7 +17,7 @@ Los servidores MCP agrupan tus herramientas de flujo de trabajo. Créalos y gest
   <Video src="mcp/mcp-server.mp4" width={700} height={450} />
 </div>
 
-1. Navega a **Configuración → MCP implementados**
+1. Navega a **Configuración → Servidores MCP**
 2. Haz clic en **Crear servidor**
 3. Introduce un nombre y una descripción opcional
 4. Copia la URL del servidor para usarla en tus clientes MCP
@@ -79,7 +79,7 @@ Incluye tu encabezado de clave API (`X-API-Key`) para acceso autenticado al usar
 
 ## Gestión del servidor
 
-Desde la vista de detalles del servidor en **Configuración → MCP implementados**, puedes:
+Desde la vista de detalles del servidor en **Configuración → Servidores MCP**, puedes:
 
 - **Ver herramientas**: consulta todos los flujos de trabajo añadidos a un servidor
 - **Copiar URL**: obtén la URL del servidor para clientes MCP

apps/docs/content/docs/es/mcp/index.mdx

@@ -27,7 +27,7 @@ Los servidores MCP proporcionan colecciones de herramientas que tus agentes pued
 </div>
 
 1. Navega a la configuración de tu espacio de trabajo
-2. Ve a la sección **MCP implementados**
+2. Ve a la sección **Servidores MCP**
 3. Haz clic en **Añadir servidor MCP**
 4. Introduce los detalles de configuración del servidor
 5. Guarda la configuración

apps/docs/content/docs/fr/mcp/deploy-workflows.mdx

@@ -17,7 +17,7 @@ Les serveurs MCP regroupent vos outils de workflow. Créez-les et gérez-les dan
   <Video src="mcp/mcp-server.mp4" width={700} height={450} />
 </div>
 
-1. Accédez à **Paramètres → MCP déployés**
+1. Accédez à **Paramètres → Serveurs MCP**
 2. Cliquez sur **Créer un serveur**
 3. Saisissez un nom et une description facultative
 4. Copiez l'URL du serveur pour l'utiliser dans vos clients MCP
@@ -79,7 +79,7 @@ Incluez votre en-tête de clé API (`X-API-Key`) pour un accès authentifié lor
 
 ## Gestion du serveur
 
-Depuis la vue détaillée du serveur dans **Paramètres → MCP déployés**, vous pouvez :
+Depuis la vue détaillée du serveur dans **Paramètres → Serveurs MCP**, vous pouvez :
 
 - **Voir les outils** : voir tous les workflows ajoutés à un serveur
 - **Copier l'URL** : obtenir l'URL du serveur pour les clients MCP

apps/docs/content/docs/fr/mcp/index.mdx

@@ -28,7 +28,7 @@ Les serveurs MCP fournissent des collections d'outils que vos agents peuvent uti
 </div>
 
 1. Accédez aux paramètres de votre espace de travail
-2. Allez dans la section **MCP déployés**
+2. Allez dans la section **Serveurs MCP**
 3. Cliquez sur **Ajouter un serveur MCP**
 4. Saisissez les détails de configuration du serveur
 5. Enregistrez la configuration

apps/docs/content/docs/ja/mcp/deploy-workflows.mdx

@@ -16,7 +16,7 @@ MCPサーバーは、ワークフローツールをまとめてグループ化
   <Video src="mcp/mcp-server.mp4" width={700} height={450} />
 </div>
 
-1. **設定 → デプロイ済みMCP**に移動します
+1. **設定 → MCP サーバー**に移動します
 2. **サーバーを作成**をクリックします
 3. 名前とオプションの説明を入力します
 4. MCPクライアントで使用するためにサーバーURLをコピーします
@@ -78,7 +78,7 @@ mcp-remoteまたは他のHTTPベースのMCPトランスポートを使用する
 
 ## サーバー管理
 
-**設定 → デプロイ済みMCP**のサーバー詳細ビューから、次のことができます:
+**設定 → MCP サーバー**のサーバー詳細ビューから、次のことができます:
 
 - **ツールを表示**: サーバーに追加されたすべてのワークフローを確認
 - **URLをコピー**: MCPクライアント用のサーバーURLを取得

apps/docs/content/docs/ja/mcp/index.mdx

@@ -27,7 +27,7 @@ MCPサーバーはエージェントが使用できるツールのコレクシ
 </div>
 
 1. ワークスペース設定に移動します
-2. **デプロイ済みMCP**セクションに移動します
+2. **MCP サーバー**セクションに移動します
 3. **MCPサーバーを追加**をクリックします
 4. サーバー設定の詳細を入力します
 5. 設定を保存します

apps/docs/content/docs/zh/mcp/deploy-workflows.mdx

@@ -16,7 +16,7 @@ MCP 服务器用于将您的工作流工具进行分组。您可以在工作区
   <Video src="mcp/mcp-server.mp4" width={700} height={450} />
 </div>
 
-1. 进入 **设置 → 已部署的 MCPs**
+1. 进入 **设置 → MCP 服务器**
 2. 点击 **创建服务器**
 3. 输入名称和可选描述
 4. 复制服务器 URL 以在你的 MCP 客户端中使用
@@ -78,7 +78,7 @@ MCP 服务器用于将您的工作流工具进行分组。您可以在工作区
 
 ## 服务器管理
 
-在 **设置 → 已部署的 MCPs** 的服务器详情页，你可以：
+在 **设置 → MCP 服务器** 的服务器详情页，你可以：
 
 - **查看工具**：查看添加到服务器的所有工作流
 - **复制 URL**：获取 MCP 客户端的服务器 URL

apps/docs/content/docs/zh/mcp/index.mdx

@@ -27,7 +27,7 @@ MCP 服务器提供工具集合，供您的代理使用。您可以在工作区
 </div>
 
 1. 进入您的工作区设置
-2. 前往 **Deployed MCPs** 部分
+2. 前往 **MCP Servers** 部分
 3. 点击 **Add MCP Server**
 4. 输入服务器配置信息
 5. 保存配置

apps/sim/app/templates/[id]/template.tsx

@@ -36,7 +36,7 @@ import { useSession } from '@/lib/auth/auth-client'
 import { cn } from '@/lib/core/utils/cn'
 import { getBaseUrl } from '@/lib/core/utils/urls'
 import type { CredentialRequirement } from '@/lib/workflows/credentials/credential-extractor'
-import { WorkflowPreview } from '@/app/workspace/[workspaceId]/w/components/preview'
+import { PreviewWorkflow } from '@/app/workspace/[workspaceId]/w/components/preview'
 import { getBlock } from '@/blocks/registry'
 import { useStarTemplate, useTemplate } from '@/hooks/queries/templates'
 
@@ -330,7 +330,7 @@ export default function TemplateDetails({ isWorkspaceContext = false }: Template
 
     try {
       return (
-        <WorkflowPreview
+        <PreviewWorkflow
           workflowState={template.state}
           height='100%'
           width='100%'

apps/sim/app/templates/components/template-card.tsx

@@ -4,7 +4,7 @@ import { Star, User } from 'lucide-react'
 import { useParams, useRouter } from 'next/navigation'
 import { VerifiedBadge } from '@/components/ui/verified-badge'
 import { cn } from '@/lib/core/utils/cn'
-import { WorkflowPreview } from '@/app/workspace/[workspaceId]/w/components/preview'
+import { PreviewWorkflow } from '@/app/workspace/[workspaceId]/w/components/preview'
 import { getBlock } from '@/blocks/registry'
 import { useStarTemplate } from '@/hooks/queries/templates'
 import type { WorkflowState } from '@/stores/workflows/workflow/types'
@@ -200,7 +200,7 @@ function TemplateCardInner({
         className='pointer-events-none h-[180px] w-full cursor-pointer overflow-hidden rounded-[6px]'
       >
         {normalizedState && isInView ? (
-          <WorkflowPreview
+          <PreviewWorkflow
             workflowState={normalizedState}
             height={180}
             width='100%'