diff --git a/frontend/src/lib/components/FlowBuilder.svelte b/frontend/src/lib/components/FlowBuilder.svelte index 482a4452d3..edbe01f834 100644 --- a/frontend/src/lib/components/FlowBuilder.svelte +++ b/frontend/src/lib/components/FlowBuilder.svelte @@ -4,8 +4,7 @@ import { initHistory, redo, undo } from '$lib/history' import { userStore, workspaceStore } from '$lib/stores' import { encodeState, formatCron, loadHubScripts, sendUserToast } from '$lib/utils' - import { faCalendarAlt, faEye, faPen, faSave } from '@fortawesome/free-solid-svg-icons' - import { Redo, Undo } from 'lucide-svelte' + import { faCalendarAlt, faPen, faSave } from '@fortawesome/free-solid-svg-icons' import { setContext } from 'svelte' import { writable, type Writable } from 'svelte/store' import CenteredPage from './CenteredPage.svelte' @@ -22,6 +21,7 @@ import { loadFlowSchedule, type Schedule } from './flows/scheduleUtils' import type { FlowEditorContext } from './flows/types' import { cleanInputs } from './flows/utils' + import { Tour } from './tutorial' export let initialPath: string = '' export let selectedId: string | undefined @@ -29,6 +29,7 @@ export let loading = false export let flowStore: Writable export let flowStateStore: Writable + export let tour = false async function createSchedule(path: string) { const { cron, args, enabled } = $scheduleStore @@ -248,6 +249,10 @@ +{#if tour} + +{/if} + {#if !$userStore?.operator} diff --git a/frontend/src/lib/components/common/tabs/Tabs.svelte b/frontend/src/lib/components/common/tabs/Tabs.svelte index 95a4427817..47f46b4b42 100644 --- a/frontend/src/lib/components/common/tabs/Tabs.svelte +++ b/frontend/src/lib/components/common/tabs/Tabs.svelte @@ -18,6 +18,7 @@ export { c as class } export let wrapperClass = '' export let style = '' + export let id = '' $: selected && updateSelected() @@ -42,6 +43,7 @@
diff --git a/frontend/src/lib/components/flows/content/FlowSettings.svelte b/frontend/src/lib/components/flows/content/FlowSettings.svelte index a76d981aa2..2a7d36e804 100644 --- a/frontend/src/lib/components/flows/content/FlowSettings.svelte +++ b/frontend/src/lib/components/flows/content/FlowSettings.svelte @@ -29,7 +29,7 @@
- + Metadata Schedule Shared Directory diff --git a/frontend/src/lib/components/flows/header/FlowPreviewButtons.svelte b/frontend/src/lib/components/flows/header/FlowPreviewButtons.svelte index a1893fdb66..d8d84e1317 100644 --- a/frontend/src/lib/components/flows/header/FlowPreviewButtons.svelte +++ b/frontend/src/lib/components/flows/header/FlowPreviewButtons.svelte @@ -35,7 +35,7 @@ let is_owner = false -
+
-
+
{ const steps: object[] | Shepherd.Step[] = [ { id: 'welcome', - text: `
Windmill Script Builder
-

Build scripts with out own web editor, then use them anywhere in your flows, apps or as standalone computations with their auto-generated UI.

`, + text: `
Windmill Flow Editor
+

Build complex workflows from your scripts, configure them and get a clear visualization.

`, buttons: [ { text: 'See by myself', @@ -21,13 +21,13 @@ export default (tour: Shepherd.Tour) => { ] }, { - id: 'editor', - text: `
Web editor
-

Code directly from the web editor.

`, + id: 'graph', + text: `
Flow graph
+

Know how your flow is structured at a glimpse.

`, cancelIcon: { enabled: true }, - attachTo: { element: '#flow-tutorial-1', on: 'bottom-start' }, + attachTo: { element: '#flow-tutorial-1', on: 'right-start' }, highlightClass: 'shepherd-highlighted-element', scrollTo: false, buttons: [ @@ -43,13 +43,13 @@ export default (tour: Shepherd.Tour) => { ] }, { - id: 'preview', - text: `
UI preview
-

Preview the user interface generated from the signature of the script.

`, + id: 'modules', + text: `
Insert modules
+

Start building by adding modules. A module can be a simple script, a loop or a branching for example.

`, cancelIcon: { enabled: true }, - attachTo: { element: '#flow-tutorial-2', on: 'left-start' }, + attachTo: { element: '#flow-tutorial-2 button', on: 'right-start' }, highlightClass: 'shepherd-highlighted-element', scrollTo: false, buttons: [ @@ -65,9 +65,9 @@ export default (tour: Shepherd.Tour) => { ] }, { - id: 'parameters', - text: `
Parameters
-

Add variables, resources and configure your script.

`, + id: 'settings', + text: `
Settings
+

Configure schedules, authorizations, sharing parameters and many more.

`, cancelIcon: { enabled: true }, @@ -88,8 +88,8 @@ export default (tour: Shepherd.Tour) => { }, { id: 'test', - text: `
Test script
-

Time to try your work! Test the script and iterate as much as you want.

`, + text: `
Test flow
+

Time to try your work! Test the flow and iterate as much as you want.

`, cancelIcon: { enabled: true }, diff --git a/frontend/src/routes/(root)/(logged)/flows/add/+page.svelte b/frontend/src/routes/(root)/(logged)/flows/add/+page.svelte index 5424de11a4..be09539342 100644 --- a/frontend/src/routes/(root)/(logged)/flows/add/+page.svelte +++ b/frontend/src/routes/(root)/(logged)/flows/add/+page.svelte @@ -89,4 +89,4 @@ $dirtyStore = true - +