Seeing extra new lines between a Forge UI kit form and a section message

Forge
, ,
1

Hello All,

I am working on a forge Jira app. I have an admin page module with a form and a table to display some results. I am seeing a few extra new lines between the form and section message. Given that this is a forge Ui Kit app I am not adding any css. So wondering how these extra lines are getting added.

Please see the attached screenshot

extra new lines
extra new lines1582Ă—369 67.7 KB

Any idea why this is happening ? Thanks in advance.

3

Welcome to the Atlassian Developer Community, @AndrianF!

I confirmed this with the team and the UI kit components being wrapped in a div is expected in order to space the components evenly from each other.

However, upon checking the screenshot you shared, we’d like to understand if there are any other components between the Form and SectionMessage. To have a better context of the current behavior, can you share snippets of your code relating to these components?

Cheers,
Ian

4

@ianRagudo Thank you very much for getting back to me. Please see the attached component code where I have the form and the search results table. Looks like I can only attach one media file with one post. So trying to fit all in one screenshot.

Here is the component for the form &

the component that refers to another component which contains the table with the results &

the component which contains the section message and the table with results

Please let me know if anything else is needed. Thanks

5

Hi @AndrianF, I do not see any glaring issues with the code. I also did a quick test based on the screenshot you shared, but I was not able to replicate the issue. Is it still consistently happening?

In the boxed divs, does all the other divs contain the same as the first expanded one? If so, it looks like multiple empty Text components but I do not see this in the snippets you shared, though.

If you strongly feel that this is a bug, kindly raise it here.

Cheers,
Ian

2 Likes
6

@ianRagudo
Thanks I think you pointed me in the correct direction. It was actually a bunch of empty tags being added inside “SearchDuplicateConfigurationsResultsTable” component.

Based on the item selected I noticed the number of new lines increased. I simply switch my conditions to use a switch / case instead of if conditions and the extra new lines went away.

Thank you again for looking into this.

1 Like