DOP-3903: API Changelog Support to omit entries

src/components/OpenAPIChangelog/OpenAPIChangelog.js

@@ -14,6 +14,7 @@ import ChangeList from './components/ChangeList';
 import { useFetchDiff } from './utils/useFetchDiff';
 import { ALL_VERSIONS, getDownloadChangelogUrl } from './utils/constants';
 import getDiffResourcesList from './utils/getDiffResourcesList';
+import { hideChanges } from './utils/filterHiddenChanges';
 
 const ChangelogPage = styled.div`
   width: 100%;
@@ -72,6 +73,7 @@ const StyledLoadingSkeleton = styled.div`
 const OpenAPIChangelog = () => {
   const { snootyEnv } = useSiteMetadata();
   const { index = {}, changelog = [], changelogResourcesList = [] } = useChangelogData();
+
   const resourceVersions = index.versions?.length ? index.versions.slice().reverse() : [];
   const downloadChangelogUrl = useMemo(() => getDownloadChangelogUrl(index.runId, snootyEnv), [index, snootyEnv]);
 
@@ -86,7 +88,8 @@ const OpenAPIChangelog = () => {
   const [diffResourcesList, setDiffResourcesList] = useState(getDiffResourcesList(diff));
 
   const [filteredDiff, setFilteredDiff] = useState(diff);
-  const [filteredChangelog, setFilteredChangelog] = useState(changelog);
+  const unfilteredChangelog = hideChanges(changelog);
+  const [filteredChangelog, setFilteredChangelog] = useState(unfilteredChangelog);
 
   /* Update diffResourcesList on diff change */
   useEffect(() => {

src/components/OpenAPIChangelog/utils/filterHiddenChanges.js

@@ -0,0 +1,41 @@
+export const hideChanges = (changelog) => {
+  const versionUpdate = (version) => {
+    const updatedVersion = { ...version };
+    if (version?.changes) {
+      updatedVersion.changes = version.changes.filter((change) => !change.hideFromChangelog);
+    }
+    return updatedVersion;
+  };
+
+  //pathUpdate takes the array of versions from the specific path passed in and takes each version and runs versionUpdate on it
+  const pathUpdate = (path) => {
+    const updatedPath = { ...path, versions: path.versions.map(versionUpdate) };
+    updatedPath.versions = updatedPath.versions.filter((version) => version.changes?.length);
+    return updatedPath;
+  };
+
+  //dateUpdate takes the array of paths from the specific date section passed in and takes each path and runs pathUpdate on it
+  const dateUpdate = (dateSection) => {
+    const updatedDateSection = { ...dateSection, paths: dateSection.paths.map(pathUpdate) };
+    updatedDateSection.paths = updatedDateSection.paths.filter((path) => path.versions?.length);
+    return updatedDateSection;
+  };
+
+  //changelog is the json file with everything in it. Map at this level takes each date section and runs dateUpdate on it
+  const updatedChangelog = changelog.map(dateUpdate);
+  return updatedChangelog.filter((dateSection) => dateSection.paths?.length);
+};
+
+//nested filtering of Diff changes with hideFromChangeloge
+export const hideDiffChanges = (diffData) => {
+  const pathUpdate = (path) => {
+    const updatedPath = { ...path };
+    if (path?.changes) {
+      updatedPath.changes = path.changes.filter((change) => !change.hideFromChangelog);
+    }
+    return updatedPath;
+  };
+
+  const updatedDiffData = diffData.map(pathUpdate);
+  return updatedDiffData.filter((path) => path.changes?.length);
+};

src/components/OpenAPIChangelog/utils/useFetchDiff.js

@@ -2,6 +2,7 @@ import { useState, useEffect } from 'react';
 import { fetchOADiff } from '../../../utils/realm';
 import useChangelogData from '../../../utils/use-changelog-data';
 import { getDiffRequestFormat } from './getDiffRequestFormat';
+import { hideDiffChanges } from './filterHiddenChanges';
 
 export const useFetchDiff = (resourceVersionOne, resourceVersionTwo, setIsLoading, setToastOpen, snootyEnv) => {
   const { index = {}, mostRecentDiff = {} } = useChangelogData();
@@ -20,7 +21,8 @@ export const useFetchDiff = (resourceVersionOne, resourceVersionTwo, setIsLoadin
       setIsLoading(true);
       fetchOADiff(index.runId, fromAndToDiffLabel, snootyEnv)
         .then((response) => {
-          setDiff(response);
+          const filteredDiff = hideDiffChanges(response);
+          setDiff(filteredDiff);
           setIsLoading(false);
         })
         .catch((err) => {

tests/unit/ChangeList.test.js

@@ -53,4 +53,38 @@ describe('OpenAPIChangelog ChangeList', () => {
       expect(queryByText(change.change)).toBeNull();
     });
   });
+
+  // it('does not render all version changelog changes with "hideFromChangelog=true"', () => {
+  //   const hiddenChanges = mockChangelog.reduce((acc, date) => {
+  //     date.paths.forEach((path) =>
+  //       path.versions.forEach((version) =>
+  //         version.changes.forEach((change) => change.hideFromChangelog && acc.push(change))
+  //       )
+  //     );
+  //     return acc;
+  //   }, []);
+
+  //   const { queryByText } = render(<ChangeList changes={mockChangelog} versionMode={ALL_VERSIONS} />);
+
+  //   expect(hiddenChanges).toHaveLength(2);
+
+  //   hiddenChanges.forEach((change) => {
+  //     expect(queryByText(change.change)).toBeNull();
+  //   });
+  // });
+
+  // it('does not render Diff changelog changes with "hideFromChangelog=true"', () => {
+  //   const hiddenChanges = mockDiff.reduce((acc, resource) => {
+  //     resource.changes.forEach((change) => change.hideFromChangelog && acc.push(change));
+  //     return acc;
+  //   }, []);
+
+  //   const { queryByText } = render(<ChangeList changes={mockDiff} versionMode={COMPARE_VERSIONS} />);
+
+  //   expect(hiddenChanges).toHaveLength(2);
+
+  //   hiddenChanges.forEach((change) => {
+  //     expect(queryByText(change.change)).toBeNull();
+  //   });
+  // });
 });

tests/unit/__snapshots__/ChangeList.test.js.snap

@@ -158,7 +158,7 @@ exports[`OpenAPIChangelog ChangeList ChangeList renders all version changelog co
   line-height: 28px;
 }
 
-.emotion-35 {
+.emotion-54 {
   font-family: Euclid Circular A,‘Helvetica Neue’,Helvetica,Arial,sans-serif;
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
@@ -183,11 +183,11 @@ exports[`OpenAPIChangelog ChangeList ChangeList renders all version changelog co
   color: #00684A;
 }
 
-.emotion-40 {
+.emotion-59 {
   position: relative;
 }
 
-.emotion-41 {
+.emotion-60 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -200,7 +200,7 @@ exports[`OpenAPIChangelog ChangeList ChangeList renders all version changelog co
   margin-right: 5px;
 }
 
-.emotion-43 {
+.emotion-62 {
   color: #DB3030;
 }
 
@@ -254,6 +254,53 @@ exports[`OpenAPIChangelog ChangeList ChangeList renders all version changelog co
         </ul>
       </div>
     </section>
+    <section
+      class="emotion-2 emotion-3"
+    >
+      <h2
+        class="emotion-4"
+      >
+        01 February 2024 Release
+      </h2>
+      <div
+        class="emotion-5 emotion-6"
+        data-testid="resource-changes-block"
+      >
+        <div
+          class="emotion-7 emotion-8"
+        >
+          <a
+            class="lg-ui-0001 emotion-9"
+            href="//0/#tag/Alert-Configurations/operation/updateAlertConfiguration"
+            target="_self"
+          >
+            <span
+              class="emotion-10"
+            >
+              <h6
+                class="emotion-11 emotion-12 emotion-13"
+              >
+                PUT /api/atlas/v2/groups/{groupId}/alertConfigs/{alertConfigId}
+              </h6>
+            </span>
+          </a>
+          <div
+            class="emotion-14 emotion-15 emotion-16"
+          >
+            Removed
+          </div>
+        </div>
+        <ul
+          class="emotion-17 emotion-18"
+        >
+          <li
+            class="emotion-19 emotion-20"
+          >
+            This change should really definitely be hidden
+          </li>
+        </ul>
+      </div>
+    </section>
     <section
       class="emotion-2 emotion-3"
     >
@@ -285,7 +332,7 @@ exports[`OpenAPIChangelog ChangeList ChangeList renders all version changelog co
             </span>
           </a>
           <div
-            class="emotion-14 emotion-15 emotion-35"
+            class="emotion-14 emotion-15 emotion-54"
           >
             Released
           </div>
@@ -297,11 +344,11 @@ exports[`OpenAPIChangelog ChangeList ChangeList renders all version changelog co
             class="emotion-19 emotion-20"
           >
             <div
-              class="emotion-40 emotion-41 emotion-42"
+              class="emotion-59 emotion-60 emotion-61"
             >
               <svg
                 aria-label="Important With Circle Icon"
-                class="emotion-43"
+                class="emotion-62"
                 fill="none"
                 height="16"
                 role="img"
@@ -344,7 +391,7 @@ exports[`OpenAPIChangelog ChangeList ChangeList renders all version changelog co
             </span>
           </a>
           <div
-            class="emotion-14 emotion-15 emotion-35"
+            class="emotion-14 emotion-15 emotion-54"
           >
             Released
           </div>
@@ -356,11 +403,37 @@ exports[`OpenAPIChangelog ChangeList ChangeList renders all version changelog co
             class="emotion-19 emotion-20"
           >
             <div
-              class="emotion-40 emotion-41 emotion-42"
+              class="emotion-59 emotion-60 emotion-61"
+            >
+              <svg
+                aria-label="Important With Circle Icon"
+                class="emotion-62"
+                fill="none"
+                height="16"
+                role="img"
+                viewBox="0 0 16 16"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  clip-rule="evenodd"
+                  d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14ZM7 4.5a1 1 0 0 1 2 0v4a1 1 0 0 1-2 0v-4Zm2 7a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"
+                  fill="currentColor"
+                  fill-rule="evenodd"
+                />
+              </svg>
+            </div>
+            This change should be hidden
+          </li>
+          <li
+            class="emotion-19 emotion-20"
+          >
+            <div
+              class="emotion-59 emotion-60 emotion-61"
             >
               <svg
                 aria-label="Important With Circle Icon"
-                class="emotion-43"
+                class="emotion-62"
                 fill="none"
                 height="16"
                 role="img"
@@ -382,11 +455,11 @@ exports[`OpenAPIChangelog ChangeList ChangeList renders all version changelog co
             class="emotion-19 emotion-20"
           >
             <div
-              class="emotion-40 emotion-41 emotion-42"
+              class="emotion-59 emotion-60 emotion-61"
             >
               <svg
                 aria-label="Important With Circle Icon"
-                class="emotion-43"
+                class="emotion-62"
                 fill="none"
                 height="16"
                 role="img"
@@ -413,11 +486,11 @@ exports[`OpenAPIChangelog ChangeList ChangeList renders all version changelog co
             class="emotion-19 emotion-20"
           >
             <div
-              class="emotion-40 emotion-41 emotion-42"
+              class="emotion-59 emotion-60 emotion-61"
             >
               <svg
                 aria-label="Important With Circle Icon"
-                class="emotion-43"
+                class="emotion-62"
                 fill="none"
                 height="16"
                 role="img"
@@ -460,7 +533,7 @@ exports[`OpenAPIChangelog ChangeList ChangeList renders all version changelog co
             </span>
           </a>
           <div
-            class="emotion-14 emotion-15 emotion-35"
+            class="emotion-14 emotion-15 emotion-54"
           >
             Updated
           </div>
@@ -512,7 +585,7 @@ exports[`OpenAPIChangelog ChangeList ChangeList renders all version changelog co
             </span>
           </a>
           <div
-            class="emotion-14 emotion-15 emotion-35"
+            class="emotion-14 emotion-15 emotion-54"
           >
             Updated
           </div>
@@ -696,6 +769,32 @@ exports[`OpenAPIChangelog ChangeList ChangeList renders diff changelog correctly
       <ul
         class="emotion-11 emotion-12"
       >
+        <li
+          class="emotion-13 emotion-14"
+        >
+          <div
+            class="emotion-15 emotion-16 emotion-17"
+          >
+            <svg
+              aria-label="Important With Circle Icon"
+              class="emotion-18"
+              fill="none"
+              height="16"
+              role="img"
+              viewBox="0 0 16 16"
+              width="16"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                clip-rule="evenodd"
+                d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14ZM7 4.5a1 1 0 0 1 2 0v4a1 1 0 0 1-2 0v-4Zm2 7a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"
+                fill="currentColor"
+                fill-rule="evenodd"
+              />
+            </svg>
+          </div>
+          A change
+        </li>
         <li
           class="emotion-13 emotion-14"
         >
@@ -812,6 +911,32 @@ exports[`OpenAPIChangelog ChangeList ChangeList renders diff changelog correctly
           </div>
           Removed the required property 'name' from the response with the '200' status.
         </li>
+        <li
+          class="emotion-13 emotion-14"
+        >
+          <div
+            class="emotion-15 emotion-16 emotion-17"
+          >
+            <svg
+              aria-label="Important With Circle Icon"
+              class="emotion-18"
+              fill="none"
+              height="16"
+              role="img"
+              viewBox="0 0 16 16"
+              width="16"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                clip-rule="evenodd"
+                d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14ZM7 4.5a1 1 0 0 1 2 0v4a1 1 0 0 1-2 0v-4Zm2 7a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"
+                fill="currentColor"
+                fill-rule="evenodd"
+              />
+            </svg>
+          </div>
+          Removed the required property 'name' from the response with the '200' status.
+        </li>
       </ul>
     </div>
   </div>