-
Notifications
You must be signed in to change notification settings - Fork 117
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix: assistant picker broken if some assistant names > 20 chars #4568
Conversation
f6a7647
to
103bb56
Compare
* `maxStringLength`. | ||
* @param str The string to truncate. | ||
*/ | ||
export function ellipsis(str: string, maxStringLength: number) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why not using CSS classes for this?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We could but IMHO the downsides are:
- not usable elswhere than inside tags in .tsx;
- less convenient, harder to setup ( text-ellipsis cannot be used alone, we need to think about other concerns such as do I want overflow-hidden, wrap/no wrap, do I need to set a max-width --> asking those questions is sometimes relevant, sometimes not and we lose time and complexify css just for the sake of the ellipsis)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
less convenient, harder to setup ( text-ellipsis cannot be used alone, we need to think about other concerns such as do I want overflow-hidden, wrap/no wrap, do I need to set a max-width --> asking those questions is sometimes relevant, sometimes not and we lose time and complexify css just for the sake of the ellipsis)
To me, it can be configure as easily as what's being done here and offer a nicer UX. Here 20 characters might work on a laptop but not on mobile. Leveraging CSS covers everything 😉
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
fine, fine 👍
visual={c.pictureUrl} | ||
hasAction={false} | ||
onClick={() => { | ||
onItemClick(c); | ||
setSearchText(""); | ||
}} | ||
className="truncate" |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
❤️
* Fix: assistant picker broken if some assistant names > 20 chars * review * clean
Description
See title & screenshot
Note: also switches spinner to spinner2 in instructions, which fixes https://github.com/dust-tt/tasks/issues/612
Risk
Deploy Plan