Add truncate for names in sidebar pane

[marcincodes]

Describe your changes

Truncate names that are overflowed

Issue link

#446

Checklist before requesting a review

• I have performed a self-review of my code
• If it is a core feature, I have added thorough tests.

[changeset-bot]

⚠️ No Changeset found

Latest commit: e0401fc

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[vercel]

@marcincodes is attempting to deploy a commit to the sofn Team on Vercel.

A member of the Team first needs to authorize it.

[psugihara]

beautiful

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
mailing-dynamic-demo	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Oct 5, 2023 8:45pm
web-emails	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Oct 5, 2023 8:45pm

1 Ignored Deployment

Name	Status	Preview	Comments	Updated (UTC)
mailing-web	⬜️ Ignored (Inspect)	Visit Preview		Oct 5, 2023 8:45pm

[psugihara]

I think there's a real test failure on this one, I re-ran a couple times.

[marcincodes]

Seems like I added a div and accessibility tool catch that this div is not accessible:

expected '<div.truncate>' to have attribute 'aria-selected'

I will fix that