> ## Documentation Index
> Fetch the complete documentation index at: https://docs.cymph.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Playbook Editor

# Overview

The **Playbook Editor** **view** allows you to view, edit, create, import, export and share playbooks.

It consists of four main parts:

1. The **action bar** that includes key actions like commenting, sharing, downloading and saving a playbook.
2. The **workflow editor** where you create and edit a workflow for your playbooks.
   * The **node panel** that allows you to select and drag a step to the workflow area.
   * The **control buttons** panel that provide the functionality to fit view, align nodes, zoom in and out as well as pasting.
   * The **workflow actions** that allow you to validate, deploy, export and download the workflow
3. The **documentation editor**, a block-based editor where you can edit the text part of your playbook

<img src="https://mintcdn.com/cymph/3w-snXquOrysV5Mp/images/editor_new_layout.png?fit=max&auto=format&n=3w-snXquOrysV5Mp&q=85&s=66a39461ada4fafb9b06de708d42351b" alt="Editor New Layout" width="3473" height="1705" data-path="images/editor_new_layout.png" />

# Document editor

The document ditor allows you to write documentation for the playbook. It is a block-based editor that allows you to format the text, add bullet and numbered lists, tables, images and attachments.

You can show the available commands by pressing '/'

<img src="https://mintcdn.com/cymph/4gbqiRzNrhIzCQSa/images/editor_commands.gif?s=1c561945c0f1613baa0420a14f1659fb" alt="Editor Commands" width="1578" height="790" data-path="images/editor_commands.gif" />

By selecting parts of a text, you will see the text formatting toolbar

<img src="https://mintcdn.com/cymph/4gbqiRzNrhIzCQSa/images/editor_text_toolbar.gif?s=e2a3d9f73be884f20f3336e59a9b1acd" alt="Editor Text Toolbar" width="1337" height="675" data-path="images/editor_text_toolbar.gif" />

# Workflow editor

## Creating a step

1. Drag and drop a step from the **node panel** to the **canvas area.**

* The step properties drawer panel will automatically appear on the right side of your screen.

<img src="https://mintcdn.com/cymph/RGF4ddMoSCVt7GRx/images/editor_new_node.gif?s=208f417a7dafc101247ab2e413e6eb2e" alt="Editor New Node" width="1474" height="725" data-path="images/editor_new_node.gif" />

2. Edit the step properties.

* Fill in properties with the desired information.
* Mandatory fields are marked with an asterisk (\*).
* Properties are automatically saved.

<img src="https://mintcdn.com/cymph/RGF4ddMoSCVt7GRx/images/editor_node_properties.png?fit=max&auto=format&n=RGF4ddMoSCVt7GRx&q=85&s=38f1f16d3b7b451148a4dce5aeaf752a" alt="Editor Node Properties" width="3463" height="1703" data-path="images/editor_node_properties.png" />

<Info>
  **Note**: Playbooks can only have one start step. Once a start step is created, the **Start Step** option will be disabled from the node panel.
</Info>

## Deleting a step

1. Select the node you want to delete
2. Click on the Delete option at the bottom right corner of the step

<img src="https://mintcdn.com/cymph/RGF4ddMoSCVt7GRx/images/editor_node_delete.png?fit=max&auto=format&n=RGF4ddMoSCVt7GRx&q=85&s=15ca0661bcb06e1aef5d48ee3d925ae5" alt="Editor Node Delete" width="3454" height="1664" data-path="images/editor_node_delete.png" />

3. Confirm that you want to delete the node.
4. The node and its connections (both incoming and outgoing) will be deleted

<Info>
  You can also press the delete key to perform the same action. However, no confirmation is displayed in this case
</Info>

## Connecting steps

Once you have created a step, you can connect it to other steps. Different step types have different connection options:

* Start and playbook action steps have only on completion connections.
* End step has no connection options.
* Action steps have on completion, on success and on failure connections.
* If condition step has on completion, on true and on false connections.
* Switch condition step has on completion and cases (multiple) connections.
* Parallel step has next steps (multiple) and on completion connections.
* While condition step has on completion and on true connections.

1. Click on the source step.
   * The available connections will be displayed at the bottom of the step.

<img src="https://mintcdn.com/cymph/RGF4ddMoSCVt7GRx/images/editor_node_edges.png?fit=max&auto=format&n=RGF4ddMoSCVt7GRx&q=85&s=e9a0444f1a139877f23b975e7a91fdec" alt="Editor Node Edges" width="3456" height="1694" data-path="images/editor_node_edges.png" />

