- Add admin-next/: full Next.js + Prisma + shadcn admin panel (45 API routes, 76 components) - docker-compose: tg_shop_admin service (port 3000, shared db/shop.db, prisma), bot talks to it via ADMIN_CHAT_URL=http://tg_shop_admin:3000/api/chat - tor-proxy now proxies onion admin to tg_shop_admin:3000 (new panel) - chatbotService: ADMIN_CHAT_URL default = http://tg_shop_admin:3000/api/chat (removed localhost:3100 anachronism) - .env admin secrets gitignored (admin-next/.env)
84 lines
2.6 KiB
TypeScript
Executable File
84 lines
2.6 KiB
TypeScript
Executable File
"use client";
|
|
|
|
import { useMemo } from "react";
|
|
import { Button } from "@/components/ui/button";
|
|
import { ChevronLeft, ChevronRight } from "lucide-react";
|
|
|
|
interface PaginationProps {
|
|
page: number;
|
|
total: number;
|
|
limit: number;
|
|
onPageChange: (page: number) => void;
|
|
}
|
|
|
|
function getPageNumbers(currentPage: number, totalPages: number): (number | "...")[] {
|
|
if (totalPages <= 7) {
|
|
return Array.from({ length: totalPages }, (_, i) => i + 1);
|
|
}
|
|
const pages: (number | "...")[] = [1];
|
|
if (currentPage > 3) pages.push("...");
|
|
const start = Math.max(2, currentPage - 1);
|
|
const end = Math.min(totalPages - 1, currentPage + 1);
|
|
for (let i = start; i <= end; i++) pages.push(i);
|
|
if (currentPage < totalPages - 2) pages.push("...");
|
|
pages.push(totalPages);
|
|
return pages;
|
|
}
|
|
|
|
export function Pagination({ page, total, limit, onPageChange }: PaginationProps) {
|
|
const totalPages = useMemo(() => Math.max(1, Math.ceil(total / limit)), [total, limit]);
|
|
const rangeStart = total === 0 ? 0 : (page - 1) * limit + 1;
|
|
const rangeEnd = Math.min(page * limit, total);
|
|
const pageNumbers = useMemo(() => getPageNumbers(page, totalPages), [page, totalPages]);
|
|
|
|
if (total <= 0) return null;
|
|
|
|
return (
|
|
<div className="flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between">
|
|
<p className="text-sm text-muted-foreground">
|
|
Showing {rangeStart}\u2013{rangeEnd} of {total}
|
|
</p>
|
|
<div className="flex items-center gap-1">
|
|
<Button
|
|
variant="outline"
|
|
size="icon"
|
|
className="h-8 w-8"
|
|
disabled={page <= 1}
|
|
onClick={() => onPageChange(page - 1)}
|
|
aria-label="Previous page"
|
|
>
|
|
<ChevronLeft className="h-4 w-4" />
|
|
</Button>
|
|
{pageNumbers.map((p, i) =>
|
|
p === "..." ? (
|
|
<span key={`ellipsis-${i}`} className="px-1.5 text-sm text-muted-foreground">
|
|
…
|
|
</span>
|
|
) : (
|
|
<Button
|
|
key={p}
|
|
variant={page === p ? "default" : "outline"}
|
|
size="icon"
|
|
className="h-8 w-8"
|
|
onClick={() => onPageChange(p)}
|
|
aria-label={`Page ${p}`}
|
|
>
|
|
{p}
|
|
</Button>
|
|
)
|
|
)}
|
|
<Button
|
|
variant="outline"
|
|
size="icon"
|
|
className="h-8 w-8"
|
|
disabled={page >= totalPages}
|
|
onClick={() => onPageChange(page + 1)}
|
|
aria-label="Next page"
|
|
>
|
|
<ChevronRight className="h-4 w-4" />
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|