Refactor code structure for improved readability and maintainability

This commit is contained in:
hamed
2026-06-10 20:45:13 +03:30
parent 916bdaaeb0
commit 7fb805be27
32 changed files with 2808 additions and 2877 deletions
+10 -14
View File
@@ -14,7 +14,7 @@ export default function Pagination({ page, total, limit, onPageChange }: Props)
if (totalPages <= 1) return null;
const from = (page - 1) * limit + 1;
const to = Math.min(page * limit, total);
const to = Math.min(page * limit, total);
const pages: (number | '...')[] = [];
if (totalPages <= 7) {
@@ -28,32 +28,29 @@ export default function Pagination({ page, total, limit, onPageChange }: Props)
}
return (
<div className="flex items-center justify-between mt-5 pt-4 border-t border-slate-100 dark:border-gray-700/40 text-sm flex-wrap gap-3">
<span className="text-slate-500 dark:text-slate-400 text-xs">
<div className="pagination">
<span style={{ fontSize: 12.5, color: 'var(--text-3)' }}>
نمایش {formatNumber(from)}{formatNumber(to)} از {formatNumber(total)} مورد
</span>
<div className="flex items-center gap-1">
<div className="page-btns">
<button
onClick={() => onPageChange(page - 1)}
disabled={page === 1}
className="w-8 h-8 flex items-center justify-center rounded-lg hover:bg-slate-100 dark:hover:bg-gray-700 text-slate-500 dark:text-slate-400 disabled:opacity-30 disabled:cursor-not-allowed transition-colors"
>
<ChevronRightIcon className="w-4 h-4" />
<ChevronRightIcon style={{ width: 16, height: 16 }} />
</button>
{pages.map((p, i) =>
p === '...' ? (
<span key={`dots-${i}`} className="w-8 text-center text-slate-400 dark:text-slate-500 text-xs"></span>
<span key={`d-${i}`} style={{ minWidth: 36, height: 36, display: 'grid', placeItems: 'center', fontSize: 13, color: 'var(--text-3)' }}>
</span>
) : (
<button
key={p}
onClick={() => onPageChange(p as number)}
className={`w-8 h-8 rounded-lg text-sm font-medium transition-colors ${
p === page
? 'bg-primary-600 text-white shadow-sm shadow-primary-500/30'
: 'text-slate-600 dark:text-slate-400 hover:bg-slate-100 dark:hover:bg-gray-700'
}`}
className={p === page ? 'on' : ''}
>
{formatNumber(p as number)}
</button>
@@ -63,9 +60,8 @@ export default function Pagination({ page, total, limit, onPageChange }: Props)
<button
onClick={() => onPageChange(page + 1)}
disabled={page === totalPages}
className="w-8 h-8 flex items-center justify-center rounded-lg hover:bg-slate-100 dark:hover:bg-gray-700 text-slate-500 dark:text-slate-400 disabled:opacity-30 disabled:cursor-not-allowed transition-colors"
>
<ChevronLeftIcon className="w-4 h-4" />
<ChevronLeftIcon style={{ width: 16, height: 16 }} />
</button>
</div>
</div>