Start refactoring issues list page with `issuable_list` component [RUN ALL RSPEC] [RUN AS-IF-FOSS]

Merged Coung Ngo requested to merge 322755-add-issuable_list-to-issues-list-page into master

What does this MR do?

This MR replaces the issues list page Haml search bar and list with the Vue issuable_list component under the feature flag vue_issues_list, defaulted to off.

This MR:

  • Adds missing UI elements to issuable_item.vue for issues
  • Adds pagination

Subsequent MRs will:

  • Add sorting
  • Add searching
  • Add filtering
  • Add missing filtered-search tokens
  • Add empty state
  • Add bulk edit
  • Add working Open/Closed/All tabs

Screenshots (strongly suggested)

before after
Screenshot_2021-03-08_at_1.40.51_pm Screenshot_2021-03-12_at_12.06.11_am

Does this MR meet the acceptance criteria?


Availability and Testing


If this MR contains changes to processing or storing of credentials or tokens, authorization and authentication methods and other items described in the security review guidelines:

  • Label as security and @ mention @gitlab-com/gl-security/appsec
  • The MR includes necessary changes to maintain consistency between UI, API, email, or other methods
  • Security reports checked/validated by a reviewer from the AppSec team

Related to #322755 (closed)

Edited by Coung Ngo