Improve product cards/pagination, Farsi locale fonts, and super-admin migrate UI.

Co-authored-by: Cursor <cursoragent@cursor.com>

apps/super-admin/src/pages/WebsitesPage.tsx

@@ -26,20 +26,13 @@ import {
   updateDomain,
 } from '../services/domainService'
 import { useToast } from '../context/ToastContext'
+import { Pagination } from '@meshkee/dashboard-ui'
 import pageStyles from '../components/PageContent.module.css'
 import tableStyles from './BusinessesPage.module.css'
 import styles from './WebsitesPage.module.css'
 
 const PAGE_SIZE = 10
 
-function buildPageNumbers(page: number, totalPages: number) {
-  const start = Math.max(1, page - 2)
-  const end = Math.min(totalPages, page + 2)
-  const numbers: number[] = []
-  for (let i = start; i <= end; i++) numbers.push(i)
-  return numbers
-}
-
 function daysUntilExpiry(expiresAt: string | null) {
   if (!expiresAt) return null
   const diff = new Date(expiresAt).getTime() - Date.now()
@@ -103,6 +96,7 @@ export function WebsitesPage() {
   const [editHost, setEditHost] = useState('')
   const [editExpiresAt, setEditExpiresAt] = useState('')
   const [editSubmitting, setEditSubmitting] = useState(false)
+  const [editError, setEditError] = useState('')
 
   const [removeTarget, setRemoveTarget] = useState<DomainListItem | null>(null)
   const [togglingActiveId, setTogglingActiveId] = useState<number | null>(null)
@@ -142,8 +136,6 @@ export function WebsitesPage() {
     return Math.max(1, Math.ceil(total / PAGE_SIZE))
   }, [data?.total])
 
-  const pageNumbers = useMemo(() => buildPageNumbers(page, totalPages), [page, totalPages])
-
   const showingFrom = useMemo(() => {
     if (!data) return 0
     return (page - 1) * PAGE_SIZE + 1
@@ -169,13 +161,14 @@ export function WebsitesPage() {
     setEditDomain(domain)
     setEditHost(domain.host)
     setEditExpiresAt(domain.expiresAt ? domain.expiresAt.slice(0, 10) : '')
+    setEditError('')
     setEditOpen(true)
   }
 
   async function submitEdit() {
     if (!editDomain) return
     setEditSubmitting(true)
-    setError('')
+    setEditError('')
     try {
       await updateDomain(editDomain.id, {
         host: editHost.trim(),
@@ -200,7 +193,7 @@ export function WebsitesPage() {
         }
       })
     } catch (err) {
-      setError(err instanceof ApiError ? err.message : 'Unable to update domain.')
+      setEditError(err instanceof ApiError ? err.message : 'Unable to update domain.')
     } finally {
       setEditSubmitting(false)
     }
@@ -575,37 +568,15 @@ export function WebsitesPage() {
 
           <div className={tableStyles.pagination}>
             <div>
-              Page {page} / {totalPages}
-            </div>
-            <div className={tableStyles.pagerBtns}>
-              <button
-                type="button"
-                className={tableStyles.pageBtn}
-                onClick={() => setPage((p) => Math.max(1, p - 1))}
-                disabled={page <= 1 || loading}
-              >
-                Prev
-              </button>
-              {pageNumbers.map((n) => (
-                <button
-                  key={n}
-                  type="button"
-                  className={`${tableStyles.pageBtn} ${n === page ? tableStyles.pageBtnActive : ''}`}
-                  onClick={() => setPage(n)}
-                  disabled={loading}
-                >
-                  {n}
-                </button>
-              ))}
-              <button
-                type="button"
-                className={tableStyles.pageBtn}
-                onClick={() => setPage((p) => Math.min(totalPages, p + 1))}
-                disabled={page >= totalPages || loading}
-              >
-                Next
-              </button>
+              Page {page} / {totalPages} · {PAGE_SIZE} per page · {data?.total ?? 0} total
             </div>
+            <Pagination
+              currentPage={page}
+              totalPages={totalPages}
+              onPageChange={setPage}
+              disabled={loading}
+              variant="inline"
+            />
           </div>
         </div>
       </div>
@@ -616,8 +587,14 @@ export function WebsitesPage() {
         onClose={() => {
           setEditOpen(false)
           setEditDomain(null)
+          setEditError('')
         }}
       >
+        {editError ? (
+          <p className={tableStyles.alertError} role="alert">
+            {editError}
+          </p>
+        ) : null}
         <div className={tableStyles.field}>
           <label htmlFor="edit-domain-host">Domain name</label>
           <input