feat(tooltip): tooltip for tables

Signed-off-by: Sudhanshu Dasgupta <dasguptashivam23@gmail.com>

Author: sudhanshutech

src/custom/CustomTooltip/customTooltip.tsx

@@ -50,7 +50,7 @@ function CustomTooltip({
       onClick={onClick}
       {...props}
     >
-      {children}
+      <div>{children}</div>
     </Tooltip>
   );
 }

src/custom/ResponsiveDataTable.tsx

@@ -1,10 +1,13 @@
 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: {
@@ -253,7 +256,10 @@ const ResponsiveDataTable = ({
         columns={tableCols ?? []}
         data={data || []}
         title={undefined}
-        components={components}
+        components={{
+          Tooltip: CustomTooltip as unknown as React.ReactNode,
+          ...components
+        }}
         options={updatedOptions}
         {...props}
       />