Skip to content

Ability to add any phosphor icon as room icon, with theme matching color #1675

Description

@GreenB0t

Describe the problem

The ability to add custom images is cool, but it would be sick if there was a more native looking solution, with ease of access to a cohesive selection of icons that may match a room's topic (gaming, sports, pet pics, books...). It can be relatively simple to add such support but imo is a pretty attractive feature to space managers and maintainers, with aesthetic and many niche or common organization functionality upsides (MMOs, devs, support servers...).

Describe the solution you'd like

In the room image selection UI, having an alternative button 'pick icon' (phosphor icon) alongside the regular 'upload'. I believe React is how it's done currently on Sable so would be the easiest. The icons would be styled like how Hashes are, and dynamically follow sable theme colors.
import type { IconProps } from '@phosphor-icons/react'; import { MoonStarsIcon,}
-source: https://github.com/SableClient/Sable/blob/dev/src/app/components/icons/phosphor.tsx

Image

Alternatives considered

This would be Sable specific, other clients would display a regular hash. Unless you go the reupload route and upload an SVG of the icons that somehow can dynamically change colors on sable to follow the picked theme.

Additional context

The custom phosphor room icons can have the badges, like the private room lock.
Would really love to see some form of autocomplete when you go to fill the icon name, even better if you can see the icons too, not just their text labels (search function). Maybe call the button 'browse' instead of 'pick' then.
If you can browse, would be good imo to give a small list of featured icons, for common topics.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions