Skip to content

Commit 35150fd

Browse files
committed
moved mp4s to blob, completed quick reference guide
1 parent de2e1b8 commit 35150fd

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

41 files changed

+186
-800
lines changed
Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
'use client'
2+
3+
import { getAssetUrl } from '@/lib/utils'
4+
5+
interface ActionImageProps {
6+
src: string
7+
alt: string
8+
}
9+
10+
interface ActionVideoProps {
11+
src: string
12+
alt: string
13+
}
14+
15+
export function ActionImage({ src, alt }: ActionImageProps) {
16+
const resolvedSrc = getAssetUrl(src.startsWith('/') ? src.slice(1) : src)
17+
18+
return (
19+
<img
20+
src={resolvedSrc}
21+
alt={alt}
22+
className='inline-block w-full max-w-[200px] rounded border border-neutral-200 dark:border-neutral-700'
23+
/>
24+
)
25+
}
26+
27+
export function ActionVideo({ src, alt }: ActionVideoProps) {
28+
const resolvedSrc = getAssetUrl(src.startsWith('/') ? src.slice(1) : src)
29+
30+
return (
31+
<video
32+
src={resolvedSrc}
33+
autoPlay
34+
loop
35+
muted
36+
playsInline
37+
className='inline-block w-full max-w-[200px] rounded border border-neutral-200 dark:border-neutral-700'
38+
/>
39+
)
40+
}

apps/docs/content/docs/en/quick-reference/index.mdx

Lines changed: 146 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -4,14 +4,7 @@ description: Essential actions for navigating and using the Sim workflow editor
44
---
55

66
import { Callout } from 'fumadocs-ui/components/callout'
7-
8-
export const ActionImage = ({ src, alt }) => (
9-
<img src={src} alt={alt} className="inline-block max-h-8 rounded border border-neutral-200 dark:border-neutral-700" />
10-
)
11-
12-
export const ActionVideo = ({ src, alt }) => (
13-
<video src={src} alt={alt} autoPlay loop muted playsInline className="inline-block max-h-8 rounded border border-neutral-200 dark:border-neutral-700" />
14-
)
7+
import { ActionImage, ActionVideo } from '@/components/ui/action-media'
158

169
A quick lookup for everyday actions in the Sim workflow editor. For keyboard shortcuts, see [Keyboard Shortcuts](/keyboard-shortcuts).
1710

@@ -38,7 +31,7 @@ A quick lookup for everyday actions in the Sim workflow editor. For keyboard sho
3831
</tr>
3932
<tr>
4033
<td>Invite team members</td>
41-
<td>Workspace settings → **Team****Invite**</td>
34+
<td>Sidebar**Invite**</td>
4235
<td><ActionVideo src="/static/quick-reference/invite.mp4" alt="Invite team members" /></td>
4336
</tr>
4437
<tr>
@@ -155,7 +148,7 @@ A quick lookup for everyday actions in the Sim workflow editor. For keyboard sho
155148
</tr>
156149
<tr>
157150
<td>Multi-select blocks</td>
158-
<td>`Mod+Click` additional blocks, or right-drag to draw selection box</td>
151+
<td>`Mod+Click` additional blocks, or shift-drag to draw selection box</td>
159152
<td><ActionVideo src="/static/quick-reference/multiselect-blocks.mp4" alt="Multi-select blocks" /></td>
160153
</tr>
161154
<tr>
@@ -227,62 +220,156 @@ A quick lookup for everyday actions in the Sim workflow editor. For keyboard sho
227220

228221
## Panels & Views
229222

230-
| Action | How |
231-
|--------|-----|
232-
| Open Copilot tab | Press `C` or click Copilot tab |
233-
| Open Toolbar tab | Press `T` or click Toolbar tab |
234-
| Open Editor tab | Press `E` or click Editor tab |
235-
| Search toolbar | `Mod+F` |
236-
| Search everything | `Mod+K` |
237-
| Toggle manual mode | Click toggle button in editor fields to switch between manual and selector |
238-
| Resize panels | Drag panel edge |
239-
| Collapse/expand sidebar | Click collapse button on sidebar |
223+
<table>
224+
<thead>
225+
<tr><th>Action</th><th>How</th><th>Preview</th></tr>
226+
</thead>
227+
<tbody>
228+
<tr>
229+
<td>Search toolbar</td>
230+
<td>`Mod+F`</td>
231+
<td><ActionVideo src="/static/quick-reference/search-toolbar.mp4" alt="Search toolbar" /></td>
232+
</tr>
233+
<tr>
234+
<td>Search everything</td>
235+
<td>`Mod+K`</td>
236+
<td><ActionImage src="/static/quick-reference/search-everything.png" alt="Search everything" /></td>
237+
</tr>
238+
<tr>
239+
<td>Toggle manual mode</td>
240+
<td>Click toggle button to switch between manual and selector</td>
241+
<td><ActionImage src="/static/quick-reference/toggle-manual-mode.png" alt="Toggle manual mode" /></td>
242+
</tr>
243+
<tr>
244+
<td>Collapse/expand sidebar</td>
245+
<td>Click collapse button on sidebar</td>
246+
<td><ActionVideo src="/static/quick-reference/collapse-sidebar.mp4" alt="Collapse sidebar" /></td>
247+
</tr>
248+
</tbody>
249+
</table>
240250

