From 22f8f71976185ddaeac22862e8964b675dc3c1f9 Mon Sep 17 00:00:00 2001
From: Amirhossein Khalili <amirhosseinkhalili901@gmail.com>
Date: Sun, 15 Mar 2026 02:04:53 +0800
Subject: [PATCH] fix(client): improve client's UI and UX

---
 src/components/CreateClientModal.tsx |  2 +-
 src/components/DeleteClientModal.tsx |  2 +-
 src/components/EditClientModal.tsx   |  2 +-
 src/pages/Clients.tsx                | 15 +++++++--------
 4 files changed, 10 insertions(+), 11 deletions(-)

diff --git a/src/components/CreateClientModal.tsx b/src/components/CreateClientModal.tsx
index 6b44ad1..3fbc1a4 100644
--- a/src/components/CreateClientModal.tsx
+++ b/src/components/CreateClientModal.tsx
@@ -38,7 +38,7 @@ export default function CreateClientModal({ isOpen, onClose, onSuccess, workspac
   const footer = (
     <>
       <Button variant="outline" onClick={onClose} disabled={isLoading}>
-        {t.clients.cancel}
+        {t.actions?.cancel}
       </Button>
       <Button onClick={handleSubmit} disabled={isLoading || !name.trim()}>
         {isLoading ? "..." : t.clients.create}
diff --git a/src/components/DeleteClientModal.tsx b/src/components/DeleteClientModal.tsx
index d32f3bd..e84caf1 100644
--- a/src/components/DeleteClientModal.tsx
+++ b/src/components/DeleteClientModal.tsx
@@ -33,7 +33,7 @@ export default function DeleteClientModal({ isOpen, onClose, onSuccess, client }
   const footer = (
     <>
       <Button variant="outline" onClick={onClose} disabled={isLoading}>
-        {t.clients.cancel}
+        {t.actions?.cancel}
       </Button>
       <Button 
         variant="destructive"
diff --git a/src/components/EditClientModal.tsx b/src/components/EditClientModal.tsx
index cb4ec4b..218969e 100644
--- a/src/components/EditClientModal.tsx
+++ b/src/components/EditClientModal.tsx
@@ -44,7 +44,7 @@ export default function EditClientModal({ isOpen, onClose, onSuccess, client }:
   const footer = (
     <>
       <Button variant="outline" onClick={onClose} disabled={isLoading}>
-        {t.clients.cancel}
+        {t.actions?.cancel}
       </Button>
       <Button onClick={handleSubmit} disabled={isLoading || !name.trim()}>
         {isLoading ? "..." : t.clients.saveChanges}
diff --git a/src/pages/Clients.tsx b/src/pages/Clients.tsx
index e8175e3..799a1f4 100644
--- a/src/pages/Clients.tsx
+++ b/src/pages/Clients.tsx
@@ -36,14 +36,13 @@ export default function Clients() {
   const isFa = lang === "fa"
 
   const orderingOptions = [
-    { value: "-created_at", label: isFa ? "جدیدترین" : "Newest First" },
-    { value: "created_at", label: isFa ? "قدیمی‌ترین" : "Oldest First" },
-    { value: "name", label: isFa ? "نام (الف-ی)" : "Name (A-Z)" },
-    { value: "-name", label: isFa ? "نام (ی-الف)" : "Name (Z-A)" },
-    { value: "-updated_at", label: isFa ? "اخیراً بروزرسانی شده" : "Recently Updated" },
+    { value: "-created_at", label: t.ordering?.createdAtDesc || "Newest First" },
+    { value: "created_at", label: t.ordering?.createdAt || "Oldest First" },
+    { value: "name", label: t.ordering?.name || "Name (A-Z)" },
+    { value: "-name", label: t.ordering?.nameDesc || "Name (Z-A)" },
+    { value: "-updated_at", label: t.ordering?.updatedAtDesc || "Recently Updated" },
   ]
 
-  // بازگشت به صفحه اول در صورت تغییر فیلتر یا جستجو
   useEffect(() => {
     setCurrentPage(1)
   }, [debouncedSearch, ordering])
@@ -106,7 +105,7 @@ export default function Clients() {
   }
 
   return (
-    <div className="flex flex-col p-6 max-w-6xl mx-auto min-h-[calc(100vh-73px)]">
+    <div className="flex flex-col p-6 min-h-[calc(100vh-73px)] bg-slate-50 dark:bg-slate-900">
       <div className="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4 mb-8">
         <div>
           <h1 className="text-2xl font-bold text-slate-900 dark:text-white">{t.clients.title}</h1>
@@ -130,7 +129,7 @@ export default function Clients() {
         searchPlaceholder={t.clients.searchPlaceholder}
       />
 
-      <Card className="overflow-hidden dark:bg-slate-900 dark:border-slate-800 mb-6">
+      <Card className="overflow-hidden dark:bg-slate-800 dark:border-slate-700 mb-6">
         <div className="p-0">
           {isLoading ? (
             <div className="flex justify-center items-center p-12 text-slate-500">