favorite page and comment page

This commit is contained in:
hamid zarghami
2025-08-26 09:47:52 +03:30
parent eba518e67b
commit c0320654a2
4 changed files with 125 additions and 7 deletions
+89
View File
@@ -0,0 +1,89 @@
import withLayout from '@/hoc/withLayout'
import { NextPage } from 'next'
import Menu from '../components/Menu'
import Image from 'next/image'
const Comments: NextPage = () => {
return (
<div className='p-6'>
<Menu pageActive='comments' />
<div className='mt-14'>
<div className='flex gap-6 border-b border-border pb-6'>
<Image
src='https://picsum.photos/200/300'
alt='comment'
width={100}
height={100}
className='max-w-20 max-h-20 object-contain'
/>
<div className='flex-1'>
<div className='border-b border-border pb-4'>
<div>
نان بربری سنتی سبوس دار
</div>
<div className='mt-1.5 text-sm text-[#999999]'>
2 آذر 1401
</div>
</div>
<div className='mt-4 text-[#4C4C4C] text-sm'>
خیلی راضیم از خریدم
</div>
</div>
</div>
<div className='flex gap-6 border-b border-border py-6'>
<Image
src='https://picsum.photos/200/300'
alt='comment'
width={100}
height={100}
className='max-w-20 max-h-20 object-contain'
/>
<div className='flex-1'>
<div className='border-b border-border pb-4'>
<div>
نان بربری سنتی سبوس دار
</div>
<div className='mt-1.5 text-sm text-[#999999]'>
2 آذر 1401
</div>
</div>
<div className='mt-4 text-[#4C4C4C] text-sm'>
خیلی راضیم از خریدم
</div>
</div>
</div>
<div className='flex gap-6 border-b border-border py-6'>
<Image
src='https://picsum.photos/200/300'
alt='comment'
width={100}
height={100}
className='max-w-20 max-h-20 object-contain'
/>
<div className='flex-1'>
<div className='border-b border-border pb-4'>
<div>
نان بربری سنتی سبوس دار
</div>
<div className='mt-1.5 text-sm text-[#999999]'>
2 آذر 1401
</div>
</div>
<div className='mt-4 text-[#4C4C4C] text-sm'>
خیلی راضیم از خریدم
</div>
</div>
</div>
</div>
</div>
)
}
export default withLayout(Comments)
+12 -6
View File
@@ -3,15 +3,21 @@ import MenuItem from './MenuItem'
import { Button } from '@/components/ui/button'
import { LogoutCurve } from 'iconsax-react'
const Menu: FC = () => {
type Props = {
pageActive: 'profile' | 'favorite' | 'comments' | 'chat' | 'orders'
}
const Menu: FC<Props> = (props) => {
const { pageActive } = props
return (
<div className='h-20 flex justify-between items-center bg-[#FAFAFA] rounded-[10px] border border-border px-10'>
<div className='flex gap-10'>
<MenuItem href='/profile' icon='user' text='پروفایل کاربری' isActive={true} />
<MenuItem href='/profile/favorite' icon='heart' text='علاقه مندی ها' isActive={false} />
<MenuItem href='/profile/comments' icon='comment' text='نظرات من' isActive={false} />
<MenuItem href='/profile/chat' icon='chat' text='گفتگو' isActive={false} />
<MenuItem href='/profile/orders' icon='orders' text='سفارشات' isActive={false} />
<MenuItem href='/profile' icon='user' text='پروفایل کاربری' isActive={pageActive === 'profile'} />
<MenuItem href='/profile/favorite' icon='heart' text='علاقه مندی ها' isActive={pageActive === 'favorite'} />
<MenuItem href='/profile/comments' icon='comment' text='نظرات من' isActive={pageActive === 'comments'} />
<MenuItem href='/profile/chat' icon='chat' text='گفتگو' isActive={pageActive === 'chat'} />
<MenuItem href='/profile/orders' icon='orders' text='سفارشات' isActive={pageActive === 'orders'} />
</div>
<Button className='bg-[#F2F2F2] h-12'>
+23
View File
@@ -0,0 +1,23 @@
import withLayout from "@/hoc/withLayout"
import { NextPage } from "next"
import Menu from "../components/Menu"
import GridWrapper from "@/components/GridWrapper"
import ProductCard from "@/components/ProductCard"
const FavoritePage: NextPage = () => {
return (
<div className="p-6">
<Menu pageActive='favorite' />
<GridWrapper desktop={5} mobile={2} className="mt-14">
<ProductCard />
<ProductCard />
<ProductCard />
<ProductCard />
</GridWrapper>
</div>
)
}
export default withLayout(FavoritePage)
+1 -1
View File
@@ -38,7 +38,7 @@ const ProfilePage = () => {
return (
<div className="p-6">
<Menu />
<Menu pageActive='profile' />
<div className='mt-10'>
<div className="flex gap-6">
{/* Left Content - Form */}