
Scripts are ready-to-use tasks that do things automatically for you.
You can run scripts whenever you need them - like generating a report, sending notifications, or processing data.
', + onNextClick: async () => { + // Move to the next step (Flows) + setTimeout(() => { + const flowsButton = document.querySelector('[data-value="flow"]') as HTMLElement | null + + if (flowsButton) { + driver.moveNext() + } else { + driver.moveNext() + } + }, 100) + } + }, + element: '[data-value="script"]' + }, + { + popover: { + title: 'Flows - Run step-by-step processes', + description: + '
Flows are processes that run multiple tasks in order, one after another.
You can start a flow and watch it complete each step automatically - perfect for tasks that have multiple stages.
', + onNextClick: async () => { + // Move to the next step (Apps) + setTimeout(() => { + const appsButton = document.querySelector('[data-value="app"]') as HTMLElement | null + + if (appsButton) { + driver.moveNext() + } else { + driver.moveNext() + } + }, 100) + } + }, + element: '[data-value="flow"]' + }, + { + popover: { + title: 'Apps - Use custom tools', + description: + '
Apps are easy-to-use tools with buttons, forms, and displays built just for your team.
You can open an app to work with your data, fill out forms, or trigger tasks - no technical knowledge needed!
', + onNextClick: async () => { + // Move to the next step (cursor animation) + driver.moveNext() + } + }, + element: '[data-value="app"]' + }, + { + popover: { + title: 'Finally, the Menu section', + description: 'Explore available tabs where you can access your history of runs, your scheduled scripts, your tutorials progress etc.💡 Want to learn more? Access more tutorials from the Tutorials page in the main menu.
', + onNextClick: async () => { + // Find the target button and click it + const targetButton = document.querySelector('[role="menuitem"]') as HTMLElement | null + if (targetButton) { + targetButton.click() + } + + // Wait for menu to open + await wait(DELAY_MEDIUM) + + // Mark tutorial as complete + updateProgress(index) + driver.destroy() + + // Clean up URL parameter if present + if ($page.url.searchParams.has('tutorial')) { + goto(`${base}/`, { replaceState: true }) + } + } + }, + element: '[role="menuitem"]' + } + ] + + return steps + }} +/> diff --git a/frontend/src/lib/tutorialUtils.ts b/frontend/src/lib/tutorialUtils.ts index bd0ce09352..02222138e8 100644 --- a/frontend/src/lib/tutorialUtils.ts +++ b/frontend/src/lib/tutorialUtils.ts @@ -71,11 +71,6 @@ export async function skipAllTodos() { tutorialsToDo.set([]) skippedAll.set(true) - // Dismiss the tutorial banner when all tutorials are skipped - if (typeof window !== 'undefined') { - localStorage.setItem(TUTORIAL_BANNER_DISMISSED_KEY, 'true') - } - await UserService.updateTutorialProgress({ requestBody: { progress: bits, skipped_all: true } }) } diff --git a/frontend/src/lib/tutorials/config.ts b/frontend/src/lib/tutorials/config.ts index 3aa062e346..455c4c50e3 100644 --- a/frontend/src/lib/tutorials/config.ts +++ b/frontend/src/lib/tutorials/config.ts @@ -1,5 +1,5 @@ import type { ComponentType } from 'svelte' -import { Workflow, GraduationCap, Wrench, PlayCircle, Link2 } from 'lucide-svelte' +import { Workflow, GraduationCap, Wrench, PlayCircle, Link2, History } from 'lucide-svelte' import { base } from '$lib/base' import type { Role } from './roleUtils' @@ -43,7 +43,7 @@ export function getTutorialIndex(id: string): number { export const TUTORIALS_CONFIG: RecordQaXQIsE5%X#Ll}&gA!PGUI8nr0^x l!fqS$fM?cv~SQq^8zP^rzmJFpoc?#2%wQFS?*>b6?
z3HV`;qAK*3mh~L;4@d!I+|wU_g%6kS@g0#wj&?~*Qscw@nyhiEw~(i=_PZu4vK)?d
zAAUq|%~cD7I$f0;iFCAebd4q$q_>?ic6Z~#qInM1Cj4<$rQ_b~3&cW$Se7fn#sQ-3
z1i>n>9o0p5zRyy>O|#=5y|Y;9FPNOzN{)d` YdcS`4Av=bE8Z1s@kN$I}J;_}?qvGR{qiIQCV7FhRwHmTyC
zS*F-`90&Z_Fe$-aW_~Snt%8V>$n5e{Ph;6#={C)wTmXO@O3*nu9JTtw*JJKuR7FA<
z_NqoSRx7Vbh5qD@kQ?PLn?IT^3fi`X>tY4{z|&-Qm}_(6@;vW}tEJUKopxyt%+UTvg
cvEXcU
zXLa
|Zn5V290`QY*{j=Bg
z^u$)g>Hfy3j`E
xT*W#WDUW;t$3~EU|dvUgSD26?9
zW?jtQ7xkD)@)KWr$F
zU$T$#5|(@y^eTJ!WjP;JXJ@)@bJ|Iv|Oi%0qaR$99Vp0(d1|R)zy7~
z-ji)iAGYJ1yB(@Ks}_w2K2{3Dmfg4uAl??qvtxIZZ8BpQTzyEj9>e7yFSSNV9}$hx
zB>jIBe@ig*!ph90OuTrg#dU9DM!&x>J`DbP-qn3!F{q4;F%0-yTN39e%%Jif5pQk*
zVBFEH
z&!F_$#coL#l3J)@UA+=e#XeuP^!>=?6@Tpcu-7s^lz9SJVRcJ!CY)uIcBaNXPh1T<
zG@M%F1IxK