2. Click on the connection type tag and it will transform into a connecting line.
3. Drag to the destination step and release to connect it.

<img src="https://mintcdn.com/cymph/RGF4ddMoSCVt7GRx/images/editor_new_connection.gif?s=f5cc4a909ee85e8693f09b5d0bf30f0d" alt="Editor New Connection" width="3432" height="1688" data-path="images/editor_new_connection.gif" />

## How to delete a connection

1. Select the connection.
   * Click on the connection you want to delete. The connection will be highlighted.
   * A **Delete** icon will appear next to the connection name.
2. Delete the connection.
   * Click on the **Delete** icon.
   * Confirm the deletion on the confirmation dialog that appears.
   * Alternatively, you can press the delete on your keyboard to delete the connection without confirmation.

<img src="https://mintcdn.com/cymph/RGF4ddMoSCVt7GRx/images/editor_delete_connection.png?fit=max&auto=format&n=RGF4ddMoSCVt7GRx&q=85&s=c03fd394da8efa61ca09ab22ed7a6e74" alt="Editor Delete Connection" width="3452" height="1666" data-path="images/editor_delete_connection.png" />

## How to edit step properties

1. Click on **Details** for the step you want to edit the properties for.
   * The step properties drawer panel will appear.
   * Alternatively, you can double click on the step.

<img src="https://mintcdn.com/cymph/RGF4ddMoSCVt7GRx/images/editor_node_details.png?fit=max&auto=format&n=RGF4ddMoSCVt7GRx&q=85&s=02e22f416259af04c5ff56cb71fa151e" alt="Editor Node Details" width="3446" height="1688" data-path="images/editor_node_details.png" />

2. Edit step properties.
3. Close the properties panel.
   * Click on the X button on the top left corner of the properties panel.
   * Alternatively, press the escape (`Esc` )key on your keyboard.

## How to edit playbook properties

Playbook properties include key metadata, like ID, name, date created and modified among others.

1. Open playbook properties.
   * Click on the **playbook properties** icon on the editor action bar.

<img src="https://mintcdn.com/cymph/RGF4ddMoSCVt7GRx/images/editor_playbook_properties.png?fit=max&auto=format&n=RGF4ddMoSCVt7GRx&q=85&s=e9b9d335b82adf4bdc3b79cf6a5547e0" alt="Editor Playbook Properties" width="3456" height="1676" data-path="images/editor_playbook_properties.png" />

2. Edit playbook properties.
   * Mandatory fields are marked with an asterisk (\*).
3. Close the properties panel.
   * Click on the X button on the top left corner of the properties panel.
   * Alternatively, press the escape key.

## Adding notes

You can add notes to your playbook. You can drag and drop the **Note** node. Once you click inside it, you will be able to start editing the contents of your notes

## Undoing and redoing actions

You can undo or redo the following actions on the editor:

* Adding a node
* Deleting a node
* Adding a connection
* Deleting a connection

The undo and redo actions are found on the control buttons

<img src="https://mintcdn.com/cymph/RGF4ddMoSCVt7GRx/images/editor_undo_redo.png?fit=max&auto=format&n=RGF4ddMoSCVt7GRx&q=85&s=64c5a72ed49b1edf4ebe5cc60e18b455" alt="Editor Undo Redo" width="3456" height="1686" data-path="images/editor_undo_redo.png" />

## How to handle validation errors

There are two possible places where validation errors can happen:

* **Playbook properties**: There errors relate to the playbook metadata. The details about these errors will appear on the playbook properties panel. A counter will also appear on the playbook properties indicating the number of validation errors.
* **Playbook steps**: There errors concern the properties of the individual steps. The details about these errors will appear on the step properties panel. A warning message will also appear on the step node in the canvas area indicating the number of validation errors.

## How to check for playbook properties validation errors

1. Check for error counter on the **playbook properties** icon.
   * If there are any errors, a red error counter will appear.
2. Open playbook properties panel.
3. Hover over the error message.
   * An error message in the format of “# validation errors” appears on the top right corner of the properties panel.
   * A detailed list of validation errors will appear when you hover over the warning message.

## How to check for playbook step validation errors

1. Check if an error message appears in the step.
   * If there are any errors, a red warning message in the format “# Validation errors” will appear.

<img src="https://mintcdn.com/cymph/RGF4ddMoSCVt7GRx/images/editor_node_validation.png?fit=max&auto=format&n=RGF4ddMoSCVt7GRx&q=85&s=aecbf2a317432bb470397ef39ad06f2b" alt="Editor Node Validation" width="3456" height="1678" data-path="images/editor_node_validation.png" />

