feat: add calendar date picker, nav icons, and input-focused keyboard scrolling

src/components/BottomTab.js

@@ -1,13 +1,14 @@
 import React from 'react';
 import { Pressable, Text, View } from 'react-native';
+import Ionicons from '@expo/vector-icons/Ionicons';
 import { styles } from '../styles';
 
 export default function BottomTab({ current, onChange }) {
   const tabs = [
-    { key: 'trips', label: 'Trips' },
-    { key: 'items', label: 'Items' },
-    { key: 'checkup', label: 'Check-Up' },
-    { key: 'history', label: 'History' },
+    { key: 'trips', label: 'Trips', icon: 'airplane-outline', iconActive: 'airplane' },
+    { key: 'items', label: 'Items', icon: 'briefcase-outline', iconActive: 'briefcase' },
+    { key: 'checkup', label: 'Check-Up', icon: 'checkmark-circle-outline', iconActive: 'checkmark-circle' },
+    { key: 'history', label: 'History', icon: 'time-outline', iconActive: 'time' },
   ];
 
   return (
@@ -17,7 +18,11 @@ export default function BottomTab({ current, onChange }) {
           const active = current === tab.key;
           return (
             <Pressable key={tab.key} onPress={() => onChange(tab.key)} style={styles.tabItem}>
-              <View style={[styles.tabDot, active && styles.tabDotActive]} />
+              <Ionicons
+                name={active ? tab.iconActive : tab.icon}
+                size={18}
+                color={active ? '#dbeafe' : '#94a3b8'}
+              />
               <Text style={[styles.tabLabel, active && styles.tabLabelActive]}>{tab.label}</Text>
             </Pressable>
           );