refactor(marketing): Abstract form logic into reusable SectionStep component

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.
This commit is contained in:
AmirReza Jamali
2025-11-05 12:44:39 +03:30
parent 90ca4054d8
commit b18aa8eb71
7 changed files with 341 additions and 100 deletions
@@ -0,0 +1,35 @@
"use client";
import SectionStep from "./SectionStep";
import useChallengesStepPresenter, {
IChallengesStepFields,
} from "./useChallengesStepPresenter";
const ChallengesStep = () => {
const {
errors,
handleSubmit,
onSubmit,
register,
fields,
append,
remove,
control,
} = useChallengesStepPresenter();
return (
<SectionStep<IChallengesStepFields>
title="Challenges"
fields={fields}
handleSubmit={handleSubmit}
onSubmit={onSubmit}
register={register}
errors={errors}
append={append}
remove={remove}
control={control}
fieldName="challenges"
defaultValues={{ icon: "", title: "", description: "" }}
/>
);
};
export default ChallengesStep;