condition cancel and return order

src/app/profile/orders/[id]/components/OrderProductItem.tsx

@@ -1,13 +1,10 @@
 'use client'
 import React, { useState } from 'react'
 import Image from 'next/image'
-import { MessageText, ShieldTick, Truck, CloseCircle, MessageAdd } from 'iconsax-react'
+import { MessageText, ShieldTick, Truck, MessageAdd } from 'iconsax-react'
 import { ShipmentItemDetail } from '../../types/Types'
-import Link from 'next/link'
-import { useParams } from 'next/navigation'
 import AddComment from '@/app/product/components/AddComment'
 import { PRIMARY_COLOR } from '@/config/const'
-import { Separator } from '@/components/ui/separator'
 
 interface OrderProductItemProps {
     item: ShipmentItemDetail
@@ -17,7 +14,6 @@ interface OrderProductItemProps {
 
 const OrderProductItem: React.FC<OrderProductItemProps> = ({ item, shipperName }) => {
 
-    const { id } = useParams()
     const [isCommentModalOpen, setIsCommentModalOpen] = useState(false)
 
     return (
@@ -97,18 +93,9 @@ const OrderProductItem: React.FC<OrderProductItemProps> = ({ item, shipperName }
                             <div>ثبت دیدگاه</div>
                         </button>
 
-                        <Separator orientation='vertical' color='gray' style={{ height: 24 }} />
+                        {/* <Separator orientation='vertical' color='gray' style={{ height: 24 }} /> */}
+
 
-                        {item.quantity !== item.cancelled_quantity && (
-                            <Link href={`/profile/orders/${id}/cancel`}>
-                                <button
-                                    className='flex items-center cursor-pointer gap-2 text-[#B3261E]  rounded-lg transition-colors'
-                                >
-                                    <CloseCircle color='#B3261E' size={16} />
-                                    <div>لغو سفارش</div>
-                                </button>
-                            </Link>
-                        )}
                     </div>
                 </div>
             </div>

src/app/profile/orders/[id]/page.tsx

@@ -1,6 +1,7 @@
 'use client'
+
 import { FC, useState } from 'react'
-import { ArrowLeft, TaskSquare } from 'iconsax-react'
+import { ArrowLeft, CloseCircle, TaskSquare } from 'iconsax-react'
 import { useRouter, useParams } from 'next/navigation'
 import PageLoading from '@/components/PageLoading'
 import Layout from '@/hoc/Layout'
@@ -12,6 +13,8 @@ import { useCancelOrder, useGetOrderDetail } from '../hooks/useOrdersData'
 import { toast } from '@/components/Toast'
 import { PRIMARY_COLOR } from '@/config/const'
 import { getStatusText } from '@/config/func'
+import { OrdersStatus } from '../types/Types'
+import Link from 'next/link'
 
 
 const OrderDetail: FC = () => {
@@ -69,10 +72,24 @@ const OrderDetail: FC = () => {
                         <div className="text-lg font-semibold">جزئیات سفارش</div>
                     </div>
 
-                    <div className='flex gap-2 items-center cursor-pointer' onClick={() => router.push(`/profile/orders/${id}/return`)}>
-                        <TaskSquare color={PRIMARY_COLOR} size={20} />
-                        <div className='text-primary'>فرم درخواست مرجوعی</div>
-                    </div>
+                    {
+                        orderDetail?.results?.order?.orderStatus === OrdersStatus.shipped && (
+                            <div className='flex gap-2 items-center cursor-pointer' onClick={() => router.push(`/profile/orders/${id}/return`)}>
+                                <TaskSquare color={PRIMARY_COLOR} size={20} />
+                                <div className='text-primary'>فرم درخواست مرجوعی</div>
+                            </div>
+                        )
+                    }
+                    {orderDetail?.results.order.orderStatus === OrdersStatus.process_by_seller && (
+                        <Link href={`/profile/orders/${id}/cancel`}>
+                            <button
+                                className='flex items-center cursor-pointer gap-2 text-[#B3261E]  rounded-lg transition-colors'
+                            >
+                                <CloseCircle color='#B3261E' size={16} />
+                                <div>لغو سفارش</div>
+                            </button>
+                        </Link>
+                    )}
                 </div>
 
                 {cancelOrderMutation.isPending ? (