Merge branch 'main' of http://45.93.137.91:3000/Rahaf/SweetHome

2026-06-24 15:04:59 +03:00
parent 389dca56d2 6e4d629cbe
commit c0fdc7ef03
11 changed files with 1132 additions and 204 deletions
--- a/app/ClientLayout.js
+++ b/app/ClientLayout.js
@ -78,7 +78,7 @@ export default function ClientLayout({ children }) {
        name: authUser.name || authUser.email,
        email: authUser.email,
        phone: authUser.phone,
-        role: AuthService.isOwner() ? UserRole.OWNER : UserRole.CUSTOMER,
+        role: AuthService.isOwner() ? UserRole.OWNER : AuthService.isAgent() ? UserRole.AGENT : UserRole.CUSTOMER,
      });
    } else {
      setUser(null);
@ -135,6 +135,8 @@ export default function ClientLayout({ children }) {
  const isProfilePage = pathname === "/profile";

  const isOwner = user?.role === UserRole.OWNER;
+  const isAgent = user?.role === UserRole.AGENT;
+  const isOwnerOrAgent = isOwner || isAgent;
  const isCustomer = user?.role === UserRole.CUSTOMER;
  const isAuthenticated = !!user;

@ -718,7 +720,7 @@ export default function ClientLayout({ children }) {
          </main>

          {isAuthenticated && !isAuthPage && (
-            <BottomNav isOwner={isOwner} />
+            <BottomNav isOwner={isOwner} isOwnerOrAgent={isOwnerOrAgent} />
          )}
        </FavoritesProvider>
      </NotificationsProvider>
--- a/app/components/BottomNav.js
+++ b/app/components/BottomNav.js
@ -1,11 +1,13 @@
 "use client";

 import Link from "next/link";
-import { Home, Building, Calendar, Heart, Bell, Settings, CreditCard } from "lucide-react";
+import { usePathname } from "next/navigation";
+import { Home, Building, Calendar, Heart, Bell, Settings, CreditCard, Briefcase } from "lucide-react";
 import React, { useEffect, useState } from "react";
 import { useNotifications } from "@/app/contexts/NotificationsContext";

-export default function BottomNav({ isOwner }) {
+export default function BottomNav({ isOwner, isOwnerOrAgent }) {
+  const pathname = usePathname();
  const { unreadCount } = useNotifications();
  const [isMounted, setIsMounted] = useState(false);
  const bookingsHref = isOwner ? "/owner/reservations" : "/reservations";
@ -17,6 +19,7 @@ export default function BottomNav({ isOwner }) {
  const items = [
    { href: "/", label: "الرئيسية", icon: Home },
    { href: "/properties", label: "عقاراتنا", icon: Building },
+    ...(isOwnerOrAgent ? [{ href: "/owner/properties", label: "عقاراتي", icon: Briefcase }] : []),
    { href: bookingsHref, label: "الحجوزات", icon: Calendar },
    { href: "/favorites", label: "المفضلة", icon: Heart },
    { href: "/payments", label: "المدفوعات", icon: CreditCard },
@ -24,16 +27,22 @@ export default function BottomNav({ isOwner }) {
    { href: "/settings", label: "الإعدادات", icon: Settings },
  ];

+  const isActive = (href) => {
+    if (href === "/") return pathname === "/";
+    return pathname.startsWith(href);
+  };
+
  return (
    <nav className="fixed bottom-4 left-1/2 transform -translate-x-1/2 z-50">
      <div className="bg-white/95 backdrop-blur-sm border border-gray-200 rounded-3xl shadow-lg px-2 py-2 flex items-center gap-3">
        {items.map((it) => {
          const Icon = it.icon;
+          const active = isActive(it.href);
          return (
            <Link
              key={it.href}
              href={it.href}
-              className="relative group flex flex-col items-center justify-center px-2.5 py-2 text-gray-700 hover:text-amber-600 transition-colors"
+              className={`relative group flex flex-col items-center justify-center px-2.5 py-2 transition-colors ${active ? "text-amber-600" : "text-gray-700 hover:text-amber-600"}`}
            >
              <div className="relative">
                <Icon className="w-6 h-6" />
--- a/app/enums/UserRole.js
+++ b/app/enums/UserRole.js
@ -7,18 +7,21 @@ const UserRole = Object.freeze({
  GUEST: 'guest',
  CUSTOMER: 'customer',
  OWNER: 'owner',
+  AGENT: 'agent',
 });

 const UserRoleLabels = Object.freeze({
  [UserRole.GUEST]: 'زائر',
  [UserRole.CUSTOMER]: 'مستأجر',
  [UserRole.OWNER]: 'مالك عقار',
+  [UserRole.AGENT]: 'وسيط عقاري',
 });

 const UserRoleColors = Object.freeze({
  [UserRole.GUEST]: 'gray',
  [UserRole.CUSTOMER]: 'blue',
  [UserRole.OWNER]: 'amber',
+  [UserRole.AGENT]: 'purple',
 });

 export { UserRole, UserRoleLabels, UserRoleColors };
--- a/app/payments/page.js
+++ b/app/payments/page.js
@ -25,7 +25,7 @@ import {
 } from 'lucide-react';
 import toast, { Toaster } from 'react-hot-toast';
 import AuthService from '@/app/services/AuthService';
-import { payDeposit } from '@/app/utils/api';
+import { payDeposit, getMyTransaction } from '@/app/utils/api';

 const STATUS_MAP = ['pending', 'ownerConfirmed', 'depositPaid', 'depositConfirmed', 'completed', 'cancelled'];

@ -87,35 +87,10 @@ export default function PaymentsPage() {
  const [isGuest, setIsGuest] = useState(null);
  const [selectedPayment, setSelectedPayment] = useState('cash');

-  const getAuthToken = () => {
-    if (typeof window === 'undefined') return '';
-    return (
-      AuthService?.getToken?.() ||
-      AuthService?.getAccessToken?.() ||
-      localStorage.getItem('token') ||
-      localStorage.getItem('accessToken') ||
-      localStorage.getItem('authToken') ||
-      ''
-    );
-  };
-
  const loadReservations = useCallback(async () => {
    try {
-      const token = getAuthToken();
-
-      const res = await fetch('http://45.93.137.91/api/Customer/GetMyTransaction', {
-        method: 'GET',
-        headers: {
-          ...(token ? { Authorization: `Bearer ${token}` } : {}),
-        },
-      });
-
-      if (!res.ok) {
-        throw new Error('فشل تحميل المدفوعات');
-      }
-
-      const json = await res.json();
-      const items = Array.isArray(json?.data) ? json.data : Array.isArray(json) ? json : [];
+      const json = await getMyTransaction();
+      const items = Array.isArray(json) ? json : [];

      const mapped = items.map((item) => {
        const deposit = item?.diposit || item?.deposit || {};
--- a/app/profile/page.js
+++ b/app/profile/page.js
@ -1,9 +1,9 @@
-'use client';
+"use client";

-import { useState, useEffect } from 'react';
-import { motion } from 'framer-motion';
-import { useRouter } from 'next/navigation';
-import Link from 'next/link';
+import { useState, useEffect } from "react";
+import { motion } from "framer-motion";
+import { useRouter } from "next/navigation";
+import Link from "next/link";
 import {
  User,
  Mail,
@ -17,11 +17,11 @@ import {
  Calendar,
  MapPin,
  Loader2,
-  Pencil
-} from 'lucide-react';
-import toast, { Toaster } from 'react-hot-toast';
-import AuthService from '../services/AuthService';
-import { getCustomerByUserId, getOwnerByUserId } from '../utils/api';
+  Pencil,
+} from "lucide-react";
+import toast, { Toaster } from "react-hot-toast";
+import AuthService from "../services/AuthService";
+import { getCustomerByUserId, getOwnerByUserId } from "../utils/api";

 export default function ProfilePage() {
  const router = useRouter();
@ -29,52 +29,65 @@ export default function ProfilePage() {
  const [isLoading, setIsLoading] = useState(true);

  const [editingBio, setEditingBio] = useState(false);
-  const [bioDraft, setBioDraft] = useState('');
+  const [bioDraft, setBioDraft] = useState("");

  const [formData, setFormData] = useState({
-    name: '',
-    email: '',
-    phone: '',
-    whatsapp: '',
-    bio: '',
-    location: '',
-    joinedDate: ''
+    name: "",
+    email: "",
+    phone: "",
+    whatsapp: "",
+    bio: "",
+    location: "",
+    joinedDate: "",
  });

-  const [avatarPreview, setAvatarPreview] = useState('');
+  const [avatarPreview, setAvatarPreview] = useState("");

  useEffect(() => {
    const authUser = AuthService.getUser();
    if (authUser) {
      const userData = {
        id: authUser.id,
-        name: authUser.name || '',
-        email: authUser.email || '',
-        phone: authUser.phone || '',
-        role: AuthService.isOwner() ? 'owner' : 'customer',
+        name: authUser.name || "",
+        email: authUser.email || "",
+        phone: authUser.phone || "",
+        role: AuthService.isOwner() ? "owner" : "customer",
      };
      setUser(userData);

      async function fetchProfile() {
        try {
-          const fetchFn = userData.role === 'owner' ? getOwnerByUserId : getCustomerByUserId;
+          const fetchFn =
+            userData.role === "owner" ? getOwnerByUserId : getCustomerByUserId;
          const profile = await fetchFn(userData.id);

          if (profile) {
            const profileData = {
-              name: profile.fullName || profile.name || `${profile.firstName || ''} ${profile.lastName || ''}`.trim() || userData.name || '',
-              email: profile.email || userData.email || '',
-              phone: profile.phone || profile.phoneNumber || userData.phone || '',
-              whatsapp: profile.whatsAppNumber || profile.whatsapp || '',
-              bio: profile.bio || '',
-              location: profile.address || profile.location || '',
+              name:
+                profile.fullName ||
+                profile.name ||
+                `${profile.firstName || ""} ${profile.lastName || ""}`.trim() ||
+                userData.name ||
+                "",
+              email: profile.email || userData.email || "",
+              phone:
+                profile.phone || profile.phoneNumber || userData.phone || "",
+              whatsapp: profile.whatsAppNumber || profile.whatsapp || "",
+              bio: profile.bio || "",
+              location: profile.address || profile.location || "",
              joinedDate: profile.createdAt
-                ? new Date(profile.createdAt).toLocaleDateString('ar-SA', { month: 'long', year: 'numeric' })
-                : new Date().toLocaleDateString('ar-SA', { month: 'long', year: 'numeric' }),
+                ? new Date(profile.createdAt).toLocaleDateString("ar-SA", {
+                    month: "long",
+                    year: "numeric",
+                  })
+                : new Date().toLocaleDateString("ar-SA", {
+                    month: "long",
+                    year: "numeric",
+                  }),
            };
            setFormData(profileData);
            setBioDraft(profileData.bio);
-            localStorage.setItem('userProfile', JSON.stringify(profileData));
+            localStorage.setItem("userProfile", JSON.stringify(profileData));
            setIsLoading(false);
            return;
          }
@ -82,59 +95,62 @@ export default function ProfilePage() {
          // Ignore API errors and fall back to local data.
        }

-        const savedProfile = localStorage.getItem('userProfile');
+        const savedProfile = localStorage.getItem("userProfile");
        let profileData;
        if (savedProfile) {
          profileData = JSON.parse(savedProfile);
        } else {
          profileData = {
-            name: userData.name || '',
-            email: userData.email || '',
-            phone: '',
-            whatsapp: '',
-            bio: '',
-            location: '',
-            joinedDate: new Date().toLocaleDateString('ar-SA', { month: 'long', year: 'numeric' })
+            name: userData.name || "",
+            email: userData.email || "",
+            phone: "",
+            whatsapp: "",
+            bio: "",
+            location: "",
+            joinedDate: new Date().toLocaleDateString("ar-SA", {
+              month: "long",
+              year: "numeric",
+            }),
          };
        }
        setFormData(profileData);
-        setBioDraft(profileData.bio || '');
+        setBioDraft(profileData.bio || "");
        setIsLoading(false);
      }

-      const savedAvatar = localStorage.getItem('userAvatar');
+      const savedAvatar = localStorage.getItem("userAvatar");
      if (savedAvatar) {
        setAvatarPreview(savedAvatar);
      }

      fetchProfile();
    } else {
-      router.push('/login');
+      router.push("/login");
    }
  }, [router]);

  const startBioEditing = () => {
-    setBioDraft(formData.bio || '');
+    setBioDraft(formData.bio || "");
    setEditingBio(true);
  };

  const cancelBioEditing = () => {
-    setBioDraft(formData.bio || '');
+    setBioDraft(formData.bio || "");
    setEditingBio(false);
  };

  const saveBio = () => {
    const updatedData = { ...formData, bio: bioDraft };
    setFormData(updatedData);
-    localStorage.setItem('userProfile', JSON.stringify(updatedData));
+    localStorage.setItem("userProfile", JSON.stringify(updatedData));
    setEditingBio(false);
-    toast.success('تم تحديث نبذة عني بنجاح');
+    toast.success("تم تحديث نبذة عني بنجاح");
  };

  const fadeInUp = {
    initial: { opacity: 0, y: 20 },
    animate: { opacity: 1, y: 0 },
-    transition: { duration: 0.5 }
+    transition: { duration: 0.5 },
  };

  if (isLoading) {
@ -177,12 +193,12 @@ export default function ProfilePage() {
            <motion.div
              className="absolute inset-0 bg-white/10"
              animate={{
-                x: ['-100%', '100%'],
+                x: ["-100%", "100%"],
              }}
              transition={{
                duration: 3,
                repeat: Infinity,
-                ease: 'linear',
+                ease: "linear",
              }}
            />
          </div>
@ -198,7 +214,7 @@ export default function ProfilePage() {
                      className="w-full h-full object-cover"
                    />
                  ) : (
-                    formData.name?.charAt(0).toUpperCase() || 'U'
+                    formData.name?.charAt(0).toUpperCase() || "U"
                  )}
                </div>
              </div>
@ -206,12 +222,14 @@ export default function ProfilePage() {

            <div className="text-center mb-6">
              <div className="flex items-center justify-center gap-2">
-                <h1 className="text-3xl font-bold text-gray-900">{formData.name}</h1>
+                <h1 className="text-3xl font-bold text-gray-900">
+                  {formData.name}
+                </h1>
              </div>

              <div className="flex items-center justify-center gap-2 text-gray-500 mt-2">
                <MapPin className="w-4 h-4" />
-                <span>{formData.location || 'الموقع غير محدد'}</span>
+                <span>{formData.location || "الموقع غير محدد"}</span>
              </div>

              <div className="flex items-center justify-center gap-2 text-gray-500 mt-1">
@ -241,7 +259,7 @@ export default function ProfilePage() {
                </div>
                <div className="flex items-center gap-2 text-gray-900">
                  <Phone className="w-5 h-5 text-gray-400" />
-                  <span>{formData.phone || 'غير محدد'}</span>
+                  <span>{formData.phone || "غير محدد"}</span>
                </div>
              </div>

@ -253,7 +271,7 @@ export default function ProfilePage() {
                </div>
                <div className="flex items-center gap-2 text-gray-900">
                  <MessageCircle className="w-5 h-5 text-gray-400" />
-                  <span>{formData.whatsapp || 'غير محدد'}</span>
+                  <span>{formData.whatsapp || "غير محدد"}</span>
                </div>
              </div>

@ -262,7 +280,7 @@ export default function ProfilePage() {
                  نوع الحساب
                </label>
                <div className="flex items-center gap-2">
-                  {user?.role === 'owner' ? (
+                  {user?.role === "owner" ? (
                    <>
                      <Building className="w-5 h-5 text-amber-500" />
                      <span className="text-gray-900">مالك عقار</span>
@ -276,8 +294,8 @@ export default function ProfilePage() {
                </div>
              </div>
            </div>
-
-            <div className="mt-6 bg-gray-50 p-4 rounded-xl group">
+            {/* noo need for the descption of me on the profile*/}
+            {/* <div className="mt-6 bg-gray-50 p-4 rounded-xl group">
              <div className="flex justify-between items-start mb-2">
                <label className="text-sm font-medium text-gray-600">
                  نبذة عني
@ -324,9 +342,9 @@ export default function ProfilePage() {
                  {formData.bio || 'لا توجد نبذة تعريفية بعد'}
                </p>
              )}
-            </div>
+            </div> */}

-            {user?.role === 'owner' && (
+            {user?.role === "owner" && (
              <div className="grid grid-cols-3 gap-4 mt-6">
                <div className="bg-amber-50 p-4 rounded-xl text-center">
                  <div className="text-2xl font-bold text-amber-600">12</div>
@ -347,4 +365,4 @@ export default function ProfilePage() {
      </div>
    </div>
  );
-}
+}
--- a/app/services/AuthService.js
+++ b/app/services/AuthService.js
@ -126,12 +126,20 @@ const AuthService = Object.freeze({
    return this.getRoles().includes('Owner');
  },

+  /**
+   * User has RealEstateAgent role
+   * @returns {boolean}
+   */
+  isAgent() {
+    return this.getRoles().includes('RealEstateAgent');
+  },
+
  /**
   * Authenticated user without Owner role (i.e. customer)
   * @returns {boolean}
   */
  isCustomer() {
-    return this.isAuthenticated() && !this.isOwner();
+    return this.isAuthenticated() && !this.isOwner() && !this.isAgent();
  },

  /**
--- a/app/settings/page.js
+++ b/app/settings/page.js
@ -276,7 +276,7 @@ import {
 } from 'lucide-react';
 import toast, { Toaster } from 'react-hot-toast';
 import AuthService from '../services/AuthService';
-import { changePassword, deleteMyAccount } from '../utils/api';
+import { changePassword, deleteMyAccount, submitReport } from '../utils/api';

 export default function SettingsPage() {
  const router = useRouter();
@ -285,10 +285,10 @@ export default function SettingsPage() {
  const [isDeleting, setIsDeleting] = useState(false);
  const [showDeleteConfirm, setShowDeleteConfirm] = useState(false);

-  const [showReportDialog, setShowReportDialog] = useState(false);
-  const [reportSubject, setReportSubject] = useState('');
-  const [reportBody, setReportBody] = useState('');
-  const [isSendingReport, setIsSendingReport] = useState(false);
+  const [showContactDialog, setShowContactDialog] = useState(false);
+  const [contactSubject, setContactSubject] = useState('');
+  const [contactBody, setContactBody] = useState('');
+  const [isSendingContact, setIsSendingContact] = useState(false);

  const handleSignOut = () => {
    AuthService.deleteToken();
@ -317,66 +317,23 @@ export default function SettingsPage() {
    }
  };

-  const handleSendGeneralReport = async () => {
-    if (!reportSubject.trim() || !reportBody.trim()) {
-      toast.error('الرجاء تعبئة عنوان البلاغ ونصه');
+  const handleSendContact = async () => {
+    if (!contactSubject.trim() || !contactBody.trim()) {
+      toast.error('الرجاء تعبئة العنوان والرسالة');
      return;
    }

-    if (reportSubject.trim().length > 300) {
-      toast.error('عنوان البلاغ يجب ألا يتجاوز 300 حرف');
-      return;
-    }
-
-    const token =
-      AuthService.getToken?.() ||
-      (typeof window !== 'undefined'
-        ? localStorage.getItem('token') ||
-          localStorage.getItem('accessToken') ||
-          localStorage.getItem('authToken')
-        : null);
-
-    if (!token) {
-      console.error('No token found. Checked AuthService.getToken and localStorage keys: token, accessToken, authToken');
-      toast.error('لم يتم العثور على التوكن');
-      return;
-    }
-
-    setIsSendingReport(true);
-
+    setIsSendingContact(true);
    try {
-      const res = await fetch('http://45.93.137.91/api/Reports/SendGeneralReport', {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-          Authorization: `Bearer ${token}`,
-        },
-        body: JSON.stringify({
-          subject: reportSubject.trim(),
-          body: reportBody.trim(),
-        }),
-      });
-
-      const responseText = await res.text();
-
-      if (!res.ok) {
-        console.error('Send report failed:', {
-          status: res.status,
-          statusText: res.statusText,
-          responseText,
-        });
-        throw new Error(responseText || `فشل إرسال البلاغ (HTTP ${res.status})`);
-      }
-
-      toast.success(responseText || 'تم إرسال البلاغ بنجاح');
-      setShowReportDialog(false);
-      setReportSubject('');
-      setReportBody('');
+      await submitReport(contactSubject.trim(), contactBody.trim());
+      toast.success('تم إرسال رسالتك بنجاح');
+      setShowContactDialog(false);
+      setContactSubject('');
+      setContactBody('');
    } catch (err) {
-      console.error('Send report error:', err);
-      toast.error(err.message || 'حدث خطأ أثناء إرسال البلاغ');
+      toast.error(err.message || 'حدث خطأ أثناء الإرسال');
    } finally {
-      setIsSendingReport(false);
+      setIsSendingContact(false);
    }
  };

@ -399,10 +356,9 @@ export default function SettingsPage() {
      title: 'الدعم',
      items: [
        { icon: HelpCircle, label: 'الأسئلة الشائعة', href: '/faq', desc: 'إجابات للأسئلة المتكررة' },
-        { icon: MessageCircle, label: 'تواصل معنا', href: '/support', desc: 'الحصول على المساعدة والدعم' },
+        { icon: MessageCircle, label: 'تواصل معنا', desc: 'الحصول على المساعدة والدعم', action: () => setShowContactDialog(true) },
        { icon: FileText, label: 'الشروط والأحكام', href: '/terms', desc: 'سياسة الاستخدام والخصوصية' },
        { icon: Eye, label: 'سياسة الخصوصية', href: '/privacy', desc: 'كيف نحمي بياناتك' },
-        { icon: AlertTriangle, label: 'إرسال بلاغ عام', desc: 'إرسال مشكلة أو ملاحظة إلى الإدارة', action: () => setShowReportDialog(true) },
      ]
    },
  ];
@ -421,7 +377,7 @@ export default function SettingsPage() {
  };

  return (
-    <div className="min-h-screen bg-gray-50 py-8" dir="rtl">
+    <div className="min-h-screen bg-gray-50 py-8 pb-28" dir="rtl">
      <Toaster position="top-center" reverseOrder={false} />

      <div className="container mx-auto px-4 max-w-2xl">
@ -586,7 +542,7 @@ export default function SettingsPage() {
        </div>
      )}

-      {showReportDialog && (
+      {showContactDialog && (
        <div className="fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/50">
          <motion.div
            initial={{ opacity: 0, scale: 0.95 }}
@ -598,14 +554,14 @@ export default function SettingsPage() {
                <MessageCircle className="w-5 h-5 text-amber-600" />
              </div>
              <div>
-                <h3 className="text-lg font-semibold text-gray-900">إرسال بلاغ عام</h3>
-                <p className="text-sm text-gray-500">سيتم إرسال البلاغ إلى الإدارة</p>
+                <h3 className="text-lg font-semibold text-gray-900">تواصل معنا</h3>
+                <p className="text-sm text-gray-500">سنقوم بالرد عليك في أقرب وقت</p>
              </div>
              <button
                onClick={() => {
-                  setShowReportDialog(false);
-                  setReportSubject('');
-                  setReportBody('');
+                  setShowContactDialog(false);
+                  setContactSubject('');
+                  setContactBody('');
                }}
                className="mr-auto p-1 hover:bg-gray-100 rounded-lg transition-colors"
              >
@ -615,17 +571,17 @@ export default function SettingsPage() {

            <input
              type="text"
-              value={reportSubject}
-              onChange={(e) => setReportSubject(e.target.value)}
-              placeholder="عنوان البلاغ"
+              value={contactSubject}
+              onChange={(e) => setContactSubject(e.target.value)}
+              placeholder="الموضوع"
              maxLength={300}
              className="w-full px-4 py-3 border border-gray-300 rounded-xl mb-4 focus:ring-2 focus:ring-amber-500 focus:border-transparent outline-none"
            />

            <textarea
-              value={reportBody}
-              onChange={(e) => setReportBody(e.target.value)}
-              placeholder="اكتب تفاصيل البلاغ هنا..."
+              value={contactBody}
+              onChange={(e) => setContactBody(e.target.value)}
+              placeholder="اكتب رسالتك هنا..."
              rows={5}
              className="w-full px-4 py-3 border border-gray-300 rounded-xl mb-4 focus:ring-2 focus:ring-amber-500 focus:border-transparent outline-none resize-none"
            />
@ -633,21 +589,21 @@ export default function SettingsPage() {
            <div className="flex gap-3">
              <button
                onClick={() => {
-                  setShowReportDialog(false);
-                  setReportSubject('');
-                  setReportBody('');
+                  setShowContactDialog(false);
+                  setContactSubject('');
+                  setContactBody('');
                }}
                className="flex-1 px-4 py-3 rounded-xl border border-gray-200 text-gray-700 hover:bg-gray-50 transition-colors text-sm font-medium"
              >
                إلغاء
              </button>
              <button
-                onClick={handleSendGeneralReport}
-                disabled={isSendingReport}
+                onClick={handleSendContact}
+                disabled={isSendingContact}
                className="flex-1 px-4 py-3 rounded-xl bg-amber-600 text-white hover:bg-amber-700 transition-colors text-sm font-medium disabled:opacity-50 flex items-center justify-center gap-2"
              >
-                {isSendingReport ? <Loader2 className="w-4 h-4 animate-spin" /> : <MessageCircle className="w-4 h-4" />}
-                {isSendingReport ? 'جاري الإرسال...' : 'إرسال البلاغ'}
+                {isSendingContact ? <Loader2 className="w-4 h-4 animate-spin" /> : <MessageCircle className="w-4 h-4" />}
+                {isSendingContact ? 'جاري الإرسال...' : 'إرسال'}
              </button>
            </div>
          </motion.div>
--- a/app/support/page.js
+++ b/app/support/page.js
@ -1,44 +1,54 @@
-'use client';
+"use client";

-import { useState } from 'react';
-import { motion } from 'framer-motion';
-import { MessageCircle, Mail, Phone, MapPin, Send, Loader2 } from 'lucide-react';
-import toast, { Toaster } from 'react-hot-toast';
-import { submitReport } from '../utils/api';
-import AuthService from '../services/AuthService';
+import { useState } from "react";
+import { motion } from "framer-motion";
+import {
+  MessageCircle,
+  Mail,
+  Phone,
+  MapPin,
+  Send,
+  Loader2,
+} from "lucide-react";
+import toast, { Toaster } from "react-hot-toast";
+import { submitReport } from "../utils/api";
+import AuthService from "../services/AuthService";

 export default function SupportPage() {
-  const [subject, setSubject] = useState('');
-  const [body, setBody] = useState('');
+  const [subject, setSubject] = useState("");
+  const [body, setBody] = useState("");
  const [isSubmitting, setIsSubmitting] = useState(false);

  const handleSubmit = async (e) => {
    e.preventDefault();
    if (!subject.trim() || !body.trim()) {
-      toast.error('يرجى تعبئة جميع الحقول');
+      toast.error("يرجى تعبئة جميع الحقول");
      return;
    }

    if (!AuthService.isAuthenticated()) {
-      toast.error('يرجى تسجيل الدخول أولاً لإرسال طلب دعم');
+      toast.error("يرجى تسجيل الدخول أولاً لإرسال طلب دعم");
      return;
    }

    setIsSubmitting(true);
    try {
      await submitReport(subject, body);
-      toast.success('تم إرسال طلب الدعم بنجاح');
-      setSubject('');
-      setBody('');
+      toast.success("تم إرسال طلب الدعم بنجاح");
+      setSubject("");
+      setBody("");
    } catch (error) {
-      toast.error('حدث خطأ أثناء إرسال الطلب. حاول مرة أخرى');
+      toast.error("حدث خطأ أثناء إرسال الطلب. حاول مرة أخرى");
    } finally {
      setIsSubmitting(false);
    }
  };

  return (
-    <div className="min-h-screen bg-gradient-to-b from-amber-50/50 to-white py-12" dir="rtl">
+    <div
+      className="min-h-screen bg-gradient-to-b from-amber-50/50 to-white py-12"
+      dir="rtl"
+    >
      <Toaster position="top-center" reverseOrder={false} />
      <div className="container mx-auto px-4 max-w-5xl">
        <motion.div
@ -49,9 +59,12 @@ export default function SupportPage() {
          <div className="w-20 h-20 bg-amber-100 rounded-2xl flex items-center justify-center mx-auto mb-6 shadow-lg shadow-amber-100">
            <MessageCircle className="w-10 h-10 text-amber-600" />
          </div>
-          <h1 className="text-4xl font-bold text-gray-900 mb-4">خدمة العملاء</h1>
+          <h1 className="text-4xl font-bold text-gray-900 mb-4">
+            خدمة العملاء
+          </h1>
          <p className="text-lg text-gray-600 max-w-2xl mx-auto">
-            نحن هنا لمساعدتك. تواصل معنا عبر النموذج أدناه أو من خلال معلومات الاتصال المباشرة
+            نحن هنا لمساعدتك. تواصل معنا عبر النموذج أدناه أو من خلال معلومات
+            الاتصال المباشرة
          </p>
        </motion.div>

@ -63,7 +76,9 @@ export default function SupportPage() {
            className="md:col-span-2"
          >
            <div className="bg-white rounded-2xl shadow-sm border border-gray-200 p-8">
-              <h2 className="text-2xl font-bold text-gray-900 mb-6">أرسل لنا رسالة</h2>
+              <h2 className="text-2xl font-bold text-gray-900 mb-6">
+                أرسل لنا رسالة
+              </h2>
              <form onSubmit={handleSubmit} className="space-y-6">
                <div>
                  <label className="block text-sm font-medium text-gray-700 mb-2">
@ -99,7 +114,7 @@ export default function SupportPage() {
                  ) : (
                    <Send className="w-5 h-5" />
                  )}
-                  {isSubmitting ? 'جاري الإرسال...' : 'إرسال'}
+                  {isSubmitting ? "جاري الإرسال..." : "إرسال"}
                </button>
              </form>
            </div>
@ -112,7 +127,9 @@ export default function SupportPage() {
            className="space-y-6"
          >
            <div className="bg-white rounded-2xl shadow-sm border border-gray-200 p-6">
-              <h3 className="text-lg font-bold text-gray-900 mb-4">معلومات الاتصال</h3>
+              <h3 className="text-lg font-bold text-gray-900 mb-4">
+                معلومات الاتصال
+              </h3>
              <div className="space-y-4">
                <div className="flex items-center gap-3">
                  <div className="w-10 h-10 bg-blue-100 rounded-xl flex items-center justify-center shrink-0">
@ -120,7 +137,9 @@ export default function SupportPage() {
                  </div>
                  <div>
                    <p className="text-sm text-gray-500">البريد الإلكتروني</p>
-                    <p className="font-medium text-gray-900">support@sweethome.com</p>
+                    <p className="font-medium text-gray-900">
+                      support@sweethome.com
+                    </p>
                  </div>
                </div>
                <div className="flex items-center gap-3">
@ -129,7 +148,9 @@ export default function SupportPage() {
                  </div>
                  <div>
                    <p className="text-sm text-gray-500">رقم الهاتف</p>
-                    <p className="font-medium text-gray-900" dir="ltr">+963 11 234 5678</p>
+                    <p className="font-medium text-gray-900" dir="ltr">
+                      +963 11 234 5678
+                    </p>
                  </div>
                </div>
                <div className="flex items-center gap-3">
@ -145,7 +166,9 @@ export default function SupportPage() {
            </div>

            <div className="bg-amber-50 rounded-2xl border border-amber-200 p-6">
-              <h3 className="text-lg font-bold text-amber-800 mb-2">ساعات العمل</h3>
+              <h3 className="text-lg font-bold text-amber-800 mb-2">
+                ساعات العمل
+              </h3>
              <div className="space-y-2 text-amber-700">
                <div className="flex justify-between">
                  <span>السبت - الخميس</span>
--- a/app/utils/api.js
+++ b/app/utils/api.js
@ -374,10 +374,10 @@
 // // ─── Booking/Reservation Management ───

 import AuthService from "../services/AuthService";
-const API_BASE =
-  process.env.NEXT_PUBLIC_API_URL || "https://45.93.137.91.nip.io/api";
+const API_BASE = // const API_BASE =
+  process.env.NEXT_PUBLIC_API_URL || "https://45.93.137.91.nip.io/api"; //   process.env.NEXT_PUBLIC_API_URL || "https://45.93.137.91.nip.io/api";
 const REPORT_API_BASE =
-  process.env.NEXT_PUBLIC_REPORT_API_URL || "http://45.93.137.91/api";
+  process.env.NEXT_PUBLIC_API_URL || "http://45.93.137.91/api";

 function isFormData(value) {
  return typeof FormData !== "undefined" && value instanceof FormData;
@ -1032,6 +1032,10 @@ export async function payDeposit(data) {
  });
 }

+export async function getMyTransaction() {
+  return apiFetch("/Customer/GetMyTransaction");
+}
+
 // ─── Owner Contact & Stats ───

 export async function getOwnerContactInformation(propertyInformationId) {