diff --git a/packages/components/package.json b/packages/components/package.json
index 2a212a4ca..93f3459b7 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -18,6 +18,7 @@
     "@layer5/sistent-svg": "workspace:^",
     "@mui/icons-material": "^5.14.12",
     "@mui/material": "^5.14.10",
+    "@types/mui-datatables": "^4.3.6",
     "@types/react": "^18.2.15",
     "@types/react-dom": "^18.2.7",
     "@typescript-eslint/eslint-plugin": "^6.0.0",
@@ -36,6 +37,7 @@
     "@emotion/react": "*",
     "@emotion/styled": "*",
     "@mui/material": "*",
+    "mui-datables": "*",
     "react": "*",
     "react-dom": "*"
   },
@@ -49,6 +51,9 @@
     "@mui/material": {
       "optional": true
     },
+    "mui-datables": {
+      "optional": true
+    },
     "react": {
       "optional": true
     },
diff --git a/packages/components/src/base/DataTable/datatable.tsx b/packages/components/src/base/DataTable/datatable.tsx
new file mode 100644
index 000000000..fa9f7ae3d
--- /dev/null
+++ b/packages/components/src/base/DataTable/datatable.tsx
@@ -0,0 +1,5 @@
+import { MUIDataTable, type MUIDataTableProps } from 'mui-datatables';
+
+export const DataTable = (props: MUIDataTableProps) => {
+  return <MUIDataTable {...props} />;
+};
diff --git a/packages/components/src/base/DataTable/index.tsx b/packages/components/src/base/DataTable/index.tsx
new file mode 100644
index 000000000..c931d8cc7
--- /dev/null
+++ b/packages/components/src/base/DataTable/index.tsx
@@ -0,0 +1 @@
+export { DataTable } from './datatable';
diff --git a/packages/components/src/base/MuiTable/data-table.tsx b/packages/components/src/base/MuiTable/data-table.tsx
deleted file mode 100644
index c79ec2846..000000000
--- a/packages/components/src/base/MuiTable/data-table.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { DataTable as MuiDataTable, type DataTableProps } from 'mui-datatables';
-
-export const DataTable = (props: DataTableProps) => {
-  return <MuiDataTable {...props} />;
-};
diff --git a/packages/components/src/base/MuiTable/index.tsx b/packages/components/src/base/MuiTable/index.tsx
deleted file mode 100644
index 28b5088cd..000000000
--- a/packages/components/src/base/MuiTable/index.tsx
+++ /dev/null
@@ -1 +0,0 @@
-export { DataTable } from './data-table';
diff --git a/packages/components/src/index.tsx b/packages/components/src/index.tsx
index 391874a22..cdf7cb547 100644
--- a/packages/components/src/index.tsx
+++ b/packages/components/src/index.tsx
@@ -6,6 +6,7 @@ export * from './base/Button';
 export * from './base/Card';
 export * from './base/Checkbox';
 export * from './base/Chip';
+export * from './base/DataTable';
 export * from './base/Dialog';
 export * from './base/Divider';
 export * from './base/Drawer';
diff --git a/packages/components/vite.config.ts b/packages/components/vite.config.ts
index 89d8b0647..d959ab1ab 100644
--- a/packages/components/vite.config.ts
+++ b/packages/components/vite.config.ts
@@ -36,7 +36,8 @@ export default defineConfig({
           react: 'React',
           '@mui/material': 'material',
           'react/jsx-runtime': 'jsxRuntime',
-          'react-error-boundary': 'reactErrorBoundary'
+          'react-error-boundary': 'reactErrorBoundary',
+          'mui-datatables': 'muiDatatables'
         }
       }
     }
diff --git a/yarn.lock b/yarn.lock
index 0123773c6..8af140d57 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1827,7 +1827,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@emotion/react@npm:^11.11.1":
+"@emotion/react@npm:^11.10.5, @emotion/react@npm:^11.11.1":
   version: 11.11.1
   resolution: "@emotion/react@npm:11.11.1"
   dependencies:
@@ -1868,7 +1868,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@emotion/styled@npm:^11.11.0":
+"@emotion/styled@npm:^11.10.5, @emotion/styled@npm:^11.11.0":
   version: 11.11.0
   resolution: "@emotion/styled@npm:11.11.0"
   dependencies:
@@ -2406,6 +2406,7 @@ __metadata:
     "@layer5/sistent-svg": "workspace:^"
     "@mui/icons-material": ^5.14.12
     "@mui/material": ^5.14.10
+    "@types/mui-datatables": ^4.3.6
     "@types/react": ^18.2.15
     "@types/react-dom": ^18.2.7
     "@typescript-eslint/eslint-plugin": ^6.0.0
@@ -2423,6 +2424,7 @@ __metadata:
     "@emotion/react": "*"
     "@emotion/styled": "*"
     "@mui/material": "*"
+    mui-datables: "*"
     react: "*"
     react-dom: "*"
   peerDependenciesMeta:
@@ -2432,6 +2434,8 @@ __metadata:
       optional: true
     "@mui/material":
       optional: true
+    mui-datables:
+      optional: true
     react:
       optional: true
     react-dom:
