81 lines
2.3 KiB
TypeScript
81 lines
2.3 KiB
TypeScript
import React, { useState, useCallback } from 'react';
|
|
import { View, ScrollView, RefreshControl, StyleSheet } from 'react-native';
|
|
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
|
import { Colors, Spacing } from '@/constants/theme';
|
|
import StatusBanner from '@/components/dashboard/StatusBanner';
|
|
import PortfolioHeroCard from '@/components/dashboard/PortfolioHeroCard';
|
|
import WinRateStrip from '@/components/dashboard/WinRateStrip';
|
|
import MarketTicker from '@/components/dashboard/MarketTicker';
|
|
import ActiveAlerts from '@/components/dashboard/ActiveAlerts';
|
|
import QuickPositions from '@/components/dashboard/QuickPositions';
|
|
import AnimatedCard from '@/components/AnimatedCard';
|
|
import { useTradingData } from '@/providers/TradingDataProvider';
|
|
|
|
export default function DashboardScreen() {
|
|
const insets = useSafeAreaInsets();
|
|
const { refresh, loading } = useTradingData();
|
|
const [refreshing, setRefreshing] = useState(false);
|
|
|
|
const onRefresh = useCallback(() => {
|
|
setRefreshing(true);
|
|
void refresh().finally(() => setRefreshing(false));
|
|
}, [refresh]);
|
|
|
|
return (
|
|
<View style={[styles.container, { paddingTop: insets.top }]}>
|
|
<ScrollView
|
|
style={styles.scroll}
|
|
contentContainerStyle={styles.content}
|
|
showsVerticalScrollIndicator={false}
|
|
refreshControl={
|
|
<RefreshControl
|
|
refreshing={refreshing || loading}
|
|
onRefresh={onRefresh}
|
|
tintColor={Colors.accent.green}
|
|
colors={[Colors.accent.green]}
|
|
/>
|
|
}
|
|
>
|
|
<AnimatedCard index={0}>
|
|
<StatusBanner />
|
|
</AnimatedCard>
|
|
|
|
<AnimatedCard index={1}>
|
|
<PortfolioHeroCard />
|
|
</AnimatedCard>
|
|
|
|
<AnimatedCard index={2}>
|
|
<WinRateStrip />
|
|
</AnimatedCard>
|
|
|
|
<AnimatedCard index={3}>
|
|
<MarketTicker />
|
|
</AnimatedCard>
|
|
|
|
<AnimatedCard index={4}>
|
|
<ActiveAlerts />
|
|
</AnimatedCard>
|
|
|
|
<AnimatedCard index={5}>
|
|
<QuickPositions />
|
|
</AnimatedCard>
|
|
</ScrollView>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
backgroundColor: Colors.background.primary,
|
|
},
|
|
scroll: {
|
|
flex: 1,
|
|
},
|
|
content: {
|
|
padding: Spacing.screenPadding,
|
|
gap: Spacing.sectionGap,
|
|
paddingBottom: 120,
|
|
},
|
|
});
|