Multiple modules with UI kit

Is it possible to use multiple modules with UI kit? Or I need to use Custom UI?

Can you expand a bit more on the question? Have you tried using multiple modules and hit an error? When you say “modules”, are you referring to the modules defined in a Forge app’s manifest: https://developer.atlassian.com/platform/forge/manifest-reference/modules/ ?

Yes, I am trying to use adminPages and Jira Issue Panel, and I am not sure how to implement it in my code. For now I am using just AdminPages:

export const run = render(
    <AdminPage>
        <App/>
    </AdminPage>
);

And I would like to add Issue Panel, how can I implement it in index.jsx?

Thank you

Thanks for clarifying.

You are not able to use the two of those modules together.

Let me try to explain why a little bit. At the top level, modules are how you let the Forge platform know that you want to render some content in the spaces the modules reference. For instance, the Jira Admin Page means your app wants to have some sort of “Admin page” experience–this is the selectable item from the menu on left nav:

Whereas, if you add the Jira Issue Panel module, that means your app wants to add something when a user is viewing an issue:

These are fundamentally different places in a user’s experience.

Based on the code snippet you shared, I can see that you’re wanting to use UI Kit. With UI Kit, for each module that you can declare in your manifest, you will need to return the corresponding component at the top-level.

So for Admin Page, you’ll use the Admin Page Component:

export const run = render(
    <AdminPage>
        <App/>
    </AdminPage>
);

And likewise, for Issue Panel, you’ll use the Issue Panel Component:

export const run = render(
    <IssuePanel>
        <App/>
    </IssuePanel>
);

Again, each module handler will need to return a corresponding top-level component.