Audit `vue_shared` components storybook stories
Audit `vue_shared` components storybook stories
Background
Currently the vue_shared directory has an incomplete set of stories available in the gitlab-storybook. Given these are intended to be shared components, we should ensure we adequately document these and provide stories for their usage.
Additionally, if components are not intended to be truly shared, they should be moved elsewhere.
TODO:
-
Audit existing components to see if they have a story
- Audit existing stories to see if they're broken
-
Try and discern which components are associated with each group
- Create separate issues for each directory
- Create an issue for directories not clearly owned by a group
- Estimate a reasonable amount that should be migrated or need new stories to be added
- Count total vue components so we have an idea how many need to be looked at
- Count total existing stories so we know the gap
Sorted
groupcode review
Existing stories
- ?
app/assets/javascripts/vue_shared/components/markdown_drawer/markdown_drawer.stories.js - ?
app/assets/javascripts/vue_shared/components/markdown/non_gfm_markdown.stories.js
Missing stories
-
app/assets/javascripts/vue_shared/components/diff_viewer/diff_viewer.vue -
app/assets/javascripts/vue_shared/components/diff_viewer/viewers/mode_changed.vue -
app/assets/javascripts/vue_shared/components/diff_viewer/viewers/not_diffable.vue -
app/assets/javascripts/vue_shared/components/diff_viewer/viewers/download_diff_viewer.vue -
app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff/swipe_viewer.vue -
app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff/onion_skin_viewer.vue -
app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff/two_up_viewer.vue -
app/assets/javascripts/vue_shared/components/diff_viewer/viewers/image_diff_viewer.vue -
app/assets/javascripts/vue_shared/components/diff_viewer/viewers/no_preview.vue -
app/assets/javascripts/vue_shared/components/diff_viewer/viewers/renamed.vue -
app/assets/javascripts/vue_shared/components/diff_stats_dropdown.vue -
ee/app/assets/javascripts/vue_shared/components/markdown/constants.js -
ee/app/assets/javascripts/vue_shared/components/markdown/mount_markdown_editor.js -
app/assets/javascripts/vue_shared/components/notes/system_note.vue -
app/assets/javascripts/vue_shared/components/notes/timeline_entry_item.vue -
app/assets/javascripts/vue_shared/components/notes/placeholder_system_note.vue -
app/assets/javascripts/vue_shared/components/notes/timeline_icon.vue -
app/assets/javascripts/vue_shared/components/notes/placeholder_note.vue -
app/assets/javascripts/vue_shared/components/notes/skeleton_note.vue -
app/assets/javascripts/vue_shared/components/notes/noteable_warning.vue -
app/assets/javascripts/vue_shared/components/awards_list.vue -
app/assets/javascripts/vue_shared/components/panel_resizer.vue
groupcomposition analysis
Existing stories
Missing stories
-
ee/app/assets/javascripts/vue_shared/license_compliance/mr_widget_license_report.vue -
ee/app/assets/javascripts/vue_shared/license_compliance/license_management.vue -
ee/app/assets/javascripts/vue_shared/license_compliance/components/license_packages.vue -
ee/app/assets/javascripts/vue_shared/license_compliance/components/license_issue_body.vue -
ee/app/assets/javascripts/vue_shared/license_compliance/components/delete_confirmation_modal.vue -
ee/app/assets/javascripts/vue_shared/license_compliance/components/add_license_form_dropdown.vue -
ee/app/assets/javascripts/vue_shared/license_compliance/components/license_management_row.vue -
ee/app/assets/javascripts/vue_shared/license_compliance/components/license_status_icon.vue -
ee/app/assets/javascripts/vue_shared/license_compliance/components/add_license_form.vue -
ee/app/assets/javascripts/vue_shared/license_compliance/components/admin_license_management_row.vue
groupcontainer registry
Existing stories
Missing stories
-
app/assets/javascripts/vue_shared/components/registry/title_area.vue -
app/assets/javascripts/vue_shared/components/registry/details_row.vue -
app/assets/javascripts/vue_shared/components/registry/code_instruction.vue -
app/assets/javascripts/vue_shared/components/registry/history_item.vue -
app/assets/javascripts/vue_shared/components/registry/list_item.vue -
app/assets/javascripts/vue_shared/components/registry/persisted_dropdown_selection.vue -
app/assets/javascripts/vue_shared/components/registry/metadata_item.vue -
app/assets/javascripts/vue_shared/components/registry/registry_search.vue
groupeditor extensions
Existing stories
Missing stories
-
ee/app/assets/javascripts/vue_shared/components/branches_selector/project_branch_selector.vue -
ee/app/assets/javascripts/vue_shared/components/branches_selector/protected_branches_selector.vue
groupenvironments
Existing stories
Missing stories
-
ee/app/assets/javascripts/vue_shared/dashboards/components/alerts.vue -
ee/app/assets/javascripts/vue_shared/dashboards/components/time_ago.vue -
ee/app/assets/javascripts/vue_shared/dashboards/components/project_pipeline.vue -
app/assets/javascripts/vue_shared/components/deployment_instance.vue -
app/assets/javascripts/vue_shared/components/commit.vue
groupobservability
Existing stories
Missing stories
-
ee/app/assets/javascripts/vue_shared/metrics_reports/grouped_metrics_reports_app.vue -
ee/app/assets/javascripts/vue_shared/metrics_reports/components/metrics_reports_issue_body.vue
groupoptimize
Existing stories
Missing stories
-
app/assets/javascripts/vue_shared/components/ci_cd_analytics/ci_cd_analytics_charts.vue -
app/assets/javascripts/vue_shared/components/ci_cd_analytics/ci_cd_analytics_area_chart.vue- CI/CD analytics gitlab#428282
-
app/assets/javascripts/vue_shared/components/resizable_chart/skeleton_loader.vue
grouppipeline execution
Existing stories
Missing stories
-
app/assets/javascripts/vue_shared/components/logs_viewer/log_line.vue -
app/assets/javascripts/vue_shared/components/logs_viewer/logs_viewer.vue -
app/assets/javascripts/vue_shared/components/logs_viewer/logs_top_bar.vue -
app/assets/javascripts/vue_shared/components/logs_viewer/line_number.vue -
app/assets/javascripts/vue_shared/components/runner_instructions/instructions/runner_cli_instructions.vue -
app/assets/javascripts/vue_shared/components/runner_instructions/instructions/runner_docker_instructions.vue -
app/assets/javascripts/vue_shared/components/runner_instructions/instructions/runner_kubernetes_instructions.vue -
app/assets/javascripts/vue_shared/components/runner_instructions/instructions/runner_aws_instructions.vue -
app/assets/javascripts/vue_shared/components/runner_instructions/runner_instructions_modal.vue -
app/assets/javascripts/vue_shared/components/navigation_tabs.vue
groupproduct planning
Existing stories
Missing stories
-
app/assets/javascripts/vue_shared/components/design_management/design_disclosure.vue -
app/assets/javascripts/vue_shared/components/design_management/design_note_pin.vue -
app/assets/javascripts/vue_shared/components/color_select_dropdown/dropdown_header.vue -
app/assets/javascripts/vue_shared/components/color_select_dropdown/dropdown_contents.vue -
app/assets/javascripts/vue_shared/components/color_select_dropdown/dropdown_value.vue -
app/assets/javascripts/vue_shared/components/color_select_dropdown/dropdown_contents_color_view.vue -
app/assets/javascripts/vue_shared/components/color_select_dropdown/color_item.vue
groupproject management
Existing stories
Missing stories
-
app/assets/javascripts/vue_shared/components/markdown/drawio_toolbar_button.vue -
app/assets/javascripts/vue_shared/components/markdown/markdown_editor.vue -
app/assets/javascripts/vue_shared/components/markdown/suggestions.vue -
app/assets/javascripts/vue_shared/components/markdown/suggestion_diff.vue -
app/assets/javascripts/vue_shared/components/markdown/suggestion_diff_header.vue -
app/assets/javascripts/vue_shared/components/markdown/toolbar_button.vue -
app/assets/javascripts/vue_shared/components/markdown/field.vue -
app/assets/javascripts/vue_shared/components/markdown/toolbar.vue -
app/assets/javascripts/vue_shared/components/markdown/header_divider.vue -
app/assets/javascripts/vue_shared/components/markdown/apply_suggestion.vue -
app/assets/javascripts/vue_shared/components/markdown/editor_mode_switcher.vue -
app/assets/javascripts/vue_shared/components/markdown/comment_templates_modal.vue -
app/assets/javascripts/vue_shared/components/markdown/suggestion_diff_row.vue -
app/assets/javascripts/vue_shared/components/markdown/field_view.vue -
app/assets/javascripts/vue_shared/components/markdown/header.vue -
app/assets/javascripts/vue_shared/components/markdown/markdown_content.vue -
app/assets/javascripts/vue_shared/issuable/sidebar/components/issuable_sidebar_root.vue -
app/assets/javascripts/vue_shared/issuable/show/components/issuable_body.vue -
app/assets/javascripts/vue_shared/issuable/show/components/issuable_header.vue -
app/assets/javascripts/vue_shared/issuable/show/components/issuable_title.vue -
app/assets/javascripts/vue_shared/issuable/show/components/issuable_edit_form.vue -
app/assets/javascripts/vue_shared/issuable/show/components/issuable_discussion.vue -
app/assets/javascripts/vue_shared/issuable/show/components/issuable_description.vue -
app/assets/javascripts/vue_shared/issuable/show/components/issuable_show_root.vue -
app/assets/javascripts/vue_shared/issuable/list/components/issuable_grid.vue -
app/assets/javascripts/vue_shared/issuable/list/components/issuable_tabs.vue -
app/assets/javascripts/vue_shared/issuable/list/components/issuable_list_root.vue -
app/assets/javascripts/vue_shared/issuable/list/components/issuable_bulk_edit_sidebar.vue -
app/assets/javascripts/vue_shared/issuable/list/components/issuable_item.vue -
app/assets/javascripts/vue_shared/issuable/create/components/issuable_form.vue -
app/assets/javascripts/vue_shared/issuable/create/components/issuable_create_root.vue -
app/assets/javascripts/vue_shared/issuable/create/components/issuable_label_selector.vue -
app/assets/javascripts/vue_shared/components/confidentiality_badge.vue -
app/assets/javascripts/vue_shared/components/mr_more_dropdown.vue -
app/assets/javascripts/vue_shared/components/issuable_blocked_icon/issuable_blocked_icon.vue -
app/assets/javascripts/vue_shared/components/page_size_selector.vue
groupremote development
Existing stories
- ?
app/assets/javascripts/vue_shared/components/web_ide_link.stories.js
Missing stories
-
ee/app/assets/javascripts/vue_shared/components/web_ide_link.vue -
app/assets/javascripts/vue_shared/components/web_ide/confirm_fork_modal.vue -
app/assets/javascripts/vue_shared/components/file_tree.vue -
app/assets/javascripts/vue_shared/components/changed_file_icon.vue -
app/assets/javascripts/vue_shared/components/integrations_help_text.vue -
app/assets/javascripts/vue_shared/components/file_row.vue -
app/assets/javascripts/vue_shared/components/dropdown/dropdown_button.vue
grouprespond
Existing stories
Missing stories
-
app/assets/javascripts/vue_shared/components/metric_images/metric_image_details_modal.vue -
app/assets/javascripts/vue_shared/components/metric_images/metric_images_table.vue -
app/assets/javascripts/vue_shared/components/metric_images/metric_images_tab.vue
groupsource code
Existing stories
Missing stories
-
app/assets/javascripts/vue_shared/components/source_viewer/components/chunk_line.vue -
app/assets/javascripts/vue_shared/components/source_viewer/components/blame_info.vue -
app/assets/javascripts/vue_shared/components/source_viewer/components/chunk_new.vue -
app/assets/javascripts/vue_shared/components/source_viewer/components/chunk.vue -
app/assets/javascripts/vue_shared/components/source_viewer/source_viewer.vue -
app/assets/javascripts/vue_shared/components/blob_viewers/simple_viewer.vue -
app/assets/javascripts/vue_shared/components/blob_viewers/rich_viewer.vue -
app/assets/javascripts/vue_shared/components/file_row_header.vue -
app/assets/javascripts/vue_shared/components/file_finder/index.vue -
app/assets/javascripts/vue_shared/components/file_finder/item.vue -
app/assets/javascripts/vue_shared/components/content_viewer/content_viewer.vue -
app/assets/javascripts/vue_shared/components/content_viewer/viewers/download_viewer.vue -
app/assets/javascripts/vue_shared/components/content_viewer/viewers/image_viewer.vue -
app/assets/javascripts/vue_shared/components/content_viewer/viewers/markdown_viewer.vue -
app/assets/javascripts/vue_shared/components/form/form_footer_actions.vue
groupstatic analysis
Existing stories
Missing stories
-
app/assets/javascripts/vue_shared/security_configuration/components/section_loader.vue -
app/assets/javascripts/vue_shared/security_configuration/components/section_layout.vue -
app/assets/javascripts/vue_shared/security_configuration/components/manage_via_mr.vue -
app/assets/javascripts/vue_shared/components/dismissible_feedback_alert.vue
groupsubscription management
Existing stories
- ?
ee/app/assets/javascripts/vue_shared/purchase_flow/components/company_information.stories.js - ?
ee/app/assets/javascripts/vue_shared/purchase_flow/components/contact_billing_address.stories.js - ?
ee/app/assets/javascripts/vue_shared/purchase_flow/components/step.stories.js - ?
ee/app/assets/javascripts/vue_shared/purchase_flow/components/checkout/billing_account_details.stories.js - ?
ee/app/assets/javascripts/vue_shared/purchase_flow/components/checkout/billing_address.stories.js
Missing stories
-
ee/app/assets/javascripts/vue_shared/purchase_flow/components/step_order_app.vue -
ee/app/assets/javascripts/vue_shared/purchase_flow/components/checkout/payment_method.vue -
ee/app/assets/javascripts/vue_shared/purchase_flow/components/checkout/sprintf_with_links.vue -
ee/app/assets/javascripts/vue_shared/purchase_flow/components/checkout/confirm_order.vue -
ee/app/assets/javascripts/vue_shared/purchase_flow/components/checkout/zuora.vue
grouptenant scale
Existing stories
- ?
app/assets/javascripts/vue_shared/components/project_avatar.stories.js - ?
app/assets/javascripts/vue_shared/components/groups_list/groups_list.stories.js - ?
app/assets/javascripts/vue_shared/components/list_actions/list_actions.stories.js
Missing stories
-
app/assets/javascripts/vue_shared/components/groups_list/groups_list_item.vue -
app/assets/javascripts/vue_shared/components/groups_list/group_list_item_delete_modal.vue -
app/assets/javascripts/vue_shared/components/projects_list/projects_list.vue -
app/assets/javascripts/vue_shared/components/projects_list/project_list_item_inactive_badge.vue -
app/assets/javascripts/vue_shared/components/projects_list/projects_list_item.vue -
app/assets/javascripts/vue_shared/components/project_selector/project_selector.vue -
app/assets/javascripts/vue_shared/new_namespace/new_namespace_page.vue -
app/assets/javascripts/vue_shared/new_namespace/components/legacy_container.vue -
app/assets/javascripts/vue_shared/new_namespace/components/welcome.vue -
ee/app/assets/javascripts/vue_shared/components/groups_list/group_list_item_delete_modal.vue
groupthreat insights
Existing stories
- ?
ee/app/assets/javascripts/vue_shared/security_reports/components/status_badge.stories.js
Missing stories
-
ee/app/assets/javascripts/vue_shared/discover/card_security_discover_app.vue -
ee/app/assets/javascripts/vue_shared/security_reports/components/solution_card_graphql.vue -
ee/app/assets/javascripts/vue_shared/security_reports/components/severity_badge.vue -
ee/app/assets/javascripts/vue_shared/security_reports/components/event_item.vue -
ee/app/assets/javascripts/vue_shared/security_reports/components/create_jira_issue.vue -
ee/app/assets/javascripts/vue_shared/security_reports/components/dast_modal.vue -
ee/app/assets/javascripts/vue_shared/security_reports/components/summary_highlights.vue -
ee/app/assets/javascripts/vue_shared/security_reports/components/dismissal_note.vue -
ee/app/assets/javascripts/vue_shared/security_reports/components/security_issue_body.vue -
ee/app/assets/javascripts/vue_shared/security_reports/components/merge_request_note.vue -
ee/app/assets/javascripts/vue_shared/security_reports/components/solution_card.vue -
ee/app/assets/javascripts/vue_shared/security_reports/components/merge_request_note_graphql.vue -
ee/app/assets/javascripts/vue_shared/security_reports/components/security_training_promo.vue -
ee/app/assets/javascripts/vue_shared/security_reports/components/split_button.vue -
ee/app/assets/javascripts/vue_shared/security_reports/components/issue_note_graphql.vue -
app/assets/javascripts/vue_shared/security_reports/components/security_report_download_dropdown.vue
groupdesign system
Existing stories
- ?
app/assets/javascripts/vue_shared/components/settings/settings_block.stories.js - ?
app/assets/javascripts/vue_shared/components/settings/settings_section.stories.js - ?
app/assets/javascripts/vue_shared/components/crud_component.stories.js
Missing stories
-
app/assets/javascripts/vue_shared/alert_details/components/alert_sidebar.vue -
app/assets/javascripts/vue_shared/alert_details/components/sidebar/sidebar_todo.vue -
app/assets/javascripts/vue_shared/alert_details/components/sidebar/sidebar_assignee.vue -
app/assets/javascripts/vue_shared/alert_details/components/sidebar/sidebar_assignees.vue -
app/assets/javascripts/vue_shared/alert_details/components/sidebar/sidebar_header.vue -
app/assets/javascripts/vue_shared/alert_details/components/sidebar/sidebar_status.vue -
app/assets/javascripts/vue_shared/alert_details/components/system_notes/system_note.vue -
app/assets/javascripts/vue_shared/alert_details/components/alert_status.vue -
app/assets/javascripts/vue_shared/alert_details/components/alert_summary_row.vue -
app/assets/javascripts/vue_shared/alert_details/components/alert_details.vue -
app/assets/javascripts/vue_shared/components/alert_details_table.vue -
app/assets/javascripts/vue_shared/components/dropdown_keyboard_navigation.vue
Link items together to show that they're related or that one is blocking others.