diff --git a/src/custom/CustomTooltip/customTooltip.tsx b/src/custom/CustomTooltip/customTooltip.tsx
index 356f4bd60..8668767f3 100644
--- a/src/custom/CustomTooltip/customTooltip.tsx
+++ b/src/custom/CustomTooltip/customTooltip.tsx
@@ -50,7 +50,7 @@ function CustomTooltip({
       onClick={onClick}
       {...props}
     >
-      <div>{children}</div>
+      {children}
     </Tooltip>
   );
 }
diff --git a/src/custom/ResponsiveDataTable.tsx b/src/custom/ResponsiveDataTable.tsx
index bb0914765..381af44fd 100644
--- a/src/custom/ResponsiveDataTable.tsx
+++ b/src/custom/ResponsiveDataTable.tsx
@@ -1,13 +1,10 @@
 import { Theme, ThemeProvider, createTheme } from '@mui/material';
 import MUIDataTable from 'mui-datatables';
 import React, { useCallback } from 'react';
-import { CustomTooltip } from './CustomTooltip';
 
 const dataTableTheme = (theme: Theme) =>
   createTheme({
-    ...theme,
     components: {
-      ...theme.components,
       MuiTable: {
         styleOverrides: {
           root: {
@@ -261,10 +258,7 @@ const ResponsiveDataTable = ({
         columns={tableCols ?? []}
         data={data || []}
         title={undefined}
-        components={{
-          Tooltip: CustomTooltip as unknown as React.ReactNode,
-          ...components
-        }}
+        components={components}
         options={updatedOptions}
         {...props}
       />