Add section validations
This commit is contained in:
@@ -3,6 +3,7 @@ import { TrashIcon } from "@/assets/icons";
|
|||||||
import InputGroup from "@/components/FormElements/InputGroup";
|
import InputGroup from "@/components/FormElements/InputGroup";
|
||||||
import { TextAreaGroup } from "@/components/FormElements/InputGroup/text-area";
|
import { TextAreaGroup } from "@/components/FormElements/InputGroup/text-area";
|
||||||
import { ShowcaseSection } from "@/components/Layouts/showcase-section";
|
import { ShowcaseSection } from "@/components/Layouts/showcase-section";
|
||||||
|
import { REGEX } from "@/constants/regex";
|
||||||
import { FormErrorMessages } from "@/constants/Texts";
|
import { FormErrorMessages } from "@/constants/Texts";
|
||||||
import {
|
import {
|
||||||
Control,
|
Control,
|
||||||
@@ -73,7 +74,10 @@ const SectionStep = <T extends FieldValues>({
|
|||||||
placeholder="Enter Section Description"
|
placeholder="Enter Section Description"
|
||||||
/>
|
/>
|
||||||
</ShowcaseSection>
|
</ShowcaseSection>
|
||||||
<ShowcaseSection title={`${title} cards`} className="flex flex-col gap-5">
|
<ShowcaseSection
|
||||||
|
title={`${title} cards`}
|
||||||
|
className="flex flex-col gap-5"
|
||||||
|
>
|
||||||
{fields.map((field, index) => (
|
{fields.map((field, index) => (
|
||||||
<div
|
<div
|
||||||
key={field.id}
|
key={field.id}
|
||||||
@@ -85,12 +89,16 @@ const SectionStep = <T extends FieldValues>({
|
|||||||
message: FormErrorMessages.required,
|
message: FormErrorMessages.required,
|
||||||
value: true,
|
value: true,
|
||||||
},
|
},
|
||||||
|
pattern: {
|
||||||
|
message: FormErrorMessages.invalidPattern,
|
||||||
|
value: REGEX.URL,
|
||||||
|
},
|
||||||
})}
|
})}
|
||||||
label="Icon"
|
label="Icon"
|
||||||
name={`cards.${index}.icon`}
|
name={`cards.${index}.icon`}
|
||||||
required
|
required
|
||||||
type="text"
|
type="text"
|
||||||
placeholder="Enter Icon URL or name"
|
placeholder="Enter Icon URL"
|
||||||
/>
|
/>
|
||||||
<InputGroup
|
<InputGroup
|
||||||
{...register(`cards.${index}.title` as Path<T>, {
|
{...register(`cards.${index}.title` as Path<T>, {
|
||||||
|
|||||||
@@ -1,6 +1,12 @@
|
|||||||
"use client";
|
"use client";
|
||||||
import EmptyListWrapper from "@/components/HOC/EmptyListWrapper";
|
import EmptyListWrapper from "@/components/HOC/EmptyListWrapper";
|
||||||
import { Table, TableHead, TableHeader, TableRow } from "@/components/ui/table";
|
import {
|
||||||
|
Table,
|
||||||
|
TableBody,
|
||||||
|
TableHead,
|
||||||
|
TableHeader,
|
||||||
|
TableRow,
|
||||||
|
} from "@/components/ui/table";
|
||||||
import TableSkeleton from "@/components/ui/TableSkeleton";
|
import TableSkeleton from "@/components/ui/TableSkeleton";
|
||||||
import { useContactUsListPresenter } from "./useContactUsListPresenter";
|
import { useContactUsListPresenter } from "./useContactUsListPresenter";
|
||||||
|
|
||||||
@@ -24,6 +30,7 @@ const ContactUsTable = () => {
|
|||||||
</TableRow>
|
</TableRow>
|
||||||
</TableHeader>
|
</TableHeader>
|
||||||
{isPending && <TableSkeleton column={columns.length} />}
|
{isPending && <TableSkeleton column={columns.length} />}
|
||||||
|
<TableBody>
|
||||||
<EmptyListWrapper
|
<EmptyListWrapper
|
||||||
list={data ?? []}
|
list={data ?? []}
|
||||||
columns={columns}
|
columns={columns}
|
||||||
@@ -31,6 +38,7 @@ const ContactUsTable = () => {
|
|||||||
>
|
>
|
||||||
Contact us table will be initialized here
|
Contact us table will be initialized here
|
||||||
</EmptyListWrapper>
|
</EmptyListWrapper>
|
||||||
|
</TableBody>
|
||||||
</Table>
|
</Table>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user