feat: debut page stats
This commit is contained in:
parent
1ab504324a
commit
b6395b71b9
@ -43,11 +43,11 @@ const TabLayout: React.FC = () => {
|
|||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<Tabs.Screen
|
<Tabs.Screen
|
||||||
name="habits/history"
|
name="habits/stats"
|
||||||
options={{
|
options={{
|
||||||
title: "History",
|
title: "Statistics",
|
||||||
tabBarIcon: ({ color }) => {
|
tabBarIcon: ({ color }) => {
|
||||||
return <TabBarIcon name="history" color={color} />
|
return <TabBarIcon name="line-chart" color={color} />
|
||||||
},
|
},
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
|
@ -1,50 +0,0 @@
|
|||||||
import { useMemo, useState } from "react"
|
|
||||||
import { View } from "react-native"
|
|
||||||
import { Agenda } from "react-native-calendars"
|
|
||||||
import { Text } from "react-native-paper"
|
|
||||||
import { SafeAreaView } from "react-native-safe-area-context"
|
|
||||||
|
|
||||||
import { getISODate, getNowDate } from "@/utils/dates"
|
|
||||||
|
|
||||||
const HistoryPage: React.FC = () => {
|
|
||||||
const today = useMemo(() => {
|
|
||||||
return getNowDate()
|
|
||||||
}, [])
|
|
||||||
const todayISO = getISODate(today)
|
|
||||||
|
|
||||||
const [selectedDate, setSelectedDate] = useState<Date>(today)
|
|
||||||
const selectedISODate = getISODate(selectedDate)
|
|
||||||
|
|
||||||
return (
|
|
||||||
<SafeAreaView
|
|
||||||
style={[
|
|
||||||
{
|
|
||||||
flex: 1,
|
|
||||||
backgroundColor: "white",
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
>
|
|
||||||
<Agenda
|
|
||||||
firstDay={1}
|
|
||||||
showClosingKnob
|
|
||||||
showOnlySelectedDayItems
|
|
||||||
onDayPress={(date) => {
|
|
||||||
setSelectedDate(new Date(date.dateString))
|
|
||||||
}}
|
|
||||||
markedDates={{
|
|
||||||
[todayISO]: { marked: true },
|
|
||||||
}}
|
|
||||||
selected={selectedISODate}
|
|
||||||
renderList={() => {
|
|
||||||
return (
|
|
||||||
<View>
|
|
||||||
<Text>{selectedDate.toISOString()}</Text>
|
|
||||||
</View>
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</SafeAreaView>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default HistoryPage
|
|
14
app/application/habits/stats.tsx
Normal file
14
app/application/habits/stats.tsx
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
import { Stats } from "@/presentation/react/components/Stats/Stats"
|
||||||
|
import { useAuthentication } from "@/presentation/react/contexts/Authentication"
|
||||||
|
|
||||||
|
const StatsPage: React.FC = () => {
|
||||||
|
const { user } = useAuthentication()
|
||||||
|
|
||||||
|
if (user == null) {
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
|
||||||
|
return <Stats />
|
||||||
|
}
|
||||||
|
|
||||||
|
export default StatsPage
|
35
presentation/react/components/Stats/Stats.tsx
Normal file
35
presentation/react/components/Stats/Stats.tsx
Normal file
@ -0,0 +1,35 @@
|
|||||||
|
import { SafeAreaView } from "react-native-safe-area-context"
|
||||||
|
import { Card, Text } from "react-native-paper"
|
||||||
|
|
||||||
|
export const Stats: React.FC = () => {
|
||||||
|
return (
|
||||||
|
<SafeAreaView>
|
||||||
|
<Text> {"Statistique"} </Text>
|
||||||
|
|
||||||
|
<Card mode="outlined">
|
||||||
|
<Card.Title title="Current Streak" />
|
||||||
|
<Card.Content>
|
||||||
|
<Text variant="bodyMedium">nbDays Sucess that follow</Text>
|
||||||
|
</Card.Content>
|
||||||
|
</Card>
|
||||||
|
<Card mode="outlined">
|
||||||
|
<Card.Title title="Sucess" />
|
||||||
|
<Card.Content>
|
||||||
|
<Text variant="bodyMedium">nbDays Sucess</Text>
|
||||||
|
</Card.Content>
|
||||||
|
</Card>
|
||||||
|
<Card mode="outlined">
|
||||||
|
<Card.Title title="Failed" />
|
||||||
|
<Card.Content>
|
||||||
|
<Text variant="bodyMedium">nbDays Fail</Text>
|
||||||
|
</Card.Content>
|
||||||
|
</Card>
|
||||||
|
<Card mode="outlined">
|
||||||
|
<Card.Title title="Card Title" />
|
||||||
|
<Card.Content>
|
||||||
|
<Text variant="bodyMedium">CardContent</Text>
|
||||||
|
</Card.Content>
|
||||||
|
</Card>
|
||||||
|
</SafeAreaView>
|
||||||
|
)
|
||||||
|
}
|
Reference in New Issue
Block a user