fix(suggested-actions): swap unaudited filled icons for EMCN outline set (#5548)

* fix(suggested-actions): swap unaudited filled icons for EMCN outline set

Suggested-action template icons on the home page mixed filled/solid
icons in with the app's outline icon convention. Swapped them for
consistent outline icons and removed the unused filled Card icon.

- gmail.ts: Card -> ClipboardList
- clickhouse.ts, sftp.ts: Trash -> TrashOutline
- ssh.ts: TerminalWindow (emcn) -> SshTerminalIcon (moved to
  components/icons.tsx alongside the other block/brand icons)
- deleted unused packages/emcn/src/icons/card.tsx
- regenerated docs

* fix(docs): revert jira.mdx regen regression

generate-docs.ts is dropping the Configuration and generic-webhook
Output tables for Jira triggers even though the trigger schemas still
define those fields (caught by Greptile review). Unrelated to the
icon changes in this PR, so reverting jira.mdx to its prior content
rather than debugging the generator here.

* fix(build): remove last Card icon consumer in playground gallery

apps/sim/app/playground/page.tsx imported Card from the top-level
@sim/emcn barrel for the icon showcase grid, which I missed when
auditing @sim/emcn/icons consumers. Broke the production build after
card.tsx was deleted. Removed the import and its gallery entry.
Verified with a local `bun run build`.
This commit is contained in:
Waleed
2026-07-09 15:55:58 -07:00
committed by GitHub
parent ce32993c76
commit aa5b1d5569
13 changed files with 140 additions and 52 deletions
+77
View File
@@ -3687,6 +3687,62 @@ export const SakanaIcon = (props: SVGProps<SVGSVGElement>) => (
</svg>
)
export function MetaIcon(props: SVGProps<SVGSVGElement>) {
const id = useId()
const gradient1Id = `meta_gradient_1_${id}`
const gradient2Id = `meta_gradient_2_${id}`
return (
<svg
{...props}
height='1em'
viewBox='0 -48.28 287.56 287.56'
width='1em'
xmlns='http://www.w3.org/2000/svg'
>
<title>Meta</title>
<defs>
<linearGradient
id={gradient1Id}
x1='61'
x2='259'
y1='117'
y2='127'
gradientUnits='userSpaceOnUse'
>
<stop offset='0' stopColor='#0064e1' />
<stop offset='0.4' stopColor='#0064e1' />
<stop offset='0.83' stopColor='#0073ee' />
<stop offset='1' stopColor='#0082fb' />
</linearGradient>
<linearGradient
id={gradient2Id}
x1='45'
x2='45'
y1='139'
y2='66'
gradientUnits='userSpaceOnUse'
>
<stop offset='0' stopColor='#0082fb' />
<stop offset='1' stopColor='#0064e0' />
</linearGradient>
</defs>
<path
d='m31.06,125.96c0,10.98 2.41,19.41 5.56,24.51 4.13,6.68 10.29,9.51 16.57,9.51 8.1,0 15.51-2.01 29.79-21.76 11.44-15.83 24.92-38.05 33.99-51.98l15.36-23.6c10.67-16.39 23.02-34.61 37.18-46.96 11.56-10.08 24.03-15.68 36.58-15.68 21.07,0 41.14,12.21 56.5,35.11 16.81,25.08 24.97,56.67 24.97,89.27 0,19.38-3.82,33.62-10.32,44.87-6.28,10.88-18.52,21.75-39.11,21.75l0-31.02c17.63,0 22.03-16.2 22.03-34.74 0-26.42-6.16-55.74-19.73-76.69-9.63-14.86-22.11-23.94-35.84-23.94-14.85,0-26.8,11.2-40.23,31.17-7.14,10.61-14.47,23.54-22.7,38.13l-9.06,16.05c-18.2,32.27-22.81,39.62-31.91,51.75-15.95,21.24-29.57,29.29-47.5,29.29-21.27,0-34.72-9.21-43.05-23.09-6.8-11.31-10.14-26.15-10.14-43.06z'
fill='#0081fb'
/>
<path
d='m24.49,37.3c14.24-21.95 34.79-37.3 58.36-37.3 13.65,0 27.22,4.04 41.39,15.61 15.5,12.65 32.02,33.48 52.63,67.81l7.39,12.32c17.84,29.72 27.99,45.01 33.93,52.22 7.64,9.26 12.99,12.02 19.94,12.02 17.63,0 22.03-16.2 22.03-34.74l27.4-.86c0,19.38-3.82,33.62-10.32,44.87-6.28,10.88-18.52,21.75-39.11,21.75-12.8,0-24.14-2.78-36.68-14.61-9.64-9.08-20.91-25.21-29.58-39.71l-25.79-43.08c-12.94-21.62-24.81-37.74-31.68-45.04-7.39-7.85-16.89-17.33-32.05-17.33-12.27,0-22.69,8.61-31.41,21.78z'
fill={`url(#${gradient1Id})`}
/>
<path
d='m82.35,31.23c-12.27,0-22.69,8.61-31.41,21.78-12.33,18.61-19.88,46.33-19.88,72.95 0,10.98 2.41,19.41 5.56,24.51l-26.48,17.44c-6.8-11.31-10.14-26.15-10.14-43.06 0-30.75 8.44-62.8 24.49-87.55 14.24-21.95 34.79-37.3 58.36-37.3z'
fill={`url(#${gradient2Id})`}
/>
</svg>
)
}
export function GeminiIcon(props: SVGProps<SVGSVGElement>) {
const id = useId()
const gradientId = `gemini_gradient_${id}`
@@ -5572,6 +5628,27 @@ export function SshIcon(props: SVGProps<SVGSVGElement>) {
)
}
export function SshTerminalIcon(props: SVGProps<SVGSVGElement>) {
return (
<svg
{...props}
xmlns='http://www.w3.org/2000/svg'
width='16'
height='14'
viewBox='0 0 16 14'
fill='none'
>
<path
d='M3 0C1.34 0 0 1.34 0 3V11C0 12.66 1.34 14 3 14H13C14.66 14 16 12.66 16 11V3C16 1.34 14.66 0 13 0H3ZM1 3C1 1.9 1.9 1 3 1H13C14.1 1 15 1.9 15 3V4H1V3ZM1 5H15V11C15 12.1 14.1 13 13 13H3C1.9 13 1 12.1 1 11V5Z'
fill='currentColor'
/>
<circle cx='3.5' cy='2.5' r='0.75' fill='currentColor' />
<circle cx='5.75' cy='2.5' r='0.75' fill='currentColor' />
<circle cx='8' cy='2.5' r='0.75' fill='currentColor' />
</svg>
)
}
export function SftpIcon(props: SVGProps<SVGSVGElement>) {
return (
<svg
@@ -1109,6 +1109,7 @@ Trigger workflow when a new application is submitted
| ↳ `currentInterviewStage` | object | currentInterviewStage output from the tool |
| ↳ `id` | string | Current interview stage UUID |
| ↳ `title` | string | Current interview stage title |
| ↳ `stageType` | string | Current interview stage type \(e.g., Lead, Applied, Interview, Offer\) |
| ↳ `job` | object | job output from the tool |
| ↳ `id` | string | Job UUID |
| ↳ `title` | string | Job title |
@@ -1163,6 +1164,7 @@ Trigger workflow when a candidate is hired
| ↳ `currentInterviewStage` | object | currentInterviewStage output from the tool |
| ↳ `id` | string | Current interview stage UUID |
| ↳ `title` | string | Current interview stage title |
| ↳ `stageType` | string | Current interview stage type \(e.g., Lead, Applied, Interview, Offer\) |
| ↳ `job` | object | job output from the tool |
| ↳ `id` | string | Job UUID |
| ↳ `title` | string | Job title |
@@ -1204,6 +1206,7 @@ Trigger workflow when a candidate changes interview stages
| ↳ `currentInterviewStage` | object | currentInterviewStage output from the tool |
| ↳ `id` | string | Current interview stage UUID |
| ↳ `title` | string | Current interview stage title |
| ↳ `stageType` | string | Current interview stage type \(e.g., Lead, Applied, Interview, Offer\) |
| ↳ `job` | object | job output from the tool |
| ↳ `id` | string | Job UUID |
| ↳ `title` | string | Job title |
@@ -1231,7 +1234,7 @@ Trigger workflow when a new job is created
| ↳ `title` | string | Job title |
| ↳ `confidential` | boolean | Whether the job is confidential |
| ↳ `status` | string | Job status \(Open, Closed, Draft, Archived\) |
| ↳ `employmentType` | string | Employment type \(Full-time, Part-time, etc.\) |
| ↳ `employmentType` | string | Employment type \(FullTime, PartTime, Intern, Contract\) |
---
@@ -1254,8 +1257,8 @@ Trigger workflow when a new offer is created
| `offer` | object | offer output from the tool |
| ↳ `id` | string | Offer UUID |
| ↳ `applicationId` | string | Associated application UUID |
| ↳ `acceptanceStatus` | string | Offer acceptance status \(Accepted, Declined, Pending, Created, Cancelled, WaitingOnResponse\) |
| ↳ `offerStatus` | string | Offer process status \(WaitingOnApprovalStart, WaitingOnOfferApproval, WaitingOnCandidateResponse, CandidateAccepted, CandidateRejected, OfferCancelled\) |
| ↳ `acceptanceStatus` | string | Offer acceptance status \(Accepted, Declined, Pending, Created, Cancelled\) |
| ↳ `offerStatus` | string | Offer process status \(WaitingOnApprovalStart, WaitingOnOfferApproval, WaitingOnApprovalDefinition, WaitingOnCandidateResponse, CandidateRejected, CandidateAccepted, OfferCancelled\) |
| ↳ `decidedAt` | string | Offer decision timestamp \(ISO 8601\). Typically null at creation; populated after candidate responds. |
| ↳ `latestVersion` | object | latestVersion output from the tool |
| ↳ `id` | string | Latest offer version UUID |
@@ -882,6 +882,7 @@ Trigger workflow when an issue is opened, updated, or closed in GitLab
| ↳ `description` | string | Issue description |
| ↳ `confidential` | boolean | Whether the issue is confidential |
| ↳ `url` | string | Issue URL |
| ↳ `work_item_type` | string | Work item type \(e.g. Issue, Incident, Task\); GitLab 17.2+ only |
---
@@ -912,7 +913,8 @@ Trigger workflow when a merge request is opened, updated, or merged in GitLab
| ↳ `action` | string | Action \(open, close, reopen, update, merge, etc.\) |
| ↳ `source_branch` | string | Source branch |
| ↳ `target_branch` | string | Target branch |
| ↳ `merge_status` | string | Merge status |
| ↳ `merge_status` | string | Merge status \(deprecated by GitLab\) |
| ↳ `detailed_merge_status` | string | Detailed merge status |
| ↳ `draft` | boolean | Whether the merge request is a draft |
| ↳ `url` | string | Merge request URL |
@@ -351,7 +351,7 @@ Triggers when new emails are received in Gmail (requires Gmail credentials)
| ↳ `date` | string | Email date in ISO format |
| ↳ `bodyText` | string | Plain text email body |
| ↳ `bodyHtml` | string | HTML email body |
| ↳ `labels` | string | Email labels array |
| ↳ `labels` | array | Email labels array |
| ↳ `hasAttachments` | boolean | Whether email has attachments |
| ↳ `attachments` | file[] | Array of email attachments as files \(if includeAttachments is enabled\) |
| `timestamp` | string | Event timestamp |
-2
View File
@@ -11,7 +11,6 @@ import {
Button,
ButtonGroup,
ButtonGroupItem,
Card as CardIcon,
Checkbox,
ChevronDown,
ChipDatePicker,
@@ -1027,7 +1026,6 @@ export default function PlaygroundPage() {
{[
{ Icon: BubbleChatClose, name: 'BubbleChatClose' },
{ Icon: BubbleChatPreview, name: 'BubbleChatPreview' },
{ Icon: CardIcon, name: 'Card' },
{ Icon: ChevronDown, name: 'ChevronDown' },
{ Icon: Connections, name: 'Connections' },
{ Icon: Cursor, name: 'Cursor' },
+11 -2
View File
@@ -1,4 +1,13 @@
import { Bell, ClipboardList, Database, File, Search, Server, Trash, Wrench } from '@sim/emcn/icons'
import {
Bell,
ClipboardList,
Database,
File,
Search,
Server,
TrashOutline,
Wrench,
} from '@sim/emcn/icons'
import { getErrorMessage } from '@sim/utils/errors'
import { ClickHouseIcon } from '@/components/icons'
import type { BlockConfig, BlockMeta } from '@/blocks/types'
@@ -516,7 +525,7 @@ export const ClickHouseBlockMeta = {
tags: ['data-warehouse', 'maintenance'],
},
{
icon: Trash,
icon: TrashOutline,
title: 'Partition retention cleanup',
prompt:
'Build a scheduled workflow that enforces a retention policy on my ClickHouse events table: take an explicit cutoff date as input, list the table partitions, select only the partitions on that exact table whose range ends strictly before the cutoff, and drop just those. Never infer the cutoff and never drop a partition that is not clearly past it.',
+2 -2
View File
@@ -1,4 +1,4 @@
import { Card } from '@sim/emcn/icons'
import { ClipboardList } from '@sim/emcn/icons'
import { GmailIcon, LemlistIcon } from '@/components/icons'
import { getScopesForService } from '@/lib/oauth/utils'
import type { BlockConfig, BlockMeta } from '@/blocks/types'
@@ -687,7 +687,7 @@ export const GmailBlockMeta = {
alsoIntegrations: ['slack'],
},
{
icon: Card,
icon: ClipboardList,
title: 'Invoice processor',
prompt:
'Build a workflow that processes invoice PDFs from Gmail, extracts vendor name, amount, due date, and line items, then logs everything to a tracking table and sends a Slack alert for invoices due within 7 days.',
+10 -2
View File
@@ -1,4 +1,12 @@
import { ClipboardList, Download, File, Search, Server, Trash, Upload } from '@sim/emcn/icons'
import {
ClipboardList,
Download,
File,
Search,
Server,
TrashOutline,
Upload,
} from '@sim/emcn/icons'
import { SftpIcon } from '@/components/icons'
import type { BlockConfig, BlockMeta } from '@/blocks/types'
import { AuthMode, IntegrationType } from '@/blocks/types'
@@ -344,7 +352,7 @@ export const SftpBlockMeta = {
tags: ['files', 'sync', 'sftp'],
},
{
icon: Trash,
icon: TrashOutline,
title: 'Archive and delete old files on a schedule',
prompt:
'Build a workflow that runs nightly, lists an SFTP directory, downloads files older than a threshold to archive them, and then deletes the originals from the remote server.',
+3 -11
View File
@@ -1,13 +1,5 @@
import {
ClipboardList,
Download,
File,
Search,
Server,
TerminalWindow,
Wrench,
} from '@sim/emcn/icons'
import { SshIcon } from '@/components/icons'
import { ClipboardList, Download, File, Search, Server, Wrench } from '@sim/emcn/icons'
import { SshIcon, SshTerminalIcon } from '@/components/icons'
import type { BlockConfig, BlockMeta } from '@/blocks/types'
import { AuthMode, IntegrationType } from '@/blocks/types'
import type { SSHResponse } from '@/tools/ssh/types'
@@ -616,7 +608,7 @@ export const SSHBlockMeta = {
url: 'https://www.openssh.com',
templates: [
{
icon: TerminalWindow,
icon: SshTerminalIcon,
title: 'Scheduled server health check to Slack',
prompt:
'Every morning, SSH into the production server and run a health check command (uptime, load average, and free memory). Summarize stdout with an agent and post the result to the #ops Slack channel so the team starts the day knowing the box is healthy.',
+21
View File
@@ -5628,6 +5628,27 @@ export function SshIcon(props: SVGProps<SVGSVGElement>) {
)
}
export function SshTerminalIcon(props: SVGProps<SVGSVGElement>) {
return (
<svg
{...props}
xmlns='http://www.w3.org/2000/svg'
width='16'
height='14'
viewBox='0 0 16 14'
fill='none'
>
<path
d='M3 0C1.34 0 0 1.34 0 3V11C0 12.66 1.34 14 3 14H13C14.66 14 16 12.66 16 11V3C16 1.34 14.66 0 13 0H3ZM1 3C1 1.9 1.9 1 3 1H13C14.1 1 15 1.9 15 3V4H1V3ZM1 5H15V11C15 12.1 14.1 13 13 13H3C1.9 13 1 12.1 1 11V5Z'
fill='currentColor'
/>
<circle cx='3.5' cy='2.5' r='0.75' fill='currentColor' />
<circle cx='5.75' cy='2.5' r='0.75' fill='currentColor' />
<circle cx='8' cy='2.5' r='0.75' fill='currentColor' />
</svg>
)
}
export function SftpIcon(props: SVGProps<SVGSVGElement>) {
return (
<svg
+6 -1
View File
@@ -11780,9 +11780,14 @@
"id": "microsoftteams_webhook",
"name": "Microsoft Teams Channel",
"description": "Trigger workflow from Microsoft Teams channel messages via outgoing webhooks"
},
{
"id": "microsoftteams_chat_subscription",
"name": "Microsoft Teams Chat",
"description": "Trigger workflow from new messages in Microsoft Teams chats via Microsoft Graph subscriptions"
}
],
"triggerCount": 1,
"triggerCount": 2,
"authType": "oauth",
"oauthServiceId": "microsoft-teams",
"category": "tools",
-26
View File
@@ -1,26 +0,0 @@
import type { SVGProps } from 'react'
/**
* Card icon component
* @param props - SVG properties including className, fill, etc.
*/
export function Card(props: SVGProps<SVGSVGElement>) {
return (
<svg
width='15'
height='12'
viewBox='0 0 15 12'
fill='none'
xmlns='http://www.w3.org/2000/svg'
aria-hidden='true'
{...props}
>
<path
d='M8.17 0C9.41 0 10.38 0 11.15 0.09C11.92 0.17 12.55 0.36 13.07 0.77C13.23 0.89 13.37 1.03 13.5 1.18C13.95 1.67 14.15 2.28 14.24 3.02C14.33 3.75 14.334 4.67 14.334 5.83C14.334 7 14.33 7.92 14.24 8.65C14.15 9.39 13.95 9.99 13.5 10.49C13.37 10.638 13.23 10.775 13.07 10.9C12.55 11.31 11.92 11.49 11.15 11.58C10.38 11.67 9.41 11.666 8.17 11.666H6.17C4.93 11.666 3.95 11.67 3.19 11.58C2.41 11.49 1.78 11.31 1.26 10.9C1.11 10.775 0.96 10.638 0.83 10.49C0.39 9.99 0.19 9.39 0.09 8.65C0 7.92 0 7 0 5.83C-1.12e-10 4.67 0 3.75 0.09 3.02C0.19 2.28 0.39 1.67 0.83 1.18C0.96 1.03 1.11 0.89 1.26 0.77C1.78 0.36 2.41 0.17 3.19 0.09C3.95 0 4.93 0 6.17 0H8.17ZM1.01 4.33C1 4.76 1 5.26 1 5.83C1 7.03 1 7.87 1.08 8.52C1.165 9.16 1.32 9.54 1.58 9.83C1.67 9.93 1.77 10.03 1.88 10.11C2.2 10.36 2.61 10.51 3.3 10.59C4 10.67 4.9 10.666 6.17 10.666H8.17C9.43 10.666 10.34 10.67 11.03 10.59C11.72 10.51 12.138 10.36 12.45 10.11C12.56 10.03 12.67 9.93 12.76 9.83C13.02 9.54 13.169 9.16 13.25 8.52C13.33 7.87 13.334 7.03 13.334 5.83C13.334 5.26 13.33 4.76 13.32 4.33H1.01ZM6.83 8C7.11 8 7.33 8.22 7.33 8.5C7.33 8.78 7.11 9 6.83 9H5.83C5.56 9 5.33 8.78 5.33 8.5C5.33 8.22 5.56 8 5.83 8H6.83ZM11.167 8C11.44 8 11.667 8.22 11.667 8.5C11.67 8.78 11.443 9 11.167 9H8.83C8.56 9 8.33 8.78 8.33 8.5C8.33 8.22 8.56 8 8.83 8H11.167ZM6.17 1C4.9 1 4 1 3.3 1.08C2.61 1.16 2.2 1.3 1.88 1.55C1.77 1.64 1.67 1.74 1.58 1.84C1.32 2.13 1.165 2.51 1.08 3.14C1.08 3.21 1.07 3.27 1.06 3.33H13.27C13.26 3.27 13.26 3.21 13.25 3.14C13.169 2.51 13.02 2.13 12.76 1.84C12.67 1.74 12.56 1.64 12.45 1.55C12.138 1.3 11.72 1.16 11.03 1.08C10.34 1 9.43 1 8.17 1H6.17Z'
fill='currentColor'
stroke='currentColor'
strokeWidth='0.3'
/>
</svg>
)
}
-1
View File
@@ -12,7 +12,6 @@ export { BubbleChatDelay } from './bubble-chat-delay'
export { BubbleChatPreview } from './bubble-chat-preview'
export { Bug } from './bug'
export { Calendar } from './calendar'
export { Card } from './card'
export { Check } from './check'
export { ChevronDown } from './chevron-down'
export { CircleAlert } from './circle-alert'