diff --git a/src/components/FiDataGrid.js b/src/components/FiDataGrid.js
index c39cc66..e2eb70b 100644
--- a/src/components/FiDataGrid.js
+++ b/src/components/FiDataGrid.js
@@ -113,7 +113,7 @@ export function FiDataGrid({ rows, columns, sx, autoHeight,
                         count={_rows.length}
                         page={page}
                         rowsPerPage={pageSize}
-                        rowsPerPageOptions={[5,10,15,20,100]}
+                        rowsPerPageOptions={[5,10,20,100]}
                         labelDisplayedRows={({ from, to, count }) =>
                             `${from}-${to} ${intl.formatMessage({ id: "of" })} ${count}`
                         }
diff --git a/src/pages/EmailTemplate/Search_GLD/DataGrid.js b/src/pages/EmailTemplate/Search_GLD/DataGrid.js
index 542ce2e..7484569 100644
--- a/src/pages/EmailTemplate/Search_GLD/DataGrid.js
+++ b/src/pages/EmailTemplate/Search_GLD/DataGrid.js
@@ -87,11 +87,7 @@ export default function EmailTemplateTable({ recordList }) {
             <FiDataGrid
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: { page: 0, pageSize: 5 },
-                    },
-                }}
+                customPageSize={5}
                 onRowDoubleClick={handleRowDoubleClick}
                 getRowHeight={() => 'auto'}
             />
diff --git a/src/pages/Message/Search/DataGrid.js b/src/pages/Message/Search/DataGrid.js
index 7c366f5..feef6ca 100644
--- a/src/pages/Message/Search/DataGrid.js
+++ b/src/pages/Message/Search/DataGrid.js
@@ -66,11 +66,7 @@ export default function MsgTable({ recordList }) {
                 rowHeight={80}
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: { page: 0, pageSize: 20 },
-                    },
-                }}
+                customPageSize={20}
                 onRowDoubleClick={handleEditClick}
             />
         </div>
diff --git a/src/pages/Organization/DetailPage/CreditorHistoryTable.js b/src/pages/Organization/DetailPage/CreditorHistoryTable.js
index ae2b301..1f51735 100644
--- a/src/pages/Organization/DetailPage/CreditorHistoryTable.js
+++ b/src/pages/Organization/DetailPage/CreditorHistoryTable.js
@@ -42,11 +42,7 @@ export default function CreditorHistoryTable({ recordList }) {
             <FiDataGrid
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: { page: 0, pageSize: 100 },
-                    },
-                }}
+                customPageSize={100}
             />
         </div>
     );
diff --git a/src/pages/Organization/SearchPage/OrganizationTable.js b/src/pages/Organization/SearchPage/OrganizationTable.js
index 73de8a0..ced795c 100644
--- a/src/pages/Organization/SearchPage/OrganizationTable.js
+++ b/src/pages/Organization/SearchPage/OrganizationTable.js
@@ -102,11 +102,7 @@ export default function OrganizationTable({ recordList }) {
             <FiDataGrid
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: { page: 0, pageSize: 5 },
-                    },
-                }}
+                customPageSize={5}
                 onRowDoubleClick={handleRowDoubleClick}
             />
         </div>
diff --git a/src/pages/Payment/Details_GLD/DataGrid.js b/src/pages/Payment/Details_GLD/DataGrid.js
index 15d2bcb..af608b4 100644
--- a/src/pages/Payment/Details_GLD/DataGrid.js
+++ b/src/pages/Payment/Details_GLD/DataGrid.js
@@ -69,11 +69,7 @@ export default function SearchPublicNoticeTable({ recordList }) {
                 rowHeight={150}
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: { page: 0, pageSize: 5 },
-                    },
-                }}
+                customPageSize={5}
             />
 
             <Typography align="right" variant= "h3">Total Amount: <span style={{ color: "blue", fontWeight: "bold", }}> HK$ {FormatUtils.currencyFormat(total)}</span></Typography>
diff --git a/src/pages/Payment/Details_Public/DataGrid.js b/src/pages/Payment/Details_Public/DataGrid.js
index 86216ee..b05ccb2 100644
--- a/src/pages/Payment/Details_Public/DataGrid.js
+++ b/src/pages/Payment/Details_Public/DataGrid.js
@@ -79,11 +79,7 @@ export default function SearchPublicNoticeTable({ recordList }) {
                 rowHeight={150}
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: { page: 0, pageSize: 5 },
-                    },
-                }}
+                customPageSize={5}
             />
             <Typography align="right" variant="h4" sx={{mr:2}}>
                 <FormattedMessage id="payTotal"/>:
