Bitbucket modules
Common modules
Compass modules
Confluence modules
Jira modules
Jira Service Management modules

This module now has support for UI Kit 2 (preview) for faster user experiences and to access additional React features.

For more information on all the supported modules, see the Supported products and their modules section.

# Jira project page

The jira:projectPage module adds an item in the Apps section of the left navigation of Jira company-managed project settings in the project sidebar. When the item is clicked, content is rendered on a new Jira page.

The page URL is constructed in the form of: /jira/{projectType}/projects/{projectKey}/apps/{appId}/{envId}

You can use the UI kit or custom UI to create content for the Jira page. This module can be used in Jira Work Management, Jira Software, and Jira Service Management.

See the ProjectPage component documentation for an example. When adding this to your app, use it as a top-level component.

Example of a project page


By default, the jira:projectPage module registers a top-level page. However, there is an option to register multiple pages using a pages or sections field.

Use pages to add individual pages to the sidebar and sections to group pages.

The sidebar will only change the project page URL, you will need to handle routes inside your custom UI app using view.createHistory().

This feature works only with custom UI.

Manifest example

    - key: hello-world-project-page
      resource: main
        function: resolver
      render: native
      title: Hello World!





A key for the module, which other modules can refer to. Must be unique within the manifest.

Regex: ^[a-zA-Z0-9_-]+$

functionstringThe project page module requires a function for use with the UI kit or a resource when building with custom UI.A reference to the function module that defines the project page. This function must return the ProjectPage component.
resourcestringA reference to the static resources entry that your project page wants to display. See resources for more details.
render'native'Yes for UI Kit 2Indicates if the module is a UI Kit 2 module.
resolver{ function: string } or
{ endpoint: string }

Set the function property if you are using a hosted function module for your resolver.

Set the endpoint property if you are using Forge remote to integrate with a remote backend.

Can only be set if the module is using the resource property.

titlestringYesThe title of the project page, which is displayed at the top of the page. The title also appears as an item in the `Apps` section of the left navigation of Jira company-managed project settings.

The icon displayed next to the title.

For custom UI and UI kit apps, the icon property accepts a relative path from a declared resource. Alternatively, you can also use an absolute URL to a self-hosted icon. See Icons for more information.

If no icon is provided, or if there's an issue preventing the icon from loading, a generic app icon will be displayed.

layout UI Kit:
  • native
  • basic
Custom UI:
  • native
  • blank
  • basic (deprecated)
(default: native)
The layout of the project page that defines whether a page is rendered with default controls (native), lays out the entire viewport with a margin on the left and breadcrumbs (basic for UI kit), or is left blank allowing for full customization (blank for custom UI).
pagesPage[]You can only specify `pages` or `sections` but not both.The list of subpages to render on the sidebar.
sectionsSection[]The list of sections to render on the sidebar.
displayConditionsobjectThe object that defines whether or not a module is displayed in the UI of the app. See display conditions.


titlestringYesThe title of the subpage, which is displayed on the sidebar.
iconstringThe URL of the icon that's displayed next to the subpage title. A generic app icon is displayed if no icon is provided.
routestringYesThe unique identifier of the subpage. This identifier is appended to the project page URL.


headerstringThe section header.
pagesPage[]YesThe list of subpages to render on the sidebar.

Extension data

Custom UI

Use the getContext bridge method to access the extension context in custom UI.

typestringThe type of the module.
stringThe id of the project where the module is rendered.
stringThe key of the project where the module is rendered.
stringThe type of the project where the module is rendered.

UI kit

Use the useProductContext hook to access the context in UI Kit.

Extension context

typestringThe type of the module.

Platform context

projectIdstringThe ID of the project where the module is rendered.
projectKeystringThe key of the project where the module is rendered.
projectTypestringThe type of the project where which the module is rendered.

Rate this page: