made url name a required payload

src/component/profile_complete/ProfileCompleteCom.jsx

@@ -56,8 +56,8 @@ export default function ProfileCompleteCom() {
     const mutation = useMutation({
         mutationFn: (fields) => {
             const {practice, specialization} = fields
-            if (!practice || !specialization) {
-                throw new Error('Please select both practice and specialization fields')
+            if (!practice || !specialization || !url_name) {
+                throw new Error('Please select both practice, specialization fields and URL_Name')
             }
             return completeProfile(fields)
         },
@@ -200,7 +200,7 @@ export default function ProfileCompleteCom() {
                                             <div className="form-group position-relative">
                                                 <label className={`text-black fw-bold control-label`}>Other General
                                                     Information :</label>
-                                                <textarea name='introduction' rows={10} style={{resize: 'none'}}
+                                                <textarea name='introduction' rows={5} style={{resize: 'none'}}
                                                           className="form-control" value={initialValues.introduction}
                                                           onChange={handlePracticeChange}/>
                                             </div>
@@ -210,8 +210,15 @@ export default function ProfileCompleteCom() {
                                             <div className="form-group position-relativ'e">
                                                 {/*<label className={`text-black fw-bold control-label`}>What we use this*/}
                                                 {/*    information for :</label>*/}
-                                                <div style={{fontSize: '14px', borderRadius: '10px', backgroundColor: 'aliceblue', fontWeight:'bolder', padding: '15px' }}>
-                                                    MERMS A.I. agents use the information supplied to help generate useful entries for your product settings.
+                                                <div style={{
+                                                    fontSize: '14px',
+                                                    borderRadius: '10px',
+                                                    backgroundColor: 'aliceblue',
+                                                    fontWeight: 'bolder',
+                                                    padding: '15px'
+                                                }}>
+                                                    MERMS A.I. agents use the information supplied to help generate
+                                                    useful entries for your product settings.
                                                 </div>
                                             </div>
                                         </div>
@@ -219,7 +226,7 @@ export default function ProfileCompleteCom() {
                                         <div className="">
                                             <div className="form-group position-relative">
                                                 <label className={`text-black fw-bold control-label`}>URL Name :</label>
-                                                <div className="position-relative d-xxl-flex" style={{gap: '10px'}}>
+                                                <div className="position-relative d-flex flex-column flex-xxl-row" style={{gap: '10px'}}>
                                                     {/* <select onChange={handlePracticeChange} name='url_name'
                                                             value={initialValues.url_name} className="form-control">
                                                         <option value=''>Select</option>
@@ -233,13 +240,20 @@ export default function ProfileCompleteCom() {
                                                         right: '2px',
                                                         transform: 'translateY(-50%)'
                                                     }}/> */}
-                                                    <input 
-                                                        className="form-control" 
+                                                    <input
+                                                        className="form-control"
                                                         onChange={handlePracticeChange} name='url_name'
-                                                        value={initialValues.url_name} 
+                                                        value={initialValues.url_name}
+                                                        minLength={6}
+                                                        maxLength={16}
                                                     />
-                                                    <p className="border-radius-10 p-2 border border-warning">We use the URL Name to form part of your default URL when we configure
-                                                        a new URL for your products. You can always change your product URL
+                                                    <p className="border-radius-10 p-2 border border-warning"
+                                                       style={{fontSize: "1.0rem"}}>We use the URL Name to form part of
+                                                        your default URL when we configure
+                                                        a new URL for your products. You can always change your product
+                                                        URL. <br/>
+                                                        <b>Example : <span style={{color: 'red'}}>url_name</span>.product.mermsemr.com
+                                                        </b>
                                                     </p>
                                                 </div>
                                             </div>