Rate this page:

IssuePanelAction

The IssuePanelAction component defines an item in the more actions ••• menu of an issue panel. You can view existing issue panel actions via the more actions ••• menu.

You must provide the IssuePanelAction component as an argument to the actions property of the IssuePanel component.

Usage

1
import ForgeUI, { IssuePanelAction } from '@forge/ui';

Props

NameTypeRequiredDescription
textstringYesThe name of the item that’s added to the actions menu of an issue panel.
onClick() => void|Promise<void>YesAn event handler executed when the item is clicked. You can perform state updates inside this function.

Example

A hello world example of an IssuePanel component with a custom action.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
import ForgeUI, {IssuePanel, IssuePanelAction, render, Text, useProductContext, useState} from '@forge/ui';

const App = () => {
    const [waveCount, setWaveCount] = useState(0);
    return (
        <IssuePanel actions={[
            <IssuePanelAction text="Custom action" onClick={() => {
                setWaveCount(waveCount + 1);
            }}/>
        ]}>
            <Text>Hello, world! {"👋".repeat(waveCount)}</Text>
        </IssuePanel>
    );
};
export const run = render(
    <App/>
);

Preview

Example of an Issue panel with a custom action

Rate this page: