Jira issue glance module in Forge or Connect app being deprecated and replaced. This module is being deprecated and replaced by Jira issue context module on Oct 6, 2023. Check out How to future-proof your Issue Glance implementation on how to migrate.
The jira:issueGlance
module adds an issue glance to Jira, which is content that is shown/hidden in
an issue by clicking a button. The button for the issue glance is placed alongside fields
such as Assignee and Labels. Clicking the button opens the content provided by the Forge app, so
that it fills the right sidebar.
This module can be used in Jira Work Management, Jira Software, and Jira Service Management. It works in the new issue view but not the old issue view.
For UI Kit 1, see the IssueGlance component documentation for more information.
1 2modules: jira:issueGlance: - key: hello-world-issue-glance resource: main resolver: function: resolver render: native title: Hello World! description: A hello world issue glance. label: Hello World!
Property | Type | Required | Description |
---|---|---|---|
key |
| Yes |
A key for the module, which other modules can refer to. Must be unique within the manifest. Regex: |
resource | string | If using Custom UI or modern versions of UI Kit | The key of a static resources entry that your module will display. See resources for more details. |
render | 'native' | If using modern versions of UI Kit | Indicates the module uses UI Kit. |
function | string | Deprecated Required if using UI Kit 1 | The key of a function module that returns a UI Kit 1 component. |
resolver | { function: string } or{ endpoint: string } |
Set the Set the | |
title | string or i18n object | Yes |
The title of the issue glance, which is displayed above its label. The |
label | string or i18n object | Yes |
The text shown on the button for the issue glance. The |
icon | string |
The icon displayed to the left of the For custom UI and UI Kit apps, the If no icon is provided, or if there's an issue preventing the icon from loading, a generic app icon will be displayed. | |
status | object | The badge, lozenge, or icon shown to the right of the label . If status is not
specified, then nothing is shown. See status properties. | |
displayConditions | object | The object that defines whether or not a module is displayed in the UI of the app. See display conditions. | |
dynamicProperties | { function: string } | Contains a function property, which references the function module that returns changeable properties. See Dynamic properties for more details.
|
Internationalization (i18n) for Forge apps is now available through Forge's Early Access Program (EAP). For details on how to sign up for the EAP, see the changelog announcement.
EAPs are offered to selected users for testing and feedback purposes. APIs and features under EAP are unsupported and subject to change without notice. APIs and features under EAP are not recommended for use in production environments.
For more details, see Forge EAP, Preview, and GA.
Key | Type | Required | Description |
---|---|---|---|
i18n | string | Yes | A key referencing a translated string in the translation files. For more details, see Translations. |
Property | Type | Required | Description |
---|---|---|---|
type | 'badge' | 'lozenge' | 'icon' | Yes | The UI element used to display the status. |
value | object | Yes |
This property is an object representing the status value. See status value properties. |
Property | Type | Required | Description |
---|---|---|---|
label | string | Yes | The text to display in the status. If |
url | string |
If | |
type | 'default' | 'inprogress' | 'moved' | 'new' | 'removed' | 'success' |
If |
Dynamic properties are used to dynamically update the status
properties. If provided in the manifest.yml
file,
Jira attempts to retrieve the dynamic properties on the initial render of the app. To do this, the dynamicProperties
handler function of the app is called. When the issue glance item is clicked, the app renders in the side panel,
where it can perform business logic updates. After the side panel is closed, the handler function
is called to retrieve updates, and then update the status
.
The app's handler function is passed the payload
argument. The payload
object has the following structure:
1 2interface Payload { // The cloudId for your site cloudId: string; extension: { // The module type included in the manifest.yml file. type: "jira:issueGlance"; issue: { id: string, type: string, key: string, typeId: string }, project: { id: string, type: string, key: string } }; }
The handler function should return (or resolve with) a plain JavaScript object with status
as key.
This is an example of a handler function returning an object:
1 2function handlerFunction(contextPayload) { return { "status": { "type": "lozenge", "value": { "label": "Dynamically set status", "type": "moved" } } }; }
When you use an icon
in your dynamic properties, its source URL is subject to a permission check.
For an example of adding source URL permissions for your icon
property, see External Permissions.
Bundled resources in the following formats are allowed by default:
resource:<resource key>;<relative path to resource>
data:image
URIsSee Icons for more information about bundling icons as a resource.
When the source URL does not have the appropriate permissions, the dynamic properties are not loaded. The default configuration is used instead.
Use the useProductContext hook to access the extension context in UI Kit or getContext bridge method in custom UI.
Property | Type | Description |
---|---|---|
type | string | The type of the module. |
issue.id | string | The id of the issue on which the module is rendered. |
issue.key | string | The key of the issue on which the module is rendered. |
issue.type | string | The type of the issue on which the module is rendered. |
issue.typeId | string | The id of the type of the issue on which the module is rendered. |
project.id | string | The id of the project where the module is rendered. |
project.key | string | The key of the project where the module is rendered. |
project.type | string | The type of the project where the module is rendered. |
Use the useProductContext hook to access the context in UI Kit 1.
Property | Type | Description |
---|---|---|
type | string | The type of the module. |
Property | Type/value | Description |
---|---|---|
issueId | string | The ID of the issue on which the module is rendered. |
issueKey | string | The key of the issue on which the module is rendered. |
issueType | string | The type of the issue on which the module is rendered. |
issueTypeId | string | The ID of the type of the issue on which the module is rendered. |
projectId | string | The ID of the project where the module is rendered. |
projectKey | string | The key of the project where the module is rendered. |
projectType | string | The type of the project where which the module is rendered. |
Apps can receive a frontend event that will notify your app that an issue has been changed. This event is triggered when an issue is updated or commented on. This event is only available for Jira issue view modules.
1 2import {events} from '@forge/bridge'; events.on('JIRA_ISSUE_CHANGED', (data) => { console.log('JIRA_ISSUE_CHANGED (Forge)', data); });
However, if you have multiple issue view modules in your app, you should use the Jira issue view background script module or its Connect counterpart. This will give you a central place for fetching issue details, thus reducing the number of network requests and improving the user experience. Fetching issue details separately for every module would introduce unnecessary overhead and degrade performance.
1 2{ "issueId": string, "projectId": string, "changes":[{ "changeType": "updated" | "commented", "atlassianId": string }] }
Property | Description |
---|---|
issueId | ID of the issue the app is rendered on. |
projectId | ID of the project the issue belongs to. |
changes | List of issue changes
|
Rate this page: