bottom tabs refactor

assets/icons/bottom-navigation/globe-solid.svg

@@ -0,0 +1,10 @@
+<svg width="23" height="23" viewBox="0 0 23 23" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2817_21824)">
+<path d="M16 11.8574C16 12.8113 15.9484 13.7309 15.8582 14.6074H7.8918C7.79727 13.7309 7.75 12.8113 7.75 11.8574C7.75 10.9035 7.80156 9.98398 7.8918 9.10742H15.8582C15.9527 9.98398 16 10.9035 16 11.8574ZM17.2375 9.10742H22.527C22.7547 9.98828 22.875 10.9078 22.875 11.8574C22.875 12.807 22.7547 13.7266 22.527 14.6074H17.2375C17.3277 13.7223 17.375 12.8027 17.375 11.8574C17.375 10.9121 17.3277 9.99258 17.2375 9.10742ZM22.0758 7.73242H17.0613C16.6316 4.98672 15.7809 2.68789 14.6852 1.21836C18.0496 2.10781 20.7867 4.54844 22.0715 7.73242H22.0758ZM15.6691 7.73242H8.08086C8.34297 6.16836 8.74687 4.78477 9.24102 3.66328C9.69219 2.64922 10.1949 1.91445 10.6805 1.45039C11.1617 0.994922 11.5613 0.857422 11.875 0.857422C12.1887 0.857422 12.5883 0.994922 13.0695 1.45039C13.5551 1.91445 14.0578 2.64922 14.509 3.66328C15.0074 4.78047 15.407 6.16406 15.6691 7.73242ZM6.68867 7.73242H1.67422C2.96328 4.54844 5.69609 2.10781 9.06484 1.21836C7.96914 2.68789 7.11836 4.98672 6.68867 7.73242ZM1.22305 9.10742H6.5125C6.42227 9.99258 6.375 10.9121 6.375 11.8574C6.375 12.8027 6.42227 13.7223 6.5125 14.6074H1.22305C0.995313 13.7266 0.875 12.807 0.875 11.8574C0.875 10.9078 0.995313 9.98828 1.22305 9.10742ZM9.24102 20.0473C8.74258 18.9301 8.34297 17.5465 8.08086 15.9824H15.6691C15.407 17.5465 15.0031 18.9301 14.509 20.0473C14.0578 21.0613 13.5551 21.7961 13.0695 22.2602C12.5883 22.7199 12.1887 22.8574 11.875 22.8574C11.5613 22.8574 11.1617 22.7199 10.6805 22.2645C10.1949 21.8004 9.69219 21.0656 9.24102 20.0516V20.0473ZM6.68867 15.9824C7.11836 18.7281 7.96914 21.027 9.06484 22.4965C5.69609 21.607 2.96328 19.1664 1.67422 15.9824H6.68867ZM22.0758 15.9824C20.7867 19.1664 18.0539 21.607 14.6895 22.4965C15.7852 21.027 16.6316 18.7281 17.0656 15.9824H22.0758Z"/>
+</g>
+<defs>
+<clipPath id="clip0_2817_21824">
+<rect width="22" height="22" fill="white" transform="translate(0.875 0.857422)"/>
+</clipPath>
+</defs>
+</svg>

assets/icons/bottom-navigation/map.svg

