AmirReza Jamali
b18aa8eb71
Reduces code duplication in the marketing page forms by creating a generic `SectionStep` component. This new component encapsulates the shared UI and logic for sections that include a title, description, and a dynamic list of fields (e.g., feature cards, pricing points). The `FeaturesStep` component has been refactored to use this new `SectionStep`, resulting in a much cleaner and more maintainable implementation.
50 lines
891 B
TypeScript
50 lines
891 B
TypeScript
"use client";
|
|
import { useFieldArray, useForm } from "react-hook-form";
|
|
|
|
export interface IChallengesStepFields {
|
|
section_title: string;
|
|
section_description: string;
|
|
challenges: {
|
|
icon: string;
|
|
title: string;
|
|
description: string;
|
|
}[];
|
|
}
|
|
|
|
const useChallengesStepPresenter = () => {
|
|
const {
|
|
register,
|
|
handleSubmit,
|
|
control,
|
|
watch,
|
|
formState: { errors },
|
|
} = useForm<IChallengesStepFields>({
|
|
defaultValues: {
|
|
challenges: [{ icon: "", title: "", description: "" }],
|
|
},
|
|
});
|
|
|
|
const { fields, append, remove } = useFieldArray({
|
|
control,
|
|
name: "challenges",
|
|
});
|
|
|
|
const onSubmit = (data: IChallengesStepFields) => {
|
|
console.log(data);
|
|
};
|
|
|
|
return {
|
|
register,
|
|
handleSubmit,
|
|
errors,
|
|
onSubmit,
|
|
fields,
|
|
append,
|
|
remove,
|
|
control,
|
|
watch,
|
|
};
|
|
};
|
|
|
|
export default useChallengesStepPresenter;
|