Update gitlab storybook for components in app/assets/javascripts/vue_shared/components
## Goals Currently the `vue_shared` directory has an incomplete set of stories available in the [gitlab-storybook](https://gitlab-org.gitlab.io/gitlab/storybook/). Components in the `vue_shared` directory are intended to be shared so we should ensure we adequately document these and provide stories for their usage. In https://gitlab.com/gitlab-org/gitlab/-/issues/473628+ we've collated a list of the components that are currently available in the `vue_shared` directory. We should now review each of these components to determine if they are intended to be truly shared or if they should be moved out of `vue_shared`, closer to the location they are intended to be used. It is also an opportunity to update or add new stories for the components in this directory to help with their discoverability. ## Background The [gitlab-storybook](https://gitlab-org.gitlab.io/gitlab/storybook/) has been available for a quite some time, but not actively maintained. This is a useful resource for working with the gitlab project as it provides a space separate to a running GDK where we can: - discover existing components that are available - preview changes to existing components - develop new components To help improve the quality and usefulness of the storybook we have been undertaking improvements https://gitlab.com/groups/gitlab-org/-/epics/14441. This issue is related to improving the `vue_shared` directory specifically. ## Example stories * [Simple example](https://gitlab.com/gitlab-org/gitlab/-/merge_requests/166252) * [Graphql + Apollo](https://gitlab.com/gitlab-org/gitlab/-/merge_requests/166918) * [Vuex wrapped components](https://gitlab.com/gitlab-org/gitlab/-/merge_requests/134711) ## TODO: Review the components in the app/assets/javascripts/vue_shared/components directory - [ ] Consider if the component makes sense in the `gitlab` project or should be moved to `gitlab-ui` - [ ] If stories already exist, we should make sure they are up to date - [ ] If the component(s) are only used in a single place, consider moving them to the location they are used - [ ] If the component(s) are used in multiple locations and belong in `vue_shared` ensure we have stories added - Open MRs to add stories - Create and schedule issues to add stories ## Improvements and suggestions Currently the gitlab storybook is not as advanced as the gitlab-ui storybook, a list of improvements [have already started to be collated](https://gitlab.com/groups/gitlab-org/-/epics/14441) so feel free to open further issues or threads if you have any suggestions or improvments See https://gitlab.com/groups/gitlab-org/-/epics/14441+ --- Created using https://gitlab.com/gitlab-org/frontend/playground/batch-issue-creator
issue