Unifying code and UI for Info panels in Viewer and Browser

[adrielulanovsky]

Following the conversation in #3431, we need to unify code and UI for the info panels in Viewer and Browser, to avoid code repetition and differences in behaviour.

Example:

• Image browser:
  

• Image viewer:
  
  

Differences I could find:
1 - Uploaded, Uploader, People fields found in image viewer, but not in image browser.
2 - Show additional metadata section found in image viewer (with fields such as suppliers reference, source, ID, Live/Killdate, Last Mod., Special Instructions). This section is not found in image browser.
3 - Collections section found in image viewer, but not in image browser.
4 - Labels section found in image viewer even when the image has no labels. This section appears on image browser when at least 1 of the selected images has a label.
5 - Syndication rights section found in image viewer but not on image browser.
6 - Keywords section found in image viewer but not on image browser.
7 - Show crops section found in image viewer when the image has crops. This section is not found in image browser.

Questions:

1. Are there other differences I couldn't find?
2. What should we do with missing sections on image browser? If we add them, what should we do in the case where there are multiple images selected? (e.g. if we add the crops section, what should we do when there are many images with crops selected?)

[paperboyo]

See discussion here.
Especially, a mention of tokens (see how labels work for multiple images selected with different sets of labels applied and how one can add/remove to/from all). Tokens should apply to all fields with arrays, eg. people, collections (and to keywords, when we make them editable). Would be nice to be able to style them differently (labels and collections look differnt and should stay looking different, I suppose?), keywords, people could maybe use a generic, one-shade-of-gray tokens (similar to how keywords look now)?

Are there other differences I couldn't find?
I would go with superset and see if users aren’t unhappy having to scroll more?

What should we do with missing sections on image browser?
Add all?

what should we do in the case where there are multiple images selected
Always support editing all editable fields? (incl. arrays – with tokens). See PR linked above.

if we add the crops section, what should we do when there are many images with crops selected
This is one section that we shouldn’t provide a sensible and usable view of in Browser, I think. As it provides links to specific, individual crops, I can’t see how it could work for multiple images selected? Will work for one image, though. Otherwise a version of Multiple crops text or whatever should be OK (or just hide the whole section for when multiple images are elected?).

cc @akash1810 because he made this comment once.