Visualize Component Configuration

Accessing the Sidebar Menu

After logging into AppMint Web Builder, you can access the MintFlow Sidebar Menu by following these steps:

1. Navigate to the Application Dropdown:

• Once you're logged in, locate the Application dropdown from the main dashboard.

2. Click on the MintFlow Plus (+) Icon:

   • In the dropdown, click on the MintFlow icon (+) to open the MintFlow Designer interface.

3. Sidebar Menu Location:

   • Once inside the MintFlow Designer, all the main controls and features are organized in the sidebar located on the left-hand side of the screen.
   • The sidebar provides quick access to all the available menu items for designing and managing your workflows.

The Visualize dropdown includes components that help in presenting data visually. The available components are DataForm and DataTable.

1. DataForm Configuration

1. Access the DataForm Component:

   • Go to the Visualize dropdown in the MintFlow Sidebar Menu and select DataForm.

2. Drag the DataForm Component into the Workflow:

   • Drag and drop the DataForm component onto the workflow canvas.

3. Configure the DataForm Component:

   • Expand the DataForm Node: Click on the Expand icon to open the configuration panel.
   • Set Node Position:
     • In Node Position: Choose from top, right, bottom, left, or hidden to set where the input node will appear relative to the DataForm.
     • Out Node Position: Choose from top, right, bottom, left, or hidden to set where the output node will appear relative to the DataForm.

Example Configuration for DataForm

• In Node Position: top
• Out Node Position: bottom

2. DataTable Configuration

1. Access the DataTable Component:

   • Go to the Visualize dropdown in the MintFlow Sidebar Menu and select DataTable.

2. Drag the DataTable Component into the Workflow:

   • Drag and drop the DataTable component onto the workflow canvas.

3. Configure the DataTable Component:

   • Expand the DataTable Node: Click on the Expand icon to open the configuration panel.
   • Set Node Position:
     • In Node Position: Choose from top, right, bottom, left, or hidden to set where the input node will appear relative to the DataTable.
     • Out Node Position: Choose from top, right, bottom, left, or hidden to set where the output node will appear relative to the DataTable.

Example Configuration for DataTable

• In Node Position: left
• Out Node Position: right

Example Configuration for DataTable

1. Drag the DataTable feature into the workflow.
2. Click the Expand icon and set the following configuration:
   • Table Name: User Data Table
   • Columns: User ID, Name, Email
   • Sorting: Name, Email
   • Filtering: Search by Name

---