Change the default Atlassian Icon of the app in Issue View, Hide the App Button

Hello everybody,

i am using Forge to develop an app with the Custom UI option and i have some small painpoints (attachment below) :frowning: .

  • Is it possible to change the default Atlassian Icon of the app in Issue View with a custom one, like a png which is in the main directory of the app instead of this property in manifest <icon: https://developer.atlassian.com/platform/forge/images/issue-panel-icon.svg> ?
  • Is it possible to remove completely the app button from the Issue View, while the app is enabled per condition in an issue type?
  • Is it possible to extend the conditions of showing/hiding the button or even the issue panel per jql ?

If those questions have been answered before, i apologise in advance.

Best Regards
Christos

Hey Forge

Hey @ChristosMoysiadis !

You can always change it it manifest no matter if you’re using Custom UI or Forge UI Kit
Please take a look at icon property https://developer.atlassian.com/platform/forge/manifest-reference/modules/#jira-issue-panel . Just put there valid URL to icon (SVG preferred)

Example

modules:
  jira:issuePanel:
    - key: hello-custom-ui-hello-world-panel
      resource: main
      resolver:
        function: resolver
      viewportSize: medium
      title: hello-custom-ui
      icon: https://www.example.com/some.svg
  function:
    - key: resolver
      handler: index.handler
resources:
  - key: main
    path: static/hello-world/build
app:
  id: ari:cloud:ecosystem::app/my-secret-id
  name: hello-custom-ui

result:
image

2 Likes

Hey @MichalMichalczuk

nice to meet you first of all and thank you for your reply.

To be honest, your answer is something i know and i have tried. I just wanted to deliver some thumbnails like assets of the app in the static directory of it.
If this is not possible, then i assume that ,in case, i publish my app in the marketplace i can give the url of the app logo or the thumbnail link from my documentation page.

What about the other 2 points? Any insights?

Thank you in advance :slight_smile:

1 Like

Ah, got your point :bulb: !
I think it is not possible, since our CDN generates unique URLs which are not predictable.

About

  • Is it possible to remove completely the app button from the Issue View, while the app is enabled per condition in an issue type?
  • Is it possible to extend the conditions of showing/hiding the button or even the issue panel per jql ?

Have you tried display conditions?
https://developer.atlassian.com/platform/forge/manifest-reference/display-conditions/

You cannot use custom jql there, but you can build logic based on system/issue properties like

  • is user admin
  • issueType
  • projectKey

  • Just to name a few :wink:

Sounds like condition based on issueType fits your case

jira:issuePanel:
- key: hello-world-panel
  function: issue-panel-function
  title: Hello world!
  icon: https://developer.atlassian.com/platform/forge/images/issue-panel-icon.svg
  displayConditions:
    issueType: Bug
3 Likes

Hey,

amazing fast reply. :smiley: thanks.
I got you again, because i tried those options too. Maybe i have to extend lil bit different the display condition logic, while there is no option for jql .

I would like to ask also something which is not related with the summary of this topic, but it has to do with the manifest. Hope its not a problem.

I know that there is the property viewportSize in the docs and it has only 4 options!
But, is there any way to dynamically change the panel size based on the size of the content?

For example,

  • If i have 2 text lines i would like the panel to be “small” sized so i earn space, and when it has 2 paragraphs to be “large/xlarge”.
    I am asking this because i saw other plugins, have implemented this “logic”.

Best Regards
Chris

Hey, that one wasn’t fast. Sorry for that :sadpanda: :cry:

But, is there any way to dynamically change the panel size based on the size of the content?

AFAIK we’re not supporting it for Custom UI.
While using Forge UI Kit (https://developer.atlassian.com/platform/forge/ui-kit-components/) panel size fits the content (to some extend).

PS Can you share with me those plugins? Those might be Connect apps, as I remember those can be dynamically changed.

Hey :slight_smile:
no worries.

An app like this is Xray :slight_smile: . They have dynamic panels and I thought it could be used also in Forge. :confused: But it seems like I have to stick to the current configs :slight_smile:

What I don’t understand though is that in Custom UI apps the panel size is kind of fixed, but on UI kit apps the panel (Fragment) is quite flexible. Is it in the scope or are there considerations for something like this in the future?

Best regards and thank you for replying back

Under the hood - in Forge UI Kit we know what will be rendered, in Custom UI … well - It is whatever iFrame handles :wink:

Is it in the scope or are there considerations for something like this in the future?

:thinking: I’ll get back to you with an answer soonish (probably tomorrow)

2 Likes

@ChristosMoysiadis we briefly discuss it internally, we didn’t had it on our roadmap but it sounds like a valid proposal :blush:

I’ve created ticket for gather interest around it :blush:
(please watch :eye: the ticket and give it :+1: )
[FRGE-259] Dynamically change the Jira Issue panel size based on the content size in Custom UI - Ecosystem Jira

If you have some more details about your case which you could share, like

  • more detail description
  • designs

Please add those directly on the mentioned ticket to give us more context.

2 Likes

Oh man you are amazing :smiley: This is great :smiley:

But I face a small problem. I can not see the ticket, when I click on it. I see, for some reason, only the ecosystem page! :confused: Are there any steps I should do before I get access in that project.?

:suspicous: I just opened the page in incognito mode, and it works fine :thinking:

You can try to copy paste address as below :smiley:
(but shouldn’t make difference)

https://ecosystem.atlassian.net/browse/FRGE-259

1 Like

Can this path to icon be a local svg image?

Yes. You can at least host the icon within the Atlassian Cloud.

  1. Place the image in you react apps assets folder (probably sth. unter /public)
  2. Insert the image in a React component
  3. Deploy.
  4. Use Chrome dev-tools to obtain the actual image url (will be sth. like: https://3610e22b-7f0d-4ae6-835d-aed4ce848a14.cdn.prod.atlassian-dev.net/66b1fd9b-1ae2-4a4f-8bd8-a1ccb1ba82ad/e2106cdf-8b07-4bcf-a1e5-1972e48544ae/e07bf0da-195f-45b1-8ec4-2396ea203774/st-panel-resources/childissue-icon.svg)
  5. optional: shorten this link with bit.ly
  6. use the url in manifest.yml

That’s the way we do it with Easy Subtask Templates

Good luck :slight_smile:

2 Likes