Add ability to set custom icons

[dannycolin]

Let the users add a custom icons to their containers.

[dave-kennedy]

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]

It looks like someone did this in #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]

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

[FlorianWendelborn]

@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]

Is having an emoji picker a reasonable substitute?

[dannycolin]

Is having an emoji picker a reasonable substitute?

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

[mathstuf]

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]

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]

@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: #391 (comment)

Here is somebody that manually added them, but it was followed up with the API does not like it? #984 (comment)

This looks like a way to change the builtin colors to appear as different colors: #391 (comment)

Some sorting info here: #1707 (comment)

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

[dannycolin]

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]

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]

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]

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]

@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]

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]

@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]

@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]

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):

• https://searchfox.org/mozilla-central/source/toolkit/components/extensions/parent/ext-contextualIdentities.js#44
• https://searchfox.org/mozilla-central/source/browser/components/preferences/dialogs/containers.js#26

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]

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]

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

[sinasalek]

I was expecting to be able to upload my own icon for containers but strangely enough that's no possible! And there isn't any non messy way of making it possible. So I'm very much interested for this to happen.
Probably the most flexible option is to let extensions customize these icons

[babs]

It would be nice to be able to customize colors too :)