diff --git a/app/application/_layout.tsx b/app/application/_layout.tsx index 1bf47a0..f27ad5d 100644 --- a/app/application/_layout.tsx +++ b/app/application/_layout.tsx @@ -31,6 +31,7 @@ const TabLayout: React.FC = () => { name="habits/new" options={{ title: "New Habit", + unmountOnBlur: true, tabBarIcon: ({ color }) => { return }, @@ -39,6 +40,7 @@ const TabLayout: React.FC = () => { diff --git a/domain/entities/Goal.ts b/domain/entities/Goal.ts index ded0b30..e3c4077 100644 --- a/domain/entities/Goal.ts +++ b/domain/entities/Goal.ts @@ -27,7 +27,7 @@ export const GoalCreateSchema = z.object({ z.object({ type: z.literal("boolean") }), z.object({ type: z.literal("numeric"), - value: z.number().int().min(0), + value: z.number().int().min(1), unit: z.string().min(1), }), ]), diff --git a/presentation/react/components/HabitForm/HabitCreateForm.tsx b/presentation/react/components/HabitForm/HabitCreateForm.tsx index deebdd8..443ad35 100644 --- a/presentation/react/components/HabitForm/HabitCreateForm.tsx +++ b/presentation/react/components/HabitForm/HabitCreateForm.tsx @@ -39,7 +39,9 @@ export const HabitCreateForm: React.FC = ({ user }) => { control, handleSubmit, reset, - formState: { errors }, + watch, + + formState: { errors, isValid }, } = useForm({ mode: "onChange", resolver: zodResolver(HabitCreateSchema), @@ -57,6 +59,8 @@ export const HabitCreateForm: React.FC = ({ user }) => { }, }) + const watchGoalType = watch("goal.target.type") + const [isVisibleSnackbar, setIsVisibleSnackbar] = useState(false) const { @@ -128,7 +132,7 @@ export const HabitCreateForm: React.FC = ({ user }) => { style={[ styles.spacing, { - width: "90%", + width: "96%", }, ]} mode="outlined" @@ -153,7 +157,7 @@ export const HabitCreateForm: React.FC = ({ user }) => { <> Habit Frequency { @@ -197,7 +201,7 @@ export const HabitCreateForm: React.FC = ({ user }) => { */} { @@ -214,12 +218,74 @@ export const HabitCreateForm: React.FC = ({ user }) => { name="goal.target.type" /> + {watchGoalType === "numeric" ? ( + + { + return ( + { + if (text.length <= 0) { + onChange("") + return + } + onChange(Number.parseInt(text, 10)) + }} + value={value?.toString()} + style={[ + styles.spacing, + { + width: "50%", + }, + ]} + mode="outlined" + keyboardType="numeric" + /> + ) + }} + name="goal.target.value" + /> + + { + return ( + + ) + }} + name="goal.target.unit" + /> + + ) : null} + { return ( { onChange(value.hex) @@ -244,7 +310,7 @@ export const HabitCreateForm: React.FC = ({ user }) => { alignItems: "center", flexDirection: "row", gap: 20, - marginVertical: 30, + marginVertical: 5, }} > @@ -269,8 +335,8 @@ export const HabitCreateForm: React.FC = ({ user }) => { mode="contained" onPress={handleSubmit(onSubmit)} loading={habitCreate.state === "loading"} - disabled={habitCreate.state === "loading"} - style={[styles.spacing, { width: "100%" }]} + disabled={habitCreate.state === "loading" || !isValid} + style={[{ width: "100%", marginVertical: 15 }]} > Create your habit! 🚀 @@ -289,6 +355,6 @@ export const HabitCreateForm: React.FC = ({ user }) => { const styles = StyleSheet.create({ spacing: { - marginVertical: 16, + marginVertical: 10, }, }) diff --git a/presentation/react/components/HabitForm/HabitEditForm.tsx b/presentation/react/components/HabitForm/HabitEditForm.tsx index 8335396..a97f844 100644 --- a/presentation/react/components/HabitForm/HabitEditForm.tsx +++ b/presentation/react/components/HabitForm/HabitEditForm.tsx @@ -28,7 +28,7 @@ export const HabitEditForm: React.FC = ({ habit }) => { const { control, handleSubmit, - formState: { errors }, + formState: { errors, isValid }, } = useForm({ mode: "onChange", resolver: zodResolver(HabitEditSchema), @@ -80,7 +80,7 @@ export const HabitEditForm: React.FC = ({ habit }) => { style={[ styles.spacing, { - width: "90%", + width: "96%", }, ]} mode="outlined" @@ -103,7 +103,7 @@ export const HabitEditForm: React.FC = ({ habit }) => { render={({ field: { onChange, value } }) => { return ( { onChange(value.hex) @@ -153,8 +153,8 @@ export const HabitEditForm: React.FC = ({ habit }) => { mode="contained" onPress={handleSubmit(onSubmit)} loading={habitEdit.state === "loading"} - disabled={habitEdit.state === "loading"} - style={[styles.spacing, { width: "90%" }]} + disabled={habitEdit.state === "loading" || !isValid} + style={[styles.spacing, { width: "96%" }]} > Save @@ -166,7 +166,7 @@ export const HabitEditForm: React.FC = ({ habit }) => { }} loading={habitStop.state === "loading"} disabled={habitStop.state === "loading"} - style={[styles.spacing, { width: "90%" }]} + style={[styles.spacing, { width: "96%" }]} > Stop