fix(profile, image): fix wallet responsive layout on mobile and replace img tags with next/image
This commit is contained in:
parsa aghaei
parent
897867c633
commit
68fbd7d183
@ -1,6 +1,7 @@
|
||||
import React from "react";
|
||||
import { ChevronRight, Calendar, User, Sparkles } from "lucide-react";
|
||||
import Link from 'next/link';
|
||||
import Image from 'next/image';
|
||||
import type { Metadata } from 'next';
|
||||
|
||||
const API_URL = process.env.NEXT_PUBLIC_API_URL || 'https://apicanina.parsaaghayi.ir';
|
||||
@ -83,8 +84,8 @@ export default async function BlogPostPage({ params }: { params: Promise<{ slug:
|
||||
<div className="grid lg:grid-cols-12 gap-12">
|
||||
<div className="lg:col-span-8">
|
||||
<div className="bg-white rounded-[3.5rem] border border-medical-gray-200 shadow-2xl overflow-hidden">
|
||||
<div className="aspect-video w-full overflow-hidden">
|
||||
<img src={selectedPost.image} alt={selectedPost.title} className="w-full h-full object-cover" />
|
||||
<div className="aspect-video w-full overflow-hidden relative">
|
||||
<Image src={selectedPost.image} alt={selectedPost.title} fill className="w-full h-full object-cover" unoptimized />
|
||||
</div>
|
||||
<div className="p-12">
|
||||
<div className="flex items-center gap-4 text-xs font-bold text-canina-blue mb-8">
|
||||
|
||||
@ -18,6 +18,7 @@ export interface BlogPost {
|
||||
}
|
||||
|
||||
import { useRouter } from 'next/navigation';
|
||||
import Image from 'next/image';
|
||||
|
||||
export default function BlogPage({ blogs = [] }: { blogs: BlogPost[] }) {
|
||||
const router = useRouter();
|
||||
@ -58,8 +59,8 @@ export default function BlogPage({ blogs = [] }: { blogs: BlogPost[] }) {
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
className="bg-white rounded-[3.5rem] border border-medical-gray-200 shadow-2xl overflow-hidden"
|
||||
>
|
||||
<div className="aspect-video w-full overflow-hidden">
|
||||
<img src={selectedPost.image} alt={selectedPost.title} className="w-full h-full object-cover" />
|
||||
<div className="aspect-video w-full overflow-hidden relative">
|
||||
<Image src={selectedPost.image} alt={selectedPost.title} fill className="w-full h-full object-cover" unoptimized />
|
||||
</div>
|
||||
<div className="p-12">
|
||||
<div className="flex items-center gap-4 text-xs font-bold text-canina-blue mb-8">
|
||||
@ -114,8 +115,8 @@ export default function BlogPage({ blogs = [] }: { blogs: BlogPost[] }) {
|
||||
onClick={() => router.push(`/shop/${p.slug || p.id}`)}
|
||||
className="bg-white/10 border border-white/20 p-4 rounded-3xl flex items-center gap-4 cursor-pointer hover:bg-white/20 transition-all group"
|
||||
>
|
||||
<div className="w-16 h-16 bg-white rounded-2xl p-2 shrink-0 group-hover:scale-110 transition-transform">
|
||||
<img src={p.image} alt={p.name} className="w-full h-full object-contain" />
|
||||
<div className="w-16 h-16 bg-white rounded-2xl p-2 shrink-0 group-hover:scale-110 transition-transform relative overflow-hidden">
|
||||
<Image src={p.image} alt={p.name} fill className="w-full h-full object-contain p-2" unoptimized />
|
||||
</div>
|
||||
<div>
|
||||
<div className="text-[10px] font-black opacity-50 uppercase tracking-widest">{p.category}</div>
|
||||
@ -135,8 +136,8 @@ export default function BlogPage({ blogs = [] }: { blogs: BlogPost[] }) {
|
||||
onClick={() => router.push(`/blog/${p.slug}`)}
|
||||
className="flex items-center gap-4 cursor-pointer group"
|
||||
>
|
||||
<div className="w-16 h-16 rounded-2xl overflow-hidden shrink-0">
|
||||
<img src={p.image} className="w-full h-full object-cover group-hover:scale-110 transition-transform" />
|
||||
<div className="w-16 h-16 rounded-2xl overflow-hidden shrink-0 relative">
|
||||
<Image src={p.image} alt={p.title} fill className="w-full h-full object-cover group-hover:scale-110 transition-transform" unoptimized />
|
||||
</div>
|
||||
<div className="text-sm font-black text-medical-gray-900 group-hover:text-canina-blue transition-colors line-clamp-2">
|
||||
{p.title}
|
||||
@ -195,11 +196,13 @@ export default function BlogPage({ blogs = [] }: { blogs: BlogPost[] }) {
|
||||
className="bg-white rounded-[3.5rem] overflow-hidden border border-medical-gray-200 shadow-2xl flex flex-col lg:flex-row cursor-pointer group"
|
||||
onClick={() => router.push(`/blog/${blogs[0].slug}`)}
|
||||
>
|
||||
<div className="lg:w-1/2 aspect-video lg:aspect-auto">
|
||||
<img
|
||||
<div className="lg:w-1/2 aspect-video lg:aspect-auto relative overflow-hidden">
|
||||
<Image
|
||||
src={blogs[0].image}
|
||||
alt={blogs[0].title}
|
||||
fill
|
||||
className="w-full h-full object-cover group-hover:scale-105 transition-transform duration-700"
|
||||
unoptimized
|
||||
/>
|
||||
</div>
|
||||
<div className="lg:w-1/2 p-12 flex flex-col justify-center">
|
||||
@ -248,11 +251,13 @@ export default function BlogPage({ blogs = [] }: { blogs: BlogPost[] }) {
|
||||
className="bg-white rounded-[3rem] overflow-hidden border border-medical-gray-200 shadow-xl group hover:shadow-2xl transition-all cursor-pointer"
|
||||
onClick={() => router.push(`/blog/${post.slug}`)}
|
||||
>
|
||||
<div className="aspect-[16/9] overflow-hidden">
|
||||
<img
|
||||
<div className="aspect-[16/9] overflow-hidden relative">
|
||||
<Image
|
||||
src={post.image}
|
||||
alt={post.title}
|
||||
fill
|
||||
className="w-full h-full object-cover group-hover:scale-110 transition-transform duration-700"
|
||||
unoptimized
|
||||
/>
|
||||
</div>
|
||||
<div className="p-8">
|
||||
@ -262,10 +267,10 @@ export default function BlogPage({ blogs = [] }: { blogs: BlogPost[] }) {
|
||||
{post.date}
|
||||
</div>
|
||||
</div>
|
||||
<h3 className="text-xl font-black text-medical-gray-900 mb-4 group-hover:text-canina-blue transition-colors">
|
||||
<h3 className="text-xl font-black text-medical-gray-900 mb-4 group-hover:text-canina-blue transition-colors line-clamp-2 leading-snug">
|
||||
{post.title}
|
||||
</h3>
|
||||
<p className="text-sm text-medical-gray-500 mb-8 leading-relaxed line-clamp-2">
|
||||
<p className="text-sm text-medical-gray-500 line-clamp-3 leading-relaxed mb-6">
|
||||
{post.excerpt}
|
||||
</p>
|
||||
<div className="flex items-center gap-2 text-medical-gray-900 font-bold group">
|
||||
@ -380,7 +385,9 @@ export default function BlogPage({ blogs = [] }: { blogs: BlogPost[] }) {
|
||||
onClick={() => router.push(`/shop/${p.slug || p.id}`)}
|
||||
className="bg-white/10 border border-white/20 p-6 rounded-3xl cursor-pointer hover:bg-white/20 transition-all text-center group"
|
||||
>
|
||||
<img src={p.image} alt={p.name} className="w-20 h-20 mx-auto mb-4 object-contain group-hover:scale-110 transition-transform" />
|
||||
<div className="w-20 h-20 mx-auto mb-4 relative overflow-hidden">
|
||||
<Image src={p.image} alt={p.name} fill className="w-full h-full object-contain group-hover:scale-110 transition-transform" unoptimized />
|
||||
</div>
|
||||
<h5 className="text-[10px] font-black">{p.name}</h5>
|
||||
</div>
|
||||
))}
|
||||
|
||||
@ -7,6 +7,7 @@ import { useSettingsStore } from "../lib/store/settingsStore";
|
||||
import { productService } from "../lib/services/productService";
|
||||
|
||||
import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
import { SCIENTIFIC_TERMS } from "../lib/data/scientificTerms";
|
||||
import { useRouter, useSearchParams } from 'next/navigation';
|
||||
|
||||
@ -243,8 +244,8 @@ export default function IngredientWiki() {
|
||||
href={`/shop/${p.slug || p.id}`}
|
||||
className="bg-white rounded-[2rem] p-5 shadow-lg border border-medical-gray-200/70 hover:border-canina-blue/40 hover:shadow-xl hover:scale-[1.03] transition-all cursor-pointer group flex flex-col justify-between"
|
||||
>
|
||||
<div className="aspect-square bg-medical-gray-50 rounded-2xl p-4 mb-4 flex items-center justify-center">
|
||||
<img src={p.image} alt={p.name} className="max-h-24 w-auto object-contain group-hover:scale-110 transition-transform duration-500" referrerPolicy="no-referrer" />
|
||||
<div className="aspect-square bg-medical-gray-50 rounded-2xl p-4 mb-4 flex items-center justify-center relative overflow-hidden">
|
||||
<Image src={p.image} alt={p.name} width={96} height={96} className="max-h-24 w-auto object-contain group-hover:scale-110 transition-transform duration-500" unoptimized />
|
||||
</div>
|
||||
<h4 className="text-xs font-black text-center text-medical-gray-900 group-hover:text-canina-blue transition-colors px-1 leading-snug font-vazir">{p.name}</h4>
|
||||
</Link>
|
||||
|
||||
@ -7,6 +7,7 @@ import { Product } from "../lib/data/products";
|
||||
import { productService } from "../lib/services/productService";
|
||||
|
||||
import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
import { useRouter } from 'next/navigation';
|
||||
|
||||
export default function SearchResultsPage({ query }: { query: string }) {
|
||||
@ -72,11 +73,13 @@ export default function SearchResultsPage({ query }: { query: string }) {
|
||||
className="bg-white rounded-[2.5rem] p-8 border border-medical-gray-200 group hover:shadow-2xl hover:shadow-canina-blue/10 transition-all flex flex-col relative h-full block"
|
||||
>
|
||||
<div className="relative aspect-square mb-8 bg-medical-gray-50 rounded-[2rem] overflow-hidden p-6 flex items-center justify-center">
|
||||
<img
|
||||
<Image
|
||||
src={product.image}
|
||||
alt={product.nameFa || product.name}
|
||||
width={200}
|
||||
height={200}
|
||||
className="w-full h-full object-contain group-hover:scale-110 transition-transform duration-500"
|
||||
referrerPolicy="no-referrer"
|
||||
unoptimized
|
||||
/>
|
||||
{product.specialBadge && (
|
||||
<div className="absolute top-4 right-4 bg-medical-gray-900 text-white text-[8px] font-black px-3 py-1 rounded-full uppercase tracking-widest">
|
||||
@ -130,8 +133,8 @@ export default function SearchResultsPage({ query }: { query: string }) {
|
||||
<div className="grid md:grid-cols-3 gap-8 opacity-60 hover:opacity-100 transition-opacity">
|
||||
{bestSellers.map(p => (
|
||||
<Link key={p.id} href={`/shop/${p.slug || p.id}`} className="cursor-pointer group block">
|
||||
<div className="aspect-square bg-white rounded-[2rem] p-6 mb-4 border border-medical-gray-100 flex items-center justify-center">
|
||||
<img src={p.image} className="w-40 h-40 object-contain group-hover:scale-105 transition-transform" />
|
||||
<div className="aspect-square bg-white rounded-[2rem] p-6 mb-4 border border-medical-gray-100 flex items-center justify-center relative overflow-hidden">
|
||||
<Image src={p.image} alt={p.name} width={160} height={160} className="w-40 h-40 object-contain group-hover:scale-105 transition-transform" unoptimized />
|
||||
</div>
|
||||
<h4 className="font-black text-medical-gray-900 text-center">{p.name}</h4>
|
||||
</Link>
|
||||
|
||||
@ -542,96 +542,96 @@ export default function UserDashboard() {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Main Balance Card */}
|
||||
<div className="bg-gradient-to-br from-canina-blue to-blue-600 rounded-[3rem] p-12 text-white shadow-2xl shadow-canina-blue/20 relative overflow-hidden group">
|
||||
<div className="absolute top-0 right-0 p-12 opacity-10 group-hover:scale-110 transition-transform duration-700">
|
||||
<Wallet className="w-48 h-48" />
|
||||
</div>
|
||||
<div className="relative z-10 flex flex-col md:flex-row items-center justify-between gap-10">
|
||||
<div className="text-center md:text-right">
|
||||
<div className="text-xs font-black uppercase tracking-[0.2em] text-white/70 mb-4 flex items-center gap-2 justify-center md:justify-start text-right">
|
||||
<div className="w-2 h-2 bg-white rounded-full animate-pulse" />
|
||||
موجودی زنده و قابل استفاده
|
||||
</div>
|
||||
<div className="flex items-baseline gap-4 flex-row-reverse justify-center md:justify-start">
|
||||
<div className="text-6xl font-black italic tracking-tight">{toPersian(profile.walletBalance.toLocaleString())}</div>
|
||||
<span className="text-xl not-italic font-bold opacity-80 decoration-white/30 underline underline-offset-8">تومان</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex gap-4 w-full md:w-auto">
|
||||
<div className="relative group/btn flex-1 md:flex-none">
|
||||
<button
|
||||
disabled
|
||||
className="w-full md:w-40 h-16 bg-white/10 backdrop-blur-md rounded-2xl font-black text-sm flex items-center justify-center gap-2 border border-white/20 opacity-50 cursor-not-allowed"
|
||||
>
|
||||
<ArrowDownCircle className="w-5 h-5" />
|
||||
برداشت وجه
|
||||
</button>
|
||||
<div className="absolute top-full right-0 mt-3 w-48 p-3 bg-medical-gray-900 text-white text-[10px] font-bold rounded-xl opacity-0 group-hover/btn:opacity-100 transition-all pointer-events-none z-20 text-center shadow-xl">
|
||||
قابلیت برداشت وجه بهزودی فعال خواهد شد.
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
onClick={() => setIsTopUpModalOpen(true)}
|
||||
className="flex-1 md:w-40 h-16 bg-white text-canina-blue rounded-2xl font-black text-sm flex items-center justify-center gap-2 hover:bg-medical-gray-900 hover:text-white transition-all shadow-xl shadow-black/10 group/topup"
|
||||
>
|
||||
<ArrowUpCircle className="w-5 h-5 group-hover:-translate-y-1 transition-transform" />
|
||||
شارژ آنی
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* Main Balance Card */}
|
||||
<div className="bg-gradient-to-br from-canina-blue to-blue-600 rounded-[2rem] sm:rounded-[3rem] p-6 sm:p-12 text-white shadow-2xl shadow-canina-blue/20 relative overflow-hidden group">
|
||||
<div className="absolute top-0 right-0 p-6 sm:p-12 opacity-10 group-hover:scale-110 transition-transform duration-700 pointer-events-none">
|
||||
<Wallet className="w-32 h-32 sm:w-48 sm:h-48" />
|
||||
</div>
|
||||
<div className="relative z-10 flex flex-col md:flex-row items-center justify-between gap-6 sm:gap-10">
|
||||
<div className="text-center md:text-right w-full md:w-auto">
|
||||
<div className="text-xs font-black uppercase tracking-[0.2em] text-white/70 mb-3 sm:mb-4 flex items-center gap-2 justify-center md:justify-start">
|
||||
<div className="w-2 h-2 bg-white rounded-full animate-pulse" />
|
||||
موجودی زنده و قابل استفاده
|
||||
</div>
|
||||
<div className="flex items-baseline gap-3 sm:gap-4 flex-row-reverse justify-center md:justify-start">
|
||||
<div className="text-4xl sm:text-6xl font-black italic tracking-tight">{toPersian(profile.walletBalance.toLocaleString())}</div>
|
||||
<span className="text-base sm:text-xl not-italic font-bold opacity-80 decoration-white/30 underline underline-offset-8">تومان</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-col sm:flex-row gap-3 sm:gap-4 w-full md:w-auto">
|
||||
<div className="relative group/btn flex-1 md:flex-none">
|
||||
<button
|
||||
disabled
|
||||
className="w-full md:w-40 h-12 sm:h-16 bg-white/10 backdrop-blur-md rounded-2xl font-black text-xs sm:text-sm flex items-center justify-center gap-2 border border-white/20 opacity-50 cursor-not-allowed"
|
||||
>
|
||||
<ArrowDownCircle className="w-4 h-4 sm:w-5 sm:h-5" />
|
||||
برداشت وجه
|
||||
</button>
|
||||
<div className="absolute top-full right-0 mt-3 w-48 p-3 bg-medical-gray-900 text-white text-[10px] font-bold rounded-xl opacity-0 group-hover/btn:opacity-100 transition-all pointer-events-none z-20 text-center shadow-xl">
|
||||
قابلیت برداشت وجه بهزودی فعال خواهد شد.
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
onClick={() => setIsTopUpModalOpen(true)}
|
||||
className="flex-1 md:w-40 h-12 sm:h-16 bg-white text-canina-blue rounded-2xl font-black text-xs sm:text-sm flex items-center justify-center gap-2 hover:bg-medical-gray-900 hover:text-white transition-all shadow-xl shadow-black/10 group/topup"
|
||||
>
|
||||
<ArrowUpCircle className="w-4 h-4 sm:w-5 sm:h-5 group-hover:-translate-y-1 transition-transform" />
|
||||
شارژ آنی
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Transaction History */}
|
||||
<div className="pt-10 border-t border-medical-gray-100">
|
||||
<div className="flex items-center gap-4 mb-8">
|
||||
<div className="w-10 h-10 bg-medical-gray-50 rounded-xl flex items-center justify-center text-medical-gray-400">
|
||||
<Clock className="w-5 h-5" />
|
||||
</div>
|
||||
<h4 className="text-lg font-black text-medical-gray-900 italic">تاریخچه تراکنشها</h4>
|
||||
</div>
|
||||
{/* Transaction History */}
|
||||
<div className="pt-10 border-t border-medical-gray-100">
|
||||
<div className="flex items-center gap-4 mb-8">
|
||||
<div className="w-10 h-10 bg-medical-gray-50 rounded-xl flex items-center justify-center text-medical-gray-400">
|
||||
<Clock className="w-5 h-5" />
|
||||
</div>
|
||||
<h4 className="text-lg font-black text-medical-gray-900 italic">تاریخچه تراکنشها</h4>
|
||||
</div>
|
||||
|
||||
<div className="space-y-4">
|
||||
{(profile?.transactions || []).length === 0 ? (
|
||||
<div className="text-center py-20 bg-medical-gray-50 rounded-[2.5rem] border border-dashed border-medical-gray-200">
|
||||
<Info className="w-12 h-12 text-medical-gray-200 mx-auto mb-4" />
|
||||
<p className="text-medical-gray-400 font-bold">تراکنشی یافت نشد.</p>
|
||||
</div>
|
||||
) : (
|
||||
(profile?.transactions || []).map((trx) => (
|
||||
<div key={trx.id} className="p-6 bg-white border border-medical-gray-100 rounded-[2rem] flex flex-wrap items-center justify-between gap-6 hover:shadow-lg hover:border-canina-blue/10 transition-all group">
|
||||
<div className="flex items-center gap-4">
|
||||
<div className={cn(
|
||||
"w-12 h-12 rounded-2xl flex items-center justify-center transition-colors",
|
||||
trx.type === 'top_up' ? "bg-green-50 text-green-500 group-hover:bg-green-500 group-hover:text-white" : "bg-red-50 text-red-500 group-hover:bg-red-500 group-hover:text-white"
|
||||
)}>
|
||||
{trx.type === 'top_up' ? <ArrowUpCircle className="w-6 h-6" /> : <ShoppingCart className="w-6 h-6" />}
|
||||
</div>
|
||||
<div>
|
||||
<div className="text-sm font-black text-medical-gray-900">{trx.type === 'top_up' ? "افزایش موجودی (شارژ)" : "پرداخت سفارش"}</div>
|
||||
<div className="text-[10px] font-bold text-medical-gray-400 flex items-center gap-2">
|
||||
<span>کد پیگیری: {trx.id}</span>
|
||||
<span className="w-1 h-1 bg-medical-gray-200 rounded-full" />
|
||||
<span>{toPersian(new Date(trx.date).toLocaleDateString("fa-IR"))}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="text-left">
|
||||
<div className={cn(
|
||||
"text-lg font-black italic",
|
||||
trx.type === 'top_up' ? "text-green-600" : "text-red-500"
|
||||
)}>
|
||||
{trx.type === 'top_up' ? "+" : ""}{toPersian(trx.amount.toLocaleString())} <span className="text-xs not-italic">تومان</span>
|
||||
</div>
|
||||
<div className="text-[9px] font-black uppercase text-green-500 tracking-widest mt-1">
|
||||
تایید شده
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="space-y-4">
|
||||
{(profile?.transactions || []).length === 0 ? (
|
||||
<div className="text-center py-20 bg-medical-gray-50 rounded-[2.5rem] border border-dashed border-medical-gray-200">
|
||||
<Info className="w-12 h-12 text-medical-gray-200 mx-auto mb-4" />
|
||||
<p className="text-medical-gray-400 font-bold">تراکنشی یافت نشد.</p>
|
||||
</div>
|
||||
) : (
|
||||
(profile?.transactions || []).map((trx) => (
|
||||
<div key={trx.id} className="p-4 sm:p-6 bg-white border border-medical-gray-100 rounded-[1.5rem] sm:rounded-[2rem] flex flex-col sm:flex-row sm:items-center justify-between gap-4 sm:gap-6 hover:shadow-lg hover:border-canina-blue/10 transition-all group">
|
||||
<div className="flex items-center gap-3 sm:gap-4">
|
||||
<div className={cn(
|
||||
"w-10 h-10 sm:w-12 sm:h-12 rounded-xl sm:rounded-2xl flex items-center justify-center transition-colors flex-shrink-0",
|
||||
trx.type === 'top_up' ? "bg-green-50 text-green-500 group-hover:bg-green-500 group-hover:text-white" : "bg-red-50 text-red-500 group-hover:bg-red-500 group-hover:text-white"
|
||||
)}>
|
||||
{trx.type === 'top_up' ? <ArrowUpCircle className="w-5 h-5 sm:w-6 sm:h-6" /> : <ShoppingCart className="w-5 h-5 sm:w-6 sm:h-6" />}
|
||||
</div>
|
||||
<div className="min-w-0">
|
||||
<div className="text-xs sm:text-sm font-black text-medical-gray-900 truncate">{trx.type === 'top_up' ? "افزایش موجودی (شارژ)" : "پرداخت سفارش"}</div>
|
||||
<div className="text-[10px] font-bold text-medical-gray-400 flex flex-wrap items-center gap-1 sm:gap-2 mt-0.5">
|
||||
<span className="truncate">کد: {trx.id}</span>
|
||||
<span className="w-1 h-1 bg-medical-gray-200 rounded-full hidden sm:inline-block" />
|
||||
<span>{toPersian(new Date(trx.date).toLocaleDateString("fa-IR"))}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="text-right sm:text-left flex sm:flex-col justify-between items-center sm:items-end border-t sm:border-t-0 pt-2 sm:pt-0 border-medical-gray-50">
|
||||
<div className={cn(
|
||||
"text-base sm:text-lg font-black italic",
|
||||
trx.type === 'top_up' ? "text-green-600" : "text-red-500"
|
||||
)}>
|
||||
{trx.type === 'top_up' ? "+" : ""}{toPersian(trx.amount.toLocaleString())} <span className="text-xs not-italic">تومان</span>
|
||||
</div>
|
||||
<div className="text-[9px] font-black uppercase text-green-500 tracking-widest sm:mt-1">
|
||||
تایید شده
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</motion.div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user