diff --git a/frontend/src/components/visual-editor/form/inputs/triggers/PatternInput.tsx b/frontend/src/components/visual-editor/form/inputs/triggers/PatternInput.tsx index b5fc024..dbd049b 100644 --- a/frontend/src/components/visual-editor/form/inputs/triggers/PatternInput.tsx +++ b/frontend/src/components/visual-editor/form/inputs/triggers/PatternInput.tsx @@ -6,7 +6,7 @@ * 2. All derivative works must include clear attribution to the original creator and software, Hexastack and Hexabot, in a prominent location (e.g., in the software's "About" section, documentation, and README file). */ -import { Box, Grid, MenuItem, Typography } from "@mui/material"; +import { Box, Grid, MenuItem, TextFieldProps, Typography } from "@mui/material"; import { FC, useEffect, useState } from "react"; import { RegisterOptions, useFormContext } from "react-hook-form"; import { useTranslation } from "react-i18next"; @@ -57,9 +57,15 @@ type PatternInputProps = { onChange: (pattern: Pattern) => void; block?: IBlockFull; idx: number; + getInputProps?: (index: number) => TextFieldProps; }; -const PatternInput: FC = ({ value, onChange, idx }) => { +const PatternInput: FC = ({ + value, + onChange, + idx, + getInputProps, +}) => { const { t } = useTranslation(); const { register, @@ -272,6 +278,7 @@ const PatternInput: FC = ({ value, onChange, idx }) => { ) : null} {typeof value === "string" && patternType === "text" ? ( onChange(e.target.value)} diff --git a/frontend/src/components/visual-editor/form/inputs/triggers/PatternsInput.tsx b/frontend/src/components/visual-editor/form/inputs/triggers/PatternsInput.tsx index c7b42af..efa5098 100644 --- a/frontend/src/components/visual-editor/form/inputs/triggers/PatternsInput.tsx +++ b/frontend/src/components/visual-editor/form/inputs/triggers/PatternsInput.tsx @@ -10,6 +10,7 @@ import AddIcon from "@mui/icons-material/Add"; import DeleteIcon from "@mui/icons-material/Delete"; import { Box, Button, Grid, IconButton, styled } from "@mui/material"; import { FC, Fragment, useEffect, useState } from "react"; +import { useFormContext } from "react-hook-form"; import { useTranslation } from "react-i18next"; import { Pattern } from "@/types/block.types"; @@ -37,6 +38,19 @@ const PatternsInput: FC = ({ value, onChange }) => { const [patterns, setPatterns] = useState[]>( value.map((pattern) => createValueWithId(pattern)), ); + const { + register, + formState: { errors }, + } = useFormContext(); + const getInputProps = (index: number) => { + return { + ...register(`message.${index}`, { + required: t("message.text_is_required"), + }), + error: !!errors?.message?.[index], + helperText: errors?.message?.[index]?.message, + }; + }; const addInput = () => { setPatterns([...patterns, createValueWithId("")]); }; @@ -73,6 +87,7 @@ const PatternsInput: FC = ({ value, onChange }) => { idx={idx} value={value} onChange={updateInput(idx)} + getInputProps={getInputProps} /> )) diff --git a/frontend/src/i18n/en/translation.json b/frontend/src/i18n/en/translation.json index 69fc736..492c339 100644 --- a/frontend/src/i18n/en/translation.json +++ b/frontend/src/i18n/en/translation.json @@ -101,7 +101,8 @@ "attachment_not_found": "Attachment is not found", "title_length_exceeded": "You have reached the maximum length", "no_label_found": "No label found", - "code_is_required": "Language code is required" + "code_is_required": "Language code is required", + "text_is_required": "Text is required" }, "menu": { "terms": "Terms of Use", diff --git a/frontend/src/i18n/fr/translation.json b/frontend/src/i18n/fr/translation.json index a23bf75..d8ba103 100644 --- a/frontend/src/i18n/fr/translation.json +++ b/frontend/src/i18n/fr/translation.json @@ -102,7 +102,8 @@ "attachment_not_found": "La pièce jointe est introuvable", "title_length_exceeded": "Vous avez atteint la longueur maximale", "no_label_found": "Aucune étiquette trouvée", - "code_is_required": "Le code est requis" + "code_is_required": "Le code est requis", + "text_is_required": "Texte requis" }, "menu": { "terms": "Conditions d'utilisation",