# Compact Calendar

GridMate provides a lightning component **GM - Compact calendar**  to display the **Event**, **Task**, or any **Objects** on the calendar as activities.

In this tutorial, we will configure the **GM - Compact calendar** component to display **Task** and **Events** object on the Calendar.

* Select an **Opportunity** and edit the page in the Lightning App Builder.
* From components list, drag and drop the component **GM - Compact calendar**.
* The **GM - Calendar component** is now ready for configuration in the Lightning App Builder.
* The property values can be configured to tailor the component to the needs of the end-user.
* To perform a quick configuration, populate the properties below: 
  * Title : **Opportunity Calendar.**
  * Custom Icon : **standard:task.**
  * Json config : See [Json config](#below-is-the-json-config-configured-for-the-demo).

#### Below is the JSON Config configured for the demo

{% code fullWidth="false" %}

```coffeescript
[
    {
        "objectApiName": "Task",
        "dateField": "ActivityDate",       
        "iconName": "standard:task",
        "backgroundColor": "",
        "filter": "{\"WhatId\": {\"operator\" : \"=\", \"value\" : \"$recordId\"}}",
        "titleField": "Subject",
        "detailFields": [
            "Description"
        ]
    },
    {
        "objectApiName": "Event",
        "dateField": "ActivityDate",
        "fromDateField": "StartDateTime",
        "toDateField": "EndDateTime",
        "iconName": "standard:event",
        "backgroundColor": "#94baf7",
        "filter": "{\"WhatId\": {\"operator\" : \"=\", \"value\" : \"$recordId\"}}",
        "titleField": "Subject",
        "detailFields": [
            "Description"
        ]
    }
]
```

{% endcode %}

Below is a step by step tutorial to configure the **GM - Compact Calendar** 👇.

{% embed url="<https://youtu.be/ze0-eqS5GBI>" %}
GridMate - Compact Calendar
{% 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/compact-calendar.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.