241251
## Running & Testing
242252

243-
| Action | How |
244-
|--------|-----|
245-
| Run workflow | Click Play button or `Mod+Enter` |
246-
| Stop workflow | Click Stop button or `Mod+Enter` while running |
247-
| Test with chat | Use Chat panel on the right side |
248-
| Select output to view | Click dropdown in Chat panel → Select block output |
249-
| Clear chat history | Click clear button in Chat panel |
250-
| View execution logs | Open terminal panel at bottom, or `Mod+L` |
251-
| Filter logs by block | Click block filter in terminal |
252-
| Filter logs by status | Click status filter in terminal |
253-
| Search logs | Use search field in terminal |
254-
| Copy log entry | Right-click log entry → **Copy** |
255-
| Clear terminal | `Mod+D` |
253+
<table>
254+
<thead>
255+
<tr><th>Action</th><th>How</th><th>Preview</th></tr>
256+
</thead>
257+
<tbody>
258+
<tr>
259+
<td>Run workflow</td>
260+
<td>Click Run Workflow button or `Mod+Enter`</td>
261+
<td><ActionImage src="/static/quick-reference/run-workflow.png" alt="Run workflow" /></td>
262+
</tr>
263+
<tr>
264+
<td>Stop workflow</td>
265+
<td>Click Stop button or `Mod+Enter` while running</td>
266+
<td><ActionImage src="/static/quick-reference/stop-workflow.png" alt="Stop workflow" /></td>
267+
</tr>
268+
<tr>
269+
<td>Test with chat</td>
270+
<td>Use Chat panel on the right side</td>
271+
<td><ActionImage src="/static/quick-reference/test-chat.png" alt="Test with chat" /></td>
272+
</tr>
273+
<tr>
274+
<td>Select output to view</td>
275+
<td>Click dropdown in Chat panel → Select block output</td>
276+
<td><ActionImage src="/static/quick-reference/output-select.png" alt="Select output to view" /></td>
277+
</tr>
278+
<tr>
279+
<td>Clear chat history</td>
280+
<td>Click clear button in Chat panel</td>
281+
<td><ActionImage src="/static/quick-reference/clear-chat.png" alt="Clear chat history" /></td>
282+
</tr>
283+
<tr>
284+
<td>View execution logs</td>
285+
<td>Open terminal panel at bottom, or `Mod+L`</td>
286+
<td><ActionImage src="/static/quick-reference/terminal.png" alt="Execution logs terminal" /></td>
287+
</tr>
288+
<tr>
289+
<td>Filter logs by block or status</td>
290+
<td>Click block filter in terminal or right-click log entry → **Filter by Block** or **Filter by Status**</td>
291+
<td><ActionImage src="/static/quick-reference/filter-block.png" alt="Filter logs by block" /></td>
292+
</tr>
293+
<tr>
294+
<td>Search logs</td>
295+
<td>Use search field in terminal or right-click log entry → **Search**</td>
296+
<td><ActionImage src="/static/quick-reference/terminal-search.png" alt="Search logs" /></td>
297+
</tr>
298+
<tr>
299+
<td>Copy log entry</td>
300+
<td>Clipboard Icon or Right-click log entry → **Copy**</td>
301+
<td><ActionImage src="/static/quick-reference/copy-log.png" alt="Copy log entry" /></td>
302+
</tr>
303+
<tr>
304+
<td>Clear terminal</td>
305+
<td>Trash icon or `Mod+D`</td>
306+
<td><ActionImage src="/static/quick-reference/clear-terminal.png" alt="Clear terminal" /></td>
307+
</tr>
308+
</tbody>
309+
</table>
256310

257311
## Deployment
258312

