Details

    Description

      Description

      The improvement for this part of the Management Toolbar (MT) is to separate the current dropdown for "Filter & Order" in two independent dropdowns, because the number of options inside has been increasing over time and is hard to manage the options within the same dropdown button.

      Designs

      LEXI-1253: Split Filter and Order

      Requirements

      • Pre-requisites:
        • n/a
      • Starting point:
        • Any section from Content & Data. 

      Acceptance Criteria

       Happy path:  

      • 'Filter' and 'order' buttons will be displayed as two independent dropdowns.
      • The filter button will use the dropdown button component.
      • The order button will use the dropdown button component.
        • User can only select one item at a time to order the results.
        • If the user selects the ascending or descending option, the order icon will change accordingly to it.
        • When there is only one field for order, the dropdown button will be replaced with a toggle button.
          • And it will have its tooltip.
          • In responsive mode, it will not follow any adaptive behavior.
      • In responsive mode, the dropdowns buttons will change to icon button mode only (without text).
        • And they will show its corresponding tooltip.

       

       Unhappy path: 

       n/a

        

      Feature impacts

       This change is an improvement for the existing Management Toolbar.

       

      Consistency

      • Dropwdowns will use the dropdown button component.
      • Adaptive behaviour depends on the space available for the Management Toolbar.  Breakpoints as per design:
        • Breakpoint: extra small to medium --> will show dropdown buttons using icon mode only.
        • Breakpoint: medium and bigger --> will show dropdown buttons using icon + text mode.
      • When buttons change to icon button mode only, they will show a tooltip.

       

      Documentation

      New documentation will be created in https://issues.liferay.com/browse/LPS-144649

       

      Test Scenarios

      General features: 

      Requirement Test Case Test Priority
      (business impact)
      Covered by
      frontend/backend unit
      test? (Yes/No)
      Test name Chrome
      Pass/Fail
      Comments
        Given a user of the portal
      When the user opens any section with the management toolbar
      Then 'filter' and 'order' buttons will be independent dropdowns
      5-critical no $FilterAndOrderButtonsRenderIndependent     
        Given a user of the portal
      When the user opens any section with the management toolbar
      And clicks on the order button
      Then the user can select one item to order the results
      5-critical  no  $OrderButtonOptions    
        Given a user of the portal
      When the user opens any section with the management toolbar
      And clicks on the order button
      And the user selects the ascending order
      Then the order icon will be displayed accordingly
      And when the user selects the descending order
      Then the order icon will be displayed accordingly
       4-major no  $OrderButtonRenderOrder    
        Given a user of the portal
      When the user opens any section with the management toolbar
      And clicks on the order button
      And there is only one field for order
      Then the order button will be displayed as a toggle button
      And a tooltip message will be displayed
       3-medium no $OrderButtonAsAToggle     
        Compatibility tests:          
        Given a user of the portal on responsive mode
      When the user opens any section with the management toolbar
      Then the 'filter' and 'order' buttons will be displayed as icon buttons
      And a tooltip message will be displayed
      4-major no   $ResponsiveModeFilterAndOrderAsIconButtons    

       

       Exploratory Tests:
      Same as detailed in "General features", high priority is Chrome, but to test the other browsers if possible.

      Test Case Test Priority
      (business impact)
      Covered by
      frontend/backend unit
      test? (Yes/No)
      Firefox
      Pass/Fail
      Safari
      Pass/Fail
      Edge
      Pass/Fail
      Comments
      Given a user of the portal
      When the user opens any section with the management toolbar
      Then 'filter' and 'order' buttons will be independent dropdowns
       5-critical no        
      Given a user of the portal
      When the user opens any section with the management toolbar
      And clicks on the order button
      Then the user can select one item to order the results
       5-critical no        
      Given a user of the portal
      When the user opens any section with the management toolbar
      And clicks on the order button
      And the user selects the ascending order
      Then the order icon will be displayed accordingly
      And when the user selects the descending order
      Then the order icon will be displayed accordingly
       4-major no        
      Given a user of the portal
      When the user opens any section with the management toolbar
      And clicks on the order button
      And there is only one field for order
      Then the order button will be displayed as a toggle button
      And a tooltip message will be displayed
       3-medium no         
       Given a user of the portal on responsive mode
      When the user opens any section with the management toolbar
      Then the 'filter' and 'order' buttons will be displayed as icon buttons
      And a tooltip message will be displayed
       4-major  no        

       

       

      Attachments

        Issue Links

          Activity

            People

              esther.ortega Esther Ortega (Inactive)
              bruno.fernandez Bruno Fernández
              SE Support SE Support
              Susan Chen Susan Chen
              Votes:
              0 Vote for this issue
              Watchers:
              1 Start watching this issue

              Dates

                Created:
                Updated:
                Resolved:

                Packages

                  Version Package
                  Master