Added translation to all site with edit style

app/owner/profits/page.js

@@ -298,9 +298,11 @@ import { useRouter } from 'next/navigation';
 import { Download, Loader2 } from 'lucide-react';
 import toast, { Toaster } from 'react-hot-toast';
 import * as XLSX from 'xlsx';
+import { useTranslation } from 'react-i18next';
 import AuthService from '@/app/services/AuthService';
 
 export default function OwnerProfitsPage() {
+  const { t, i18n } = useTranslation();
   const router = useRouter();
   const [user, setUser] = useState(null);
   const [isLoading, setIsLoading] = useState(true);
@@ -404,29 +406,29 @@ export default function OwnerProfitsPage() {
   const handleExportReport = () => {
     try {
       const exportData = tableData.map((row) => ({
-        'العقار': row.property,
-        'رقم الحجز': row.bookingNumber,
-        'من تاريخ': row.fromDate,
-        'حتى تاريخ': row.toDate,
-        'العروض المستلم': row.amountReceived,
-        'عمولة المنصة': row.platformCommission,
-        'ربح المنصة (5%)': row.platformProfit,
-        'المستحق للمالك': row.ownerDue,
-        'تم التحويل للمالك': row.transferredToOwner,
-        'رقم وصل التحويل': row.transferReceipt,
+        [t('profits.colProperty')]: row.property,
+        [t('profits.colBookingNumber')]: row.bookingNumber,
+        [t('profits.colFromDate')]: row.fromDate,
+        [t('profits.colToDate')]: row.toDate,
+        [t('profits.colAmountReceived')]: row.amountReceived,
+        [t('profits.colPlatformCommission')]: row.platformCommission,
+        [t('profits.colPlatformProfit')]: row.platformProfit,
+        [t('profits.colOwnerDue')]: row.ownerDue,
+        [t('profits.colTransferred')]: row.transferredToOwner,
+        [t('profits.colTransferReceipt')]: row.transferReceipt,
       }));
 
       exportData.push({
-        'العقار': 'الإجمالي العام',
-        'رقم الحجز': '',
-        'من تاريخ': '',
-        'حتى تاريخ': '',
-        'العروض المستلم': totals.totalAmountReceived,
-        'عمولة المنصة': totals.totalCommission,
-        'ربح المنصة (5%)': totals.totalPlatformProfit,
-        'المستحق للمالك': totals.totalOwnerDue,
-        'تم التحويل للمالك': totals.totalTransferred,
-        'رقم وصل التحويل': '—',
+        [t('profits.colProperty')]: t('profits.totalGeneral'),
+        [t('profits.colBookingNumber')]: '',
+        [t('profits.colFromDate')]: '',
+        [t('profits.colToDate')]: '',
+        [t('profits.colAmountReceived')]: totals.totalAmountReceived,
+        [t('profits.colPlatformCommission')]: totals.totalCommission,
+        [t('profits.colPlatformProfit')]: totals.totalPlatformProfit,
+        [t('profits.colOwnerDue')]: totals.totalOwnerDue,
+        [t('profits.colTransferred')]: totals.totalTransferred,
+        [t('profits.colTransferReceipt')]: '—',
       });
 
       const worksheet = XLSX.utils.json_to_sheet(exportData);
@@ -445,14 +447,14 @@ export default function OwnerProfitsPage() {
       worksheet['!cols'] = colWidths;
 
       const workbook = XLSX.utils.book_new();
-      XLSX.utils.book_append_sheet(workbook, worksheet, 'أرباح المالك');
+      XLSX.utils.book_append_sheet(workbook, worksheet, t('profits.sheetName'));
       
-      XLSX.writeFile(workbook, `تقرير_الأرباح_${new Date().toISOString().slice(0,19).replace(/:/g, '-')}.xlsx`);
+      XLSX.writeFile(workbook, `${t('profits.fileName')}${new Date().toISOString().slice(0,19).replace(/:/g, '-')}.xlsx`);
       
-      toast.success('تم تصدير التقرير بنجاح!');
+      toast.success(t('profits.exportSuccess'));
     } catch (error) {
-      console.error('خطأ في التصدير:', error);
-      toast.error('حدث خطأ أثناء تصدير التقرير');
+      console.error(t('profits.exportErrorLog'), error);
+      toast.error(t('profits.exportError'));
     }
   };
 
@@ -461,14 +463,14 @@ export default function OwnerProfitsPage() {
       <div className="min-h-screen bg-gray-50 flex items-center justify-center">
         <div className="text-center">
           <Loader2 className="w-12 h-12 text-amber-500 animate-spin mx-auto mb-4" />
-          <p className="text-gray-600">جاري تحميل بيانات الأرباح...</p>
+          <p className="text-gray-600">{t('profits.loading')}</p>
         </div>
       </div>
     );
   }
 
   return (
-    <div className="min-h-screen bg-gray-50 py-8" dir="rtl">
+    <div className="min-h-screen bg-gray-50 py-8" dir={i18n.language === 'ar' ? 'rtl' : 'ltr'}>
       <Toaster position="top-center" reverseOrder={false} />
       <div className="container mx-auto px-4 max-w-7xl">
         <motion.div
@@ -477,9 +479,9 @@ export default function OwnerProfitsPage() {
           className="flex flex-col md:flex-row justify-between items-start md:items-center mb-8 gap-4"
         >
           <div>
-            <h1 className="text-3xl font-bold text-gray-900 mb-2">أرباح المالك</h1>
+            <h1 className="text-3xl font-bold text-gray-900 mb-2">{t('profits.pageTitle')}</h1>
             <p className="text-gray-600">
-              مرحباً {user?.name}
+              {t('profits.greeting')} {user?.name}
             </p>
           </div>
           <button
@@ -487,7 +489,7 @@ export default function OwnerProfitsPage() {
             className="px-5 py-2.5 bg-amber-500 text-white rounded-xl font-medium hover:bg-amber-600 transition-colors flex items-center gap-2 shadow-sm"
           >
             <Download className="w-5 h-5" />
-            تصدير التقرير
+            {t('profits.exportReport')}
           </button>
         </motion.div>
 
@@ -500,18 +502,18 @@ export default function OwnerProfitsPage() {
             <table className="min-w-full divide-y divide-gray-200 text-sm">
               <thead className="bg-gray-800 text-gray-100">
                 <tr>
-                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">العقار</th>
-                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">رقم الحجز</th>
-                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">من تاريخ</th>
-                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">حتى تاريخ</th>
-                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">العروض المستلم</th>
-                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">عمولة المنصة</th>
+                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">{t('profits.colProperty')}</th>
+                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">{t('profits.colBookingNumber')}</th>
+                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">{t('profits.colFromDate')}</th>
+                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">{t('profits.colToDate')}</th>
+                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">{t('profits.colAmountReceived')}</th>
+                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">{t('profits.colPlatformCommission')}</th>
                   <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider bg-amber-50 text-amber-800">
-                    ربح المنصة <span className="font-normal text-[11px] block">(5% من العربون)</span>
+                    {t('profits.colPlatformProfit')} <span className="font-normal text-[11px] block">{t('profits.colPlatformProfitSub')}</span>
                   </th>
-                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">المستحق للمالك</th>
-                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">تم التحويل للمالك</th>
-                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">رقم وصل التحويل</th>
+                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">{t('profits.colOwnerDue')}</th>
+                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">{t('profits.colTransferred')}</th>
+                  <th className="px-4 py-4 text-center text-xs font-semibold uppercase tracking-wider">{t('profits.colTransferReceipt')}</th>
                 </tr>
               </thead>
               <tbody className="bg-white divide-y divide-gray-100">
@@ -558,7 +560,7 @@ export default function OwnerProfitsPage() {
               <tfoot className="bg-gray-100 border-t-2 border-gray-300">
                 <tr>
                   <td colSpan="4" className="px-4 py-4 text-right font-bold text-gray-800">
-                    الإجمالي العام
+                    {t('profits.totalGeneral')}
                   </td>
                   <td className="px-4 py-4 text-center font-bold font-mono text-gray-800">
                     {totals.totalAmountReceived}
@@ -582,8 +584,8 @@ export default function OwnerProfitsPage() {
           </div>
 
           <div className="bg-gray-50 px-6 py-3 text-xs text-gray-500 border-t border-gray-200">
-            <span className="inline-flex items-center gap-1"></span> ملاحظة: 
-            <strong> ربح المنصة </strong> يُحتسب تلقائياً بنسبة <strong className="text-amber-600">5%</strong> من قيمة «العروض المستلم». 
+            <span className="inline-flex items-center gap-1"></span> {t('profits.note')}
+            <strong> {t('profits.colPlatformProfit')} </strong>{t('profits.noteMiddle')}<strong className="text-amber-600">5%</strong>{t('profits.noteEnd', { colName: t('profits.colAmountReceived') })}
           </div>
         </motion.div>
       </div>