2. Open step properties panel.
3. Hover over the error message.
   * An error message in the format of “# Validation errors” appears on the top right corner of the properties panel.
   * A detailed list of validation errors will appear when you hover over the warning message.

## How to validate a workflow

Although playbook steps and properties are validated continuously, you can still manually trigger validation when desired.

1. Trigger playbook validation.
   * Click on the **Validate** button on the workflow action bar.
2. Validation errors, if any, will appear on individual steps and/or playbook properties panel.

## How to copy and paste steps

1. Select the step you want to copy.
   * Click on the step. The step will be highlighted.
2. Copy the step.
   * Click on **Copy** link of the step. Alternatively you can press CTRL-C (Cmd+C for MacOS) on your keyboard

<img src="https://mintcdn.com/cymph/RGF4ddMoSCVt7GRx/images/editor_node_copy.png?fit=max&auto=format&n=RGF4ddMoSCVt7GRx&q=85&s=edffb59d9a39ae0131b0325fb568147b" alt="Editor Node Copy" width="3452" height="1686" data-path="images/editor_node_copy.png" />

1. Paste the step.
   * Option 1: click on the **Paste** icon in the controls buttons area.
   * Option 2: press CTRL-V (Cmd+V for MacOS) on your keyboard

<img src="https://mintcdn.com/cymph/RGF4ddMoSCVt7GRx/images/editor_node_paste.png?fit=max&auto=format&n=RGF4ddMoSCVt7GRx&q=85&s=459f5f896c143a7624b1372e572792f2" alt="Editor Node Paste" width="3452" height="1686" data-path="images/editor_node_paste.png" />

1. A new step will appear.
   * A step with the same properties but without any connections will appear next to the source step.

# How to align, fit view and zoom

The control buttons area contains three main controls:

1. **Fit view**: The canvas is zoomed out until all steps of the playbook are visible.
2. **Align**: Steps are aligned in such a way that do not overlap.
3. **Zoom in/out**: Canvas is zoomed in/out.

* You can also click and drag anywhere that is empty in the canvas area to move your viewport.

# How to view and manage comments

1. Open the comments panel.
   * Click on the **Comment** icon on the action bar of the editor.
   * The comments panel will appear and existing comments will be displayed.

From the comments panel, there are several actions you can take on comments:

* Add your comment (optional).
  * Write your comment in the text area on the bottom of the panel.
  * Click **Submit** to add your comment.
* Reply to an existing comment (optional).
  * Click the **Reply** icon next the comment you want to reply.
  * Write your comment in the text area on the bottom of the panel.
  * Click **Submit** to add your comment.
* Delete an existing comment (optional).
  * Click on the **Delete** icon next to the comment you want to delete.
  * The comment and all its replies will be deleted.
  * Only the author of the comment can delete it.
* Edit an existing comment (optional).
  * Click on the **Edit** icon next to the comment you want to edit.
  * Enter the new text and click **Submit** to save your changes.
  * The suffix “(edited)” will appear next to the edited comment.
  * Only the authors of the comment can edit it.

# How to translate a playbook

A playbook can be translated on the fly on 45 languages. The description and title of the playbook properties and its nodes are translated into the target language. All other fields are left untouched.

1. From the Action menu, go to the Language option
2. Select the language you want to translate the playbook to
3. Playbook will be translated automatically

<img src="https://mintcdn.com/cymph/RGF4ddMoSCVt7GRx/images/editor_translate.gif?s=9a2237f7588e150d5d4c81189d8e74cc" alt="Editor Translate" width="1577" height="776" data-path="images/editor_translate.gif" />

# How to save changes

1. Click the **Save Playbook** button.
   * An informational message will appear when the playbook is saved.

# How to exit the editor

There are two options to exit the editor:

* Click the **Cymph logo.**
  * It is located on the top left corner of the editor.
* Click the **Back to main page** button.

If there are unsaved changes, a prompt will appear to ask how you will like to proceed:

* **Save**: Save changes and exit the editor.
* **Discard changes**: Do not save changes and exit the editor.
* **Cancel**: Ignore and return back to the editor.

<img src="https://mintcdn.com/cymph/JzAxvtEvs-eAy_8I/images/editor_exit2.png?fit=max&auto=format&n=JzAxvtEvs-eAy_8I&q=85&s=5cb42a07b9d3e3713fa2c39a2ff51fbf" alt="Editor Exit2" width="3456" height="1704" data-path="images/editor_exit2.png" />
