added dummy pagination

src/components/Pagination/NewPaginatedList.jsx

@@ -76,21 +76,39 @@ export default function NewPaginatedList({
         <div className="mt-10 w-full flex gap-4 justify-center items-center">
         <button
           onClick={handlePrev}
-            className={`w-12 h-12 rounded-full flex justify-center items-center border ${
+          className={`w-12 h-12 rounded-full flex justify-center items-center transition-all duration-300 ${
             currentPage == 0
-                ? "text-slate-300 border-slate-300 dark:text-slate-400 dark:border-slate-400 pointer-events-none"
+              ? "text-slate-400 border-slate-400 dark:text-slate-400 dark:border-slate-400 pointer-events-none"
-                : "text-slate-600 border-slate-600 dark:text-slate-300 dark:border-slate-300"
+              : "text-slate-600 border-slate-600 dark:text-white dark:border-white"
-            } transition-all duration-500`}
+          }`}
         >
           &lt;
         </button>
+
+        {data.length && data.map((item, index)=>{
+          if(index%itemsPerPage == 0 && index >= currentPage && index <= currentPage+itemsPerPage){
+            return (
               <button
                 onClick={handleNext}
-            className={`w-12 h-12 rounded-full flex justify-center items-center border ${
+                className={`w-12 h-12 rounded-full flex justify-center items-center border transition-all duration-300 ${
+                  currentPage != index
+                    ? "text-slate-400 border-slate-400 dark:text-slate-400 dark:border-slate-400"
+                    : "text-slate-600 border-slate-600 dark:text-white dark:border-white pointer-events-none"
+                }`}
+              >
+                {index/itemsPerPage +1}
+              </button>
+            )
+          }
+        })}
+
+        <button
+          onClick={handleNext}
+          className={`w-12 h-12 rounded-full flex justify-center items-center transition-all duration-300 ${
             currentPage + numberOfSelection >= data.length
-                ? "text-slate-300 border-slate-300 dark:text-slate-400 dark:border-slate-400 pointer-events-none"
+              ? "text-slate-400 border-slate-400 dark:text-slate-400 dark:border-slate-400 pointer-events-none"
-                : "text-slate-600 border-slate-600 dark:text-slate-300 dark:border-slate-300"
+              : "text-slate-600 border-slate-600 dark:text-white dark:border-white"
-            } transition-all duration-500`}
+          }`}
         >
           &gt;
         </button>