@@ -2659,6 +2663,28 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@mui/base@npm:5.0.0-beta.18":
+  version: 5.0.0-beta.18
+  resolution: "@mui/base@npm:5.0.0-beta.18"
+  dependencies:
+    "@babel/runtime": ^7.23.1
+    "@floating-ui/react-dom": ^2.0.2
+    "@mui/types": ^7.2.5
+    "@mui/utils": ^5.14.12
+    "@popperjs/core": ^2.11.8
+    clsx: ^2.0.0
+    prop-types: ^15.8.1
+  peerDependencies:
+    "@types/react": ^17.0.0 || ^18.0.0
+    react: ^17.0.0 || ^18.0.0
+    react-dom: ^17.0.0 || ^18.0.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 7d4ca1e9d537b7b5850567f1adecd1caa47b8613b43a587cf2f399cfda0a8c17dfda06b030c0bea554b76abe7ac25bb9b1af3c996574def5f860cda0c6ea4a3c
+  languageName: node
+  linkType: hard
+
 "@mui/core-downloads-tracker@npm:^5.14.11":
   version: 5.14.11
   resolution: "@mui/core-downloads-tracker@npm:5.14.11"
@@ -2666,6 +2692,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@mui/core-downloads-tracker@npm:^5.14.12":
+  version: 5.14.12
+  resolution: "@mui/core-downloads-tracker@npm:5.14.12"
+  checksum: 1c1576ceecf7cade9e0d7a531632f5f9db24853d9ebbd47bb9ed943a3af7de734ad4f3374bab79880e9591db3ea55ea84cc10df72177f9ca5e32cc7662e04405
+  languageName: node
+  linkType: hard
+
 "@mui/icons-material@npm:^5.14.12":
   version: 5.14.12
   resolution: "@mui/icons-material@npm:5.14.12"
@@ -2682,6 +2715,39 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@mui/material@npm:^5.11.4":
+  version: 5.14.12
+  resolution: "@mui/material@npm:5.14.12"
+  dependencies:
+    "@babel/runtime": ^7.23.1
+    "@mui/base": 5.0.0-beta.18
+    "@mui/core-downloads-tracker": ^5.14.12
+    "@mui/system": ^5.14.12
+    "@mui/types": ^7.2.5
+    "@mui/utils": ^5.14.12
+    "@types/react-transition-group": ^4.4.6
+    clsx: ^2.0.0
+    csstype: ^3.1.2
+    prop-types: ^15.8.1
+    react-is: ^18.2.0
+    react-transition-group: ^4.4.5
+  peerDependencies:
+    "@emotion/react": ^11.5.0
+    "@emotion/styled": ^11.3.0
+    "@types/react": ^17.0.0 || ^18.0.0
+    react: ^17.0.0 || ^18.0.0
+    react-dom: ^17.0.0 || ^18.0.0
+  peerDependenciesMeta:
+    "@emotion/react":
+      optional: true
+    "@emotion/styled":
+      optional: true
+    "@types/react":
+      optional: true
+  checksum: a0d3b52ce3cc282da04036db0805f95f27b35a9c899f132f962fe96f05d3eb112e99ccbf6bd9d05cae617b24beda95470aedaff129d6e39d1b52e1ddf80a9e12
+  languageName: node
+  linkType: hard
+
 "@mui/material@npm:^5.14.10, @mui/material@npm:^5.14.8":
   version: 5.14.11
   resolution: "@mui/material@npm:5.14.11"
@@ -2732,6 +2798,23 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@mui/private-theming@npm:^5.14.12":
+  version: 5.14.12
+  resolution: "@mui/private-theming@npm:5.14.12"
+  dependencies:
+    "@babel/runtime": ^7.23.1
+    "@mui/utils": ^5.14.12
+    prop-types: ^15.8.1
+  peerDependencies:
+    "@types/react": ^17.0.0 || ^18.0.0
+    react: ^17.0.0 || ^18.0.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: f8127347dc29126fece3b530cb156f6ababf747b64bb1c712874375e6efae6c738c014304d9553001d67a59b24ca6a665f2d03bb5ae137f03bdba90815f0ecc1
+  languageName: node
+  linkType: hard
+
 "@mui/styled-engine@npm:^5.14.11":
   version: 5.14.11
   resolution: "@mui/styled-engine@npm:5.14.11"
@@ -2753,6 +2836,27 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@mui/styled-engine@npm:^5.14.12":
+  version: 5.14.12
+  resolution: "@mui/styled-engine@npm:5.14.12"
+  dependencies:
+    "@babel/runtime": ^7.23.1
+    "@emotion/cache": ^11.11.0
+    csstype: ^3.1.2
+    prop-types: ^15.8.1
+  peerDependencies:
+    "@emotion/react": ^11.4.1
+    "@emotion/styled": ^11.3.0
+    react: ^17.0.0 || ^18.0.0
+  peerDependenciesMeta:
+    "@emotion/react":
+      optional: true
+    "@emotion/styled":
+      optional: true
+  checksum: c689ccad59e7fd54cd8367838612daa4f132c64d8c6b99ccb7c8f9697b5c940a6bf7edcccd686ce437b565dbcf3bfc12bb0dea47cbd5fbd750ea1553017f9c0d
+  languageName: node
+  linkType: hard
+
 "@mui/system@npm:^5.14.11":
   version: 5.14.11
   resolution: "@mui/system@npm:5.14.11"
