Bird’s-eye View

The Bird’s-eye View is a visualization tool provided by Momen that helps you intuitively see the dependencies between various components, data, and actions in your project. It graphically displays the connections between data tables, APIs, workflows, and other components, giving you a better understanding of your project’s architecture and data flow.

Feature Overview

The Bird’s-eye View presents your project data as nodes and connections:

• Nodes: Represent different data elements in your project (data tables, APIs, workflows, etc.)
• Connections: Indicate dependencies between elements (calls, references, triggers, etc.)
• Interactions: Support clicking, hovering, and filtering to explore data relationships

Node Types

The Bird’s-eye View displays the following types of nodes:

1. Data Tables: Created data tables
2. APIs: Created APIs
3. Workflows: Created workflows
4. Variables: Created global variables, page variables, workflow variables, etc.
5. Component Data: Component inputs and outputs
6. AI: Created AI agents
7. Roles: Created roles
8. Triggers: Created triggers

Relationship Types

Connections represent different types of relationships between elements:

1. Calls: Call relationships between APIs, workflows, and AI, e.g., a workflow calls an API
2. Creates: Data creation relationships, e.g., a workflow creates a data record
3. Reads: Data query relationships, e.g., a component reads data table information
4. Updates: Data modification relationships, e.g., a component action updates data table content
5. Deletes: Data deletion relationships, e.g., a component action deletes data table content
6. References: Data reference relationships, e.g., a workflow output references a workflow variable
7. Triggers: Event trigger relationships, e.g., a trigger starts a workflow
8. Assigns: Variable assignment relationships, e.g., a page variable assigns to a global variable
9. Governs: Permission control relationships, e.g., an admin role governs modification permissions for the account table
10. Is a Type of: Type definition relationships, e.g., the account table serves as a type definition for a global variable
11. Uses as Data Source: Used as a page data source, e.g., a page uses the account table as its data source
12. Uses as Tool: Used as an AI tool, e.g., an AI assistant uses an API as a tool
13. Uses as Context: Used as an AI context, e.g., an AI assistant uses the account table as a context

How to Use

Viewing the Graph

1. In the data model, workflow, or AI editor, click the “Bird’s-eye View” button.
2. The system will automatically generate a dependency graph centered on the current element in the editor.
3. Node size is automatically adjusted based on the number of connections—the more connections, the larger the node.

Node Interactions

1. Hover over a node to display basic information.
2. Click a node to highlight it and emphasize related connections.
3. Quickly jump to node details for editing.

Connection Interactions

1. Click a connection to view detailed relationship information.
2. Use the right panel to filter relationship types (multi-select supported).

Filtering and Search

1. Filter node types at the top and relationship types on the right (multi-select supported).
2. The system automatically hides unconnected nodes to keep the graph clean.
3. Search for nodes at the top and relationships on the right (fuzzy search supported).

Use Cases

1. Quickly understand project structure and data flow
2. Analyze dependencies and impact of changes
3. Troubleshoot data and call issues
4. Optimize architecture and data access

Notes

1. For large projects, use filters to focus—system automatically optimizes performance
2. The graph reflects the latest state in real time and updates automatically after changes
3. Displayed content is subject to permissions—only accessible data is shown

FAQ

1. Node not displayed: It may be unconnected or hidden by filters
2. Viewing relationships: Search, click nodes, or filter by relationship type
3. Incomplete graph: Check filter settings or permissions