Skip to content

Add components for Expiration Policy UI redesign

What does this MR do?

To implement the new designs shown here: #222885 (closed) we need to re-create some components, initially the code was using a shared component that was meant to be shared with another piece of the UI. Since this is not happening for now, to implement this work I've created a set of components that then will be used to implement the new design.

The work is too big for a single MR so it has been split in two pieces, in this MR we are introducing supporting code and then wiring it together in a following MR.

The Plan

Description MR
Create a set of new components to implement the UI 👈 You are here!
Wire the new components and do UX and UI text reviews !48243 (merged)
Cleanup the shared folder and remove dead code TBD

Screenshots (strongly suggested)

This MR do not introduce any visual change! The following screenshots are just a demo to show how the wired components introduced in this MR work together.

Empty state Enabled State Disabled State
Screenshot_2020-11-18_at_13.47.19 Screenshot_2020-11-18_at_13.48.16 Screenshot_2020-11-18_at_13.48.24

Screencaptures

Mobile Desktop
ExpirationPoliciesMobile ExpirationPoliciesDesktop

Does this MR meet the acceptance criteria?

Conformity

Availability and Testing

Security

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 #222885 (closed)

Edited by Nicolò Maria Mezzopera

Merge request reports