Could this form example snippet be improved?

[troix1]

Package

v4.x

Description

Hi! I was going through the NuxtUI form docs and noticed that in FormExampleBasic.vue, the validate function currently uses the any type.

It might be more accurate to use Partial<Schema> instead, which would provide better type safety and align with the form’s schema typing.

const validate = (state: any): FormError[] => {
  const errors = []
  if (!state.email) errors.push({ name: 'email', message: 'Required' })
  if (!state.password) errors.push({ name: 'password', message: 'Required' })
  return errors
}

replace any with Partial<Schema>

const validate = (state: Partial<Schema>): FormError[] => {
  const errors = []
  if (!state.email) errors.push({ name: 'email', message: 'Required' })
  if (!state.password) errors.push({ name: 'password', message: 'Required' })
  return errors
}

Link to docs: https://ui.nuxt.com/docs/components/form

[benjamincanac]

@romhml Should we juste define a Schema type like on other examples?

diff --git a/docs/app/components/content/examples/form/FormExampleBasic.vue b/docs/app/components/content/examples/form/FormExampleBasic.vue
index e077b1923..63b7cbcbb 100644
--- a/docs/app/components/content/examples/form/FormExampleBasic.vue
+++ b/docs/app/components/content/examples/form/FormExampleBasic.vue
@@ -6,7 +6,9 @@ const state = reactive({
   password: undefined
 })
 
-const validate = (state: any): FormError[] => {
+type Schema = typeof state
+
+function validate(state: Partial<Schema>): FormError[] {
   const errors = []
   if (!state.email) errors.push({ name: 'email', message: 'Required' })
   if (!state.password) errors.push({ name: 'password', message: 'Required' })

[romhml]

@benjamincanac yep, that works!