Add the Component Library to the app #8319
Conversation
|
Can you share context as to why do we need this? |
|
The idea is to have an unified place where to play with certain components. Mainly for testing purposes. In this example, the button component. Instead of trying to figure out where the button is used as "primary" or "tertiary" to see if the styles are correct, we can have a centralized place where to look at all of them at the same time. It would be something similar to have storybook, but inside the product, so we get the version of the button this build has. |
Ok I follow. Will the users be able to try this out or is it purely a dev thing? |
|
Define users 😛 This is mainly intended for development and testing environments. End users should not be using this. That is the reason it is behind the "EnableDeveloper" setting, which should never be used in production. That being said, end users seeing this screen is not a big deal. There is nothing bad they can do in this screen. We can try to make it prettier (since they may stumble unto it), but we should also make clear this is a development tool. |
| const buttonSizeValues = ['xs', 's', 'm', 'lg']; | ||
| const buttonEmphasisValues = ['primary', 'secondary', 'tertiary', 'link']; | ||
| const buttonTypeValues = ['default', 'destructive', 'inverted', 'disabled']; | ||
| const buttonStateValues = ['default', 'hover', 'active', 'focus']; |
There was a problem hiding this comment.
I wonder if there is a way for you to construct this array of values based on the styles of the buttons defined in @utils/buttonStyles so that if ever another one is added it won't be missing from here.
There was a problem hiding this comment.
Sadly, it is a limitation from typescript. We can get types from runtime objects, but we cannot get runtime objects from types 😅
There are ways around that, but all of them look pretty ugly to me, and would imply extra changes in the code: https://stackoverflow.com/questions/75835161/typescript-convert-type-with-multiple-string-options-to-an-array-with-those-opti
Nevertheless, it is something we can consider for the future.
Summary
Parallel to mattermost/mattermost#28826 , we add a component library to mobile.
Right now it follows the same logic as the web (developer mode is enabled in the server) but we could consider having this only for beta builds. 0/5 on this (not sure if builds from PRs are considered beta or not)
Ticket Link
NONE
Screenshots
Screencast.from.07-11-24.13.37.54.webm
Release Note