Skip to content

Commit 7df6f00

Browse files
kubamaJakub Madejqooban
authored
RD-6920 Environment button widget doc (#2528)
* Added environment button widget documentation * Added environment button widget documentation * Update content/working_with/console/widgets/environmentButton.md Co-authored-by: Jakub Niezgoda <jakub.niezgoda@cloudify.co> * Update content/working_with/console/widgets/environmentButton.md Co-authored-by: Jakub Niezgoda <jakub.niezgoda@cloudify.co> --------- Co-authored-by: Jakub Madej <jakub.madej@cloudify.co> Co-authored-by: Jakub Niezgoda <jakub.niezgoda@cloudify.co>
1 parent f8e78ad commit 7df6f00

5 files changed

Lines changed: 64 additions & 20 deletions

File tree

‎content/developer/writing_widgets/widget-definition.md‎

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -39,26 +39,26 @@ As seen in the example above, there are some configuration fields that you can p
3939

4040
The `Stage.defineWidget` function receives a settings object with the options described in this table.
4141

42-
Option | Type | Required | Default | Description
43-
---------- | ----- | -------- |--------------| -----------
44-
`categories` | array | No | `['Others']` | This property specifies in which categories this widget is shown. It can take an array containing one or more of the values defined in `Stage.GenericConfig.CATEGORY` object: `BLUEPRINTS` ('Blueprints' category), `DEPLOYMENTS` ('Deployments'), `BUTTONS_AND_FILTERS` ('Buttons and Filters'), `CHARTS_AND_STATISTICS` ('Charts and Statistics'), `EXECUTIONS_NODES` ('Executions/Nodes'), `SYSTEM_RESOURCES` ('System Resources'), `OTHERS` ('Others'), `ALL` ('All').
45-
`color` | string | No | no color | Widget's top border color. One of the following: `red`, `orange`, `yellow`, `olive`, `green`, `teal`, `blue`, `violet`, `purple`, `pink`, `brown`, `grey`, `black` or undefined.
46-
`description` | string | No | - | Description of the widget that is displayed in the [Add Widget modal]({{< relref "working_with/console/customization/edit-mode.md#adding-widgets" >}}).
47-
`fetchUrl` | string/object | No | - | If `fetchUrl` exists, the data from the URL is fetched by the application and passed to the render and postRender methods. To fetch multiple URLs, you must pass an object where the key is a name you select for this data, and the value is the URL. It is important to note that the render is called once before the data is fetched (to enable information about loading or partial data can be displayed) and once after the data is fetched.
48-
`hasReadme` | boolean | No | `false` | Whether to use `README.md` file. File must be present in widget's main directory. If `helpUrl` is defined and `hasReadme` is set to `true`, then `helpUrl` is used.
49-
`hasStyle` | boolean | No | `false` | Whether to use `style.css` file. File must be present in widget main directory.
50-
`hasTemplate` | boolean | No | `false` | Whether to use `widget.html` file as template. File must be present in widget main directory.
51-
`helpUrl` | string | No | - | URL to help webpage. If `helpUrl` is defined and `hasReadme` is set to `true`, then `helpUrl` is used.
52-
`id` | string | Yes | - | The ID of the widget definition. Must match the name of the directory into which it is placed.
53-
`initialConfiguration` | array | No | `[]` | A list of widget configuration options. The options are displayed when a user clicks the **Configure** icon in the top-right corner of the widget in [Edit Mode]({{< relref "working_with/console/customization/edit-mode.md" >}}).
54-
`initialHeight` | string | No | `12` | The default height of the widget when added to a page.
55-
`initialWidth` | string | No | `3` | The default width of the widget when added to a page.
56-
`isReact` | boolean | No | `true` | Set as `true` when writing a React widget.
57-
`name` | string | Yes | - | The display name of the widget that is displayed in the [Add Widget modal]({{< relref "working_with/console/customization/edit-mode.md#adding-widgets" >}}). It is also used as the default widget name.
58-
`showBorder` | boolean | No | `true` | Whether to display border of the widget.
59-
`showHeader` | boolean | No | `true` | Whether to display a header. If a header is not displayed, a user cannot change the widget name.
60-
`supportedEditions` | array | No | `[]` | A list of {{< param product_name >}} license editions (strings) that widget is supported by. Widget is available only on {{< param product_name >}} with one of the listed license editions installed. If not set (default), then widget availability will not be restricted to any specific license edition.
61-
`permission` | string | No | `CUSTOM_ALL` | This property specifies which user can later access and view this widget. It can take one of the following three values defined in `Stage.GenericConfig.CUSTOM_WIDGET_PERMISSIONS` object: `CUSTOM_ADMIN_ONLY` (applies for 'sys_admin' and 'manager' roles), `CUSTOM_SYS_ADMIN_ONLY` (applies for 'sys_admin' only, `CUSTOM_ALL` (applies to all user-roles).
42+
Option | Type | Required | Default | Description
43+
---------- | ----- |----------|------------------------------------------------------------------------------------| -----------
44+
`categories` | array | No | `['Others']` | This property specifies in which categories this widget is shown. It can take an array containing one or more of the values defined in `Stage.GenericConfig.CATEGORY` object: `BLUEPRINTS` ('Blueprints' category), `DEPLOYMENTS` ('Deployments'), `BUTTONS_AND_FILTERS` ('Buttons and Filters'), `CHARTS_AND_STATISTICS` ('Charts and Statistics'), `EXECUTIONS_NODES` ('Executions/Nodes'), `SYSTEM_RESOURCES` ('System Resources'), `OTHERS` ('Others'), `ALL` ('All').
45+
`color` | string | No | no color | Widget's top border color. One of the following: `red`, `orange`, `yellow`, `olive`, `green`, `teal`, `blue`, `violet`, `purple`, `pink`, `brown`, `grey`, `black` or undefined.
46+
`description` | string | No | translation bundle entry for `widgets.[id].description`, no value if not available | Description of the widget that is displayed in the [Add Widget modal]({{< relref "working_with/console/customization/edit-mode.md#adding-widgets" >}}).
47+
`fetchUrl` | string/object | No | - | If `fetchUrl` exists, the data from the URL is fetched by the application and passed to the render and postRender methods. To fetch multiple URLs, you must pass an object where the key is a name you select for this data, and the value is the URL. It is important to note that the render is called once before the data is fetched (to enable information about loading or partial data can be displayed) and once after the data is fetched.
48+
`hasReadme` | boolean | No | `false` | Whether to use `README.md` file. File must be present in widget's main directory. If `helpUrl` is defined and `hasReadme` is set to `true`, then `helpUrl` is used.
49+
`hasStyle` | boolean | No | `false` | Whether to use `style.css` file. File must be present in widget main directory.
50+
`hasTemplate` | boolean | No | `false` | Whether to use `widget.html` file as template. File must be present in widget main directory.
51+
`helpUrl` | string | No | - | URL to help webpage. If `helpUrl` is defined and `hasReadme` is set to `true`, then `helpUrl` is used.
52+
`id` | string | Yes | - | The ID of the widget definition. Must match the name of the directory into which it is placed.
53+
`initialConfiguration` | array | No | `[]` | A list of widget configuration options. The options are displayed when a user clicks the **Configure** icon in the top-right corner of the widget in [Edit Mode]({{< relref "working_with/console/customization/edit-mode.md" >}}).
54+
`initialHeight` | string | No | `12` | The default height of the widget when added to a page.
55+
`initialWidth` | string | No | `3` | The default width of the widget when added to a page.
56+
`isReact` | boolean | No | `true` | Set as `true` when writing a React widget.
57+
`name` | string | No | translation bundle entry for `widgets.[id].name`, no value if not available | The display name of the widget that is displayed in the [Add Widget modal]({{< relref "working_with/console/customization/edit-mode.md#adding-widgets" >}}). It is also used as the default widget name.
58+
`showBorder` | boolean | No | `true` | Whether to display border of the widget.
59+
`showHeader` | boolean | No | `true` | Whether to display a header. If a header is not displayed, a user cannot change the widget name.
60+
`supportedEditions` | array | No | `[]` | A list of {{< param product_name >}} license editions (strings) that widget is supported by. Widget is available only on {{< param product_name >}} with one of the listed license editions installed. If not set (default), then widget availability will not be restricted to any specific license edition.
61+
`permission` | string | No | `CUSTOM_ALL` | This property specifies which user can later access and view this widget. It can take one of the following three values defined in `Stage.GenericConfig.CUSTOM_WIDGET_PERMISSIONS` object: `CUSTOM_ADMIN_ONLY` (applies for 'sys_admin' and 'manager' roles), `CUSTOM_SYS_ADMIN_ONLY` (applies for 'sys_admin' only, `CUSTOM_ALL` (applies to all user-roles).
6262

6363

6464
### initialConfiguration

‎content/working_with/console/widgets/environmentButton.md‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
---
2+
title: Create environment button
3+
category: Widgets
4+
draft: false
5+
---
6+
Allows creating a new environment.
7+
8+
![create_deployment_button]( /images/ui/widgets/create_environment_button.png )
9+
10+
Two options are available:
11+
##### From Blueprint
12+
13+
Allows for creating an environment deployment from a selected environment blueprint. Refer to [Deploying a Blueprint]({{< relref "working_with/console/widgets/blueprints#deploying-a-blueprint" >}}) and [Create Deployment Button]({{< relref "working_with/console/widgets/deploymentButton.md" >}}) for details on deployment creation.
14+
15+
16+
##### New
17+
18+
Allows for creating an environment deployment from an on-the-fly created blueprint.
19+
20+
![create_deployment_modal]( /images/ui/widgets/create_environment_modal.png )
21+
22+
The following form fields are mandatory:
23+
24+
* `Name` - the name of the environment deployment to be created
25+
* `Blueprint Name` - the name of the underlaying blueprint that will be generated
26+
27+
Rest of the fields are optional:
28+
29+
* `Blueprint Description` - description of the blueprint that will be generated
30+
* `Capabilities` - capabilities of the blueprint that will be generated
31+
* `Labels` - labels of the environment blueprint/deployment to be created (depending on the `Blueprint Default` checkbox value)
32+
* `Location` - site name to be set for the environment deployment to be created
33+
34+
Once the `Create` button is clicked the environment blueprint will be generated and environment deployment creation modal will show up, as described in [From Blueprint]({{< relref "#from-blueprint" >}}).
35+
Note that blueprint selection option will not be present - the blueprint to be used for environment deployment creation will be the one generated based on the provided data.
36+
37+
## Settings
38+
39+
* `Label` - The label displayed in the button. Default: 'Create Environment'
40+
* `Color` - The color of the button. Available colors list can be found
41+
at: [Theming - Semantic UI React](https://react.semantic-ui.com/layouts/theming). Default: 'blue'
42+
* `Icon` - Name of the icon displayed in the button. Available icons list can be found
43+
at: [Icon - Semantic UI React](https://react.semantic-ui.com/elements/icon). Default: 'add'
44+
* `Basic button` - Allows to change button appearence, basic button is less pronounced. Default: No

‎static/images/ui/pages/environments-page.png‎

-19.3 KB
Loading

‎static/images/ui/widgets/create_environment_button.png‎

2.06 KB
Loading

‎static/images/ui/widgets/create_environment_modal.png‎

33.5 KB
Loading

0 commit comments

Comments
 (0)