From a025ac34d7772ac91a84ac3e88abbbcdd9261466 Mon Sep 17 00:00:00 2001
From: "pramod.mahajan" <pramod.mahajan@marcoaiot.com>
Date: Fri, 31 Oct 2025 10:07:01 +0530
Subject: [PATCH]  added default "Select Organization Size" option and improve
 select safety with optional chaining

---
 .../UserSubscription/SubscriptionForm.jsx     | 25 +++++++++++++------
 1 file changed, 18 insertions(+), 7 deletions(-)

diff --git a/src/components/UserSubscription/SubscriptionForm.jsx b/src/components/UserSubscription/SubscriptionForm.jsx
index bada7426..8b5c1607 100644
--- a/src/components/UserSubscription/SubscriptionForm.jsx
+++ b/src/components/UserSubscription/SubscriptionForm.jsx
@@ -159,6 +159,7 @@ const SubscriptionForm = ({ currentStep, setCurrentStep, setStepStatus }) => {
                     <Label htmlFor="organizationSize" required>
                       Organization Size
                     </Label>
+
                     <select
                       id="organizationSize"
                       className="form-select shadow-none border py-1 px-2"
@@ -167,12 +168,14 @@ const SubscriptionForm = ({ currentStep, setCurrentStep, setStepStatus }) => {
                         required: "Organization size is required",
                       })}
                     >
-                      {orgSize.map((org) => (
+                      <option value="">Select Organization Size</option>
+                      {orgSize?.map((org) => (
                         <option key={org.val} value={org.val}>
                           {org.name}
                         </option>
                       ))}
                     </select>
+
                     {errors.organizationSize && (
                       <div className="danger-text">
                         {errors.organizationSize.message}
@@ -193,13 +196,17 @@ const SubscriptionForm = ({ currentStep, setCurrentStep, setStepStatus }) => {
                       {industryLoading ? (
                         <option value="">Loading...</option>
                       ) : (
-                        data?.map((indu) => (
-                          <option key={indu.id} value={indu.id}>
-                            {indu.name}
-                          </option>
-                        ))
+                        <>
+                          <option value="">Select Industry</option>
+                          {data?.map((indu) => (
+                            <option key={indu.id} value={indu.id}>
+                              {indu.name}
+                            </option>
+                          ))}
+                        </>
                       )}
                     </select>
+
                     {errors.industryId && (
                       <div className="danger-text">
                         {errors.industryId.message}
@@ -217,6 +224,7 @@ const SubscriptionForm = ({ currentStep, setCurrentStep, setStepStatus }) => {
                       className="form-select shadow-none border py-1 px-2 small"
                       {...register("reference")}
                     >
+                      <option value="">Select Reference</option>
                       {reference.map((org) => (
                         <option key={org.val} value={org.val}>
                           {org.name}
@@ -237,7 +245,10 @@ const SubscriptionForm = ({ currentStep, setCurrentStep, setStepStatus }) => {
                     className="btn btn-label-primary d-flex align-items-center me-2"
                   >
                     {isPending ? (
-                      <span><i className='bx bx-loader-alt bx-md bx-spin me-2'></i>Please Wait...</span>
+                      <span>
+                        <i className="bx bx-loader-alt bx-md bx-spin me-2"></i>
+                        Please Wait...
+                      </span>
                     ) : (
                       <>
                         <span className="me-1">Next</span>