Add ability to set custom icons

mozilla / multi-account-containers

Firefox Multi-Account Containers lets you keep parts of your online life separated into color-coded tabs that preserve your privacy. Cookies are separated by container, allowing you to use the web with multiple identities or accounts simultaneously.

https://addons.mozilla.org/firefox/addon/multi-account-containers/

Mozilla Public License 2.0

2.64k stars 323 forks source link

Add ability to set custom icons #2368

Open dannycolin opened 2 years ago

dannycolin commented 2 years ago

Let the users add a custom icons to their containers.

dave-kennedy commented 1 year ago

You mentioned elsewhere that this requires work upstream. What exactly is required?

It looks like someone did this in #231. Can we not do the same thing here?

dannycolin commented 1 year ago

It looks like someone did this in https://github.com/mozilla/multi-account-containers/pull/231. Can we not do the same thing here?

This icons were added manually (in the PR) in Firefox source code. This issue is to let the user uploads a custom one and the code in Firefox doesn't handle this specific use case.

dave-kennedy commented 1 year ago

Gotcha. So we could easily add a bunch more icons though, right?

FlorianWendelborn commented 1 year ago

@dave-kennedy in theory, yes. In practice, it'd be more viable to allow custom icons since it'd otherwise make firefox a competitor to icon websites in a few years 😄

atharen commented 1 year ago

Is having an emoji picker a reasonable substitute?

dannycolin commented 1 year ago

Is having an emoji picker a reasonable substitute?

Not really because the goal is to not have more hardcoded icons.

mathstuf commented 1 year ago

How is an emoji picker a set of hardcoded icons? Or is there some detail about the implementation that means every emoji codepoint would require a manual mapping?

Karasiq commented 1 year ago

How is an emoji picker a set of hardcoded icons? Or is there some detail about the implementation that means every emoji codepoint would require a manual mapping?

I agree, that would be an ideal solution. Also maybe this is possible to add option to select the favicon of an one of bound sites.

Jieiku commented 1 year ago

@dannycolin Your opening post says "Let the users add a custom icons to their containers."

I am wondering if you can edit it to include more information, such as where these changes need to take place, etc.

From reading this post it seems this is simply impossible unless something upstream changes in firefox?

I am just hoping for a post that outlines what changes need to be made and where.

It seems the goal is to not hard code additional icons but allow users to add their own, which is fine.

I found one post outlining some of the required changes: https://github.com/mozilla/multi-account-containers/issues/391#issuecomment-1198503007

Here is somebody that manually added them, but it was followed up with the API does not like it? https://github.com/mozilla/multi-account-containers/issues/984#issuecomment-348807006

This looks like a way to change the builtin colors to appear as different colors: https://github.com/mozilla/multi-account-containers/issues/391#issuecomment-368238595

Some sorting info here: https://github.com/mozilla/multi-account-containers/issues/1707#issuecomment-613476957

Firefox tickets: https://bugzilla.mozilla.org/show_bug.cgi?id=1533542 https://bugzilla.mozilla.org/show_bug.cgi?id=1454188

dannycolin commented 1 year ago

From reading this post it seems this is simply impossible unless something upstream changes in firefox? I am just hoping for a post that outlines what changes need to be made and where.

You're right. It can only be implemented upstream. As I'm not a Mozilla developer, it isn't easy for me to outlines in details what's needed.

However, the tl;dr that I can give you is that you'd need to:

Change the contextualidentity module in order to accept custom images
Have a way to validate the image respect a set of rules (dimension, format, etc)
Expose this feature to the webextension API
Handle backward compatibility for addons that expect a value from the current hardcoded list of icons.

If you are considering contributing a patch, the best place to ask more question before even starting to write one line of code would be on #introduction on https://chat.mozilla.org. Make sure to mention bug 1533542 and ask who you should get in touch with to mentor you.

If you never used Matrix before, read https://wiki.mozilla.org/Matrix. It has some useful information on how to join our server.

atharen commented 1 year ago

