hook up validation packages for realtime validation

linode · Apr 10, 2024 · f56e4ad · f56e4ad
1 parent e4e71f6
commit f56e4ad
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 1 deletion.
diff --git a/packages/manager/package.json b/packages/manager/package.json
@@ -16,6 +16,7 @@
   "dependencies": {
     "@emotion/react": "^11.11.1",
     "@emotion/styled": "^11.11.0",
+    "@hookform/resolvers": "2.9.11",
     "@linode/api-v4": "*",
     "@linode/validation": "*",
     "@lukemorales/query-key-factory": "^1.3.4",

diff --git a/packages/manager/src/features/Linodes/LinodeCreatev2/index.tsx b/packages/manager/src/features/Linodes/LinodeCreatev2/index.tsx
@@ -1,3 +1,5 @@
+import { yupResolver } from '@hookform/resolvers/yup';
+import { CreateLinodeSchema } from '@linode/validation';
 import React from 'react';
 import { FormProvider, useForm } from 'react-hook-form';
 import { useHistory } from 'react-router-dom';
@@ -37,7 +39,11 @@ import type { CreateLinodeRequest } from '@linode/api-v4';
 import type { SubmitHandler } from 'react-hook-form';
 
 export const LinodeCreatev2 = () => {
-  const methods = useForm<CreateLinodeRequest>({ defaultValues });
+  const methods = useForm<CreateLinodeRequest>({
+    defaultValues,
+    resolver: yupResolver(CreateLinodeSchema),
+    mode: 'onChange',
+  });
   const history = useHistory();
 
   const { mutateAsync: createLinode } = useCreateLinodeMutation();

diff --git a/yarn.lock b/yarn.lock
@@ -1817,6 +1817,11 @@
   resolved "https://registry.yarnpkg.com/@floating-ui/utils/-/utils-0.2.1.tgz#16308cea045f0fc777b6ff20a9f25474dd8293d2"
   integrity sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q==
 
+"@hookform/resolvers@2.9.11":
+  version "2.9.11"
+  resolved "https://registry.yarnpkg.com/@hookform/resolvers/-/resolvers-2.9.11.tgz#9ce96e7746625a89239f68ca57c4f654264c17ef"
+  integrity sha512-bA3aZ79UgcHj7tFV7RlgThzwSSHZgvfbt2wprldRkYBcMopdMvHyO17Wwp/twcJasNFischFfS7oz8Katz8DdQ==
+
 "@humanwhocodes/config-array@^0.11.13":
   version "0.11.14"
   resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.11.14.tgz#d78e481a039f7566ecc9660b4ea7fe6b1fec442b"