@@ -1,4 +1,10 @@
-<svg width="19" height="22" viewBox="0 0 19 22" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M9.2093 4.86047C6.94879 4.86047 5.11628 6.69297 5.11628 8.95349C5.11628 11.214 6.94879 13.0465 9.2093 13.0465C11.4698 13.0465 13.3023 11.214 13.3023 8.95349C13.3023 6.69297 11.4698 4.86047 9.2093 4.86047ZM7.16279 8.95349C7.16279 7.82323 8.07905 6.90698 9.2093 6.90698C10.3396 6.90698 11.2558 7.82323 11.2558 8.95349C11.2558 10.0837 10.3396 11 9.2093 11C8.07905 11 7.16279 10.0837 7.16279 8.95349Z"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M18.4186 9.2093C18.4186 14.8372 11.2558 22 9.2093 22C7.16279 22 0 14.8372 0 9.2093C0 4.12315 4.12315 0 9.2093 0C14.2955 0 18.4186 4.12315 18.4186 9.2093ZM16.3721 9.2093C16.3721 11.2914 14.9657 14.0204 12.9993 16.417C12.0547 17.5682 11.0699 18.5324 10.2414 19.1883C9.82504 19.5179 9.48419 19.741 9.23696 19.8715L9.2093 19.886L9.18165 19.8715C8.93442 19.741 8.59357 19.5179 8.17725 19.1883C7.34867 18.5324 6.3639 17.5682 5.41931 16.417C3.45291 14.0204 2.04651 11.2914 2.04651 9.2093C2.04651 5.2534 5.2534 2.04651 9.2093 2.04651C13.1652 2.04651 16.3721 5.2534 16.3721 9.2093Z"/>
+<svg width="18" height="23" viewBox="0 0 18 23" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2817_21798)">
+<path d="M9.89336 22.3074C12.0977 19.5488 17.125 12.8629 17.125 9.10742C17.125 4.55273 13.4297 0.857422 8.875 0.857422C4.32031 0.857422 0.625 4.55273 0.625 9.10742C0.625 12.8629 5.65234 19.5488 7.85664 22.3074C8.38516 22.9648 9.36484 22.9648 9.89336 22.3074ZM8.875 6.35742C9.60435 6.35742 10.3038 6.64715 10.8195 7.16288C11.3353 7.6786 11.625 8.37808 11.625 9.10742C11.625 9.83677 11.3353 10.5362 10.8195 11.052C10.3038 11.5677 9.60435 11.8574 8.875 11.8574C8.14565 11.8574 7.44618 11.5677 6.93046 11.052C6.41473 10.5362 6.125 9.83677 6.125 9.10742C6.125 8.37808 6.41473 7.6786 6.93046 7.16288C7.44618 6.64715 8.14565 6.35742 8.875 6.35742Z"/>
+</g>
+<defs>
+<clipPath id="clip0_2817_21798">
+<rect width="16.5" height="22" fill="white" transform="translate(0.625 0.857422)"/>
+</clipPath>
+</defs>
 </svg>

assets/icons/bottom-navigation/messages.svg

@@ -0,0 +1,10 @@
+<svg width="28" height="23" viewBox="0 0 28 23" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2817_21832)">
+<path d="M9.0626 15.9824C13.9997 15.9824 18.0001 12.5965 18.0001 8.41992C18.0001 4.24336 13.9997 0.857422 9.0626 0.857422C4.12549 0.857422 0.125104 4.24336 0.125104 8.41992C0.125104 10.0785 0.756745 11.6125 1.82667 12.8629C1.67628 13.2668 1.45284 13.6234 1.21651 13.9242C1.01026 14.1906 0.799713 14.3969 0.645026 14.5387C0.567682 14.6074 0.503229 14.6633 0.46026 14.6977C0.438776 14.7148 0.421588 14.7277 0.412995 14.732L0.404401 14.7406C0.168073 14.9168 0.0649478 15.2262 0.159479 15.5055C0.25401 15.7848 0.51612 15.9824 0.812604 15.9824C1.74932 15.9824 2.69464 15.7418 3.48096 15.4453C3.87628 15.2949 4.24581 15.1273 4.56807 14.9555C5.88721 15.6086 7.4212 15.9824 9.0626 15.9824ZM19.3751 8.41992C19.3751 13.2453 15.1169 16.8805 10.0724 17.3145C11.1165 20.5113 14.5798 22.8574 18.6876 22.8574C20.329 22.8574 21.863 22.4836 23.1864 21.8305C23.5087 22.0023 23.8739 22.1699 24.2692 22.3203C25.0556 22.6168 26.0009 22.8574 26.9376 22.8574C27.2341 22.8574 27.5005 22.6641 27.5907 22.3805C27.681 22.0969 27.5821 21.7875 27.3415 21.6113L27.3329 21.6027C27.3243 21.5941 27.3071 21.5855 27.2856 21.5684C27.2427 21.534 27.1782 21.4824 27.1009 21.4094C26.9462 21.2676 26.7357 21.0613 26.5294 20.7949C26.2931 20.4941 26.0696 20.1332 25.9192 19.7336C26.9892 18.4875 27.6208 16.9535 27.6208 15.2906C27.6208 11.3031 23.9728 8.0332 19.345 7.74961C19.3622 7.96875 19.3708 8.19219 19.3708 8.41562L19.3751 8.41992Z"/>
+</g>
+<defs>
+<clipPath id="clip0_2817_21832">
+<rect width="27.5" height="22" fill="white" transform="translate(0.125 0.857422)"/>
+</clipPath>
+</defs>
+</svg>

