savsisbtw/nodeshiftmusicburmalda
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

Add files via upload

Browse source
This commit is contained in:
Savsis 2026-04-28 16:54:42 +05:00 • committed by GitHub
parent 81ce3b2271
commit 9fb037a648
13 changed files with 832 additions and 518 deletions
Download patch file Download diff file Expand all files Collapse all files

51
app/(tabs)/_layout.tsx
View file

@ -4,23 +4,26 @@ import { Tabs, router } from 'expo-router';
import { BlurView } from 'expo-blur';
import Svg, { Path, Circle, Line, Polyline } from 'react-native-svg';
import { Colors, TAB_BAR_HEIGHT } from '../../constants/theme';
import { useAuth, usePlayer } from '../../store';
import { useAuth, usePlayer, useLikes } from '../../store';
import MiniPlayer from '../../components/MiniPlayer';
import Player from '../../components/Player';
export default function TabsLayout() {
const { user, ready } = useAuth();
const { expanded } = usePlayer();
const { loadLikes } = useLikes();
useEffect(() => {
if (ready && !user) {
router.replace('/auth');
}
if (ready && !user) router.replace('/auth');
}, [user, ready]);
useEffect(() => {
if (user) loadLikes();
}, [user]);
if (!ready) return (
<View style={{ flex: 1, backgroundColor: Colors.bg, alignItems: 'center', justifyContent: 'center' }}>
<ActivityIndicator color="#1db954" />
<ActivityIndicator color={Colors.accent} />
</View>
);
if (!user) return null;
@ -32,18 +35,19 @@ export default function TabsLayout() {
headerShown: false,
tabBarStyle: styles.tabBar,
tabBarBackground: () => (
<BlurView intensity={80} tint="dark" style={StyleSheet.absoluteFill} />
<BlurView intensity={30} tint="dark" style={StyleSheet.absoluteFill} />
),
tabBarActiveTintColor: Colors.green,
tabBarActiveTintColor: Colors.text,
tabBarInactiveTintColor: Colors.text3,
tabBarLabelStyle: { fontSize: 10, fontWeight: '600', marginBottom: 4 },
tabBarItemStyle: { paddingTop: 8 },
tabBarLabelStyle: { fontSize: 9, fontWeight: '500', letterSpacing: 0.3, marginBottom: 4 },
tabBarItemStyle: { paddingTop: 6 },
}}
>
<Tabs.Screen name="index" options={{ title: 'Главная', tabBarIcon: ({ color }) => <HomeIcon color={color} /> }} />
<Tabs.Screen name="library" options={{ title: 'Библиотека', tabBarIcon: ({ color }) => <LibIcon color={color} /> }} />
<Tabs.Screen name="search" options={{ title: 'Поиск', tabBarIcon: ({ color }) => <SearchIcon color={color} /> }} />
<Tabs.Screen name="profile" options={{ title: 'Профиль', tabBarIcon: ({ color }) => <ProfileIcon color={color} /> }} />
<Tabs.Screen name="index" options={{ title: 'Главная', tabBarIcon: ({ color }) => <HomeIcon color={color} /> }} />
<Tabs.Screen name="library" options={{ title: 'Библиотека', tabBarIcon: ({ color }) => <LibIcon color={color} /> }} />
<Tabs.Screen name="search" options={{ title: 'Поиск', tabBarIcon: ({ color }) => <SearchIcon color={color} /> }} />
<Tabs.Screen name="liked" options={{ title: 'Понравилось', tabBarIcon: ({ color }) => <HeartIcon color={color} /> }} />
<Tabs.Screen name="profile" options={{ title: 'Профиль', tabBarIcon: ({ color }) => <ProfileIcon color={color} /> }} />
</Tabs>
<MiniPlayer />
@ -54,35 +58,39 @@ export default function TabsLayout() {
function HomeIcon({ color }: { color: string }) {
return (
<Svg width={22} height={22} viewBox="0 0 24 24" fill="none">
<Svg width={20} height={20} viewBox="0 0 24 24" fill="none">
<Path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" stroke={color} strokeWidth={1.8} strokeLinecap="round" strokeLinejoin="round" />
<Polyline points="9,22 9,12 15,12 15,22" stroke={color} strokeWidth={1.8} strokeLinecap="round" strokeLinejoin="round" />
</Svg>
);
}
function LibIcon({ color }: { color: string }) {
return (
<Svg width={22} height={22} viewBox="0 0 24 24" fill="none">
<Svg width={20} height={20} viewBox="0 0 24 24" fill="none">
<Path d="M9 18V5l12-2v13" stroke={color} strokeWidth={1.8} strokeLinecap="round" />
<Circle cx={6} cy={18} r={3} stroke={color} strokeWidth={1.8} />
<Circle cx={18} cy={16} r={3} stroke={color} strokeWidth={1.8} />
</Svg>
);
}
function SearchIcon({ color }: { color: string }) {
return (
<Svg width={22} height={22} viewBox="0 0 24 24" fill="none">
<Svg width={20} height={20} viewBox="0 0 24 24" fill="none">
<Circle cx={11} cy={11} r={8} stroke={color} strokeWidth={1.8} />
<Line x1="21" y1="21" x2="16.65" y2="16.65" stroke={color} strokeWidth={1.8} strokeLinecap="round" />
</Svg>
);
}
function HeartIcon({ color }: { color: string }) {
return (
<Svg width={20} height={20} viewBox="0 0 24 24" fill="none">
<Path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z" stroke={color} strokeWidth={1.8} strokeLinecap="round" strokeLinejoin="round" />
</Svg>
);
}
function ProfileIcon({ color }: { color: string }) {
return (
<Svg width={22} height={22} viewBox="0 0 24 24" fill="none">
<Svg width={20} height={20} viewBox="0 0 24 24" fill="none">
<Path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2" stroke={color} strokeWidth={1.8} strokeLinecap="round" />
<Circle cx={12} cy={7} r={4} stroke={color} strokeWidth={1.8} />
</Svg>
@ -92,7 +100,8 @@ function ProfileIcon({ color }: { color: string }) {
const styles = StyleSheet.create({
tabBar: {
position: 'absolute',
borderTopWidth: 0,
borderTopWidth: StyleSheet.hairlineWidth,
borderTopColor: 'rgba(255,255,255,0.08)',
backgroundColor: 'transparent',
elevation: 0,
height: TAB_BAR_HEIGHT,