<div style={{position:'relative'}} className='col-lg-6'>
<span className='switch_destination'><Link onClick={toogleDestination} to=''> <PiArrowsLeftRight/></Link></span>
<div className='row g-0'>
<div className='col-lg-6'>
<AirportContainer
Source={'From'}
icon={
<svg
xmlns="http://www.w3.org/2000/svg"
width="27"
viewBox="0 0 640 512"
>
<path d="M381 114.9L186.1 41.8c-16.7-6.2-35.2-5.3-51.1 2.7L89.1 67.4C78 73 77.2 88.5 87.6 95.2l146.9 94.5L136 240 77.8 214.1c-8.7-3.9-18.8-3.7-27.3 .6L18.3 230.8c-9.3 4.7-11.8 16.8-5 24.7l73.1 85.3c6.1 7.1 15 11.2 24.3 11.2H248.4c5 0 9.9-1.2 14.3-3.4L535.6 212.2c46.5-23.3 82.5-63.3 100.8-112C645.9 75 627.2 48 600.2 48H542.8c-20.2 0-40.2 4.8-58.2 14L381 114.9zM0 480c0 17.7 14.3 32 32 32H608c17.7 0 32-14.3 32-32s-14.3-32-32-32H32c-17.7 0-32 14.3-32 32z" />
</svg>
}
onAirportSelect={handleAirportSelectFrom}
airportPayload={
searchPayload?.segments && searchPayload?.segments[0].origin
}
/>
</div>
<div className='col-lg-6'>
<AirportContainer
Source={'To'}
icon={
<svg
xmlns="http://www.w3.org/2000/svg"
width="27"
viewBox="0 0 640 512"
>
<path d="M381 114.9L186.1 41.8c-16.7-6.2-35.2-5.3-51.1 2.7L89.1 67.4C78 73 77.2 88.5 87.6 95.2l146.9 94.5L136 240 77.8 214.1c-8.7-3.9-18.8-3.7-27.3 .6L18.3 230.8c-9.3 4.7-11.8 16.8-5 24.7l73.1 85.3c6.1 7.1 15 11.2 24.3 11.2H248.4c5 0 9.9-1.2 14.3-3.4L535.6 212.2c46.5-23.3 82.5-63.3 100.8-112C645.9 75 627.2 48 600.2 48H542.8c-20.2 0-40.2 4.8-58.2 14L381 114.9zM0 480c0 17.7 14.3 32 32 32H608c17.7 0 32-14.3 32-32s-14.3-32-32-32H32c-17.7 0-32 14.3-32 32z" />
</svg>
}
onAirportSelect={handleAirportSelectTo}
airportPayload={
searchPayload?.segments &&
searchPayload?.segments[0].destination
}
/>
</div>
</div>
</div>
</div>