update tn-forms and change default implementatino of dynamic form fields

thinknimble · Sep 23, 2024 · fca98c4 · fca98c4
1 parent a16b513
commit fca98c4
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 13 deletions.
diff --git a/{{cookiecutter.project_slug}}/clients/mobile/react-native/package.json b/{{cookiecutter.project_slug}}/clients/mobile/react-native/package.json
@@ -38,7 +38,7 @@
     "@sentry/react-native": "~5.22.0",
     "@shopify/flash-list": "1.6.4",
     "@tanstack/react-query": "^5.15.0",
-    "@thinknimble/tn-forms": "^3.1.3",
+    "@thinknimble/tn-forms": "^3.2.0",
     "@thinknimble/tn-forms-react": "^1.0.3",
     "@thinknimble/tn-models": "^3.0.0",
     "axios": "^1.3.2",

diff --git a/{{cookiecutter.project_slug}}/clients/web/react/package.json b/{{cookiecutter.project_slug}}/clients/web/react/package.json
@@ -17,7 +17,7 @@
   },
   "dependencies": {
     "@tanstack/react-query": "^5.15.0",
-    "@thinknimble/tn-forms": "^3.1.8",
+    "@thinknimble/tn-forms": "^3.2.0",
     "@thinknimble/tn-forms-react": "^1.0.3",
     "@thinknimble/tn-models": "^3.0.0",
     "axios": "^1.5.0",

diff --git a/{{cookiecutter.project_slug}}/clients/web/vue3/package.json b/{{cookiecutter.project_slug}}/clients/web/vue3/package.json
@@ -21,7 +21,7 @@
   "dependencies": {
     "@headlessui/vue": "1.7.16",
     "@heroicons/vue": "2.0.18",
-    "@thinknimble/tn-forms": "3.1.8",
+    "@thinknimble/tn-forms": "3.2.0",
     "@thinknimble/tn-models": "^3.0.0",
     "@thinknimble/tn-utils": "2.0.1",
     "@tanstack/vue-query": "^5.28.9",

diff --git a/{{cookiecutter.project_slug}}/clients/web/vue3/src/composables/Users.ts b/{{cookiecutter.project_slug}}/clients/web/vue3/src/composables/Users.ts
@@ -14,6 +14,7 @@ import { reactive, ref } from 'vue'
 import { useRouter } from 'vue-router'
 import { useUserStore } from '@/stores/user'
 import { useAlert } from '@/composables/CommonAlerts'
+import { MustMatchValidator } from '@thinknimble/tn-forms'
 
 export function useUsers() {
   const userStore = useUserStore()
@@ -22,10 +23,24 @@ export function useUsers() {
   const loginForm = reactive(new LoginForm({}))
   const forgotPasswordForm = reactive(new EmailForgotPasswordForm({}))
   const resetPasswordForm = reactive(new ResetPasswordForm({}))
-  const registerForm = reactive(new AccountForm({}))
+  const registerForm = ref(new AccountForm({}))
   const loading = ref(false)
   const { errorAlert, successAlert } = useAlert()
 
+  const fillUserForm = (data: UserShape | null ) =>{
+    if(data){
+      registerForm.value = new AccountForm(data)
+
+    }else{
+      registerForm.value = new AccountForm()
+    }
+    registerForm.value.addFormLevelValidator(
+      'confirmPassword',
+      new MustMatchValidator({ matcher: 'password' }),
+    )
+
+  }
+
   const getCodeUidFromRoute = () => {
     const { uid, token } = router.currentRoute.value.params
     return { uid, token }

diff --git a/{{cookiecutter.project_slug}}/clients/web/vue3/src/services/users/forms.ts b/{{cookiecutter.project_slug}}/clients/web/vue3/src/services/users/forms.ts
@@ -4,7 +4,6 @@ import Form, {
   IFormField,
   MinLengthValidator,
   RequiredValidator,
-  MustMatchValidator,
 } from '@thinknimble/tn-forms'
 
 export type AccountFormInputs = {
@@ -131,14 +130,6 @@ export class ResetPasswordForm extends Form<ResetPasswordInput> {
     value: '',
     validators: [],
   })
-
-  static dynamicValidators = {
-    confirmPassword: [
-      new MustMatchValidator({
-        matcher: 'password',
-      }),
-    ],
-  }
 }
 
 export type TResetPasswordForm = ResetPasswordForm & ResetPasswordInput