docs/ui/hello-world-resource-resolution-cba.rst

   1 .. This work is licensed under a Creative Commons Attribution 4.0 International License.
   2 .. http://creativecommons.org/licenses/by/4.0
   3 .. Copyright (C) 2019 IBM.
   4
   5 .. _hello_world_resource_resolution_cba:
   6
   7 How to create a “Hello World” Package with CDS Designer UI? The Resource Resolution Type
   8 ========================================================================================
   9
  10 .. toctree::
  11    :maxdepth: 2
  12
  13 .. note::
  14     **How to Get Started with CDS Designer UI**
  15
  16     If you’re new to CDS Designer UI and need to get set up, the following guides may be helpful:
  17
  18     -  :ref:`running_cds_ui_locally`
  19     -  :ref:`designer_guide`
  20
  21 .. note::
  22     **NOTE:**
  23
  24     In order to see the latest version described below in the tutorial, we will need to use the latest cds-ui-server docker image:
  25     nexus3.onap.org:10001/onap/ccsdk-cds-ui-server:1.1.0-STAGING-latest
  26
  27
  28 Create New CBA Package
  29 ~~~~~~~~~~~~~~~~~~~~~~
  30
  31 In the Package List, click on the **Create Package** button.
  32
  33 |image1|
  34
  35 Define Package MetaData
  36 ~~~~~~~~~~~~~~~~~~~~~~~
  37
  38 In MetaData Tab:
  39
  40 1. Package name (Required), type **"hello_world"**
  41 2. Package version (Required), type **"1.0.0"**
  42 3. Package description (Required), type **"Hello World, the New CBA Package created with CDS Designer UI"**
  43 4. Package Tags (Required), type **"tag1"** then use the **Enter** key on the keyboard
  44
  45 |image2|
  46
  47 Once you enter all fields you will be able to save your package. Click on the **Save** button and continue to define your package.
  48
  49 |image3|
  50
  51 Define Template And Mapping
  52 ~~~~~~~~~~~~~~~~~~~~~~~~~~~
  53
  54 In the Template & Mapping Tab:
  55
  56 1. Enter template name **"hello_world_template"**, then go to **Template section**
  57 2. Choose the template type **"Velocity"**
  58 3. Type the Template parameter **"Hello, ${image_name}!"** in the code editor
  59
  60 |image4|
  61
  62 Now, go to the **Manage Mapping section.**
  63
  64 |image5|
  65
  66 Click on the **Use Current Template Instance** button to resolve the value within the template and to auto-map it.
  67
  68 |image6|
  69
  70 Inside the **Mapping table**, change **Dictionary Source** from **default** to **input**
  71
  72 |image7|
  73
  74 Click on the **Finish** button to save the template and close it.
  75
  76 |image8|
  77
  78 After the new template is added to the **Template and Mapping list**, click on the **Save** button to save the package updates.
  79
  80 |image9|
  81
  82 Create An Action
  83 ~~~~~~~~~~~~~~~~~
  84
  85 From the Package information box on top, click on the **Designer Mode** button.
  86
  87 |image10|
  88
  89 Click on the **Skip to Designer Canvas** button to go directly to Designer Mode.
  90
  91 |image11|
  92
  93 Now the designer has zero action added. Let's start adding the first Action.
  94
  95 |image12|
  96
  97 Go to the left side of the designer screen and in the **ACTIONS tab**, click on the **+ New Action** button.
  98
  99 |image13|
 100
 101 Now, the first Action **Action1** is added to the **Actions list** and in the **Workflow canvas**.
 102
 103 |image14|
 104
 105 Add Resource Resolution Function To The Action
 106 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 107
 108 On the left side of the designer screen, Click on the **FUNCTIONS tab** to view all the **Functions List.**
 109
 110 |image15|
 111
 112 **Drag** the function type **"component-resource-resolution"**
 113
 114 |image16|
 115
 116 **Drop** the function to the **"Action1"** Action container.
 117
 118 |image17|
 119
 120 Define Action Attributes
 121 ~~~~~~~~~~~~~~~~~~~~~~~~
 122
 123 Click on **Action1** from the ACTIONS tab to open **the ACTION ATTRIBUTES** section on designer screens’ right side.
 124
 125 |image18|
 126
 127 Let's customize the first action's attribute by click on the **+ Create Custom** button to open **Add Custom Attributes** modal window.
 128
 129 |image19|
 130
 131 In the **Add Custom Attributes** **Window**, and the **INPUTS tab** starts to add the first input attribute for **Action1**.
 132
 133 **INPUTS Tab:** Enter the required properties for the inputs’ attribute:
 134
 135 1. Name: **"template-prefix"**
 136 2. Type: **"List"**
 137 3. Required: **"True"**
 138
 139 |image20|
 140
 141 After you add the **template-prefix** input's attribute, click on In the OUTPUT Tab to create the output attribute too.
 142
 143 |image21|
 144
 145 **OUTPUTS Tab:** Enter the required properties for the output’ attribute:
 146
 147 1. Name: **"hello-world-output"**
 148 2. Required: **"True"**
 149 3. Type: **"other"**
 150 4. Type name: **"json"**
 151 5. Value (get_attribute): From the **Functions list**, select **"component-resource-resolution"** that will show all attributes included in this function
 152 6. Select parameter name **"assignment-params"**
 153 7. Click on the **Submit Attributes** button to add input and output attributes to **Actions' Attributes list**
 154 8. Click on the **Close** button to close the modal window and go backto the designer screen.
 155
 156 |image22|
 157
 158 Now, you can see all the added attributes listed in the **ACTION ATTRIBUTES** area.
 159
 160 |image23|
 161
 162 Define Function Attributes
 163 ~~~~~~~~~~~~~~~~~~~~~~~~~~
 164
 165 From **ACTIONS** List, Click on the function name **"component-resource-resolution"**.
 166
 167 |image24|
 168
 169 When you click on the **component-resource-resolution** function, the **FUNCTION ATTRIBUTES** section will be open on the right side of the designers' screen.
 170
 171 |image25|
 172
 173 Now, you need to add the values of **Inputs** or **Outputs** required attributes in **the Interfaces** **section**.
 174
 175 -  **artifact-prefix-names**:
 176
 177 1. Click on the **Select Templates** button
 178 2. In the modal window that lists all templates you created, click on the **"hello_world_template"** name
 179 3. Click on the **Add Template** button to insert it in **the Artifacts** section and to close the modal window.
 180
 181 |image26|
 182
 183 |image27|
 184
 185 Now, the **hello_world_template** template is listed inside the **Artifacts section.**
 186
 187 |image28|
 188
 189 From the page header and inside **the Save** **menu**, click on the **Save** button to save all the changes.
 190
 191 |image30|
 192
 193 Enrich And Deploy The CBA Package
 194 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 195
 196 From the page header and inside the **Save menu**, click on the **Enrich & Deploy** button.
 197
 198 |image31|
 199
 200 Once the process is done, a confirmation message will appear.
 201
 202 |image32|
 203
 204 Test The CBA package With CDS REST API
 205 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 206
 207 To test the CDS hello_world package we created, we can use the REST API shown below to run the resource resolution workflow in the hello_wold
 208 package, which will resolve the value of the "image_name" resource from the REST Call input, and will send it back to the user in the form of
 209 "Hello, $image_name!".
 210
 211 **CURL Request to RUN CBA Package**
 212
 213 .. code-block:: bash
 214
 215      curl --location --request POST
 216      'http://cds-blueprint-processor:8080/api/v1/execution-service/process'\\
 217      --header 'Content-Type: application/json;charset=UTF-8'\\
 218      --header 'Accept: application/json;charset=UTF-8,application/json'\\
 219      --header 'Authorization: BasicY2NzZGthcHBzOmNjc2RrYXBwcw=='\\
 220      --data-raw '{
 221          "actionIdentifiers": {
 222              "mode": "sync",
 223              "blueprintName": "hello_world",
 224              "blueprintVersion": "1.0.0",
 225              "actionName": "Action1"
 226          },
 227          "payload": {
 228              "Action1-request": {
 229                   "Action1-properties": {
 230                       "image_name": "Sarah Abouzainah"
 231                   }
 232              }
 233          },
 234          "commonHeader": {
 235               "subRequestId": "143748f9-3cd5-4910-81c9-a4601ff2ea58",
 236               "requestId": "e5eb1f1e-3386-435d-b290-d49d8af8db4c",
 237               "originatorId": "SDNC_DG"
 238          }
 239      }'
 240
 241
 242 **CDS Response showing result of running package**
 243
 244 .. code-block:: json
 245
 246      {
 247        "correlationUUID": null,
 248        "commonHeader": {
 249          "timestamp": "2020-12-13T11:43:10.993Z",
 250          "originatorId": "SDNC_DG",
 251          "requestId": "e5eb1f1e-3386-435d-b290-d49d8af8db4c",
 252          "subRequestId": "143748f9-3cd5-4910-81c9-a4601ff2ea58",
 253          "flags": null
 254        },
 255        "actionIdentifiers": {
 256          "blueprintName": "hello_world",
 257          "blueprintVersion": "1.0.0",
 258          "actionName": "Action1",
 259          "mode": "sync"
 260        },
 261        "status": {
 262          "code": 200,
 263          "eventType": "EVENT_COMPONENT_EXECUTED",
 264          "timestamp": "2020-12-13T11:43:11.028Z",
 265          "errorMessage": null,
 266          "message": "success"
 267        },
 268        "payload": {
 269          "Action1-response": {
 270            "hello-world-output": {
 271              "hello_world_template": "Hello, Sarah Abouzainah!"
 272            }
 273          }
 274        }
 275      }
 276
 277 Screenshot from POSTMAN showing how to run the hello_world package, and the CDS Response:
 278
 279 |image33|
 280
 281 Next:
 282 -----
 283
 284     :ref:`Script Executor Type Hello World CBA Package <hello_world_script_executor_cba>`
 285
 286
 287 .. |image1| image:: https://wiki.onap.org/download/attachments/93003036/1.png?version=4&modificationDate=1607534831000&api=v2
 288    :width: 1000pt
 289 .. |image2| image:: https://wiki.onap.org/download/attachments/93003036/2.png?version=5&modificationDate=1609170583000&api=v2
 290    :width: 1000pt
 291 .. |image3| image:: https://wiki.onap.org/download/attachments/93003036/3.png?version=4&modificationDate=1609170695000&api=v2
 292    :width: 1000pt
 293 .. |image4| image:: https://wiki.onap.org/download/attachments/93003036/4.png?version=3&modificationDate=1609170995000&api=v2
 294    :width: 1000pt
 295 .. |image5| image:: https://wiki.onap.org/download/attachments/93003036/5.png?version=3&modificationDate=1607538358000&api=v2
 296    :width: 1000pt
 297 .. |image6| image:: https://wiki.onap.org/download/attachments/93003036/6.png?version=2&modificationDate=1607538455000&api=v2
 298    :width: 1000pt
 299 .. |image7| image:: https://wiki.onap.org/download/attachments/93003036/7.png?version=2&modificationDate=1607538653000&api=v2
 300    :width: 1000pt
 301 .. |image8| image:: https://wiki.onap.org/download/attachments/93003036/8.png?version=3&modificationDate=1609171068000&api=v2
 302    :width: 1000pt
 303 .. |image9| image:: https://wiki.onap.org/download/attachments/93003036/9.png?version=3&modificationDate=1609171129000&api=v2
 304    :width: 1000pt
 305 .. |image10| image:: https://wiki.onap.org/download/attachments/93003036/10.png?version=3&modificationDate=1609171172000&api=v2
 306    :width: 1000pt
 307 .. |image11| image:: https://wiki.onap.org/download/attachments/93003036/11.png?version=2&modificationDate=1607540629000&api=v2
 308    :width: 1000pt
 309 .. |image12| image:: https://wiki.onap.org/download/attachments/93003036/12.png?version=2&modificationDate=1607540920000&api=v2
 310    :width: 1000pt
 311 .. |image13| image:: https://wiki.onap.org/download/attachments/93003036/13.png?version=3&modificationDate=1607542672000&api=v2
 312    :width: 200pt
 313 .. |image14| image:: https://wiki.onap.org/download/attachments/93003036/14.png?version=2&modificationDate=1607541858000&api=v2
 314    :width: 800pt
 315 .. |image15| image:: https://wiki.onap.org/download/attachments/93003036/15.png?version=2&modificationDate=1607542785000&api=v2
 316    :width: 300pt
 317 .. |image16| image:: https://wiki.onap.org/download/attachments/93003036/16.png?version=3&modificationDate=1607543088000&api=v2
 318    :width: 700pt
 319 .. |image17| image:: https://wiki.onap.org/download/attachments/93003036/17.png?version=2&modificationDate=1607543299000&api=v2
 320    :width: 700pt
 321 .. |image18| image:: https://wiki.onap.org/download/attachments/93003036/18.png?version=2&modificationDate=1607543587000&api=v2
 322    :width: 300pt
 323 .. |image19| image:: https://wiki.onap.org/download/attachments/93003036/19.png?version=3&modificationDate=1607543849000&api=v2
 324    :width: 300pt
 325 .. |image20| image:: https://wiki.onap.org/download/attachments/93003036/20.png?version=2&modificationDate=1607544576000&api=v2
 326    :width: 700pt
 327 .. |image21| image:: https://wiki.onap.org/download/attachments/93003036/21.png?version=2&modificationDate=1607544745000&api=v2
 328    :width: 700pt
 329 .. |image22| image:: https://wiki.onap.org/download/attachments/93003036/22.png?version=2&modificationDate=1607545959000&api=v2
 330    :width: 800pt
 331 .. |image23| image:: https://wiki.onap.org/download/attachments/93003036/23.png?version=2&modificationDate=1607546223000&api=v2
 332    :width: 300pt
 333 .. |image24| image:: https://wiki.onap.org/download/attachments/93003036/24.png?version=2&modificationDate=1607548321000&api=v2
 334    :width: 300pt
 335 .. |image25| image:: https://wiki.onap.org/download/attachments/93003036/25.png?version=3&modificationDate=1612796664000&api=v2
 336    :width: 300pt
 337 .. |image26| image:: https://wiki.onap.org/download/attachments/93003036/26.png?version=2&modificationDate=1607551324000&api=v2
 338    :width: 340pt
 339 .. |image27| image:: https://wiki.onap.org/download/attachments/93003036/27.png?version=3&modificationDate=1607551567000&api=v2
 340    :width: 800pt
 341 .. |image28| image:: https://wiki.onap.org/download/attachments/93003036/28.png?version=2&modificationDate=1607551732000&api=v2
 342    :width: 300pt
 343 .. |image29| image:: https://wiki.onap.org/download/attachments/93003036/29.png?version=3&modificationDate=1607553177000&api=v2
 344    :width: 300pt
 345 .. |image30| image:: https://wiki.onap.org/download/attachments/93003036/30.png?version=2&modificationDate=1607552712000&api=v2
 346    :width: 1000pt
 347 .. |image31| image:: https://wiki.onap.org/download/attachments/93003036/32.png?version=4&modificationDate=1612796710000&api=v2
 348    :width: 1000pt
 349 .. |image32| image:: https://wiki.onap.org/download/attachments/93003036/33.png?version=1&modificationDate=1607554073000&api=v2
 350    :width: 1000pt
 351 .. |image33| image:: https://wiki.onap.org/download/attachments/93003036/34.png?version=1&modificationDate=1607608398000&api=v2
 352    :width: 1000pt