Hi, I come to you with a great request.
The zod-i18n-map in react hook form is not working at all.
The messages under the inputs do not appear.
I tested different ways, I came across the sandbox "zod faker 2" and there I changed as I had it all worked correctly.
I think it's electronjs problem, but the json load normally.
Below I am uploading my code for i18n.ts, signin.tsx and zod.ts.
Please help, I would appreciate it.
i18n.ts:
`import i18next from 'i18next'
import { initReactI18next } from 'react-i18next'
import { z } from 'zod'
import { zodI18nMap } from 'zod-i18n-map'
import translationEn from 'zod-i18n-map/locales/en/zod.json'
import translationPL from 'zod-i18n-map/locales/pl/zod.json'
import { en, pl } from '.'
Hi, I come to you with a great request. The zod-i18n-map in react hook form is not working at all. The messages under the inputs do not appear. I tested different ways, I came across the sandbox "zod faker 2" and there I changed as I had it all worked correctly. I think it's electronjs problem, but the json load normally. Below I am uploading my code for i18n.ts, signin.tsx and zod.ts. Please help, I would appreciate it.
i18n.ts: `import i18next from 'i18next' import { initReactI18next } from 'react-i18next' import { z } from 'zod' import { zodI18nMap } from 'zod-i18n-map' import translationEn from 'zod-i18n-map/locales/en/zod.json' import translationPL from 'zod-i18n-map/locales/pl/zod.json' import { en, pl } from '.'
i18next.use(initReactI18next).init({ lng: 'en', resources: { pl: { zod: translationPL, translation: pl, }, en: { zod: translationEn, translation: en, }, }, }) z.setErrorMap(zodI18nMap) `
signIn.tsx: `import { Button } from '@components/Buttons' import { zodResolver } from '@hookform/resolvers/zod' import { userAtom } from '@store/userAtom' import { useMutation } from '@tanstack/react-query' import { loginSchema } from '@type/auth' import { userAtomType } from '@type/user' import { motion } from 'framer-motion' import { useAtom } from 'jotai' import { SubmitHandler, useForm } from 'react-hook-form' import { toast } from 'react-hot-toast' import { useTranslation } from 'react-i18next' import { useNavigate } from 'react-router-dom'
export const SignIn = () => { const [user, setUser] = useAtom(userAtom) const { t } = useTranslation() const navigate = useNavigate() const { register, handleSubmit, formState: { errors }, reset, } = useForm({ resolver: zodResolver(loginSchema) })
} `
zod.ts:
export const loginSchema = z.object({ email: z.string().email(), password: z.string().min(4).max(30), })