1
1
mirror of https://github.com/theoludwig/p61-project.git synced 2024-07-17 07:00:12 +02:00

fix: suggestion for creating the first habit

This commit is contained in:
Xc165543337 2024-04-04 11:21:56 +02:00
parent eea32ec256
commit 1dc3939d42

View File

@ -1,6 +1,7 @@
import { FlatList } from "react-native" import { FlatList, View } from "react-native"
import { List } from "react-native-paper" import { Button, List, Text } from "react-native-paper"
import { useState } from "react" import { useMemo, useState } from "react"
import { useRouter } from "expo-router"
import type { GoalFrequency } from "@/domain/entities/Goal" import type { GoalFrequency } from "@/domain/entities/Goal"
import { GOAL_FREQUENCIES } from "@/domain/entities/Goal" import { GOAL_FREQUENCIES } from "@/domain/entities/Goal"
@ -15,6 +16,14 @@ export interface HabitsHistoryProps {
export const HabitsHistory: React.FC<HabitsHistoryProps> = (props) => { export const HabitsHistory: React.FC<HabitsHistoryProps> = (props) => {
const { habitsTracker } = props const { habitsTracker } = props
const router = useRouter()
const habitsByFrequency = useMemo(() => {
return GOAL_FREQUENCIES.filter((frequency) => {
return habitsTracker.habitsHistory[frequency].length > 0
})
}, [habitsTracker])
const [accordionExpanded, setAccordionExpanded] = useState<{ const [accordionExpanded, setAccordionExpanded] = useState<{
[key in GoalFrequency]: boolean [key in GoalFrequency]: boolean
}>({ }>({
@ -23,6 +32,41 @@ export const HabitsHistory: React.FC<HabitsHistoryProps> = (props) => {
monthly: true, monthly: true,
}) })
if (habitsByFrequency.length <= 0) {
return (
<View
style={{
flex: 1,
alignItems: "center",
justifyContent: "center",
}}
>
<Text variant="titleLarge">{"Let's begin by adding habits! 🤩"}</Text>
<Button
mode="contained"
style={{
marginTop: 16,
width: 250,
height: 40,
}}
onPress={() => {
router.push("/application/habits/new")
}}
>
<Text
style={{
color: "white",
fontWeight: "bold",
fontSize: 16,
}}
>
Create your first habit! 🚀
</Text>
</Button>
</View>
)
}
return ( return (
<List.Section <List.Section
style={[ style={[
@ -31,7 +75,7 @@ export const HabitsHistory: React.FC<HabitsHistoryProps> = (props) => {
}, },
]} ]}
> >
{GOAL_FREQUENCIES.map((frequency) => { {habitsByFrequency.map((frequency) => {
return ( return (
<List.Accordion <List.Accordion
expanded={accordionExpanded[frequency]} expanded={accordionExpanded[frequency]}