removed the descption on the profile
All checks were successful
Build frontend / build (push) Successful in 49s
All checks were successful
Build frontend / build (push) Successful in 49s
This commit is contained in:
mouazkh
@ -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>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@ -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>
|
||||
|
||||
Reference in New Issue
Block a user