From c83aa690d0f0aa492d095eb49de5f668ba42c587 Mon Sep 17 00:00:00 2001
From: sazzadulalambd <sazzad.sua@gmail.com>
Date: Tue, 5 May 2026 01:47:27 +0600
Subject: [PATCH] feat: add merchant entity type with dedicated company
 information and rider request steps to KYC form

---
 src/app/admin/kyc/page.tsx | 231 ++++++++++++++++++++++++++++++-------
 1 file changed, 191 insertions(+), 40 deletions(-)

diff --git a/src/app/admin/kyc/page.tsx b/src/app/admin/kyc/page.tsx
index c55e878..42ad76b 100644
--- a/src/app/admin/kyc/page.tsx
+++ b/src/app/admin/kyc/page.tsx
@@ -1136,6 +1136,7 @@ function NewApplicationModal({ isOpen, onClose, onSave }: { isOpen: boolean; onC
     scheduleDate: string;
     investmentPlan: { planName: string; planType: string; bikes: number; amount: number; monthlyReturn: number; expectedROI: number };
     swapStationPlan: { planType: string; cabinets: number; amount: number; batteries: number; monthlyRent: number };
+    merchantPlan: { companyCategory: string; bikersRequested: number; amount: number; monthlyBudget: number; requiredArea: string };
     requiredDocuments: Document[];
   }>({
     applicationSource: 'walkin',
@@ -1168,6 +1169,7 @@ function NewApplicationModal({ isOpen, onClose, onSave }: { isOpen: boolean; onC
     scheduleDate: '',
     investmentPlan: { planName: '', planType: '', bikes: 1, amount: 0, monthlyReturn: 0, expectedROI: 0 },
     swapStationPlan: { planType: '', cabinets: 8, amount: 0, batteries: 0, monthlyRent: 0 },
+    merchantPlan: { companyCategory: '', bikersRequested: 0, amount: 0, monthlyBudget: 0, requiredArea: '' },
     requiredDocuments: [],
   });
 
@@ -1940,49 +1942,118 @@ function NewApplicationModal({ isOpen, onClose, onSave }: { isOpen: boolean; onC
                     </div>
                   </div>
                 </div>
-              ) : (
-                <div className="bg-purple-50/80 p-4 rounded-xl border border-purple-100">
-                  <h4 className="font-semibold text-purple-900 mb-3 flex items-center gap-2 text-sm">
-                    <Briefcase className="w-4 h-4" /> Business Information
-                  </h4>
-                  <div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
-                    <div>
-                      <label className="text-xs font-medium text-slate-600 mb-1 block">Business Name</label>
-                      <input
-                        type="text"
-                        value={formData.employmentInfo.company}
-                        onChange={(e) => updateField('employmentInfo.company', e.target.value)}
-                        className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm"
-                        placeholder="Your business name"
-                      />
-                    </div>
-                    <div>
-                      <label className="text-xs font-medium text-slate-600 mb-1 block">Monthly Income (Tk)</label>
-                      <input
-                        type="number"
-                        value={formData.employmentInfo.monthlyEarning}
-                        onChange={(e) => updateField('employmentInfo.monthlyEarning', Number(e.target.value))}
-                        className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm"
-                        placeholder="0"
-                      />
-                    </div>
-                    <div className="sm:col-span-2">
-                      <label className="text-xs font-medium text-slate-600 mb-1 block">Nature of Business</label>
-                      <input
-                        type="text"
-                        value={formData.employmentInfo.whyEV}
-                        onChange={(e) => updateField('employmentInfo.whyEV', e.target.value)}
-                        className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm"
-                        placeholder="e.g., retail, wholesale, e-commerce"
-                      />
-                    </div>
-                  </div>
-                </div>
-              )}
+              ) : null}
             </div>
           )}
 
