EVEREST-1574-db-details-status-modal (#779)

* EVEREST-1574-db-details-status-modal * EVEREST-1574-db-details-status-modal * EVEREST-1574-db-details-status-modal
percona · Oct 23, 2024 · 5f77b08 · 5f77b08
1 parent c40c26a
commit 5f77b08
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 8 deletions.
diff --git a/ui/apps/everest/src/components/db-actions/db-actions.tsx b/ui/apps/everest/src/components/db-actions/db-actions.tsx
@@ -36,8 +36,8 @@ export const DbActions = ({
   isDetailView = false,
   dbCluster,
   setIsNewClusterMode,
-  setOpenDetailsDialog,
   handleRestoreDbCluster,
+  handleOpenDbDetailsDialog,
   handleDeleteDbCluster,
   handleDbRestart,
   handleDbSuspendOrResumed,
@@ -182,12 +182,12 @@ export const DbActions = ({
             <KeyboardReturnIcon /> {Messages.menuItems.restoreFromBackup}
           </MenuItem>
         )}
-        {isDetailView && setOpenDetailsDialog && dbCluster?.status?.details && (
+        {isDetailView && dbCluster?.status?.details && (
           <MenuItem
             key={6}
             sx={sx}
             onClick={() => {
-              setOpenDetailsDialog(true);
+              handleOpenDbDetailsDialog(dbCluster);
             }}
           >
             <VisibilityOutlinedIcon /> {Messages.menuItems.dbStatusDetails}

diff --git a/ui/apps/everest/src/components/db-actions/db-actions.types.ts b/ui/apps/everest/src/components/db-actions/db-actions.types.ts
@@ -4,7 +4,7 @@ export interface DbActionsProps {
   isDetailView?: boolean;
   dbCluster: DbCluster;
   setIsNewClusterMode: React.Dispatch<React.SetStateAction<boolean>>;
-  setOpenDetailsDialog?: React.Dispatch<React.SetStateAction<boolean>>;
+  handleOpenDbDetailsDialog: (dbCluster: DbCluster) => void;
   handleRestoreDbCluster: (dbCluster: DbCluster) => void;
   handleDeleteDbCluster: (dbCluster: DbCluster) => void;
   handleDbRestart: (dbCluster: DbCluster) => void;

diff --git a/ui/apps/everest/src/hooks/api/db-cluster/useDbActions.ts b/ui/apps/everest/src/hooks/api/db-cluster/useDbActions.ts
@@ -157,6 +157,11 @@ export const useDbActions = () => {
     setOpenRestoreDialog(true);
   };
 
+  const handleOpenDbDetailsDialog = (dbCluster: DbCluster) => {
+    setSelectedDbCluster(dbCluster);
+    setOpenDetailsDialog(true);
+  };
+
   const handleCloseRestoreDialog = () => {
     setOpenRestoreDialog(false);
   };
@@ -173,6 +178,7 @@ export const useDbActions = () => {
     handleDbRestart,
     handleDeleteDbCluster,
     handleConfirmDelete,
+    handleOpenDbDetailsDialog,
     handleCloseDeleteDialog,
     handleCloseDetailsDialog,
     isPaused,

diff --git a/ui/apps/everest/src/pages/databases/DbClusterView.tsx b/ui/apps/everest/src/pages/databases/DbClusterView.tsx
@@ -56,7 +56,7 @@ export const DbClusterView = () => {
     handleConfirmDelete,
     handleCloseDeleteDialog,
     openDetailsDialog,
-    setOpenDetailsDialog,
+    handleOpenDbDetailsDialog,
     handleCloseDetailsDialog,
     selectedDbCluster,
   } = useDbActions();
@@ -181,7 +181,7 @@ export const DbClusterView = () => {
                 handleDeleteDbCluster={handleDeleteDbCluster}
                 isPaused={isPaused}
                 handleRestoreDbCluster={handleRestoreDbCluster}
-                setOpenDetailsDialog={setOpenDetailsDialog}
+                handleOpenDbDetailsDialog={handleOpenDbDetailsDialog}
               />
             );
           }}

diff --git a/ui/apps/everest/src/pages/db-cluster-details/db-cluster-details.tsx b/ui/apps/everest/src/pages/db-cluster-details/db-cluster-details.tsx
@@ -33,11 +33,11 @@ export const DbClusterDetails = () => {
     openRestoreDialog,
     handleCloseRestoreDialog,
     handleRestoreDbCluster,
+    handleOpenDbDetailsDialog,
     handleDbRestart,
     handleDbSuspendOrResumed,
     handleDeleteDbCluster,
     openDetailsDialog,
-    setOpenDetailsDialog,
     handleCloseDetailsDialog,
     isPaused,
     openDeleteDialog,
@@ -102,7 +102,7 @@ export const DbClusterDetails = () => {
             isDetailView={true}
             dbCluster={dbCluster}
             setIsNewClusterMode={setIsNewClusterMode}
-            setOpenDetailsDialog={setOpenDetailsDialog}
+            handleOpenDbDetailsDialog={handleOpenDbDetailsDialog}
             handleDbRestart={handleDbRestart}
             handleDbSuspendOrResumed={handleDbSuspendOrResumed}
             handleDeleteDbCluster={handleDeleteDbCluster}