@@ -28,6 +28,7 @@ import logger from '../../../../../logger.config.mjs';
2828
2929const SellerRegistrationForm = ( ) => {
3030 const HEADER = 'font-bold text-lg md:text-2xl' ;
31+ const SUBHEADER = 'font-bold mb-2' ;
3132 const router = useRouter ( ) ;
3233 const t = useTranslations ( ) ;
3334 const placeholderSeller = itemData . seller ;
@@ -264,8 +265,52 @@ const SellerRegistrationForm = () => {
264265 </ div >
265266
266267 < div className = "mb-4" >
268+ < h2 className = { SUBHEADER } >
269+ { t ( 'SCREEN.SELLER_REGISTRATION.SELLER_DETAILS_LABEL' ) }
270+ </ h2 >
271+ < p className = 'text-gray-400 text-sm' > { t ( 'SCREEN.SELLER_REGISTRATION.SELLER_DETAILS_PLACEHOLDER' ) } </ p >
272+ < div className = "mb-2" >
273+ < TextArea
274+ name = "sellerDescription"
275+ value = { formData . sellerDescription }
276+ onChange = { handleChange }
277+ styles = { { height : '200px' } }
278+ />
279+ </ div >
280+ </ div >
281+ < Link
282+ href = { {
283+ pathname : "/map-center" , // Path to MapCenter component
284+ query : { entryType : 'sell' } // Passing 'sell' as entryType
285+ } }
286+ >
287+ < Button
288+ label = { t ( 'SCREEN.SELLER_REGISTRATION.SELLER_SELL_CENTER' ) }
289+ styles = { {
290+ color : '#ffc153' ,
291+ height : '40px' ,
292+ padding : '10px' ,
293+ marginLeft : 'auto' ,
294+ } }
295+ />
296+ </ Link >
297+ < div className = "mb-4 mt-3 ml-auto w-min" >
298+ < Button
299+ label = { t ( 'SHARED.SAVE' ) }
300+ disabled = { ! isSaveEnabled }
301+ styles = { {
302+ color : '#ffc153' ,
303+ height : '40px' ,
304+ padding : '10px 15px' ,
305+ } }
306+ onClick = { handleSave }
307+ />
308+ </ div >
309+
310+ < div className = 'spacing-7' >
267311 { /* seller registration form fields toggle */ }
268- < ToggleCollapse header = { t ( 'SCREEN.SELLER_REGISTRATION.SELLER_SETTINGS_LABEL' ) }
312+ < ToggleCollapse
313+ header = { t ( 'SCREEN.SELLER_REGISTRATION.SELLER_ADVANCED_SETTINGS_LABEL' ) }
269314 open = { true } >
270315 < div className = "mb-4" >
271316 < Input
@@ -290,32 +335,6 @@ const SellerRegistrationForm = () => {
290335 value = { formData . sellerAddress }
291336 onChange = { handleChange }
292337 />
293- < Link
294- href = { {
295- pathname : "/map-center" , // Path to MapCenter component
296- query : { entryType : 'sell' } // Passing 'sell' as entryType
297- } }
298- >
299- < Button
300- label = { t ( 'SCREEN.SELLER_REGISTRATION.SELLER_SELL_CENTER' ) }
301- styles = { {
302- color : '#ffc153' ,
303- height : '40px' ,
304- padding : '10px' ,
305- marginLeft : 'auto' ,
306- } }
307- />
308- </ Link >
309- < div className = "mb-2 mt-4" >
310- < TextArea
311- label = { t ( 'SCREEN.SELLER_REGISTRATION.SELLER_DETAILS_PLACEHOLDER' ) }
312- describe = { t ( 'SCREEN.SELLER_REGISTRATION.SELLER_DETAILS_PLACEHOLDER' ) }
313- name = "sellerDescription"
314- value = { formData . sellerDescription }
315- onChange = { handleChange }
316- styles = { { height : '200px' } }
317- />
318- </ div >
319338 </ div >
320339 < div className = "mb-4" >
321340 < FileInput
@@ -337,9 +356,7 @@ const SellerRegistrationForm = () => {
337356 />
338357 </ div >
339358 </ ToggleCollapse >
340- </ div >
341359
342- < div className = 'spacing-7' >
343360 { /* seller review toggle */ }
344361 < ToggleCollapse
345362 header = { t ( 'SCREEN.SELLER_REGISTRATION.REVIEWS_SUMMARY_LABEL' ) }
@@ -367,10 +384,10 @@ const SellerRegistrationForm = () => {
367384 </ div >
368385 </ ToggleCollapse >
369386
370- { /* user settings info toggle */ }
387+ { /* contact details info toggle */ }
371388 < ToggleCollapse
372389 header = { t ( 'SCREEN.BUY_FROM_SELLER.SELLER_CONTACT_DETAILS_LABEL' ) }
373- open = { false } >
390+ open = { false } >
374391 < div className = "text-sm mb-3" >
375392 < span className = "font-bold" >
376393 { t ( 'SHARED.USER_INFORMATION.PI_USERNAME_LABEL' ) + ': ' }
@@ -395,6 +412,18 @@ const SellerRegistrationForm = () => {
395412 </ span >
396413 < span > { userSettings ? userSettings . email : "" } </ span >
397414 </ div >
415+ < div className = "mb-4 mt-3 ml-auto w-min" >
416+ < Button
417+ label = { t ( 'SHARED.SAVE' ) }
418+ disabled = { ! isSaveEnabled }
419+ styles = { {
420+ color : '#ffc153' ,
421+ height : '40px' ,
422+ padding : '10px 15px' ,
423+ } }
424+ onClick = { handleSave }
425+ />
426+ </ div >
398427 </ ToggleCollapse >
399428
400429 </ div >
0 commit comments