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

# Workflow Interface

> Explore the powerful components of Odella`s intuitive workflow interface

## Key Interface Components

Odella's workflow interface is designed to be intuitive yet powerful, allowing you to create complex legal workflows with ease. Let's explore the main components:

<CardGroup cols={2}>
  <Card title="Sidebar" icon="sidebar" image="/images/sidebar.png">
    Navigate between projects, flows, and access essential configuration options.
  </Card>

  <Card title="Flow Canvas" icon="diagram-project" image="/images/flow-canvas.png">
    The main workspace where you design and visualise your legal workflows.
  </Card>

  <Card title="Block Editor" icon="pen-to-square" image="/images/block-editor.png">
    Customise individual blocks to fine-tune your workflow's behaviour.
  </Card>

  <Card title="Action Bar" icon="play" image="/images/action-bar.png">
    Control the execution of your workflows and access additional features.
  </Card>
</CardGroup>

## Saving Your Work

Saving your work in Odella is crucial to ensure that all your changes are preserved. Here's what you need to know about saving:

<Frame>
  <img src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/workflow_save_light.gif?s=44550f5acaa21cdd84eab4001cee3c7b" alt="Workflow Save (Light Mode)" className="block dark:hidden" width="472" height="384" data-path="assets/workflow_save_light.gif" />

  <img src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/workflow_save_dark.gif?s=f704f89bb86f5dc4dd20be45cd72ddb5" alt="Workflow Save (Dark Mode)" className="hidden dark:block" width="472" height="384" data-path="assets/workflow_save_dark.gif" />
</Frame>

<CardGroup cols={2}>
  <Card title="Save Before Running" icon="play">
    Odella automatically saves your work before you run a workflow, ensuring your changes are always protected when executing your flows.
  </Card>

  <Card title="Manual Save" icon="floppy-disk">
    Manually save your work at any time by pressing Ctrl+S (Windows) or Cmd+S (Mac).
  </Card>
</CardGroup>

<Callout type="info">
  It's a good practice to manually save your work after making significant changes to your workflow.
</Callout>

### Save Indicators

Odella provides visual indicators to show the save status of your work:

* A green checkmark indicates that all changes have been saved.
* A spinning icon indicates that changes are being saved.
* A red exclamation mark indicates that there are unsaved changes.

<Tip>
  Always ensure your work is saved before closing the browser or logging out. If you see the red exclamation mark, make sure to manually save your changes.
</Tip>

## Sidebar

The sidebar is your central navigation hub, offering quick access to project information, flows, and flow-specific details.

<Frame>
  <img src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/workflow_sidebar_light.gif?s=e8c6c1c251125b76019d008aba463278" alt="Sidebar (Light Mode)" className="block dark:hidden" width="1010" height="858" data-path="assets/workflow_sidebar_light.gif" />

  <img src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/workflow_sidebar_dark.gif?s=ed9d7fa0a4df8f0befcbe3f9c75e6e02" alt="Sidebar (Dark Mode)" className="hidden dark:block" width="1010" height="858" data-path="assets/workflow_sidebar_dark.gif" />
</Frame>

### General Tab

The General tab allows you to set basic information about your workflow:

* **Workflow Name**: Set a clear, descriptive name for your workflow.
* **Workflow Description**: Provide a concise overview of your workflow's purpose and scope.

<Tip>
  A well-documented project makes collaboration easier and helps you quickly identify the right workflow when you need it.
</Tip>

### Flows Tab

The Flows tab is where you manage your workflow components:

* **Main Flow**: The primary, undeletable flow of your workflow.
* **Flow Explorer**: Click on any flow to view and edit it.
* **Add Flow**: Click the "+" icon to create a new flow.
* **Rename Flow**: Use the pencil icon to edit a flow's name and description.
* **Delete Flow**: Remove a flow with the trash icon. Note: This action is irreversible.

Use this tab to organize and structure your legal workflow efficiently.

<Callout type="warning">
  Deleting a flow is permanent and cannot be undone. Always ensure you have a backup of your workflow before making significant changes.
</Callout>

### Plugins Tab

The Plugins tab allows you to integrate external services and extend the functionality of your workflows:

Currently available plugins include:

* **G-Mail**: Draft, send and search for e-mails in your workflows using G-Mail.
* **Hubspot**: Search your Hubspot CRM for contacts and companies.
* **Google Drive**: Access files in your Google Drive for use in our template builder and within your workflows.

<Tip>
  Connecting plugins enhances your workflow capabilities by allowing seamless integration with external tools and services you already use.
</Tip>

### Builder Tab

The Builder tab provides settings to customize your workflow environment:

* **Previous data per node to keep**: Set the number of previous data values to retain for each node. This helps in tracking the history of node operations.
* **Zoom sensitivity**: Adjust the sensitivity of zooming when using the mouse wheel. Move the slider towards "Slow" for finer control or "Fast" for quicker zooming.

<Tip>
  Experiment with these settings to find the optimal configuration for your workflow management style. Adjusting the zoom sensitivity can greatly improve your navigation experience on the canvas.
</Tip>

### Delete Workflow

The Delete Workflow tab allows you to permanently remove a workflow and all its associated data:

To delete a workflow:

1. Click the **"Delete workflow"** button in the sidebar to open the deletion interface.
2. To prevent accidental deletions, you must **type the exact name** of the workflow you wish to delete in the text field (e.g., "Delete New test workflow").
3. The delete button will become **active** once the correct name is entered.
4. Click the **"Delete New test workflow"** button to permanently remove the workflow.

<Callout type="warning">
  **Deleting a workflow is irreversible.** Ensure you have backups of any important data before proceeding with deletion.
</Callout>

## Flow Canvas

<Frame>
  <img className="dark:hidden" src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/workflow_canvas_light.gif?s=f9e038e340b87af6f3ded53f0a3b0c42" alt="Workflow Canvas Light Mode" width="1010" height="858" data-path="assets/workflow_canvas_light.gif" />

  <img className="hidden dark:block" src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/workflow_canvas_dark.gif?s=e1b6ccf3ddebaa09793e14d4d5bbfe7e" alt="Workflow Canvas Dark Mode" width="1010" height="858" data-path="assets/workflow_canvas_dark.gif" />
</Frame>

The Flow Canvas is where your legal workflows come to life. Here's how to navigate and use this powerful space:

* **Pan**: Click and drag to move around the canvas.
* **Zoom**: Use the scroll wheel to zoom in and out.
* **Add Blocks**: Right-click to open the context menu and add new blocks.
* **Select Multiple Blocks**: Hold Shift and drag to create a selection box, or Shift-click block title bars.
* **Group Operations**: Move selected blocks as a group or create subflows from selections.

## Block Editor

<Frame>
  <img className="dark:hidden" src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/workflow_block_edit_light.gif?s=7c01d557c8a11fbcaf4c818a90e6ee1b" alt="Workflow Block Editor (Light Mode)" width="1010" height="858" data-path="assets/workflow_block_edit_light.gif" />

  <img className="hidden dark:block" src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/workflow_block_edit_dark.gif?s=5de8356dcfed58acd6848782cb49fda6" alt="Workflow Block Editor (Dark Mode)" width="1010" height="858" data-path="assets/workflow_block_edit_dark.gif" />
</Frame>

Customise your workflow blocks with the Block Editor:

<CardGroup cols={2}>
  <Card title="Block Details" icon="pen">
    Edit block titles and descriptions for clear documentation.
  </Card>

  <Card title="Batching" icon="layer-group">
    Enable batch processing and set maximum batch amounts for efficiency.
  </Card>

  <Card title="Variants" icon="code-branch">
    Create and switch between different versions of a block to test variations.
  </Card>

  <Card title="Block-Specific Editors" icon="sliders">
    Access specialised editors tailored to each block type.
  </Card>
</CardGroup>

## Action Bar

Control your workflow execution and access additional features:

<Frame>
  <img className="dark:hidden" src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/workflow_action_light.gif?s=3dbf13c6574d9326029b5e265ccf8a1e" alt="Workflow Action Bar (Light Mode)" width="1362" height="870" data-path="assets/workflow_action_light.gif" />

  <img className="hidden dark:block" src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/workflow_action_dark.gif?s=dfaafca8776df509ded5cd51e7229291" alt="Workflow Action Bar (Dark Mode)" width="1010" height="858" data-path="assets/workflow_action_dark.gif" />
</Frame>

<CardGroup cols={4}>
  <Card title="Run" icon="play">
    Start executing the current flow.
  </Card>

  <Card title="Abort" icon="stop">
    Immediately stop the running flow.
  </Card>

  <Card title="Pause/Resume" icon="pause">
    Temporarily halt or continue flow execution.
  </Card>

  <Card title="Settings" icon="gear">
    Access additional Odella features and settings.
  </Card>
</CardGroup>

<Tip>
  Experiment with different components of the interface to find the most efficient workflow for your legal tasks. The flexibility of Odella's interface allows you to tailor your experience to your specific needs.
</Tip>