I'll just say, that emoji are built-in for Firefox (ctrl+f emoji), and seems to have bundled font as well...

Let's start from this simple premise:

[ ] Can the extension render a unicode/emoji symbol or is it just tofu?
- This extension made it work, from the source, looks like it bundles some emoji fonts.

From there:

[ ] how difficult would it be to colour emoji? or make them a single colour?
- And if colouring is an issue, maybe don't colour the emoji character?
[ ] The icon appears in the address bar; can unicode appear in the address bar?
[ ] Can a custom font appear in the address bar?
- Probably no, unless you stick it as a picture, presumably like the existing implementation...

I dunno, overall seems like something that should go through without issue; mainly doubtful of the latter point, and even then, one can use the system fonts (or maybe twemoji?), which might not be consistent across OSs, I don't think that is going to affect a lot of users.

atharen commented 1 year ago

For the record, the only reason I don't like custom icons, is because they wouldn't be portable - I don't want to load my multi-account container icons on each fresh Firefox install.

And if there is some free service for extension backups, I doubt the provider intends it to be for bitmaps, probably just for configs.

mathstuf commented 1 year ago

I don't want to load my multi-account container icons on each fresh Firefox install.

Ideally they'd be stored in containers.json so that it can be ported nicely.

MikeDacre commented 1 year ago

@dannycolin This issue has existed for a long time and seems somewhat stalled by upstream.

Would you be amenable to the addition of a few more SVG icons to the current set (maybe 6 more)?

I would be happy to add them myself in a PR.

Also open to suggestions on which icons to make and how many.

mathstuf commented 1 year ago

Selfishly, icons that would be nice to replace the circles I am using:

newspaper/magnifying glass/magazine for "news"
something graph-like for "social"
wrench for "tools" or "code"
controller for "game"
sports thing (ball, bike, whatever) for "fitness"
something for temporary tabs (smoke, cloud, clock?)

Just suggestions; take or leave as anyone sees fit (or according to difficulty).

dannycolin commented 1 year ago

@MikeDacre it's been triaged as P5 (See bug 1533542) meaning Firefox developers (upstream) are open to accept a patch from a contributor.

If you wish to do so, you can read the documentation on https://firefox-source-docs.mozilla.org/contributing/contribution_quickref.html#firefox-contributors-quick-reference. This will help you get a working development environment to build Firefox locally and work on your patch.

If at any point you're stuck, please don’t hesitate to ask at https://chat.mozilla.org/ in the #introduction channel for any questions on the tools used to work on Firefox codebase. You can also join #containers if you want to discuss further about this patch.

MikeDacre commented 1 year ago

@dannycolin Thanks!

I am not sure if I'll have time to do all of that though, I was actually thinking of replicating PR #231 and adding a small number of new hard coded icons. Would that be acceptable for now?

I will see if I have time to work on the actual new feature folks are asking for the way you suggest also.

dannycolin commented 1 year ago

I was actually thinking of replicating PR #231 and adding a small number of new hard coded icons. Would that be acceptable for now?

We can't implement it like in #231 because this code is now part of Firefox itself.

This is where the CSS code goes and svgs are placed in /content directory: https://searchfox.org/mozilla-central/source/browser/components/contextualidentity/content/usercontext.css#50

You'll need to update this two lists (only adding the new icon names):

Then, you'll need to add the icons where needed in Multi-Account Containers. It's a "good-first-bug" in term of complexity but it indeed needs time to update everything.

Another thing is the icons you're going to add to the hardcoded list would probably need to be vetted by someone at Mozilla mostly to make sure the license allow them to distribute the icons.

MikeDacre commented 9 months ago

FYI, work has become sufficiently intense that I will be unlikely to have time to do this in the immediate foreseeable future. If anyone else has time, go ahead. Otherwise, @dannycolin, fine to close as "won't fix" if you don't want to clutter the open issues. If I have time later I'll circle back and just create a pull request directly.

Fred-Vatin commented 1 month ago

It would be nice if it uses an icon picker filtering through a built-in font-awesome set for instance.