Skip to content
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.

Sign up for GitHub

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

Jump to bottom

Introduce Specific Icons image identifier for Notes and Tasks #6486

Open
Bonapara opened this issue Aug 1, 2024 · 5 comments · May be fixed by #6997
Open

Introduce Specific Icons image identifier for Notes and Tasks #6486

Bonapara opened this issue Aug 1, 2024 · 5 comments · May be fixed by #6997
Assignees
@ehconitin
Labels
good first issue Good for newcomers prio: low scope: front Issues that are affecting the frontend side only size: short type: design improvement

Comments

@Bonapara
Copy link
Member

Bonapara commented Aug 1, 2024

Current Behavior

Currently, the image identifier for both Notes and Tasks is the first letter of the task or note enclosed in a circle. This design is similar to that used for People & Custom object identifiers, which can cause confusion.

Desired Behavior

To improve visual differentiation and user experience, we should introduce specific icon image identifiers for these items:

  • Notes Icon: A Yellow note icon.

image

image

https://www.figma.com/design/xt8O9mFeLl46C5InWwoMrN/Twenty?node-id=36824-90522&t=7he5Wg1gGH5yGp53-11

  • Tasks Icon: A Blue checkbox icon.

image

image

https://www.figma.com/design/xt8O9mFeLl46C5InWwoMrN/Twenty?node-id=36824-90299&t=7he5Wg1gGH5yGp53-11
@Bonapara Bonapara added scope: front Issues that are affecting the frontend side only size: minutes labels Aug 1, 2024
@ehconitin
Copy link
Contributor

On it

@ehconitin
Copy link
Contributor

ehconitin commented Aug 1, 2024 •
edited
Loading

Hi @Bonapara,

I took a look at this issue. From a performance perspective, it might be more efficient to handle this on the backend by storing the specific icon in the avatarUrl. This approach aligns with how other icons are managed using Twenty's favicon system. Checking each record on the frontend to determine if it's a Note or Task could potentially lead to performance issues.

I think this should be scoped to backend :(
I might be wrong, so do get a second opinion on this.
Thanks

@Bonapara
Copy link
Member Author

Bonapara commented Aug 1, 2024

@Weiko do you think it should be handled by the backend too?

@FelixMalfait
Copy link
Member

@ehconitin I don't think there would be any perf issue doing it on the frontend.
We already do similar adjustments. For example we have getAvatarType which is used to display a different icon for companies, I think we should build around that.
I'm not sure what would be most elegant, probably introduce an avatarType=icon and pass the icon in a separate var.

@FelixMalfait FelixMalfait added the good first issue Good for newcomers label Sep 11, 2024
@ehconitin ehconitin linked a pull request Sep 11, 2024 that will close this issue
Open
@ehconitin
Copy link
Contributor

PR 6997

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@ehconitin ehconitin

Labels
good first issue Good for newcomers prio: low scope: front Issues that are affecting the frontend side only size: short type: design improvement
Projects
Product development ✅
Status: 🆕 New
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Introduced Specific Icons image identifier for Notes and Tasks ehconitin/twenty
3 participants
@FelixMalfait @Bonapara @ehconitin