Development Toolkit

An add-on manifest is used to describe how your CAKE.com Marketplace add-on integrates with the Clockify app. Your add-on can contain some additional UI elements that will be added by installing that add-on and manifest file can define details regarding those elements.
Manifest is a JSON file that needs to be hosted on a path to an add-on URL app and included in the add-on URL root folder.

When creating an add-on at CAKE.com Marketplace, manifest URL is required. You need to enter it in a form at the first step of creating an add-on. 

Top-level properties

Components

Components contain details about your add-ons UI elements such as their type, e.g. tab, widget, sidebar, or permission access level, e.g. component can be accessed by admin or everyone.

Example

"components": [
    {
    "type": "sidebar",
    "label": "${sidebarLabel}",
    "accessLevel": "ADMINS",
    "path": "${sidebarPath}",
    "options": {
        "option 1": "option 1 value",
        "option 2": "option 2 value"
    },
    "iconPath": "/trt"
  ]

Lifecycles

Lifecycles contain events add-on receives when installed, deleted, or when its settings are updated.

Example

"lifecycle": [
    {
      "path": "/postinstall",
      "type": "INSTALLED"
    },
    {
      "path": "/uninstalled",
      "type": "DELETED"
    }
  ]

Webhooks

Webhooks contain details about events that trigger the webhook requests. There can be various types of webhooks, depending on the events.

Example

"webhooks": [
    {
      "event": "NEW_TIME_ENTRY",
      "path": "/clockify/time-entry"
    },
    {
      "event": "NEW_CLIENT",
      "path": "clockify/client"
    }
  ],

Settings

Settings contain details about additional settings for UI elements (e.g. dropdown with options 1, 2, 3). Settings are organized by nesting tabs and groups. Each setting must have id, name, type, value and access level. Value and type of setting must be compatible.
If the value of settings is a URL path (e.g. /settings), settings are taken from an add-on and displayed in Clockify app via iFrame. These types of settings are hosted on an add-on.
If empty, there are no settings for that add-on.

Example

"settings": [
    {
        "id": "sidebarLabel",
        "accessLevel": "ADMINS",
        "value": "Custom label",
        "name": "Custom label for component",
        "type": "TXT"
     },
     {
        "id": "sidebarPath",
        "accessLevel": "ADMINS",  
        "value": "/sidebar",
        "name": "Custom label for component",
        "type": "TXT"
      }
 ]

Tabs

Tabs are at the top level of hierarchy when defining settings.
Tabs cannot be nested in other tabs or groups and they need to have at least one type of settings defined, whether it’s a “settings” or a “groups” property. If “groups” property is the one defined, it needs to have at least one “settings” property defined in it.
For more information on “groups”, check out Groups section.

Example

"settings": {
    "tabs": [
    {
        "id": "Tab id",
        "name": "Tab one title",
        "header": {
            "title": "Title text"
        },
        "groups": [
            {
                "id": "Group id",
                "title": "Group one title",
                "description": "Group description",
                "header": {
                    "title": "Header title"
                },
                "settings": [
                    {
                        "id": "Setting id",
                        "name": "Default setting",
                        "description": "Description of default setting",
                        "placeholder": "Default setting here...",
                        "type": "TXT",
                        "value": "Value of default setting",
                        "required": true,
                        "copyable": true,
                        "readOnly": false, 
                        "accessLevel": "ADMINS"
                    }
                ]
            }
        ],
        "settings": [
            {
                "id": "Tab setting",
                "name": "Tab setting",
                "type": "TXT",
                "value": "Some value",
                "required": true,
                "accessLevel": "EVERYONE"
            }
        ]
    }
]}
]

Groups

Serves as another level of hierarchy when defining settings. Group can be part of tabs, and one tab can contain multiple groups. Each group needs to have its “id” and can have “title”, “description”, “header” and “settings”.

Example

"groups": [
            {
                "id": "Group id",
                "title": "Group one title",
                "description": "Group description",
                "header": {
                    "title": "Header title"
                },
                "settings": [
                    {
                        "id": "Setting id",
                        "name": "Default setting",
                        "description": "Description of default setting",
                        "placeholder": "Default setting here...",
                        "type": "TXT",
                        "value": "Value of default setting",
                        "required": true,
                        "copyable": true,
                        "readOnly": false,
                        "accessLevel": "ADMINS"
                    }
                ]
            }
        ]

Settings

These settings are defined in “settings” or “groups” properties.

Example

"settings": [
    {
        "id": "Setting id",
        "name": "Default setting",
        "description": "Description of default setting",
        "placeholder": "Default setting here...",
        "type": "TXT",
        "value": "Value of default setting",
        "required": true,
        "copyable": true,
        "readOnly": false,
        "accessLevel": "ADMINS"
     }
 ]