Feature: Update report downloader function to download sitemap report

packages/cli-dashboard/src/components/siteMapReport/index.tsx

@@ -41,6 +41,7 @@ import SiteMapAffectedCookies from './sitemapAffectedCookies';
 import CookiesLandingContainer from '../siteReport/tabs/cookies/cookiesLandingContainer';
 import reshapeCookies from '../utils/reshapeCookies';
 import sidebarData from './sidebarData';
+import { generateSiteMapReportandDownload } from '../utils/reportDownloader';
 
 interface SiteMapReportProps {
   landingPageCookies: CookieFrameStorageType;
@@ -134,6 +135,13 @@ const SiteMapReport = ({
           tabCookies={reshapedCookies}
           tabFrames={frames}
           affectedCookies={affectedCookies}
+          downloadReport={() => {
+            if (!Array.isArray(completeJson)) {
+              return;
+            }
+
+            generateSiteMapReportandDownload(completeJson);
+          }}
         />
       );
 

packages/cli-dashboard/src/components/siteReport/tabs/cookies/index.tsx

@@ -21,7 +21,7 @@ import { UNKNOWN_FRAME_KEY, type TabFrames } from '@ps-analysis-tool/common';
  */
 import CookiesListing from './cookiesListing';
 import { useContentStore } from '../../stateProviders/contentStore';
-import { genereateAndDownloadCSVReports } from '../../../utils/reportDownloader';
+import { generateSiteReportandDownload } from '../../../utils/reportDownloader';
 import CookiesLandingContainer from './cookiesLandingContainer';
 
 interface CookiesTabProps {
@@ -60,9 +60,9 @@ const CookiesTab = ({ selectedFrameUrl, selectedSite }: CookiesTabProps) => {
       return;
     }
     if (Array.isArray(completeJson)) {
-      genereateAndDownloadCSVReports(completeJson, selectedSite);
+      generateSiteReportandDownload(completeJson, selectedSite);
     } else if (!Array.isArray(completeJson)) {
-      genereateAndDownloadCSVReports([completeJson]);
+      generateSiteReportandDownload([completeJson]);
     }
   }, [completeJson, selectedSite]);
 

packages/cli-dashboard/src/components/utils/generateReports/generateAffectedCookiesCSV.ts → packages/cli-dashboard/src/components/utils/reportDownloader/generateReports/generateAffectedCookiesCSV.ts

@@ -21,7 +21,7 @@ import { sanitizeCsvRecord } from '@ps-analysis-tool/common';
 /**
  * Internal dependencies
  */
-import type { CompleteJson, CookieJsonDataType } from '../../../types';
+import type { CompleteJson, CookieJsonDataType } from '../../../../types';
 
 export const AFFECTED_COOKIES_DATA_HEADERS = [
   'Name',

packages/cli-dashboard/src/components/utils/generateReports/generateAllCookiesCSV.ts → packages/cli-dashboard/src/components/utils/reportDownloader/generateReports/generateAllCookiesCSV.ts

@@ -21,7 +21,7 @@ import { sanitizeCsvRecord } from '@ps-analysis-tool/common';
 /**
  * Internal dependencies
  */
-import type { CompleteJson, CookieJsonDataType } from '../../../types';
+import type { CompleteJson, CookieJsonDataType } from '../../../../types';
 
 export const COOKIES_DATA_HEADER = [
   'Name',

packages/cli-dashboard/src/components/utils/generateReports/generateSummaryDataCSV.ts → packages/cli-dashboard/src/components/utils/reportDownloader/generateReports/generateSummaryDataCSV.ts

@@ -17,7 +17,7 @@
 /**
  * Internal dependencies
  */
-import type { CompleteJson, CookieJsonDataType } from '../../../types';
+import type { CompleteJson, CookieJsonDataType } from '../../../../types';
 
 const generateSummaryDataCSV = (siteAnalysisData: CompleteJson): string => {
   const frameCookieDataMap = siteAnalysisData.cookieData;

packages/cli-dashboard/src/components/utils/generateReports/generateTechnologyCSV.ts → packages/cli-dashboard/src/components/utils/reportDownloader/generateReports/generateTechnologyCSV.ts

@@ -21,7 +21,7 @@ import { sanitizeCsvRecord } from '@ps-analysis-tool/common';
 /**
  * Internal dependencies
  */
-import type { CompleteJson } from '../../../types';
+import type { CompleteJson } from '../../../../types';
 
 const TECHNOLOGIES_DATA_HEADER = [
   'Name',

packages/cli-dashboard/src/components/utils/generateReports/tests/data.mock.ts → packages/cli-dashboard/src/components/utils/reportDownloader/generateReports/tests/data.mock.ts

@@ -14,11 +14,70 @@
  * limitations under the License.
  */
 
-import type { CompleteJson } from '../../../../types';
+import type { CompleteJson } from '../../../../../types';
 
 export const mockData1: CompleteJson = {
   pageUrl: 'https://edition.cnn.com/',
-  technologyData: [],
+  technologyData: [
+    {
+      slug: 'bootstrap',
+      name: 'Bootstrap',
+      description:
+        'Bootstrap is a free and open-source CSS framework directed at responsive, mobile-first front-end web development. It contains CSS and JavaScript-based design templates for typography, forms, buttons, navigation, and other interface components.',
+      confidence: 100,
+      version: null,
+      icon: 'Bootstrap.svg',
+      website: 'https://getbootstrap.com',
+      cpe: 'cpe:2.3:a:getbootstrap:bootstrap:*:*:*:*:*:*:*:*',
+      categories: [
+        {
+          id: 66,
+          slug: 'ui-frameworks',
+          name: 'UI frameworks',
+        },
+      ],
+    },
+    {
+      slug: 'varnish',
+      name: 'Varnish',
+      description: 'Varnish is a reverse caching proxy.',
+      confidence: 100,
+      version: null,
+      icon: 'Varnish.svg',
+      website: 'https://www.varnish-cache.org',
+      cpe: 'cpe:2.3:a:varnish-software:varnish_cache:*:*:*:*:*:*:*:*',
+      categories: [
+        {
+          id: 23,
+          slug: 'caching',
+          name: 'Caching',
+        },
+      ],
+    },
+    {
+      slug: 'styled-components',
+      name: 'styled-components',
+      description:
+        'Styled components is a CSS-in-JS styling framework that uses tagged template literals in JavaScript.',
+      confidence: 100,
+      version: '4.3.2',
+      icon: 'styled-components.svg',
+      website: 'https://styled-components.com',
+      cpe: null,
+      categories: [
+        {
+          id: 12,
+          slug: 'javascript-frameworks',
+          name: 'JavaScript frameworks',
+        },
+        {
+          id: 47,
+          slug: 'development',
+          name: 'Development',
+        },
+      ],
+    },
+  ],
   cookieData: {
     'https://edition.cnn.com': {
       cookiesCount: 2,

packages/cli-dashboard/src/components/utils/reportDownloader/generateReports/tests/generateSummaryData.ts

@@ -0,0 +1,39 @@
+/*
+ * Copyright 2023 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * Internal dependencies
+ */
+import generateSummaryDataCSV from '../generateSummaryDataCSV';
+import { mockData1 } from './data.mock';
+
+describe('generateSummaryDataCSV', () => {
+  it('should create CSV string for summary data', () => {
+    const CSVString = generateSummaryDataCSV(mockData1);
+
+    expect(CSVString.split('\r\n').filter((str) => str).length).toBe(12);
+  });
+
+  it('shoulde have 3 cookies', () => {
+    const CSVString = generateSummaryDataCSV(mockData1);
+
+    expect(
+      CSVString.split('\r\n').filter(
+        (str) => str.split(',')[0] === 'Total Cookies'
+      )
+    ).toStrictEqual(['Total Cookies, 3']);
+  });
+});

packages/cli-dashboard/src/components/utils/reportDownloader/generateReports/tests/generateTechnologyCSV.ts

@@ -0,0 +1,29 @@
+/*
+ * Copyright 2023 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * Internal dependencies
+ */
+import generateTechnologyCSV from '../generateTechnologyCSV';
+import { mockData1 } from './data.mock';
+
+describe('generateTechnologyCSV', () => {
+  it('should create CSV string for technology data', () => {
+    const CSVString = generateTechnologyCSV(mockData1);
+
+    expect(CSVString.split('\r\n').filter((str) => str).length).toBe(4);
+  });
+});

packages/cli-dashboard/src/components/utils/reportDownloader/generateSiteMapReportandDownload.ts

@@ -0,0 +1,50 @@
+/*
+ * Copyright 2023 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * External dependencies
+ */
+import JSZip from 'jszip';
+import { saveAs } from 'file-saver';
+
+/**
+ * Internal dependencies
+ */
+import type { CompleteJson } from '../../../types';
+import { createZip, getFolderName } from './utils';
+
+const generateSiteMapReportandDownload = async (JSONReport: CompleteJson[]) => {
+  if (!JSONReport.length) {
+    return;
+  }
+
+  const zip = new JSZip();
+
+  JSONReport.forEach((data) => {
+    const zipFolder: JSZip | null = zip.folder(getFolderName(data.pageUrl));
+
+    if (!zipFolder) {
+      return;
+    }
+
+    createZip(data, zipFolder);
+  });
+
+  const content = await zip.generateAsync({ type: 'blob' });
+  saveAs(content, 'report.zip');
+};
+
+export default generateSiteMapReportandDownload;