Added paging to accounts table

src/components/pagination/Pagination.tsx

@@ -0,0 +1,65 @@
+import { generatePagination } from "@/util/PaginationUtil";
+import { BsChevronLeft, BsChevronRight } from "react-icons/bs";
+import PrimaryButton from "../button/PrimaryButton";
+
+export default function Pagination({
+	currentPage,
+	totalPages,
+	onChange
+}:{
+	currentPage: number;
+	totalPages: number;
+	onChange: (page: number) => void;
+}){
+	const pages = generatePagination(currentPage, totalPages);
+
+
+	return(
+		<div
+			className="flex flex-row items-center justify-center w-full text-xl text-white"
+		>
+			<div
+				className="mr-8"
+			>
+				<PrimaryButton
+					shape="square"
+					className="w-9 h-9"
+					disabled={currentPage <= 1}
+					onClick={() => onChange(currentPage - 1)}
+				>
+					<BsChevronLeft/>
+				</PrimaryButton>
+			</div>
+			<div
+				className="flex flex-row items-center justify-center gap-4"
+			>
+				{
+					pages.map((page, index) => (
+						<PrimaryButton
+							key={index}
+							size="sm"
+							shape="square"
+							className="w-9 h-9"
+							disabled={(page === "...") || (page === currentPage)}
+							onClick={() => onChange(page as number)}
+						>
+							{page}
+						</PrimaryButton>
+					))
+				}
+			</div>
+			<div
+				className="ml-8"
+			>
+				<PrimaryButton
+					shape="square"
+					className="w-9 h-9"
+					disabled={currentPage >= totalPages}
+					onClick={() => onChange(currentPage + 1)}
+				>
+					<BsChevronRight/>
+				</PrimaryButton>
+			</div>
+		</div>
+	);
+}