---
sidebar_position: 10
---

# Plugin manifest

The plugin manifest describes metadata about a plugin. The manifest is used:

- By Future Ordering "Frontend Plugin Configurator" Navigator-app to display information about the plugin and to display configurable parameters
- By build script to generate javascript file names which include version

Each plugin must have a manifest file. Create a file named `manifest.json` that should contain the following properties:

- `version`: Example: "1.0.0"
- `esm`: Default: true. Use ES-module style plugins, se to true for modern browsers. See [Plugins in old browser](./plugins-old-browsers.md) for more info.
- `description`: Description of the plugin.
- `parameters`: Description of parameters in the configuration. Each parameter is rendered as inputs to be easily entered when configuring the plugin. See section below for more info.
- `defaultConfig`: Object describing default plugin config. These values are predefined in the Plugin Configurator when activating a plugin. Available values are:
    - `allowedDataUrls` (_string array_): Default value. Describes URLs that the plugin is allowed to load data from. These URLs are added to content sources in Content Security Policy. For more information see [CSP source values](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/Sources#host-source).
    - `allowBlobs` (_boolean_): Default value. Allows plugin use blobs. Enabling _allowBlobs_ adds _blob:_ to content sources in Content Security Policy.
    - `allowUnsafeInline` (_boolean_): Default value. Allows plugin to use inline scripts. Enabling _allowUnsafeInline_ adds _'unsafe-inline'_ to Content Security Policy.
    - `allowUnsafeEval` (_boolean_): Default value. Allows plugin to use _eval()_. Enabling _allowUnsafeEval_ adds _'unsafe-eval'_ to Content Security Policy.
    - `appTrackingConsent` (_boolean_): Default value. Requires user to allow app tracking in native app in order for plugin to be loaded.
    - `channels` (_enum array_): Default values. Requires channel to be one of defined values for plugin to be loaded. Valid values are **foapp**, **mobile-browser**, **desktop-browser**, **kiosk**.
    - `consentLevels` (_enum array_): Default values. Requires user to give consent to _all_ content levels for plugin to be loaded. Valid values are: **standard**, **preferences**, **statistics**, **marketing**.
    - `countryCodes` (_string array_): Default countryCodes. Describes countries were plugin is loaded.
    - `dependentOn` (_string array_): Default values. Defines load order of plugins. Describes names of plugin that are loaded before this plugin.

## Parameters

An array of objects. Properties of each object:

- `name` (_string_): Name of the parameter. It must match the property name in the plugin configuration on the context object.
- `friendlyName` (_string_): Name of the parameter as displayed in the Plugin Configurator.
- `description` (_string, optional_): Description of the parameter.
- `required` (_boolean_): Indicates whether the parameter is required.
- `defaultValue`(_any_): Predefined value in the Plugin Configurator.
- `schema` (_object_): Describes the type of the parameter with the following properties:
  - `type` (_string_): Type of the parameter, which can be string, boolean, integer, array, object or record.
  - (... additional properties depending on type)

### Parameters examples

Examples of how different schemas will be displayed in the plugin configurator.

Displayed as a text input

```json
{
    "schema": {
        "type": "string"
    }
}
```

Displayed as a checkbox

```json
{
    "schema": {
        "type": "boolean",
    }
}
```

Displayed as a list of string values

```json
{
    "schema": {
        "type": "array",
        "items": {
            "type": "string"
        }
    }
}
```

Displayed as select box (dropdown)

```json
{
    "schema": {
        "type": "string",
        "enum": ["dev", "test", "prod"]
    }
}
```

Displayed as input textbox with json content

```json
{
    "schema": {
        "type": "object",
        "properties": {
            "planId": {
                "type": "string"
            },
            "planVersion": {
                "type": "integer"
            }
        }
    }
}
```

Displayed as table, with default values

```json
{
    "schema": {
        "type": "record",
        "keys": {
            "type": "string"
        },
        "values": {
            "type": "object",
            "properties": {
                "title": {
                    "type": "string"
                },
                "description": {
                    "type": "string"
                }
            }
        }
    },
    "defaultValue": {
        "en": {
            "title": "Points & Rewards",
            "description": "Gather points and earn rewards"
        },
        "sv": {
            "title": "Poäng & Erbjudanden",
            "loading": "Samla poäng of få erbjudanden"
        }
    }
}
```
See [plugin translations example](./plugins-translations-example.md) for an example of a complete plugin using translations.

Note: if schema not supported an input textbox is shown which expects json.

## Example

Example of plugin that utilized config parameters.

_manifest.json_

```json
{
    "version": "1.0.0",
    "description": "Adds menu item 'Discounts' to popout navigation. Clicking it leads to framed page with discounts from Como",
    "esm": true,
    "parameters": [
        {
            "name": "env",
            "friendlyName": "Future Ordering Environment",
            "description": "The environment to target in future ordering. Use dev or test for testing. Prod for production. Default is prod.",
            "required": false,
            "schema": {
                "type": "string",
                "enum": ["dev", "test", "prod"]
            }
        },
        {
            "name": "enabledForUserIds",
            "friendlyName": "Enabled for user ids",
            "description": "Users IDs for which the feature is enabled",
            "required": false,
            "schema": {
                "type": "array",
                "items": {
                    "type": "string"
                }
            }
        }
    ]
}
```

_myplugin.ts_

```typescript
type MyContext = PluginContext & {
    config: {
        env?: 'dev' | 'test' | 'prod';
        /**
         * If set, only users with these user IDs will see the plugin.
         */
        enabledForUserIds?: string[];
    };
};

export default async (context: MyContext) => {
    const env = context.config.env ?? 'test';
    const enabledForUserIds = context.config.enabledForUserIds ?? [];
   
   // plugin code
};
```

## More examples

- See [plugin translations example](./plugins-translations-example.md) for an example of a complete plugin using translations.