Modal dialog of "issue action" module is displayed in fixed square size

Forge Forge UI Kit and Custom UI
1

I have created a sample “Jira action” module app using “forge create”. I wanted to test how modal resizes according to its content.

  • I have removed viewportSize from jira:issueAction module in manifest.yml.
  • I have added style={{width: "500px", height: "800px", backgroundColor: "red"} to div in App.js file to make it tall and narrow.

According to documentation, this should set the size of the dialog automatically according to its content. But it is not working as expected. It still displays a square dialog, as shown in the screenshot. Can you help me to understand what I’m missing?

image
image631×572 8.17 KB

manifest.yml

modules:
  jira:issueAction:
    - key: modalresizetest-hello-world-issue-action
      resource: main
      resolver:
        function: resolver
      title: ModalResizeTest
  function:
    - key: resolver
      handler: index.handler
resources:
  - key: main
    path: static/hello-world/build

App.js

import React, { useEffect, useState } from 'react';
import { invoke, view } from '@forge/bridge';

function App() {
  const [data, setData] = useState(null);

  useEffect(() => {
    invoke('getText', { example: 'my-invoke-variable' }).then(setData);
  }, []);

  return (
    <div style={{width: "500px", height: "800px", backgroundColor: "red"}}>
      <button onClick={() => view.close()}>Close</button>
      {data ? data : 'Loading...'}
    </div>
  );
}
2 Likes