canonical
EmptyState implementation inconsistency with Vanilla Framework
Vanilla Framework's design of EmptyState component can be found here and the react-components library's design can be found here. The image is rendered to the left of the text in Vanilla Framework, while it is rendered on top of the text in react-components library.
Had a small chat today with @lukasSerelis and he specified that the Empty State design from Vanilla Framework is the one we should use in the web apps as well.
Thanks for confirming that. I'm not sure why this inconsistency was introduced, but will be good to fix that to avoid confusion.
@bartaz I'm currently looking into how Vanilla Framework implemented the Empty State and the implementations of all 3 types of Empty States differ. Are we only concerned with implementing the No content Empty State in this component?
Yes, the Vanilla docs for Empty State pattern are very generic and cover variety of cases (search, 404, etc). For apps the most relevant is "no content" empty state, so that was meant to be covered by this React component.
Also note that this is very context specific, so image may be different, text obviously. The action button also should be optional.
Overall the purpose of empty state component is to provide information about what's missing, and ideally explain the action to be taken to add something.
