picpagination.tsx

// import React, { useRef, useState} from "react";

// type num = {
//     total: number,
//     page: number,
//     setPage: Function

// }

// export function Pagination({ total, page, setPage}: num) {
//     const numPages = Math.ceil(total / 15);
//     const firstLeftClick = useRef(true);
//     const firstRightClick = useRef(true);
    
//     const leftClick = () => {
//         if (firstLeftClick.current) {
//             firstLeftClick.current = false;
//             firstRightClick.current = true;
//         } else {
//             setPage(page - 1)
//         }
//     };

//     const rightClick = () => {
//         if (firstRightClick.current) {
//             firstLeftClick.current = true;
//             firstRightClick.current = false;
//         } else {
//             setPage(page + 1)
//         }
//   };
//     };

//     return (
//         <div>
//             <button onClick={leftClick} disabled={page === 1}>
//                 &lt;{page}
//             </button>
//             <button onClick={rightClick} disabled={page === numPages}>
//                 &gt;
//             </button>

//         </div>
//     );
// };


// export function PaginationRight({ total, page, setPage }: num) {
//     const numPages = Math.ceil(total / 15);
//     const firstLeftClick = useRef(true);
//     const firstRightClick = useRef(true);


//     const right = () => {
//         if (firstRightClick.current) {
//             firstLeftClick.current = true;
//             firstRightClick.current = false;
//         } else {
//             setPage(page + 1)
//         }
//     };

//     return (
//         <div>
//             <button onClick={right} disabled={page === numPages}>
//                 &gt;
//             </button>
//         </div>
//     );
// };

    {/* {Array(numPages)
        .fill(1)
        .map((_, i) => (
            <button key={i + 1} onClick={() => setPage(i + 1)}>
                {i + 1}
            </button>
        ))} */}