From 9fad5bd5acf6b5d5f92969873c0237251a3daed5 Mon Sep 17 00:00:00 2001
From: hiren1212 <hirenpadsala12@gmail.com>
Date: Mon, 24 Jan 2022 23:47:45 +0530
Subject: [PATCH] Feature - wms11 create component for table pagination

---
 src/assets/images/NextIcon.js           |  9 +++++++
 src/assets/images/PreviousIcon.js       |  7 ++++++
 src/components/TablePagination/index.js | 33 +++++++++++++++++++++++++
 3 files changed, 49 insertions(+)
 create mode 100644 src/assets/images/NextIcon.js
 create mode 100644 src/assets/images/PreviousIcon.js
 create mode 100644 src/components/TablePagination/index.js

diff --git a/src/assets/images/NextIcon.js b/src/assets/images/NextIcon.js
new file mode 100644
index 0000000..98f15dc
--- /dev/null
+++ b/src/assets/images/NextIcon.js
@@ -0,0 +1,9 @@
+const NextIcon = () => (
+  <svg width="10" height="19" viewBox="0 0 10 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M1.28158 18.5311C1.08366 18.5311 0.885742 18.4582 0.729492 18.3019C0.427409 17.9998 0.427409 17.4998 0.729492 17.1978L7.52116 10.4061C8.02116 9.90609 8.02116 9.09359 7.52116 8.59359L0.729492 1.80192C0.427409 1.49984 0.427409 0.999837 0.729492 0.697754C1.03158 0.395671 1.53157 0.395671 1.83366 0.697754L8.62533 7.48942C9.15658 8.02067 9.45866 8.73942 9.45866 9.49984C9.45866 10.2603 9.16699 10.979 8.62533 11.5103L1.83366 18.3019C1.67741 18.4478 1.47949 18.5311 1.28158 18.5311Z" fill="#292D32"/>
+  </svg>
+
+);
+
+export default NextIcon;
+
diff --git a/src/assets/images/PreviousIcon.js b/src/assets/images/PreviousIcon.js
new file mode 100644
index 0000000..37d8269
--- /dev/null
+++ b/src/assets/images/PreviousIcon.js
@@ -0,0 +1,7 @@
+const PreviousIcon = () => (
+  <svg width="10" height="19" viewBox="0 0 10 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M8.625 18.5311C8.42708 18.5311 8.22917 18.4582 8.07292 18.3019L1.28125 11.5103C0.177083 10.4061 0.177083 8.59359 1.28125 7.48942L8.07292 0.697754C8.375 0.395671 8.875 0.395671 9.17708 0.697754C9.47917 0.999837 9.47917 1.49984 9.17708 1.80192L2.38542 8.59359C1.88542 9.09359 1.88542 9.90609 2.38542 10.4061L9.17708 17.1978C9.47917 17.4998 9.47917 17.9998 9.17708 18.3019C9.02083 18.4478 8.82292 18.5311 8.625 18.5311Z" fill="#292D32"/>
+  </svg>  
+);
+
+export default PreviousIcon;
diff --git a/src/components/TablePagination/index.js b/src/components/TablePagination/index.js
new file mode 100644
index 0000000..9981eaf
--- /dev/null
+++ b/src/components/TablePagination/index.js
@@ -0,0 +1,33 @@
+import * as React from 'react';
+import Pagination from '@mui/material/Pagination';
+import Stack from '@mui/material/Stack';
+import { PaginationItem } from '@mui/material';
+import NextIcon from 'assets/images/NextIcon';
+import PreviousIcon from 'assets/images/PreviousIcon';
+
+function TablePagination() {
+  return (
+    <Stack spacing={2}>
+      <Pagination 
+        count={10} 
+        shape="rounded" 
+        color="primary" 
+        size="large"  
+        renderItem={(item) => (
+          <PaginationItem
+            components={{ previous: PreviousIcon, next: NextIcon }}
+            {...item}
+            sx={{
+              minWidth:'20px',
+              fontWeight:'500',
+              height: '30px'
+            }}
+          />
+        )}
+      />
+
+    </Stack>
+  );
+}
+
+export default TablePagination;