assets/icons/bottom-navigation/profile.svg

@@ -1,4 +1,3 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M11.6449 2.54857C9.53402 2.54857 7.83543 4.25521 7.83543 6.35805C7.83543 8.40528 9.43467 10.0663 11.4538 10.156C11.5762 10.1475 11.7056 10.1471 11.8276 10.1559C13.8448 10.0653 15.445 8.40534 15.4544 6.35647C15.4535 4.25549 13.7461 2.54857 11.6449 2.54857ZM6.28687 6.35805C6.28687 3.40223 8.6765 1 11.6449 1C14.6019 1 17.003 3.40109 17.003 6.35805L17.003 6.36127C16.9909 9.25234 14.7121 11.6087 11.8361 11.7053C11.8017 11.7065 11.7673 11.7054 11.733 11.7019C11.6833 11.697 11.6089 11.6963 11.5395 11.7026C11.5076 11.7055 11.4755 11.7064 11.4434 11.7053C8.56801 11.6087 6.28687 9.25219 6.28687 6.35805Z"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M11.8229 12.5498C13.8135 12.5498 15.8434 13.0494 17.4122 14.0971C18.8223 15.0357 19.6302 16.3514 19.6302 17.7672C19.6302 19.1829 18.8224 20.5009 17.4129 21.4445L17.4127 21.4446C15.8392 22.4975 13.8067 23.0001 11.8151 23.0001C9.82395 23.0001 7.79184 22.4977 6.2184 21.4452C4.80805 20.5067 4 19.1909 4 17.7749C4 16.3592 4.80778 15.0412 6.21733 14.0976L6.22017 14.0957L6.22018 14.0957C7.7981 13.0495 9.83197 12.5498 11.8229 12.5498ZM7.07735 15.3854C5.98959 16.1141 5.54857 16.9946 5.54857 17.7749C5.54857 18.5551 5.9894 19.4329 7.07693 20.1564L7.07863 20.1576C8.3441 21.0043 10.0591 21.4515 11.8151 21.4515C13.571 21.4515 15.286 21.0043 16.5514 20.1577C17.6403 19.4288 18.0817 18.5479 18.0817 17.7672C18.0817 16.987 17.6408 16.1092 16.5533 15.3857L16.5521 15.3849C15.2922 14.5434 13.5798 14.0984 11.8229 14.0984C10.0669 14.0984 8.34866 14.543 7.07735 15.3854Z"/>
+<svg width="20" height="23" viewBox="0 0 20 23" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9.875 11.8574C11.3337 11.8574 12.7326 11.278 13.7641 10.2465C14.7955 9.21506 15.375 7.81611 15.375 6.35742C15.375 4.89873 14.7955 3.49978 13.7641 2.46833C12.7326 1.43688 11.3337 0.857422 9.875 0.857422C8.41631 0.857422 7.01736 1.43688 5.98591 2.46833C4.95446 3.49978 4.375 4.89873 4.375 6.35742C4.375 7.81611 4.95446 9.21506 5.98591 10.2465C7.01736 11.278 8.41631 11.8574 9.875 11.8574ZM7.91133 13.9199C3.67891 13.9199 0.25 17.3488 0.25 21.5812C0.25 22.2859 0.821484 22.8574 1.52617 22.8574H18.2238C18.9285 22.8574 19.5 22.2859 19.5 21.5812C19.5 17.3488 16.0711 13.9199 11.8387 13.9199H7.91133Z"/>
 </svg>

assets/icons/bottom-navigation/travellers.svg

