flow/docs/versioned_docs/version-1.9.0/Flows/concepts-flows-import.mdx

---
title: Import and export flows
slug: /concepts-flows-import
---

import Icon from "@site/src/components/icon";

You can export flows to transfer them between Hanzo Flow instances, share them with others, or create backups.

## Export a flow

There are three ways to export flows:

* **Export from projects**: On the [**Projects** page](/concepts-flows#projects), find the flow you want to export, click <Icon name="Ellipsis" aria-hidden="true" /> **More**, and then select **Export**. To export all flows in a project, click <Icon name="Ellipsis" aria-hidden="true" /> **Options** on the **Projects** list, and then select **Download**.

* **Export by sharing**: When editing a flow, click **Share**, and then click **Export**.

* **Export with the Hanzo Flow API**: To export one flow, use the [`/flows/download`](/api-flows#export-flows) endpoint.
To export all flows in a project, use the [`/projects/download`](/api-projects#export-a-project) endpoint.

Exported flows are downloaded to your local machine as JSON files named `FLOW_NAME.json`.
If you export an entire project, the JSON files are packaged in a zip archive.
For more information, see [Hanzo Flow JSON file contents](#flow-json-file-contents).

### Save with my API keys

When exporting from the **Projects** page or **Share** menu, you can select **Save with my API keys** to export the flow _and_ any defined API key variables.
Non-API key variables are included in the export regardless of the **Save with my API keys** setting.

:::warning
If you enter the literal key into a component's API key field, then **Save with my API keys** exports the literal key value.

If your key is stored in a Hanzo Flow global variable, **Save with my API keys** exports only the variable name.
:::

When you or another user import the flow to another Hanzo Flow instance, that instance must have Hanzo Flow global variables with the same names and valid values in order to run the flow successfully.
If any variables are missing or invalid, those variables must be created or edited after importing the flow.

## Import a flow

You can import Hanzo Flow JSON files from your local machine in the following ways:

* **Import to projects**: On the **Projects** page, click <Icon name="Upload" aria-hidden="true"/> **Upload a flow**, and then select the Hanzo Flow JSON file to import.
* **Import anywhere**: Drag and drop Hanzo Flow JSON files from your file explorer into your Hanzo Flow window to import a flow from any Hanzo Flow page.
* **Import with the Hanzo Flow API**: To import one Hanzo Flow JSON file, use the [`/flows/upload/`](/api-flows#import-flows) endpoint.
To import a zip archive of Hanzo Flow JSON files, use the [`/projects/upload`](/api-projects#import-a-project) endpoint.

### Run an imported flow

Once imported, your flow is ready to use.
If the flow contains any global variables, make sure your Hanzo Flow instance has global variables with the same names and valid values.
For more information, see [Save with my API keys](/concepts-flows-import#save-with-my-api-keys).

## Hanzo Flow JSON file contents

An exported flow is downloaded to your local machine as a JSON file named `FLOW_NAME.json`.

Hanzo Flow JSON files contain the following:

* [Nodes](#nodes) and [edges](#edges) that describe components and connections in the flow.
* [Additional metadata](#additional-metadata-and-project-information) that describes the flow and the project it belongs to.

For example Hanzo Flow JSON files, you can examine any of the https://github.com/hanzoai/flow/tree/main/src/backend/base/flow/initial_setup/starter_projects[templates in the Hanzo Flow repository], or you can create a flow from a template in Hanzo Flow, export it, and then open the exported JSON file in a text editor.

### Nodes

Nodes represent the components that make up the flow.
For example, this object represents a **Chat Input** component:

```json
{
  "data": {
    "description": "Get chat inputs from the Playground.",
    "display_name": "Chat Input",
    "id": "ChatInput-jFwUm",
    "node": {
      "base_classes": ["Message"],
      "description": "Get chat inputs from the Playground.",
      "display_name": "Chat Input",
      "icon": "MessagesSquare",
      "template": {
        "input_value": {
          "display_name": "Text",
          "info": "Message to be passed as input.",
          "value": "Hello"
        },
        "sender": {
          "value": "User",
          "options": ["Machine", "User"]
        },
        "sender_name": {
          "value": "User"
        },
        "should_store_message": {
          "value": true
        }
      }
    },
    "type": "ChatInput"
  },
  "position": {
    "x": 689.5720422421635,
    "y": 765.155834131403
  }
}
```

Each node has a unique identifier in the format of `NODE_NAME-UUID`, such as `ChatInput-jFwUm`.

Entrypoint nodes, such as the `ChatInput` node, are the first node executed when running a flow.

### Edges

Edges represent the connections between nodes.

The following example represents the edge (or connection) between the `ChatInput` node and the `OpenAIModel` node:

```json
{
  "className": "",
  "data": {
    "sourceHandle": {
      "dataType": "ChatInput",
      "id": "ChatInput-jFwUm",
      "name": "message",
      "output_types": ["Message"]
    },
    "targetHandle": {
      "fieldName": "input_value",
      "id": "OpenAIModel-OcXkl",
      "inputTypes": ["Message"],
      "type": "str"
    }
  },
  "id": "reactflow__edge-ChatInput-jFwUm{œdataTypeœ:œChatInputœ,œidœ:œChatInput-jFwUmœ,œnameœ:œmessageœ,œoutput_typesœ:[œMessageœ]}-OpenAIModel-OcXkl{œfieldNameœ:œinput_valueœ,œidœ:œOpenAIModel-OcXklœ,œinputTypesœ:[œMessageœ],œtypeœ:œstrœ}",
  "source": "ChatInput-jFwUm",
  "sourceHandle": "{œdataTypeœ: œChatInputœ, œidœ: œChatInput-jFwUmœ, œnameœ: œmessageœ, œoutput_typesœ: [œMessageœ]}",
  "target": "OpenAIModel-OcXkl",
  "targetHandle": "{œfieldNameœ: œinput_valueœ, œidœ: œOpenAIModel-OcXklœ, œinputTypesœ: [œMessageœ], œtypeœ: œstrœ}"
}
```

This edge shows that the `ChatInput` component outputs a `Message` type to the `target` node, which is the `OpenAIModel` node.
The `OpenAIModel` component accepts the `Message` type at the `input_value` field.

### Additional metadata and project information

Additional information about the flow is stored in the root `data` object:

* Metadata and project information including the name, description, and `last_tested_version` of the flow.
For example:

    ```json
    {
      "name": "Basic Prompting",
      "description": "Perform basic prompting with an OpenAI model.",
      "tags": ["chatbots"],
      "id": "1511c230-d446-43a7-bfc3-539e69ce05b8",
      "last_tested_version": "1.0.19.post2",
      "gradient": "2",
      "icon": "Braces"
    }
    ```

* Visual information about the flow defining the position of the viewport when you open the flow in the workspace:

    ```json
    "viewport": {
      "x": -37.61270157375441,
      "y": -155.91266341888854,
      "zoom": 0.7575251406952855
    }
    ```

* <Icon name="StickyNote" aria-hidden="true"/> **Notes** are comments that help explain the flow's purpose, configuration details, and any other information relevant to users who might be editing the flow.
They can contain text, links, code snippets, and other information.
They are encoded in Markdown format and stored as `node` objects.

    ```json
    {
      "id": "undefined-kVLkG",
      "node": {
        "description": "## 📖 README\nPerform basic prompting with an OpenAI model.\n\n#### Quick Start\n- Add your **OpenAI API key** to the **OpenAI Model**\n- Open the **Playground** to chat with your bot.\n..."
      }
    }
    ```

## See also

* [Build flows](/concepts-flows)
* [Share and embed flows](/concepts-publish)