Excessive space accordion

[ayushgml]

This PR addresses the issue:

• excessive space between accordion sections #3695

Changes

• I added the following in ant-collapse-item-active (Panel) :

display: flex;
flex-direction: column;
justify-content: space-between;

How to test it

• Run the Electron app and go to the ExplorerPane

Screenshots

Checklist

• tested locally
• added new dependencies
• updated the docs
• added a test

[ayushgml]

Hey @topliceanurazvan! I made the necessary changes. Please suggest any changes if you encounter any issues.

[topliceanurazvan]

Seems like we are still missing some padding from the bottom of the pane:

Expected:

The rest of the work looks good! 🙌🏻

[ayushgml]

Okay @topliceanurazvan I will fix this padding issue!

[ayushgml]

@topliceanurazvan I made the change! The padding issue was happening only when FilesPane was selected and padding was there when other panes were selected. This was because FilesPane has a slightly different structure than the rest of them. Rest of them have lists which are made using the styled component ListContainer. FilesPane didn't have it so i removed the extra height only when the FilesPane is selected.

This issue issue might be due to the height miscalculation in the AccordionPanel:
const height = usePaneHeight() - PANEL_HEADER_HEIGHT - 130 - (props.panelKey === 'files' ? 35 : 25);

Though I fixed the issue!🙌🏼 You can test it out from your end.

[topliceanurazvan]

Great work! 👍🏻