Introduce custom reports to Data map

CHANGELOG.md

@@ -20,6 +20,7 @@ The types of changes are:
 ### Added
 - Make all "Description" table columns expandable in Admin UI tables [#5340](https://github.com/ethyca/fides/pull/5340)
 - Added access support for Shipstation [#5343](https://github.com/ethyca/fides/pull/5343)
+- Introduce custom reports to Data map report [#5352](https://github.com/ethyca/fides/pull/5352)
 
 ### Changed
 - Updated the filter postprocessor (SaaS integration framework) to support dataset references [#5343](https://github.com/ethyca/fides/pull/5343)

clients/admin-ui/cypress/e2e/datamap-report.cy.ts

@@ -8,6 +8,7 @@ import { REPORTING_DATAMAP_ROUTE } from "~/features/common/nav/v2/routes";
 import {
   AllowedTypes,
   CustomFieldDefinition,
+  ReportType,
   ResourceTypes,
 } from "~/types/api";
 
@@ -30,6 +31,7 @@ const mockCustomField = (overrides?: Partial<CustomFieldDefinition>) => {
 
 describe("Minimal datamap report table", () => {
   beforeEach(() => {
+    cy.intercept("GET", "/api/v1/system*", { body: [] });
     cy.login();
     stubPlus(true);
     stubSystemCrud();
@@ -194,6 +196,192 @@ describe("Minimal datamap report table", () => {
     });
   });
 
+  describe("Custom report templates", () => {
+    beforeEach(() => {
+      cy.intercept("GET", "/api/v1/plus/custom-report/minimal*", {
+        fixture: "custom-reports/minimal.json",
+      }).as("getCustomReportsMinimal");
+      cy.intercept("GET", "/api/v1/plus/custom-report/plu_*", {
+        fixture: "custom-reports/custom-report.json",
+      }).as("getCustomReportById");
+      cy.intercept("POST", "/api/v1/plus/custom-report", {
+        fixture: "custom-reports/custom-report.json",
+      }).as("createCustomReport");
+      cy.intercept("DELETE", "/api/v1/plus/custom-report/*", "").as(
+        "deleteCustomReport",
+      );
+    });
+    it("should show an empty state when no custom reports are available", () => {
+      cy.intercept("GET", "/api/v1/plus/custom-report/minimal*", {
+        fixture: "custom-reports/empty_custom-reports.json",
+      }).as("getEmptyCustomReports");
+      cy.getByTestId("custom-reports-trigger").click();
+      cy.getByTestId("custom-reports-popover").should("be.visible");
+      cy.wait("@getEmptyCustomReports");
+      cy.getByTestId("custom-reports-empty-state").should("be.visible");
+    });
+    it("should list the available reports in the popover", () => {
+      cy.getByTestId("custom-reports-trigger").click();
+      cy.getByTestId("custom-reports-popover").should("be.visible");
+      cy.wait("@getCustomReportsMinimal");
+      cy.getByTestId("custom-reports-popover").within(() => {
+        cy.getByTestId("custom-report-item").should("have.length", 2);
+      });
+    });
+    it("should allow the user to select a report", () => {
+      cy.wait("@getCustomReportsMinimal");
+      cy.getByTestId("custom-reports-trigger")
+        .should("contain.text", "Reports")
+        .click();
+      cy.getByTestId("custom-reports-popover").within(() => {
+        cy.getByTestId("custom-report-item").first().click();
+      });
+      cy.wait("@getCustomReportById");
+      cy.getByTestId("apply-report-button").click();
+      cy.getByTestId("custom-reports-popover").should("not.be.visible");
+      cy.get("#toast-datamap-report-toast")
+        .should("be.visible")
+        .should("have.attr", "data-status", "success");
+      cy.getByTestId("custom-reports-trigger")
+        .should("contain.text", "My Custom Report")
+        .click();
+      cy.getByTestId("fidesTable").within(() => {
+        // reordering applied to report
+        cy.get("thead th").eq(2).should("contain.text", "Legal name");
+        // column visibility applied to report
+        cy.get("thead th").eq(4).should("not.contain.text", "Data subject");
+      });
+      cy.getByTestId("group-by-menu").should(
+        "contain.text",
+        "Group by data use",
+      );
+      cy.getByTestId("edit-columns-btn").click();
+      cy.get("button#data_subjects").should(
+        "have.attr",
+        "aria-checked",
+        "false",
+      );
+      cy.getByTestId("column-settings-close-button").click();
+      cy.getByTestId("filter-multiple-systems-btn").click();
+      cy.getByTestId("datamap-report-filter-modal")
+        .should("be.visible")
+        .within(() => {
+          cy.getByTestId("filter-modal-accordion-button").eq(0).click();
+          cy.getByTestId("checkbox-Analytics").within(() => {
+            cy.get("[data-checked]").should("exist");
+          });
+          cy.getByTestId("standard-dialog-close-btn").click();
+        });
+    });
+    it("should allow the user to reset a report", () => {
+      cy.wait("@getCustomReportsMinimal");
+      cy.getByTestId("custom-reports-trigger")
+        .should("contain.text", "Reports")
+        .click();
+      cy.getByTestId("custom-reports-popover").within(() => {
+        cy.getByTestId("custom-report-item").first().click();
+      });
+      cy.wait("@getCustomReportById");
+      cy.getByTestId("apply-report-button").click();
+      cy.getByTestId("custom-reports-popover").should("not.be.visible");
+      cy.getByTestId("custom-reports-trigger")
+        .should("contain.text", "My Custom Report")
+        .click();
+      cy.getByTestId("custom-reports-reset-button").click();
+      cy.getByTestId("apply-report-button").click();
+      cy.getByTestId("custom-reports-popover").should("not.be.visible");
+      cy.getByTestId("custom-reports-trigger").should(
+        "contain.text",
+        "Reports",
+      );
+    });
+    it("should allow the user cancel a report selection", () => {
+      cy.wait("@getCustomReportsMinimal");
+      cy.getByTestId("custom-reports-trigger")
+        .should("contain.text", "Reports")
+        .click();
+      cy.getByTestId("custom-reports-popover").within(() => {
+        cy.getByTestId("custom-report-item").first().click();
+      });
+      cy.wait("@getCustomReportById");
+      cy.getByTestId("custom-report-popover-cancel").click();
+      cy.getByTestId("custom-reports-popover").should("not.be.visible");
+      cy.get("#toast-datamap-report-toast").should("not.exist");
+    });
+    it("should not be affected by the user's custom column settings", () => {
+      cy.wait("@getCustomReportsMinimal");
+      cy.getByTestId("custom-reports-trigger")
+        .should("contain.text", "Reports")
+        .click();
+      cy.getByTestId("custom-reports-popover").within(() => {
+        cy.getByTestId("custom-report-item").first().click();
+      });
+      cy.wait("@getCustomReportById");
+      cy.getByTestId("apply-report-button").click();
+      cy.getByTestId("data_categories-header-menu").click();
+      cy.getByTestId("data_categories-header-menu-list").within(() => {
+        cy.get("button").contains("Expand all").click();
+      });
+      cy.getByTestId("custom-reports-trigger").should(
+        "contain.text",
+        "My Custom Report",
+      );
+    });
+    it("should show an error if the report fails to load", () => {
+      cy.intercept("GET", "/api/v1/plus/custom-report/plu_*", {
+        statusCode: 500,
+        body: "Internal Server Error",
+      }).as("getCustomReportById500");
+      cy.getByTestId("custom-reports-trigger").click();
+      cy.wait("@getCustomReportsMinimal");
+      cy.getByTestId("custom-reports-popover").within(() => {
+        cy.getByTestId("custom-report-item").first().click();
+      });
+      cy.wait("@getCustomReportById500");
+      cy.get("#toast-custom-report-toast")
+        .should("be.visible")
+        .should("have.attr", "data-status", "error");
+    });
+    it("should allow an authorized user to create a new report", () => {
+      cy.getByTestId("custom-reports-trigger").click();
+      cy.wait("@getCustomReportsMinimal");
+      cy.getByTestId("custom-reports-popover").within(() => {
+        cy.getByTestId("create-report-button").click();
+      });
+      cy.getByTestId("custom-report-form").should("be.visible");
+      cy.getByTestId("custom-report-form").within(() => {
+        cy.get("#reportName").type("My Custom Report").blur();
+        cy.getByTestId("error-reportName").should("exist");
+        cy.get("#reportName").clear();
+      });
+      cy.getByTestId("custom-report-form").within(() => {
+        cy.get("#reportName").type("My new report");
+        cy.getByTestId("error-reportName").should("not.exist");
+        cy.getByTestId("custom-report-form-submit").click();
+      });
+      cy.wait("@createCustomReport").then((interception) => {
+        expect(interception.request.body.name).to.equal("My new report");
+        expect(interception.request.body.type).to.equal(ReportType.DATAMAP);
+        expect(interception.request.body.config).to.not.be.empty;
+      });
+      cy.getByTestId("custom-reports-popover").should("be.visible");
+    });
+    it("should allow an authorized user to delete a report", () => {
+      cy.getByTestId("custom-reports-trigger").click();
+      cy.wait("@getCustomReportsMinimal");
+      cy.getByTestId("custom-reports-popover").within(() => {
+        cy.getByTestId("delete-report-button").first().click();
+      });
+      cy.getByTestId("confirmation-modal").should("be.visible");
+      cy.getByTestId("confirmation-modal").within(() => {
+        cy.getByTestId("continue-btn").click();
+      });
+      cy.wait("@deleteCustomReport")
+        .its("request.url")
+        .should("include", "1234");
+    });
+  });
+
   describe("Exporting", () => {
     it("should open the export modal", () => {
       cy.getByTestId("export-btn").click();

clients/admin-ui/cypress/fixtures/custom-reports/custom-report.json

@@ -0,0 +1,112 @@
+{
+  "id": "plu_1234",
+  "type": "datamap",
+  "name": "My Custom Report",
+  "config": {
+    "table_state": {
+      "filters": {
+        "dataUses": ["analytics"],
+        "dataSubjects": [],
+        "dataCategories": []
+      },
+      "groupBy": "data_use, system",
+      "columnOrder": [
+        "data_use",
+        "system_name",
+        "legal_name",
+        "data_categories",
+        "data_subjects",
+        "dpo",
+        "legal_basis_for_processing",
+        "administrating_department",
+        "cookie_max_age_seconds",
+        "privacy_policy",
+        "legal_address",
+        "cookie_refresh",
+        "data_security_practices",
+        "DATA_SHARED_WITH_THIRD_PARTIES",
+        "data_stewards",
+        "declaration_name",
+        "does_international_transfers",
+        "dpa_location",
+        "egress",
+        "exempt_from_privacy_regulations",
+        "features",
+        "fides_key",
+        "flexible_legal_basis_for_processing",
+        "impact_assessment_location",
+        "ingress",
+        "joint_controller_info",
+        "legal_basis_for_profiling",
+        "legal_basis_for_transfers",
+        "legitimate_interest_disclosure_url",
+        "link_to_processor_contract",
+        "processes_personal_data",
+        "reason_for_exemption",
+        "requires_data_protection_assessments",
+        "responsibility",
+        "retention_period",
+        "shared_categories",
+        "special_category_legal_basis",
+        "system_dependencies",
+        "third_country_safeguards",
+        "third_parties",
+        "system_undeclared_data_categories",
+        "data_use_undeclared_data_categories",
+        "cookies",
+        "uses_cookies",
+        "uses_non_cookie_access",
+        "uses_profiling",
+        "system_lorem"
+      ],
+      "columnVisibility": {
+        "dpo": true,
+        "egress": true,
+        "cookies": true,
+        "ingress": true,
+        "features": true,
+        "fides_key": true,
+        "legal_name": true,
+        "dpa_location": true,
+        "system_lorem": true,
+        "uses_cookies": true,
+        "data_stewards": true,
+        "data_subjects": false,
+        "legal_address": true,
+        "third_parties": true,
+        "cookie_refresh": true,
+        "privacy_policy": true,
+        "responsibility": true,
+        "uses_profiling": true,
+        "data_categories": true,
+        "declaration_name": true,
+        "retention_period": true,
+        "shared_categories": true,
+        "system_dependencies": true,
+        "reason_for_exemption": true,
+        "joint_controller_info": true,
+        "cookie_max_age_seconds": true,
+        "uses_non_cookie_access": true,
+        "data_security_practices": true,
+        "processes_personal_data": true,
+        "third_country_safeguards": true,
+        "administrating_department": true,
+        "legal_basis_for_profiling": true,
+        "legal_basis_for_transfers": true,
+        "impact_assessment_location": true,
+        "legal_basis_for_processing": true,
+        "link_to_processor_contract": true,
+        "does_international_transfers": true,
+        "special_category_legal_basis": true,
+        "DATA_SHARED_WITH_THIRD_PARTIES": true,
+        "exempt_from_privacy_regulations": true,
+        "system_undeclared_data_categories": false,
+        "legitimate_interest_disclosure_url": true,
+        "data_use_undeclared_data_categories": false,
+        "flexible_legal_basis_for_processing": true,
+        "requires_data_protection_assessments": true
+      }
+    },
+    "column_map": {}
+  }
+}

clients/admin-ui/cypress/fixtures/custom-reports/empty_custom-reports.json

@@ -0,0 +1 @@
+{ "items": [], "total": 0, "page": 1, "size": 50, "pages": 0 }

clients/admin-ui/cypress/fixtures/custom-reports/minimal.json

@@ -0,0 +1,18 @@
+{
+  "items": [
+    {
+      "id": "plu_1234",
+      "type": "datamap",
+      "name": "My Custom Report"
+    },
+    {
+      "id": "plu_5678",
+      "type": "datamap",
+      "name": "Another Saved Report"
+    }
+  ],
+  "total": 2,
+  "page": 1,
+  "size": 50,
+  "pages": 1
+}

clients/admin-ui/cypress/fixtures/user-management/permissions.json

@@ -48,6 +48,9 @@
     "custom_field_definition:delete",
     "custom_field_definition:read",
     "custom_field_definition:update",
+    "custom_report:read",
+    "custom_report:create",
+    "custom_report:delete",
     "data_category:create",
     "data_category:delete",
     "data_category:read",

clients/admin-ui/src/features/common/api.slice.ts

@@ -26,6 +26,7 @@ export const baseApi = createApi({
     "Custom Assets",
     "Custom Field Definition",
     "Custom Fields",
+    "Custom Reports",
     "Data Categories",
     "Datamap",
     "Data Subjects",