ShowFlag in Post Function Forge App

[TMonatisa]

Hi 

import { showFlag } from '@forge/bridge';

export const postfunction = ({ issue, transition: { from, to }, configuration: {message} }) => {
  console.log(`PostFunction for issue ${issue.key} for transition from status ${from.id} to ${to.id} with config message: ${message}`);
  const flag = showFlag({
    id: 'success-flag',
    title: 'Hello World!',
    type: 'info',
    description: 'Here is a flag body description.',
    actions: [
      {
        text: 'Flag action',
        onClick: () => {
          console.log('flag action clicked');
        },
      }
    ],
    isAutoDismiss: true,
  });

  flag.close();
};

I am developing a Forge app that displays a message when an issue transitions to another status. While I can see the message in the console when using console.log, I am unable to display it using ShowFlag.

Since this is a Custom UI app, could you assist me in ensuring the message appears correctly? Any guidance would be greatly appreciated.

Kind regards

Tiisetso Monatisa

[Tim Pettersen · Accepted solution]

Hi @TMonatisa

The `showFlag` function is only supported on the client-side, whereas post-functions are evaluated on the backend. You can't use it directly in a post-function module.

However, you can workaround this by using an `issueViewBackgroundScript` module to use the `showFlag` function instead.

I created a little example app that uses this technique last week for another customer: https://github.com/kannonboy/forge-toaster

It allows an admin to create a message targeting a specific user which is then displayed as a flag the next time they view an issue or a dashboard in Jira. At the moment it does this via an `adminPage`, but you could adapt it to create the message from a post-function instead.

cheers,

Tim

[TMonatisa]

Hi Tim

Thank you. I will use the workaround.

[ELFAPP Technologies]

Hi @TMonatisa 

That's the same example in the documentation minus being nested with an export function. Probably you should not include the showFlag object inside an export function.

[TMonatisa]

Hi @ELFAPP Technologies 

So where should I call the showFlag if not in the export function?

[ELFAPP Technologies]

I think for you to use it the way you want, you most probably want to return showFlag then you can include it in the export function. For example

import { showFlag } from '@forge/bridge';


const flag = () => {
  return showFlag({
    id: 'success-flag',
    title: 'Hello World!',
    type: 'info',
    description: 'Here is a flag body description.',
    actions: [
      {
        text: 'Flag action',
        onClick: () => {
          console.log('flag action clicked');
        },
      }
    ],
    isAutoDismiss: true,
  });
}

export const postfunction = ({ issue, transition: { from, to }, 
configuration: {message} }) => {
  console.log(`PostFunction for issue ${issue.key} 
  for transition from status ${from.id} to ${to.id} 
  with config message: ${message}`);

flag().close();

};