# Utility Bar Grid

**GM - FieldSet Grid**, **GM - ListView Grid** and **GM - RelatedList Grid** can be embedded as a utility bar item. Below is a quick demo on how to configure an Open Task utility bar using **GM - FieldSet Grid**.

{% embed url="<https://youtu.be/yc2u0FQUcgE>" %}
Gridmate - Utility Bar Grid Setup
{% endembed %}

In our example, we configured the utility bar item properties (Label, Icon, Width and Height)

![](/files/oGnlVPfCDU6ewpz78WWz)

We configured the **GM - FieldSet Grid** properties same as configuring it on the Lightning App Builder. We added a custom field Marker on the Task object to highlight the task based on the priority.&#x20;

The column style is set to make the marker field short. The tasks are filtered to see only open one and sorted by due date. We configured an autolaunched flow action to mark tasks as completed.

```coffeescript
[
   {
      "name": "markcomplete",
      "label": "Mark as Complete",
      "icon": "utility:check",
      "component": "gmpkg:DataGridCallFlowComponent",
      "attributes": {
         "flowName": "Complete_Task",
         "idListParam": "idList",
         "autolaunched": true
      }
   }
]
```

Finally we set the coloring configuration based the priority.

```coffeescript
{
   "Marker__c": [
      {
         "color": "#F08D8D",
         "exp": {
            "Priority": {
               "operator": "in",
               "value": [
                  "High"
               ]
            }
         }
      },
      {
         "color": "#FF9C25",
         "exp": {
            "Priority": {
               "operator": "in",
               "value": [
                  "Normal"
               ]
            }
         }
      },
      {
         "color": "#B0FD9F",
         "exp": {
            "Priority": {
               "operator": "in",
               "value": [
                  "Low"
               ]
            }
         }
      }
   ]
}
```

{% hint style="success" %}
We recommend using the Config. Wizard to configure the utility bar.
{% endhint %}

Below is a quick demo of the final version of our utility bar where the user can smoothly see his open tasks and mark them as completed with few clicks!

{% embed url="<https://youtu.be/r_lwMRaK0Jc>" %}
GM - Utility Bar Grid Demo
{% endembed %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.gridmate.io/product-tour/smart-grids-in-utility-bar.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
