[Feature] Custom Icons

[echo6ix]

Summary

Add user-configurable custom icons to the Performer Detail page in the .name-icon div based on performer URL domains, StashID Endpoint Names, and select performer detail-item attributes.

Description

This feature would introduce user-configurable icons in the .name-icon div, to the Performer Detail pages. Icons will act as (clickable) visual shortcuts, representing specific details or links from the performer's metadata. This allows users to quickly identify relevant information (they value) at a glance, such as external social media links or performer-specific metadata.

• User Configuration. Users will define their custom icons using a JSON configuration file, specifying key-value pairs. The keys will correspond to performer attributes, URL domains, or StashID Endpoint Names. The values will reference image filenames stored in a designated folder.
• Example JSON Structure. Much like Custom Localization, Custom Icons can use JSON to define the values

{
    "performer": {
        "urls": {
            "domains": {
                "twitter.com": "/URLs/twitter_favicon.png",
                "instagram.com": "/URLs/instagram_favicon.png",
                "iafd.com": "/URLs/iafd_favicon.png"
            }
        },
        "stashbox_endpoint": {
            "StashDB": "/FontAwesome/verified.png"
        },
        "details": {
            "ignore_auto_tag": {
                "true": "/details/ignore_autotag_enabled.png"
            }
        }
    }
}

• Icons. Icons will be rendered in .name-icon div when conditions in the JSON are met. For example, if a performer has a Twitter link or StashDB StashID, a clickable icon using the defined filename, will appear in the .name-icon div.
• Existing social media .name-icons would not be hardcoded. We could remove the hard-coding of existing social media icons, but still include them in the stock JSON file and corresponding icon/ folder. They would serve as sample entries for users.

Future Considerations:

While this feature would initially focuses on Performer Detail pages, the scope could be expanded in the future to other areas of the app where visual custom icons may be useful.

[cj12312021]

Thanks for creating this issue. My current assessment of the implementation is that we would provide a dialog menu somewhere on the settings page where the user would provide the domain names they want to capture and then provide the image/icon they would like to correspond to the domain. My thinking is that this would all be done using the UI configuration, which saves the data in the config YML file which users could edit directly. The uploaded images would need to be base64 encoded so they can be written to the file. Alternatively, the uploaded file could be written somewhere in the UI directly so the path could be referenced in the YML instead of using the base64 string. I imagine this will be more intuitive than asking users to configure paths. We wouldn't need a section for each details page. We would just have one section for domains, capturing domains across all pages. @WithoutPants could provide additional input here.