shawon/JML
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add profile image support and upload functionality to biker profiles

Browse Source
This commit is contained in:
sazzadulalambd
2026-05-13 02:18:22 +06:00
parent 5aecfc061b
commit aa7cb65cf8
2 changed files with 47 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/app/admin/bikers/[id]/page.tsx
View File

@@ -265,6 +265,7 @@ interface Biker {
rating: number;
totalRatings: number;
depositAmount: number;
profileImage?: string;
role: string;
totalRentals: number;
activeRentals: number;
@@ -286,6 +287,7 @@ const mockBiker: Biker = {
rating: 4.8,
totalRatings: 156,
depositAmount: 5000,
profileImage: 'https://picsum.photos/200/200?random=profile',
kyc: {
fullName: 'Mohammad Rafiqul Islam',
phone: '01712345678',
@@ -862,8 +864,18 @@ export default function BikerDetailPage() {
<div className="bg-white rounded-xl shadow-sm border border-slate-100 overflow-hidden mb-4">
<div className="p-4 lg:p-6 flex flex-col lg:flex-row lg:items-center gap-4">
<div className="w-20 h-20 rounded-full bg-blue-100 flex items-center justify-center">
<span className="text-3xl font-bold text-blue-600">{biker.kyc.fullName.charAt(0)}</span>
<div className="relative group">
{biker.profileImage ? (
<img src={biker.profileImage} alt={biker.kyc.fullName} className="w-20 h-20 rounded-full object-cover border-2 border-slate-200" />
) : (
<div className="w-20 h-20 rounded-full bg-blue-100 flex items-center justify-center border-2 border-slate-200">
<span className="text-3xl font-bold text-blue-600">{biker.kyc.fullName.charAt(0)}</span>
</div>
)}
<label className="absolute bottom-0 right-0 w-7 h-7 bg-blue-600 rounded-full flex items-center justify-center cursor-pointer opacity-0 group-hover:opacity-100 transition-opacity shadow-sm border-2 border-white">
<Camera className="w-3.5 h-3.5 text-white" />
<input type="file" accept="image/*" className="hidden" onChange={(e) => { toast.success('Profile image updated'); }} />
</label>
</div>
<div className="flex-1">
<div className="flex items-center gap-2">