TypeScript fix accessing error keys of optional nested object (#2718)

* Update types.ts

* Update types.ts

Author: pascalbaljet

packages/core/src/types.ts

@@ -64,7 +64,7 @@ export type FormDataKeys<T> = T extends Function | FormDataConvertibleValue
   ? never
   : T extends unknown[]
     ? ArrayFormDataKeys<T>
-    : T extends Record<string, unknown>
+    : T extends object
       ? ObjectFormDataKeys<T>
       : never
 
@@ -92,7 +92,7 @@ type ArrayFormDataKeys<T extends unknown[]> = number extends T['length']
 /**
  * Helper type for object form data keys
  */
-type ObjectFormDataKeys<T extends Record<string, unknown>> = string extends keyof T
+type ObjectFormDataKeys<T extends object> = string extends keyof T
   ? string
   :
       | Extract<keyof T, string>
@@ -105,7 +105,11 @@ type ObjectFormDataKeys<T extends Record<string, unknown>> = string extends keyo
                 ? `${Key}.${FormDataKeys<T[Key]> & string}`
                 : T[Key] extends Record<string, any>
                   ? `${Key}.${FormDataKeys<T[Key]> & string}`
-                  : never
+                  : Exclude<T[Key], null | undefined> extends any[]
+                    ? never
+                    : Exclude<T[Key], null | undefined> extends Record<string, any>
+                      ? `${Key}.${FormDataKeys<Exclude<T[Key], null | undefined>> & string}`
+                      : never
         }[Extract<keyof T, string>]
 
 type PartialFormDataErrors<T> = {

packages/react/test-app/Pages/FormHelper/TypeScript/NullableNestedObject.tsx

@@ -0,0 +1,18 @@
+// This component is used for checking the TypeScript implementation; there is no Playwright test depending on it.
+import { useForm } from '@inertiajs/react'
+
+interface FormData {
+  foo: null | {
+    bar: string
+  }
+}
+
+export default function NullableNestedObject() {
+  const form = useForm<FormData>({
+    foo: null,
+  })
+
+  console.log(form.errors['foo.bar'])
+
+  return <div></div>
+}

packages/svelte/test-app/Pages/FormHelper/TypeScript/NullableNestedObject.svelte

@@ -0,0 +1,16 @@
+<script lang="ts">
+  // This component is used for checking the TypeScript implementation; there is no Playwright test depending on it.
+  import { useForm } from '@inertiajs/svelte'
+
+  interface FormData {
+    foo: null | {
+      bar: string
+    }
+  }
+
+  const form = useForm<FormData>({
+    foo: null,
+  })
+
+  console.log($form.errors['foo.bar'])
+</script>

packages/vue3/test-app/Pages/FormHelper/TypeScript/NullableNestedObject.vue

@@ -0,0 +1,16 @@
+<script setup lang="ts">
+// This component is used for checking the TypeScript implementation; there is no Playwright test depending on it.
+import { useForm } from '@inertiajs/vue3'
+
+interface FormData {
+  foo: null | {
+    bar: string
+  }
+}
+
+const form = useForm<FormData>({
+  foo: null,
+})
+
+console.log(form.errors['foo.bar'])
+</script>