Skip to content

Commit aecc03a

Browse files
hcourdenthcourdent
authored
Rich results and changelog (windmill-labs#559)
1 parent 8699ee1 commit aecc03a

22 files changed

+158
-21
lines changed

‎changelog/2024-03-27-approval-steps/hide_cancel_approval_page.png

292 KB
Loading

‎changelog/2024-03-27-approval-steps/index.md

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
---
2+
slug: approval-steps-improvements
3+
version: v1.298.0
4+
title: Approval Steps Improvements
5+
tags: ['Flow Editor']
6+
image: ./hide_cancel_approval_page.png
7+
description: Improved the experience with approval steps.
8+
features:
9+
[
10+
'You can now remove the deny button from approval page to force more complex patterns using forms with enums processed in ulterior steps.',
11+
'Now approval steps resume forms at any level will be displayed at the top-level, regardless of their depths.',
12+
'We have updated the default template and there is a new field description to add very clear instructions which support the whole range of of rich display rendering.'
13+
]
14+
docs: /docs/flows/flow_approval
15+
---

‎changelog/2024-03-27-map-support-renderer/index.md

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
---
2+
slug: map-support-renderer
3+
version: v1.298.0
4+
title: Map Support in Result Renderer
5+
tags: ['Scripts', 'Flow Editor']
6+
image: ./map.png
7+
description: Map support in Rich Display Rendering.
8+
features:
9+
[
10+
'Display a map from lat and long.',
11+
'Marker with specific location and colors.',
12+
'Example: `return { "map": { lat: 40, lon: 0, zoom: 3, markers: [{lat: 50.6, lon: 3.1, title: "Home", radius: 5, color: "yellow", strokeWidth: 3, strokeColor: "Black"}]}`'
13+
]
14+
docs: /docs/core_concepts/rich_display_rendering
15+
---

‎changelog/2024-03-27-map-support-renderer/map.png

756 KB
Loading

‎changelog/2024-03-27-markdown-support/flow_settings_metadata_markdown.png

225 KB
Loading

‎changelog/2024-03-27-markdown-support/index.md

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
---
2+
slug: markdown-support-descriptions
3+
version: v1.298.0
4+
title: Markdown support in descriptions
5+
tags: ['Scripts', 'Flow Editor', 'Resources']
6+
image: ./flow_settings_metadata_markdown.png
7+
description: We now support GH flavored markdown for description of scripts, flows, resources.
8+
features:
9+
[
10+
'Markdown support for scripts descriptions.',
11+
'Markdown support for flows descriptions.',
12+
'Markdown support for resources descriptions.',
13+
]
14+
docs: /docs/flows/editor_components#description
15+
---

‎docs/apps/2_outputs.mdx

Lines changed: 17 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,8 @@ You can search for an output by typing in the search bar. It searches in the out
1919

2020
![Search outputs](../assets/apps/2_app_outputs/search_output.png 'Search outputs')
2121

22+
## Context and state
23+
2224
### App context
2325

2426
The app context contains the following outputs:
@@ -32,7 +34,7 @@ The app context contains the following outputs:
3234

3335
The app state is a client-side store that can be used to store data. The app state can be manipulated by frontend scripts.
3436

35-
### Component outputs
37+
## Component outputs
3638

3739
Each component has its own outputs. The outputs are displayed in a tree structure. The tree structure is collapsible and can be expanded by clicking on the `{...}` button. Next to the button, you can see the number of outputs.
3840

@@ -50,7 +52,7 @@ For example, the [Table component](./4_app_configuration_settings/table.mdx) has
5052

5153
The outputs are used to quickly visualize the current state of the app.
5254

53-
### Containers
55+
## Containers
5456

5557
Some components are "containers" and can contain other components.
5658

@@ -67,11 +69,11 @@ The components contained in a container have their outputs displayed in the cont
6769
/>
6870
</div>
6971

70-
### Background runnables outputs
72+
## Background runnables outputs
7173

7274
A [background runnable](./3_app-runnable-panel.mdx#background-runnables) is a script or flow that runs in the background and can be used to perform actions that are not related to the UI.
7375

74-
### Connecting inputs
76+
## Connecting inputs
7577

7678
Inputs can be connected to any outputs. When connecting, you can click on the output to connect the input to it. The data source will change to [eval](./3_app-runnable-panel.mdx#evals). Note that you can select nested outputs, objects and arrays.
7779

@@ -96,7 +98,17 @@ Alternatively, refer to the component directly through an [eval](./3_app-runnabl
9698

9799
![App outputs](../assets/apps/2_app_outputs/connecting_eval.png 'Connecting through eval')
98100

99-
### Editing the id of a component
101+
### Forcing the value of a component
102+
103+
You can use a [frontend script helper](./3_app-runnable-panel.mdx#frontend-scripts-helpers): [setValue](./3_app-runnable-panel.mdx#setvalue) that is meant to manually set or force the value of a component. This can be convenient in cases where connecting components is not the easiest pattern.
104+
105+
```js
106+
setValue(id: string, value: any)
107+
```
108+
109+
Note that it's a bad idea to mix dynamic default value and setValue together.
110+
111+
## Editing the id of a component
100112

101113
You can edit the id of a component by clicking on the id. Component id can only contain letters and numbers.
102114

‎docs/apps/3_app-runnable-panel.mdx

Lines changed: 30 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,31 @@ They can be either attached to a component or detached.
6262

6363
Frontend scripts are JavaScripts that are executed on the browser.
6464

65+
They come with [frontend script helpers](#frontend-scripts-helpers) that are functions and global objects to help you interact with the app.
66+
67+
Frontend scripts can read outputs and ctx of the rest of the app with for example:
68+
69+
```js
70+
// read outputs and ctx
71+
console.log(ctx.email)
72+
73+
// access a global state store
74+
if (!state.foo) { state.foo = 0 }
75+
state.foo += 1
76+
77+
// for reactivity to work, you need to assign a value and not modify it in place
78+
// e.g: state.foo.push(1) will not work but 'state.foo = [...state.foo, 1]' will.
79+
// you may also just reassign as next statement 'state.foo = state.foo'
80+
81+
// you can also navigate (goto), recompute a script (recompute), or set a tab (setTab)
82+
// Inputs and display components support settings their value directly
83+
setValue('a', "Bar")
84+
85+
// Tables support setting their selected index (setSelectedIndex)
86+
87+
return state.foo
88+
```
89+
6590
### Background runnables
6691

6792
Background runnables are scripts that are executed in the background. They are executed on the server.
@@ -411,7 +436,11 @@ setSelectedIndex(id: string, index: number)
411436

412437
### setValue
413438

414-
The `setValue` function is meant to set or force the value of a component. This can be convenient in cases where connection is not the easiest pattern.
439+
The `setValue` function is meant to manually set or force the value of a component. This can be convenient in cases where [connecting components](./2_connecting_components/index.mdx) is not the easiest pattern.
440+
441+
```js
442+
setValue(id: string, value: any)
443+
```
415444

416445
Note that it's a bad idea to mix dynamic default value and setValue together.
417446

‎docs/assets/flows/description.png

267 KB
Loading

‎docs/assets/flows/flow_settings_metadata.png

22.2 KB
Loading

0 commit comments

Comments
 (0)