65 lines
1.6 KiB
TypeScript
65 lines
1.6 KiB
TypeScript
import { Tabs } from 'expo-router';
|
|
import React from 'react';
|
|
import { Image } from 'expo-image';
|
|
|
|
import { HapticTab } from '@/components/haptic-tab';
|
|
import { useAuth } from '@/hooks/use-auth';
|
|
|
|
export default function TabLayout() {
|
|
const { isAuthenticated, isLoading } = useAuth();
|
|
|
|
if (isLoading) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<Tabs
|
|
screenOptions={{
|
|
tabBarActiveTintColor: '#FFFFFF',
|
|
headerShown: false,
|
|
tabBarButton: HapticTab,
|
|
tabBarStyle: {
|
|
backgroundColor: '#050505',
|
|
borderTopColor: '#1a1a1a',
|
|
},
|
|
}}>
|
|
<Tabs.Screen
|
|
name="home"
|
|
options={{
|
|
title: 'Home',
|
|
tabBarIcon: ({ focused }) => (
|
|
<Image
|
|
source={require('@/assets/images/home.png')}
|
|
style={{ width: 28, height: 28, opacity: focused ? 1 : 0.5 }}
|
|
/>
|
|
),
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="history"
|
|
options={{
|
|
title: 'Content',
|
|
tabBarIcon: ({ focused }) => (
|
|
<Image
|
|
source={require('@/assets/images/content.png')}
|
|
style={{ width: 28, height: 28, opacity: focused ? 1 : 0.5 }}
|
|
/>
|
|
),
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="profile"
|
|
options={{
|
|
title: 'Profile',
|
|
tabBarIcon: ({ focused }) => (
|
|
<Image
|
|
source={require('@/assets/images/user.png')}
|
|
style={{ width: 28, height: 28, opacity: focused ? 1 : 0.5 }}
|
|
/>
|
|
),
|
|
}}
|
|
/>
|
|
</Tabs>
|
|
);
|
|
}
|