Compliance tracker view design

[gorkem-bwl]

The compliance tracker is a page where users see a list of controls and subcontrols (requirements). Each control is a topic, and each subcontrol is a subtopic. Several controls and subcontrols are stored in a JSON file on the database. Initially, we can use a simple JSON file to serve basic demo content and update the JSON as time goes on (e.g., when the JSON file finalizes).

Each control is a number (eg 19) and each subcontrol is a another subnumber associated with the control (eg. 19.1).

On the compliance tracker window, the following information is shown:

• Compliance status: the number of subcontrols filled in / all subcontrols
• Total number of controls: All controls count
• Implemented controls: Number of controls filled in

When the user wants to fill in a subcontrol, he/she clicks on a row, and the following popup appears:

In this popup, there are 3 tabs for each subcontrol.

• Overview: All general information about the subcontrol (e.g status, approver, reviewer, etc).
• Evidence: Evidence documents to be uploaded by the user.
• Auditor feedback: The feedback area provided by the auditor.

Tasks:

• [x] Implement the compliance tracker page:
  • [x] Show compliance status, total number of controls, implemented controls and auditor completed status
  • [x] Create a table where all controls and subcontrols are shown.
  • [x] Each subcontrol has name, owner, number of subcontrols and completion rate (%).
• [x] Implement the subcontrol details popup:
  • [x] Show 3 tabs (Overview, Evidence, Auditor feedback)
  • [x] Show all information under 3 tabs
  • [x] Add previous subcontrol and next subcontrol buttons where the sure will be able to see the previous/next subcontrols in the same popup

[MuhammadKhalilzadeh]

@melpsh Please do not forget to Check ✅ the parts that you complete in here, too.

[gorkem-bwl]

@melpsh Just FYI - the project selector has been moved to the sidebar, so you'll need to remove it from your design as well.

[gorkem-bwl]

@melpsh just fyi - the designs of the popup have changed quite a bit. Please refer to Figma designs here.