diff --git a/src/pages/Payment/Search_Public/DataGrid.js b/src/pages/Payment/Search_Public/DataGrid.js
index d8633a3..b662f17 100644
--- a/src/pages/Payment/Search_Public/DataGrid.js
+++ b/src/pages/Payment/Search_Public/DataGrid.js
@@ -106,11 +106,7 @@ export default function SearchPublicNoticeTable({ recordList }) {
                 rowHeight={80}
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: { page: 0, pageSize: 5 },
-                    },
-                }}
+                customPageSize={5}
                 onRowDoubleClick={handleEditClick}
             />
         </div>
diff --git a/src/pages/Proof/Search_Public/DataGrid.js b/src/pages/Proof/Search_Public/DataGrid.js
index 3bb6ceb..7d8e7d5 100644
--- a/src/pages/Proof/Search_Public/DataGrid.js
+++ b/src/pages/Proof/Search_Public/DataGrid.js
@@ -158,11 +158,7 @@ export default function SearchPublicNoticeTable({ recordList }) {
                 sx={_sx}
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: { page: 0, pageSize: 10 },
-                    },
-                }}
+                customPageSize={10}
                 getRowHeight={() => "auto"}
                 onRowDoubleClick={handleRowDoubleClick}
             />
diff --git a/src/pages/PublicNotice/Details_GLD/tabTableDetail/ProofTab.js b/src/pages/PublicNotice/Details_GLD/tabTableDetail/ProofTab.js
index 759829e..19a6e55 100644
--- a/src/pages/PublicNotice/Details_GLD/tabTableDetail/ProofTab.js
+++ b/src/pages/PublicNotice/Details_GLD/tabTableDetail/ProofTab.js
@@ -109,11 +109,7 @@ export default function ProofTab({rows}) {
             <FiDataGrid
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: {page: 0, pageSize: 5},
-                    },
-                }}
+                customPageSize={5}
             />
         </div>
     );
diff --git a/src/pages/PublicNotice/Details_GLD/tabTableDetail/StatusHistoryTab.js b/src/pages/PublicNotice/Details_GLD/tabTableDetail/StatusHistoryTab.js
index 4cd4dc4..1788537 100644
--- a/src/pages/PublicNotice/Details_GLD/tabTableDetail/StatusHistoryTab.js
+++ b/src/pages/PublicNotice/Details_GLD/tabTableDetail/StatusHistoryTab.js
@@ -52,11 +52,7 @@ export default function StatusHistoryTab({rows}) {
             <FiDataGrid
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: {page: 0, pageSize: 5},
-                    },
-                }}
+                customPageSize={5}
             />
         </div>
     );
diff --git a/src/pages/PublicNotice/Details_Public/tabTableDetail/ProofTab.js b/src/pages/PublicNotice/Details_Public/tabTableDetail/ProofTab.js
index 45e6d6f..3448b71 100644
--- a/src/pages/PublicNotice/Details_Public/tabTableDetail/ProofTab.js
+++ b/src/pages/PublicNotice/Details_Public/tabTableDetail/ProofTab.js
@@ -80,11 +80,7 @@ export default function ProofTab({rows}) {
             <FiDataGrid
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: {page: 0, pageSize: 5},
-                    },
-                }}
+                customPageSize={5}
             />
         </div>
     );
diff --git a/src/pages/PublicNotice/Details_Public/tabTableDetail/StatusHistoryTab.js b/src/pages/PublicNotice/Details_Public/tabTableDetail/StatusHistoryTab.js
index 43ed2cc..8a06c52 100644
--- a/src/pages/PublicNotice/Details_Public/tabTableDetail/StatusHistoryTab.js
+++ b/src/pages/PublicNotice/Details_Public/tabTableDetail/StatusHistoryTab.js
@@ -44,11 +44,7 @@ export default function StatusHistoryTab({rows}) {
             <FiDataGrid
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: {page: 0, pageSize: 5},
-                    },
-                }}
+                customPageSize={5}
             />
         </div>
     );
diff --git a/src/pages/PublicNotice/ListPanel/BaseGrid.js b/src/pages/PublicNotice/ListPanel/BaseGrid.js
index ea0320b..d1c8b34 100644
--- a/src/pages/PublicNotice/ListPanel/BaseGrid.js
+++ b/src/pages/PublicNotice/ListPanel/BaseGrid.js
@@ -122,11 +122,7 @@ export default function BaseGrid({rows}) {
             <FiDataGrid
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: {page: 0, pageSize: 10},
-                    },
-                }}
+                customPageSize={10}
                 onRowDoubleClick={handleRowDoubleClick}
                 getRowHeight={() => 'auto'}
             />
