Написание схемы с помощью Zod

Question 1

Написание схемы с помощью Zod

Answer 1

1. Создание схемы:
   import * as z from ‘zod’ !! Обратить внимание

export const loginSchema = z.object({
email: z.email(),
password: z.string(),
rememberMe: z.boolean(),
})

2. Применение resolver:
   import { zodResolver } from ‘@hookform/resolvers/zod’

export const Login = () => {
/…/

const {
register,
handleSubmit,
reset,
control,
formState: { errors },
} = useForm<LoginInputs>({
resolver: zodResolver(loginSchema),
defaultValues: { email: '', password: '', rememberMe: false },
})</LoginInputs>

/…/
}

3.Чтобы не писать типы для формы вручную, можно воспользоваться z.infer:
export type LoginInputs = z.infer<typeof></typeof>

4. Схема domainTaskSchema для валидации типа ответа сервера в fetchTasksTC:
   export const tasksSlice = createAppSlice({
   /…/
   reducers: create => ({
   fetchTasksTC: create.asyncThunk(
   async (todolistId: string, { dispatch, rejectWithValue }) => {
   try {
   dispatch(setAppStatusAC({ status: ‘loading’ }))
   const res = await tasksApi.getTasks(todolistId)
   domainTaskSchema.array().parse(res.data.items) // 💎
   dispatch(setAppStatusAC({ status: ‘succeeded’ }))
   return { todolistId, tasks: res.data.items }
   } catch (error: any) {
   console.log(error)
   handleServerNetworkError(error, dispatch)
   return rejectWithValue(null)
   }
   }
   /…/
   ),
   /…/
   }),
   })