Using soy template with web-panel

Atlassian Developer Tools
,
1

Hi ,

I am able to get velocity template working with web-panel , however when referencing soy template it doesn’t work.

Can somebody help me with a snippet on how to reference soy-template within a web-panel ?

I tried the example listed out here - Adding a board configuration page , but the reference to soy template doesnt work

<web-panel key="my-configuration-page" location="jira.agile.board.configuration" weight="1">
        <label key="my.configuration.page.label">My Configuration Page</label>
        <resource type="soy" name="view" location=":soy/My.addOn.tpl.board.config.myConfigurationPage" />
    </web-panel>
3

Hello @ajay!

The snippet you pasted assumes that in the same atlassian-plugin.xml file you have a web-resource with the key “soy” that contains of soy resource, having for example My.addOn.tpl.board.config namespace with .myConfigurationPage template inside.

<web-resource key="soy" name="My app soy server-side resources">
        <transformation extension="soy">
            <transformer key="soyTransformer"/>
        </transformation>
        <resource type="soy" name="boardConfigPage" location="templates/boardConfigPage.soy"/>
    </web-resource>

and in your templates/boardConfigPage.soy the following structure:

{namespace My.addOn.tpl.board.config}

/**
    Some description of this template to be filled.
     If you need/pass params, do not forget to include them in SoyDoc as well.
*/
{template .myConfigurationPage}
    <div>Your markup here</div>
{/template}

Kind regards,
and have a great time at App Week!

1 Like
4

Thanks @mrzymski … that explains and solves the problem :blush:

1 Like
5

@mrzymski

I am now trying to get react working on the web-panel … now that my soy template is loading…
However I am struggling to get the react components loaded on the soy template…

Any clues on why the web-resources are not loading … (The global page works for me though which is served using a servlet) . How do you specify the context for loading the web-resources in a web-panel?

{template .scmglobalpage}
    {webResourceManager_requireResourcesForContext('scmglobalpage')}
    <html>
    <head>
        <meta charset="utf-8"/>
        <meta name="decorator" content="atl.admin">
        <meta name="admin.active.section" content="atl.jira.view.issue.right.context">
        <title>SCM Global Page</title>
    </head>
    <body>
    <div id="maincontainer">
        <div id="container">
        </div>
    </div>
    </body>
    </html>
{/template}

Sample workspace attached

https://drive.google.com/drive/folders/1_Wo2dMpbonoABwJ5nn5Fyu_vrzWZ3lEZ?usp=sharing

6

Hi,
Depending on how web-panel is rendered, the calls to WRM to load contexts or web-resources may not necessary work:

  • it works when the page along with those web-panels is server-side rendered and there’s a point where WRM is drained and resource tags are put to the page
  • on the other hand when the web-panel is rendered async. or via REST there’s no point for WRM drain
    In the latter case, it’s common to use the client-side WRM client to load contexts or web-resources.
    For cases when the web-panel can be rendered in both ways, there are both calls: one that you have (calling WRM Java API) and the client-side call.
    (a note: WRM client is aware that a given context was already loaded, so the 2nd call for the same thing will be a no-op, doesn’t hurt).
    You can call WRM client inside a script type=module (but there’s an issue with that when jQuery is used later on to put such async. fetched markup on the page) or a regular script with resourcePhaseCheckpoint (since Jira 9.0). This is especially important for pages with defer scripts, such as Dashboard and Issue view since Jira 9.0, otherwise you won’t be able to access WRM client at that point.
<script type="module">
    require('wrm/require')('wrc!scmglobalpage_or_other_name_of_the_context');
</script>

<script>
window.resourcePhaseCheckpoint.defer.then(() => {
    require('wrm/require')('wrc!scmglobalpage_or_other_name_of_the_context');
});
</script>

Yet another way for case with a template with both WRM type of calls, when you know that the async one is going to happen always after DCL, which has the additional benefit of working pre and post Jira 9.0:

{webResourceManager_requireResourcesForContext('scmglobalpage_or_other_name_of_the_context')}
<script>
if (WRM.require) {
    require('wrm/require')('wrc!scmglobalpage_or_other_name_of_the_context');
}
</script>

I hope that it helps,
Cheers!