diff --git a/src/pages/PublicNotice/ListPanel/SearchPublicNoticeTable.js b/src/pages/PublicNotice/ListPanel/SearchPublicNoticeTable.js
index 0c8fa95..6076867 100644
--- a/src/pages/PublicNotice/ListPanel/SearchPublicNoticeTable.js
+++ b/src/pages/PublicNotice/ListPanel/SearchPublicNoticeTable.js
@@ -127,11 +127,7 @@ export default function SearchPublicNoticeTable({ recordList }) {
             <FiDataGrid
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: { page: 0, pageSize: 20 },
-                    },
-                }}
+                customPageSize={20}
                 onRowDoubleClick={handleRowDoubleClick}
                 getRowHeight={() => 'auto'}
             />
diff --git a/src/pages/Setting/SystemSetting/Table.js b/src/pages/Setting/SystemSetting/Table.js
index 395739f..8006676 100644
--- a/src/pages/Setting/SystemSetting/Table.js
+++ b/src/pages/Setting/SystemSetting/Table.js
@@ -60,11 +60,7 @@ const Table = ({onRowClick, dataList}) => {
                     <FiDataGrid
                         rows={rows}
                         columns={columns}
-                        initialState={{
-                            pagination: {
-                                paginationModel: { page: 0, pageSize: 10 },
-                            },
-                        }}
+                        customPageSize={10}
                         getRowHeight={() => 'auto'}
                         onRowClick={onRowClick}
                     />
diff --git a/src/pages/User/SearchPage/UserTable.js b/src/pages/User/SearchPage/UserTable.js
index f6c63e4..919bfb7 100644
--- a/src/pages/User/SearchPage/UserTable.js
+++ b/src/pages/User/SearchPage/UserTable.js
@@ -133,11 +133,7 @@ export default function UserTable({recordList,setChangeLocked}) {
             <FiDataGrid
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: {page: 0, pageSize: 5},
-                    },
-                }}
+                customPageSize={5}
                 onRowDoubleClick={handleRowDoubleClick}
                 getRowHeight={() => 'auto'}
             />
diff --git a/src/pages/User/SearchPage_Individual/UserTable_Individual.js b/src/pages/User/SearchPage_Individual/UserTable_Individual.js
index 77e84d4..37d3218 100644
--- a/src/pages/User/SearchPage_Individual/UserTable_Individual.js
+++ b/src/pages/User/SearchPage_Individual/UserTable_Individual.js
@@ -140,11 +140,7 @@ export default function UserTable_Individual({ recordList }) {
             <FiDataGrid
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: { page: 0, pageSize: 5 },
-                    },
-                }}
+                customPageSize={5}
                 onRowDoubleClick={handleRowDoubleClick}
             />
         </div>
diff --git a/src/pages/User/SearchPage_Organization/UserTable_Organization.js b/src/pages/User/SearchPage_Organization/UserTable_Organization.js
index 6db5c22..7fe38ba 100644
--- a/src/pages/User/SearchPage_Organization/UserTable_Organization.js
+++ b/src/pages/User/SearchPage_Organization/UserTable_Organization.js
@@ -135,11 +135,7 @@ export default function UserTable_Organization({recordList}) {
             <FiDataGrid
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: {page: 0, pageSize: 5},
-                    },
-                }}
+                customPageSize={5}
                 onRowDoubleClick={handleRowDoubleClick}
             />
         </div>
diff --git a/src/pages/pnspsUserGroupSearchPage/UserGroupTable.js b/src/pages/pnspsUserGroupSearchPage/UserGroupTable.js
index a583fb1..86384a3 100644
--- a/src/pages/pnspsUserGroupSearchPage/UserGroupTable.js
+++ b/src/pages/pnspsUserGroupSearchPage/UserGroupTable.js
@@ -63,11 +63,7 @@ export default function UserGroupTable({recordList}) {
             <FiDataGrid
                 rows={rows}
                 columns={columns}
-                initialState={{
-                    pagination: {
-                        paginationModel: {page: 0, pageSize: 10},
-                    },
-                }}
+                customPageSize={10}
                 pageSizeOptions={[10, 15, 20]}
                 onRowDoubleClick={handleRowDoubleClick}
             />