@@ -1,6 +1,10 @@
-<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M7.64491 1.54857C5.53402 1.54857 3.83543 3.25521 3.83543 5.35805C3.83543 7.40528 5.43467 9.06634 7.4538 9.15602C7.57625 9.1475 7.70561 9.14708 7.82765 9.15593C9.84479 9.0653 11.445 7.40534 11.4544 5.35647C11.4535 3.25549 9.74609 1.54857 7.64491 1.54857ZM2.28687 5.35805C2.28687 2.40223 4.6765 0 7.64491 0C10.6019 0 13.003 2.40109 13.003 5.35805L13.003 5.36127C12.9909 8.25234 10.7121 10.6087 7.83611 10.7053C7.80172 10.7065 7.76729 10.7054 7.73305 10.7019C7.68327 10.697 7.60887 10.6963 7.53951 10.7026C7.50756 10.7055 7.47546 10.7064 7.4434 10.7053C4.56801 10.6087 2.28687 8.25219 2.28687 5.35805Z"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M14.5203 2.83898C14.5203 2.41136 14.8669 2.0647 15.2945 2.0647C17.7264 2.0647 19.6822 4.03363 19.6822 6.45231C19.6822 8.82209 17.8021 10.7516 15.4577 10.8394C15.416 10.8409 15.3742 10.8391 15.3327 10.8339C15.3172 10.832 15.2857 10.8308 15.2458 10.8352C14.8208 10.8824 14.438 10.5762 14.3908 10.1511C14.3436 9.72613 14.6498 9.34331 15.0748 9.29609C15.1964 9.28258 15.3238 9.27945 15.4495 9.2896C16.943 9.20773 18.1336 7.96815 18.1336 6.45231C18.1336 4.886 16.8683 3.61327 15.2945 3.61327C14.8669 3.61327 14.5203 3.26661 14.5203 2.83898Z"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M7.82285 11.5498C9.81349 11.5498 11.8434 12.0494 13.4122 13.0971C14.8223 14.0357 15.6302 15.3514 15.6302 16.7672C15.6302 18.1829 14.8224 19.5009 13.4129 20.4445L13.4127 20.4446C11.8392 21.4975 9.80666 22.0001 7.81511 22.0001C5.82395 22.0001 3.79184 21.4977 2.2184 20.4452C0.808052 19.5067 0 18.1909 0 16.7749C0 15.3592 0.807777 14.0412 2.21733 13.0976L2.22017 13.0957L2.22018 13.0957C3.7981 12.0495 5.83197 11.5498 7.82285 11.5498ZM3.07735 14.3854C1.98959 15.1141 1.54857 15.9946 1.54857 16.7749C1.54857 17.5551 1.9894 18.4329 3.07693 19.1564L3.07863 19.1576C4.3441 20.0043 6.05912 20.4515 7.81511 20.4515C9.57103 20.4515 11.286 20.0043 12.5514 19.1577C13.6403 18.4288 14.0817 17.5479 14.0817 16.7672C14.0817 15.987 13.6408 15.1092 12.5533 14.3857L12.5521 14.3849C11.2922 13.5434 9.57976 13.0984 7.82285 13.0984C6.06685 13.0984 4.34866 13.543 3.07735 14.3854Z"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M16.5629 12.9924C16.6569 12.5753 17.0713 12.3133 17.4884 12.4073C18.3034 12.591 19.1033 12.9186 19.778 13.4331C20.7495 14.1628 21.2929 15.1799 21.2929 16.2546C21.2929 17.329 20.7498 18.3458 19.7788 19.0755C19.0959 19.5989 18.2838 19.9402 17.4452 20.1149C17.0265 20.2021 16.6165 19.9335 16.5292 19.5148C16.442 19.0962 16.7107 18.6861 17.1293 18.5989C17.7759 18.4642 18.3665 18.2076 18.8392 17.8446L18.8461 17.8393L18.8461 17.8393C19.4834 17.3613 19.7443 16.7791 19.7443 16.2546C19.7443 15.7301 19.4834 15.1479 18.8461 14.6699L18.8408 14.6659L18.8408 14.6659C18.3805 14.3143 17.7979 14.0644 17.148 13.918C16.7308 13.824 16.4689 13.4096 16.5629 12.9924Z"/>
+<svg width="28" height="23" viewBox="0 0 28 23" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2817_21804)">
+<path d="M6.3125 0.857422C7.22418 0.857422 8.09852 1.21959 8.74318 1.86424C9.38784 2.5089 9.75 3.38324 9.75 4.29492C9.75 5.2066 9.38784 6.08095 8.74318 6.7256C8.09852 7.37026 7.22418 7.73242 6.3125 7.73242C5.40082 7.73242 4.52648 7.37026 3.88182 6.7256C3.23716 6.08095 2.875 5.2066 2.875 4.29492C2.875 3.38324 3.23716 2.5089 3.88182 1.86424C4.52648 1.21959 5.40082 0.857422 6.3125 0.857422ZM22.125 0.857422C23.0367 0.857422 23.911 1.21959 24.5557 1.86424C25.2003 2.5089 25.5625 3.38324 25.5625 4.29492C25.5625 5.2066 25.2003 6.08095 24.5557 6.7256C23.911 7.37026 23.0367 7.73242 22.125 7.73242C21.2133 7.73242 20.339 7.37026 19.6943 6.7256C19.0497 6.08095 18.6875 5.2066 18.6875 4.29492C18.6875 3.38324 19.0497 2.5089 19.6943 1.86424C20.339 1.21959 21.2133 0.857422 22.125 0.857422ZM0.125 13.6922C0.125 11.1613 2.17891 9.10742 4.70977 9.10742H6.54453C7.22773 9.10742 7.87656 9.25781 8.46094 9.52422C8.40508 9.83359 8.3793 10.1559 8.3793 10.4824C8.3793 12.1238 9.10117 13.5977 10.2398 14.6074C10.2312 14.6074 10.2227 14.6074 10.2098 14.6074H1.04023C0.5375 14.6074 0.125 14.1949 0.125 13.6922ZM17.5402 14.6074C17.5316 14.6074 17.523 14.6074 17.5102 14.6074C18.6531 13.5977 19.3707 12.1238 19.3707 10.4824C19.3707 10.1559 19.3406 9.83789 19.2891 9.52422C19.8734 9.25352 20.5223 9.10742 21.2055 9.10742H23.0402C25.5711 9.10742 27.625 11.1613 27.625 13.6922C27.625 14.1992 27.2125 14.6074 26.7098 14.6074H17.5402ZM9.75 10.4824C9.75 9.3884 10.1846 8.33919 10.9582 7.56561C11.7318 6.79202 12.781 6.35742 13.875 6.35742C14.969 6.35742 16.0182 6.79202 16.7918 7.56561C17.5654 8.33919 18 9.3884 18 10.4824C18 11.5764 17.5654 12.6257 16.7918 13.3992C16.0182 14.1728 14.969 14.6074 13.875 14.6074C12.781 14.6074 11.7318 14.1728 10.9582 13.3992C10.1846 12.6257 9.75 11.5764 9.75 10.4824ZM5.625 21.7102C5.625 18.5477 8.19023 15.9824 11.3527 15.9824H16.3973C19.5598 15.9824 22.125 18.5477 22.125 21.7102C22.125 22.3418 21.6137 22.8574 20.9777 22.8574H6.77227C6.14062 22.8574 5.625 22.3461 5.625 21.7102Z"/>
+</g>
+<defs>
+<clipPath id="clip0_2817_21804">
+<rect width="27.5" height="22" fill="white" transform="translate(0.125 0.857422)"/>
+</clipPath>
+</defs>
 </svg>

src/components/TabBarButton/index.tsx

@@ -5,7 +5,7 @@ import { NAVIGATION_PAGES } from '../../types';
 
 import MapIcon from '../../../assets/icons/bottom-navigation/map.svg';
 import TravellersIcon from '../../../assets/icons/bottom-navigation/travellers.svg';
-import GlobeIcon from '../../../assets/icons/bottom-navigation/globe.svg';
+import GlobeIcon from '../../../assets/icons/bottom-navigation/globe-solid.svg';
 import ProfileIcon from '../../../assets/icons/bottom-navigation/profile.svg';
 
 import { Colors } from '../../theme';

src/components/TabBarButton/style.tsx

@@ -1,4 +1,4 @@
-import { StyleSheet } from 'react-native';
+import { StyleSheet, Platform } from 'react-native';
 
 export const styles = StyleSheet.create({
   buttonStyle: {
@@ -6,6 +6,7 @@ export const styles = StyleSheet.create({
     alignItems: 'center',
     justifyContent: 'center',
     overflow: 'hidden',
+    marginTop: Platform.OS === 'ios' ? 8 : 0,
   },
   labelStyle: {
     marginTop: 4,