Currently, reactions are displayed as plaintext in a single label, which is a lazy hack just to enable the set of reactions to easily wrap to the next line.
Instead, each type of reaction (each key in the reactions map) should be represented by its own icon button, in which the icon is the text of the reaction key. Typically a reaction key is a single emoji, but technically it can be any arbitrary string, so that works well with an existing button (Robrix has an IconButton type for this purpose).
Then, when clicking one of the IconButtons, Robrix would toggle that reaction's annotation by using the Timeline::toggle_reaction(). Using this higher-level reaction API will make things a lot easier to deal with. The Annotation's key field should be set to the same key string value used for the reaction's IconButton (its text content).
Note that in the structure that represents the Reaction icon button, the key string should be stored separately from the count value such that key can be easily retrieved independently from the count, and such that the count can be incremented/decremented easily.
In addition, that structure should store whether the current user has "sent" this reaction, i.e., the button's reaction key has been toggled "on" by the current user. This should also be made apparent at the UI level, e.g., by setting the button's background color and/or outline differently than the icon buttons that represent reactions that were not sent by the current user.
One of the main UI challenges in this area is how to get a series of reaction icon buttons to neatly wrap on to the next line (or multiple lines) if there are many reactions. Note that this is a common scenario, especially for popular posts. See this example from Discord:
Makepad may not yet support the ability to "wrap" multiple buttons (or arbitrary widgets) across multiple lines, but I'm not sure.
Note:
It is a known issue that Makepad doesn't yet support rendering actual emoji.
That is not a blocker for this issue, as the text on each reactions' icon button can still be a stringified emoji, e.g., :grin:, and work the same way.
See issue #111 for more info.
Currently, reactions are displayed as plaintext in a single label, which is a lazy hack just to enable the set of reactions to easily wrap to the next line.
Instead, each type of reaction (each key in the reactions map) should be represented by its own icon button, in which the icon is the text of the reaction key. Typically a reaction key is a single emoji, but technically it can be any arbitrary string, so that works well with an existing button (Robrix has an IconButton type for this purpose).
Then, when clicking one of the IconButtons, Robrix would toggle that reaction's annotation by using the
Timeline::toggle_reaction(). Using this higher-level reaction API will make things a lot easier to deal with. TheAnnotation'skeyfield should be set to the samekeystring value used for the reaction's IconButton (its text content).Note that in the structure that represents the Reaction icon button, the
keystring should be stored separately from thecountvalue such thatkeycan be easily retrieved independently from thecount, and such that thecountcan be incremented/decremented easily. In addition, that structure should store whether the current user has "sent" this reaction, i.e., the button's reaction key has been toggled "on" by the current user. This should also be made apparent at the UI level, e.g., by setting the button's background color and/or outline differently than the icon buttons that represent reactions that were not sent by the current user.One of the main UI challenges in this area is how to get a series of reaction icon buttons to neatly wrap on to the next line (or multiple lines) if there are many reactions. Note that this is a common scenario, especially for popular posts. See this example from Discord:
Makepad may not yet support the ability to "wrap" multiple buttons (or arbitrary widgets) across multiple lines, but I'm not sure.