@@ -2781,6 +2885,34 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@mui/system@npm:^5.14.12":
+  version: 5.14.12
+  resolution: "@mui/system@npm:5.14.12"
+  dependencies:
+    "@babel/runtime": ^7.23.1
+    "@mui/private-theming": ^5.14.12
+    "@mui/styled-engine": ^5.14.12
+    "@mui/types": ^7.2.5
+    "@mui/utils": ^5.14.12
+    clsx: ^2.0.0
+    csstype: ^3.1.2
+    prop-types: ^15.8.1
+  peerDependencies:
+    "@emotion/react": ^11.5.0
+    "@emotion/styled": ^11.3.0
+    "@types/react": ^17.0.0 || ^18.0.0
+    react: ^17.0.0 || ^18.0.0
+  peerDependenciesMeta:
+    "@emotion/react":
+      optional: true
+    "@emotion/styled":
+      optional: true
+    "@types/react":
+      optional: true
+  checksum: 70c3920eadc593395a2d258ddea0f3b28689c7f02fdaf97fc205e16efaeebe462b2ab01c69a20a3bcb011e0d07ea47fa66a433e70d0a1ce15d7b694fb3c52135
+  languageName: node
+  linkType: hard
+
 "@mui/types@npm:^7.2.4":
   version: 7.2.4
   resolution: "@mui/types@npm:7.2.4"
@@ -2793,6 +2925,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@mui/types@npm:^7.2.5":
+  version: 7.2.5
+  resolution: "@mui/types@npm:7.2.5"
+  peerDependencies:
+    "@types/react": ^17.0.0 || ^18.0.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 2807e9a8eb251294eee6384a4d68b2159f7660466625f1781e9efea282aa7c6ff35b42bc7039c2d43e7a5ac80291dcb85c4110022b0b6de4e12b6406b62f3dc1
+  languageName: node
+  linkType: hard
+
 "@mui/utils@npm:^5.14.11":
   version: 5.14.11
   resolution: "@mui/utils@npm:5.14.11"
@@ -2811,6 +2955,24 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@mui/utils@npm:^5.14.12":
+  version: 5.14.12
+  resolution: "@mui/utils@npm:5.14.12"
+  dependencies:
+    "@babel/runtime": ^7.23.1
+    "@types/prop-types": ^15.7.7
+    prop-types: ^15.8.1
+    react-is: ^18.2.0
+  peerDependencies:
+    "@types/react": ^17.0.0 || ^18.0.0
+    react: ^17.0.0 || ^18.0.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 41470b6292b7a46c71fb0a0acc6a5f05a5e080648106b8805555de920e8f748669c7e8d39cbbcf0f52be9053927bb8439a748e24bd02bc1a220c9bded4435f42
+  languageName: node
+  linkType: hard
+
 "@ndelangen/get-tarball@npm:^3.0.7":
   version: 3.0.9
   resolution: "@ndelangen/get-tarball@npm:3.0.9"
@@ -5493,6 +5655,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/mui-datatables@npm:^4.3.6":
+  version: 4.3.6
+  resolution: "@types/mui-datatables@npm:4.3.6"
+  dependencies:
+    "@emotion/react": ^11.10.5
+    "@emotion/styled": ^11.10.5
+    "@mui/material": ^5.11.4
+    "@types/react": "*"
+    csstype: ^3.1.1
+  checksum: 722bc2a4631fbbb3d29264e4784d2b5324262a0e96fd4aeb1c7651a3e23183be921d9f22a38b1a276c02fef0fbf44ad364d61c9e938da31b43097113cee1c29b
+  languageName: node
+  linkType: hard
+
 "@types/node-fetch@npm:^2.6.4":
   version: 2.6.6
   resolution: "@types/node-fetch@npm:2.6.6"
@@ -5552,6 +5727,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/prop-types@npm:^15.7.7":
+  version: 15.7.8
+  resolution: "@types/prop-types@npm:15.7.8"
+  checksum: 61dfad79da8b1081c450bab83b77935df487ae1cdd4660ec7df6be8e74725c15fa45cf486ce057addc956ca4ae78300b97091e2a25061133d1b9a1440bc896ae
+  languageName: node
+  linkType: hard
+
 "@types/qs@npm:*, @types/qs@npm:^6.9.5":
   version: 6.9.8
   resolution: "@types/qs@npm:6.9.8"
@@ -7666,7 +7848,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"csstype@npm:^3.0.2, csstype@npm:^3.1.2":
+"csstype@npm:^3.0.2, csstype@npm:^3.1.1, csstype@npm:^3.1.2":
   version: 3.1.2
   resolution: "csstype@npm:3.1.2"
   checksum: e1a52e6c25c1314d6beef5168da704ab29c5186b877c07d822bd0806717d9a265e8493a2e35ca7e68d0f5d472d43fac1cdce70fd79fd0853dff81f3028d857b5