259-
| Action | How |
260-
|--------|-----|
261-
| Deploy a workflow | Click **Deploy** button in Deploy tab |
262-
| Update deployment | Click **Update** when changes are detected |
263-
| View deployment status | Check status indicator (Live/Update/Deploy) in Deploy tab |
264-
| Revert deployment | Access previous versions in Deploy tab |
265-
| Copy webhook URL | Deploy tab → Copy webhook URL |
266-
| Copy API endpoint | Deploy tab → Copy API endpoint URL |
267-
| Set up a schedule | Add Schedule trigger block → Configure interval |
313+
<table>
314+
<thead>
315+
<tr><th>Action</th><th>How</th><th>Preview</th></tr>
316+
</thead>
317+
<tbody>
318+
<tr>
319+
<td>Deploy a workflow</td>
320+
<td>Click **Deploy** button in panel</td>
321+
<td><ActionImage src="/static/quick-reference/deploy.png" alt="Deploy workflow" /></td>
322+
</tr>
323+
<tr>
324+
<td>Update deployment</td>
325+
<td>Click **Update** when changes are detected</td>
326+
<td><ActionImage src="/static/quick-reference/update-deployment.png" alt="Update deployment" /></td>
327+
</tr>
328+
<tr>
329+
<td>View deployment status</td>
330+
<td>Check status indicator (Live/Update/Deploy) in Deploy tab</td>
331+
<td><ActionImage src="/static/quick-reference/view-deployment.png" alt="View deployment status" /></td>
332+
</tr>
333+
<tr>
334+
<td>Revert deployment</td>
335+
<td>Access previous versions in Deploy tab → **Promote to live**</td>
336+
<td><ActionImage src="/static/quick-reference/promote-deployment.png" alt="Promote deployment to live" /></td>
337+
</tr>
338+
<tr>
339+
<td>Copy API endpoint</td>
340+
<td>Deploy tab → Copy API endpoint URL</td>
341+
<td><ActionImage src="/static/quick-reference/copy-api.png" alt="Copy API endpoint" /></td>
342+
</tr>
343+
</tbody>
344+
</table>
268345

269346
## Variables
270347

271-
| Action | How |
272-
|--------|-----|
273-
| Add workflow variable | Variables tab → **Add Variable** |
274-
| Edit workflow variable | Variables tab → Click variable to edit |
275-
| Delete workflow variable | Variables tab → Click delete icon on variable |
276-
| Add environment variable | Settings → **Environment Variables****Add** |
277-
| Reference a workflow variable | Use `<blockName.itemName>` syntax in block inputs |
278-
| Reference an environment variable | Use `{{ENV_VAR}}` syntax in block inputs |
279-
280-
## Credentials
281-
282-
| Action | How |
283-
|--------|-----|
284-
| Add API key | Block credential field → **Add Credential** → Enter API key |
285-
| Connect OAuth account | Block credential field → **Connect** → Authorize with provider |
286-
| Manage credentials | Settings → **Credentials** |
287-
| Remove credential | Settings → **Credentials** → Delete credential |
348+
<table>
349+
<thead>
350+
<tr><th>Action</th><th>How</th><th>Preview</th></tr>
351+
</thead>
352+
<tbody>
353+
<tr>
354+
<td>Add / Edit / Delete workflow variable</td>
355+
<td>Panel -> Variables -> **Add Variable**, click to edit, or delete icon</td>
356+
<td><ActionImage src="/static/quick-reference/variables.png" alt="Variables panel" /></td>
357+
</tr>
358+
<tr>
359+
<td>Add environment variable</td>
360+
<td>Settings → **Environment Variables****Add**</td>
361+
<td><ActionImage src="/static/quick-reference/add-env-variable.png" alt="Add environment variable" /></td>
362+
</tr>
363+
<tr>
364+
<td>Reference a workflow variable</td>
365+
<td>Use `<blockName.itemName>` syntax in block inputs</td>
366+
<td><ActionImage src="/static/quick-reference/variable-reference.png" alt="Reference workflow variable" /></td>
367+
</tr>
368+
<tr>
369+
<td>Reference an environment variable</td>
370+
<td>Use `&#123;&#123;ENV_VAR&#125;&#125;` syntax in block inputs</td>
371+
<td><ActionImage src="/static/quick-reference/env-variable-reference.png" alt="Reference environment variable" /></td>
372+
</tr>
373+
</tbody>
374+
</table>
288375

-299 KB
Binary file not shown.
104 KB
Loading
36.6 KB
Loading
45.3 KB
Loading
-1.54 MB
Binary file not shown.
-224 KB
Binary file not shown.
-447 KB
Binary file not shown.
114 KB
Loading

0 commit comments

Comments
 (0)