Uploaded image for project: 'SonarQube'
  1. SonarQube
  2. SONAR-8871

Code viewer header lacks usability

    Details

    • Type: Improvement
    • Status: Closed
    • Priority: Major
    • Resolution: Won't Fix
    • Affects Version/s: None
    • Fix Version/s: None
    • Component/s: UX/UI, Web
    • Labels:
    • Edition:
      Community

      Description

      • File path is repeated twice and is confusing
      • The menu button should be part of the sticky header to stay actionable as you scroll
      • The name of the file should always be visible even when scrolling. It is already the case in Measures and Issues with our sticky header containing the file path, but should be done in the Code tab.

      Current design solution:

      • Sticky header always visible on screen containing file path on the left, file info and menu button on the right
      • If needed, keyboard hint will be floating as a toast pop-up on the code viewer. It will never be displayed again once the user closes it

      Code page:

      Measures page:

      Issues page:

        Attachments

        1. code-viewer-header_01.png
          code-viewer-header_01.png
          185 kB
        2. code-viewer-header_02.png
          code-viewer-header_02.png
          151 kB
        3. code-viewer-improvements.png
          code-viewer-improvements.png
          114 kB
        4. Header_Code_Page.png
          Header_Code_Page.png
          197 kB
        5. Header_Issues_Page.png
          Header_Issues_Page.png
          274 kB
        6. Header_Measures_Page.png
          Header_Measures_Page.png
          208 kB
        7. screenshot-1.png
          screenshot-1.png
          211 kB

          Issue Links

            Activity

              People

              • Assignee:
                Unassigned
                Reporter:
                laura.wacrenier Laura Wacrenier
              • Votes:
                0 Vote for this issue
                Watchers:
                5 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved: