From d816734b20e9c8212ebc8e4786a24186647c39e9 Mon Sep 17 00:00:00 2001
From: Xiao Yijun <xiaoyijun@silverhand.io>
Date: Tue, 4 Apr 2023 16:39:32 +0800
Subject: [PATCH] refactor(console): disable invalid pagination labels (#3675)

---
 .../components/Pagination/index.module.scss    |  9 +++------
 .../src/components/Pagination/index.tsx        | 18 ++++++++++++++++--
 2 files changed, 19 insertions(+), 8 deletions(-)

diff --git a/packages/console/src/components/Pagination/index.module.scss b/packages/console/src/components/Pagination/index.module.scss
index af4f856c6..c9c878382 100644
--- a/packages/console/src/components/Pagination/index.module.scss
+++ b/packages/console/src/components/Pagination/index.module.scss
@@ -46,13 +46,10 @@
   }
 
   li.disabled {
-    .button {
-      cursor: not-allowed;
-      background: var(--color-neutral-95);
+    cursor: not-allowed;
 
-      &:hover {
-        background: var(--color-neutral-95);
-      }
+    .button {
+      background: var(--color-neutral-95);
     }
   }
 
diff --git a/packages/console/src/components/Pagination/index.tsx b/packages/console/src/components/Pagination/index.tsx
index 3b97abb65..c32d979ac 100644
--- a/packages/console/src/components/Pagination/index.tsx
+++ b/packages/console/src/components/Pagination/index.tsx
@@ -57,8 +57,22 @@ function Pagination({ page, totalCount, pageSize, className, mode = 'normal', on
             title={<DangerousRaw>{pageNumber}</DangerousRaw>}
           />
         )}
-        previousLabel={<Button className={styles.button} size="small" icon={<Previous />} />}
-        nextLabel={<Button className={styles.button} size="small" icon={<Next />} />}
+        previousLabel={
+          <Button
+            className={styles.button}
+            size="small"
+            icon={<Previous />}
+            disabled={page === 1}
+          />
+        }
+        nextLabel={
+          <Button
+            className={styles.button}
+            size="small"
+            icon={<Next />}
+            disabled={page === pageCount}
+          />
+        }
         breakLabel={
           <Button className={styles.button} size="small" title={<DangerousRaw>...</DangerousRaw>} />
         }