Vps 40/dropdown trunucation

[GogaIV]

Issue

drop down truncation

Solution

it was a little small i felt you could only fit 22 chars so i expanded it and added a scroll for overflow
I also added an extra quick command for lint and prettier on the side cause it saves a few seconds

Images

Risk

None

Checklist

• Acceptance criteria met
• Wiki documentation is written and up to date
• Unit tests written and passing
• Integration tests written and passing
• Continuous integration build passing

[linear]

VPS-40

[leowla]

It would be better to wrap text here.

e.g.

https://primer.style/accessibility/patterns/truncation/#interactive-elements

Do not truncate text if it contains focusable elements such as links, buttons, and mentions/tags.

If you experience this challenge, some potential design alternatives are:

• Wrap text instead of truncate (so long as focus does not break)
• Use a tooltip that is keyboard and screen reader accessible to announce the entirety of text
• Offer a method such as a button or toggle to "expand all titles" and "hide titles"

[GogaIV]

sum like this

[leowla]

You can do yarn run prettier lint to save time. We could set up a pre-commit hook to properly solve this problem but anyway this should be done in a separate PR since its not related to the dropdown.

[leowla]

📐