From 86af1daa7b4e70b8f1a468980d96a498a11ee7e5 Mon Sep 17 00:00:00 2001
From: Bilal MEDDAH <b_meddah@esi.dz>
Date: Mon, 24 Jul 2023 11:26:39 +0200
Subject: [PATCH] f-4092/update: add toggle to fetch deprecated resources,
 default to false

---
 src/subapps/dataExplorer/DataExplorer.tsx     | 26 ++++++++++++++++++-
 .../dataExplorer/DataExplorerUtils.tsx        |  8 +++++-
 2 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/src/subapps/dataExplorer/DataExplorer.tsx b/src/subapps/dataExplorer/DataExplorer.tsx
index dda2c2a9d..498622f3c 100644
--- a/src/subapps/dataExplorer/DataExplorer.tsx
+++ b/src/subapps/dataExplorer/DataExplorer.tsx
@@ -23,6 +23,7 @@ export interface DataExplorerConfiguration {
   type: string | undefined;
   predicate: ((resource: Resource) => boolean) | null;
   selectedPath: string | null;
+  deprecated: boolean;
 }
 
 export const DataExplorer: React.FC<{}> = () => {
@@ -31,7 +32,15 @@ export const DataExplorer: React.FC<{}> = () => {
   const [headerHeight, setHeaderHeight] = useState<number>(0);
 
   const [
-    { pageSize, offset, orgAndProject, predicate, type, selectedPath },
+    {
+      pageSize,
+      offset,
+      orgAndProject,
+      predicate,
+      type,
+      selectedPath,
+      deprecated,
+    },
     updateTableConfiguration,
   ] = useReducer(
     (
@@ -45,6 +54,7 @@ export const DataExplorer: React.FC<{}> = () => {
       type: undefined,
       predicate: null,
       selectedPath: null,
+      deprecated: false,
     }
   );
 
@@ -53,6 +63,7 @@ export const DataExplorer: React.FC<{}> = () => {
     offset,
     orgAndProject,
     type,
+    deprecated,
   });
 
   const currentPageDataSource: Resource[] = resources?._results || [];
@@ -71,6 +82,11 @@ export const DataExplorer: React.FC<{}> = () => {
     [currentPageDataSource, showMetadataColumns, selectedPath]
   );
 
+  const onDeprecatedChange = (checked: boolean) =>
+    updateTableConfiguration({
+      deprecated: checked,
+    });
+
   return (
     <div className="data-explorer-contents">
       {isLoading && <Spin className="loading" />}
@@ -111,6 +127,14 @@ export const DataExplorer: React.FC<{}> = () => {
             totalFiltered={predicate ? displayedDataSource.length : undefined}
           />
           <div className="data-explorer-toggles">
+            <Switch
+              defaultChecked={false}
+              checked={deprecated}
+              onClick={onDeprecatedChange}
+              id="show-deprecated-resources"
+              className="data-explorer-toggle"
+            />
+            <label htmlFor="show-metadata-columns">Show deprecated</label>
             <Switch
               defaultChecked={false}
               checked={showMetadataColumns}
diff --git a/src/subapps/dataExplorer/DataExplorerUtils.tsx b/src/subapps/dataExplorer/DataExplorerUtils.tsx
index 73fe2562f..c2436f4c6 100644
--- a/src/subapps/dataExplorer/DataExplorerUtils.tsx
+++ b/src/subapps/dataExplorer/DataExplorerUtils.tsx
@@ -11,11 +11,15 @@ export const usePaginatedExpandedResources = ({
   offset,
   orgAndProject,
   type,
+  deprecated,
 }: PaginatedResourcesParams) => {
   const nexus = useNexusContext();
 
   return useQuery({
-    queryKey: ['data-explorer', { pageSize, offset, orgAndProject, type }],
+    queryKey: [
+      'data-explorer',
+      { pageSize, offset, orgAndProject, type, deprecated },
+    ],
     retry: false,
     queryFn: async () => {
       const resultWithPartialResources = await nexus.Resource.list(
@@ -23,6 +27,7 @@ export const usePaginatedExpandedResources = ({
         orgAndProject?.[1],
         {
           type,
+          deprecated,
           from: offset,
           size: pageSize,
         }
@@ -181,4 +186,5 @@ interface PaginatedResourcesParams {
   offset: number;
   orgAndProject?: string[];
   type?: string;
+  deprecated: boolean;
 }