-          {(step === 3 && (formData.type === 'biker' || formData.type === 'investor' || formData.type === 'swapstation')) && (
+          {(step === 2 && formData.type === 'merchant') && (
+            <div className="space-y-5">
+              <div className="bg-purple-50/80 p-4 rounded-xl border border-purple-100">
+                <h4 className="font-semibold text-purple-900 mb-3 flex items-center gap-2 text-sm">
+                  <Briefcase className="w-4 h-4" /> Company Information (Merchant)
+                </h4>
+                <div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
+                  <div>
+                    <label className="text-xs font-medium text-slate-600 mb-1 block">Company Name</label>
+                    <input
+                      type="text"
+                      value={formData.employmentInfo.company}
+                      onChange={(e) => updateField('employmentInfo.company', e.target.value)}
+                      className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm"
+                      placeholder="e.g., Foodpanda, Uber, Pathao"
+                    />
+                  </div>
+                  <div>
+                    <label className="text-xs font-medium text-slate-600 mb-1 block">Company Phone</label>
+                    <input
+                      type="text"
+                      value={formData.phone}
+                      onChange={(e) => updateField('phone', e.target.value)}
+                      className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm"
+                      placeholder="01XXXXXXXXX"
+                    />
+                  </div>
+                  <div>
+                    <label className="text-xs font-medium text-slate-600 mb-1 block">Company Email</label>
+                    <input
+                      type="email"
+                      value={formData.email}
+                      onChange={(e) => updateField('email', e.target.value)}
+                      className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm"
+                      placeholder="company@email.com"
+                    />
+                  </div>
+                  <div>
+                    <label className="text-xs font-medium text-slate-600 mb-1 block">Trade License Number</label>
+                    <input
+                      type="text"
+                      value={formData.nid}
+                      onChange={(e) => updateField('nid', e.target.value)}
+                      className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm"
+                      placeholder="Trade license number"
+                    />
+                  </div>
+                  <div>
+                    <label className="text-xs font-medium text-slate-600 mb-1 block">TIN Number</label>
+                    <input
+                      type="text"
+                      value={formData.passport}
+                      onChange={(e) => updateField('passport', e.target.value)}
+                      className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm"
+                      placeholder="TIN number"
+                    />
+                  </div>
+                  <div>
+                    <label className="text-xs font-medium text-slate-600 mb-1 block">Monthly Revenue (Tk)</label>
+                    <input
+                      type="number"
+                      value={formData.employmentInfo.monthlyEarning}
+                      onChange={(e) => updateField('employmentInfo.monthlyEarning', Number(e.target.value))}
+                      className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm"
+                      placeholder="0"
+                    />
+                  </div>
+                  <div className="sm:col-span-2">
+                    <label className="text-xs font-medium text-slate-600 mb-1 block">Company Address</label>
+                    <input
+                      type="text"
+                      value={formData.presentAddress.line1}
+                      onChange={(e) => updateField('presentAddress.line1', e.target.value)}
+                      className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm"
+                      placeholder="Company headquarters address"
+                    />
+                  </div>
+                  <div className="sm:col-span-2">
+                    <label className="text-xs font-medium text-slate-600 mb-1 block">Delivery Platform</label>
+                    <select
+                      value={formData.employmentInfo.whyEV}
+                      onChange={(e) => updateField('employmentInfo.whyEV', e.target.value)}
+                      className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm bg-white"
+                    >
+                      <option value="">Select Platform</option>
+                      <option value="Foodpanda">Foodpanda</option>
+                      <option value="Uber">Uber</option>
+                      <option value="Pathao">Pathao</option>
+                      <option value="SSL Commercial">SSL Commercial</option>
+                      <option value="Others">Others</option>
+                    </select>
+                  </div>
+                  <div className="sm:col-span-2">
+                    <label className="text-xs font-medium text-slate-600 mb-1 block">Company Description</label>
+                    <textarea
+                      value={formData.employmentInfo.experience}
+                      onChange={(e) => updateField('employmentInfo.experience', e.target.value)}
+                      className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm"
+                      rows={3}
+                      placeholder="Describe your company business..."
+                    />
+                  </div>
+                </div>
+              </div>
+            </div>
+          )}
+
+          {(step === 3 && (formData.type === 'biker' || formData.type === 'investor' || formData.type === 'swapstation' || formData.type === 'merchant')) && (
             <div className="space-y-5">
               <div className="bg-pink-50/80 p-4 rounded-xl border border-pink-100">
                 <h4 className="font-semibold text-pink-900 mb-3 flex items-center gap-2 text-sm">
@@ -2367,6 +2438,86 @@ function NewApplicationModal({ isOpen, onClose, onSave }: { isOpen: boolean; onC
             </div>
           )}
 
+          {step === 4 && formData.type === 'merchant' && (
+            <div className="space-y-5">
+              <div className="bg-amber-50/80 p-4 rounded-xl border border-amber-100">
+                <h4 className="font-semibold text-amber-900 mb-3 flex items-center gap-2 text-sm">
+                  <Users className="w-4 h-4" /> Rider Request Plan
+                </h4>
+                <div className="grid grid-cols-1 sm:grid-cols-3 gap-3 mb-4">
+                  {[
+                    { v: 5, l: '5 Riders', d: 'Request for 5 bikers' },
+                    { v: 10, l: '10 Riders', d: 'Request for 10 bikers' },
+                    { v: 20, l: '20 Riders', d: 'Request for 20 bikers' },
+                    { v: 50, l: '50 Riders', d: 'Request for 50 bikers' },
+                    { v: 100, l: '100 Riders', d: 'Request for 100 bikers' },
+                  ].map(plan => (
+                    <button
+                      key={plan.v}
+                      onClick={() => updateField('merchantPlan.bikersRequested', plan.v)}
+                      className={`p-4 rounded-lg border text-left transition-all ${formData.merchantPlan.bikersRequested === plan.v
+                        ? 'border-accent bg-accent/10 ring-1 ring-accent'
+                        : 'border-slate-200 bg-white hover:border-accent'
+                        }`}
+                    >
+                      <Users className={`w-5 h-5 mb-2 ${formData.merchantPlan.bikersRequested === plan.v ? 'text-accent' : 'text-slate-400'}`} />
+                      <p className="text-sm font-semibold text-slate-800">{plan.l}</p>
+                      <p className="text-xs text-slate-500">{plan.d}</p>
+                    </button>
+                  ))}
+                </div>
+                <div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
+                  <div>
+                    <label className="text-xs font-medium text-slate-600 mb-1 block">Company Category</label>
+                    <select
+                      value={formData.merchantPlan.companyCategory}
+                      onChange={(e) => updateField('merchantPlan.companyCategory', e.target.value)}
+                      className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm bg-white"
+                    >
+                      <option value="">Select Category</option>
+                      <option value="Food Delivery">Food Delivery</option>
+                      <option value="Parcel Delivery">Parcel Delivery</option>
+                      <option value="E-commerce">E-commerce</option>
+                      <option value="Logistics">Logistics</option>
+                      <option value="Quick Commerce">Quick Commerce</option>
+                      <option value="Others">Others</option>
+                    </select>
+                  </div>
+                  <div>
+                    <label className="text-xs font-medium text-slate-600 mb-1 block">Required Area/Zone</label>
+                    <input
+                      type="text"
+                      value={formData.merchantPlan.requiredArea}
+                      onChange={(e) => updateField('merchantPlan.requiredArea', e.target.value)}
+                      className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm"
+                      placeholder="e.g., Dhaka, Chattogram"
+                    />
+                  </div>
+                  <div>
+                    <label className="text-xs font-medium text-slate-600 mb-1 block">Investment Amount (Tk)</label>
+                    <input
+                      type="number"
+                      value={formData.merchantPlan.amount}
+                      onChange={(e) => updateField('merchantPlan.amount', Number(e.target.value))}
+                      className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm"
+                      placeholder="0"
+                    />
+                  </div>
+                  <div>
+                    <label className="text-xs font-medium text-slate-600 mb-1 block">Monthly Budget (Tk)</label>
+                    <input
+                      type="number"
+                      value={formData.merchantPlan.monthlyBudget}
+                      onChange={(e) => updateField('merchantPlan.monthlyBudget', Number(e.target.value))}
+                      className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm"
+                      placeholder="0"
+                    />
+                  </div>
+                </div>
+              </div>
+            </div>
+          )}
+
           {step === 5 && (
             <div className="space-y-5">
               <div className="bg-green-50/80 p-4 rounded-xl border border-green-100">