Merge pull request #219 from x0k/remove-send-data

Remove send data

Author: x0k

.changeset/brown-boxes-grin.md

@@ -0,0 +1,5 @@
+---
+"@sjsf/sveltekit": major
+---
+
+Remove `sendData` option from `ValidatedFormData` type

.changeset/ripe-tips-invent.md

@@ -0,0 +1,5 @@
+---
+"@sjsf/sveltekit": major
+---
+
+Add `updateData` option to `ValidatedFormData` type

examples/sveltekit-starter/src/routes/native-form/+page.server.ts

@@ -38,7 +38,7 @@ export const load = async () => {
 };
 
 export const actions = {
-  defaults: createAction(
+  default: createAction(
     {
       ...defaults,
       name: "form",

packages/sveltekit/src/lib/client/form.svelte.ts

@@ -34,9 +34,7 @@ function initialFormData<Meta extends SvelteKitFormMeta<any, any, string, any>>(
   idPrefix: string
 ): InitialFormData<Meta['__formValue']> | undefined {
   if (isRecord(page.form)) {
-    const validationData = page.form[meta.name] as
-      | ValidatedFormData<Meta['__sendData']>
-      | undefined;
+    const validationData = page.form[meta.name] as ValidatedFormData | undefined;
     if (
       validationData !== undefined &&
       validationData.idPrefix === idPrefix &&
@@ -75,13 +73,11 @@ export function createSvelteKitForm<
     if (!isRecord(page.form)) {
       return;
     }
-    const validationData = page.form[meta.name] as
-      | ValidatedFormData<Meta['__sendData']>
-      | undefined;
+    const validationData = page.form[meta.name] as ValidatedFormData | undefined;
     if (validationData === undefined || formIdPrefix !== validationData.idPrefix) {
       return;
     }
-    if (validationData.sendData) {
+    if (validationData.updateData) {
       form.value = validationData.data;
     }
     updateErrors(form, validationData.errors);

packages/sveltekit/src/lib/client/meta.ts

@@ -8,15 +8,13 @@ export interface SvelteKitFormMeta<
   PageData,
   Name extends FormNameFromActionDataUnion<ActionData>,
   FallbackValue,
-  IFD = InitialFromDataFromPageData<PageData, Name>,
-  VFD = ValidatedFormDataFromActionDataUnion<ActionData, Name>
+  IFD = InitialFromDataFromPageData<PageData, Name>
 > {
   name: Name;
   __actionData: ActionData;
   __pageData: PageData;
   __formValue: FormValueFromInitialFormData<IFD, FallbackValue>;
   __sendSchema: SendSchemaFromInitialFormData<IFD>;
-  __sendData: SendDataFromValidatedFormData<VFD>;
 }
 
 const proxy = new Proxy(
@@ -40,21 +38,13 @@ export function createMeta<ActionData, PageData, FallbackValue = SchemaValue>()
 }
 
 type FormNameFromActionDataBranch<ActionData> = keyof {
-  [K in keyof ActionData]: ActionData[K] extends ValidatedFormData<any> ? K : never;
+  [K in keyof ActionData]: ActionData[K] extends ValidatedFormData ? K : never;
 };
 
 type FormNameFromActionDataUnion<ActionData> = ActionData extends any
   ? FormNameFromActionDataBranch<ActionData>
   : never;
 
-type ValidatedFormDataFromActionDataBranch<ActionData, FormName extends keyof ActionData> =
-  ActionData[FormName] extends ValidatedFormData<any> ? ActionData[FormName] : never;
-
-type ValidatedFormDataFromActionDataUnion<
-  ActionData,
-  FormName extends keyof ActionData
-> = ActionData extends any ? ValidatedFormDataFromActionDataBranch<ActionData, FormName> : never;
-
 type InitialFromDataFromPageData<PageData, FormName extends PropertyKey> = PageData extends {
   [K in FormName]: InitialFormData<any>;
 }
@@ -67,7 +57,4 @@ type FormValueFromInitialFormData<IFD, FallbackValue> = unknown extends IFD
     ? T
     : never;
 
-type SendDataFromValidatedFormData<VFD> =
-  VFD extends ValidatedFormData<infer SendData> ? SendData : false;
-
 type SendSchemaFromInitialFormData<IFD> = IFD extends { schema: Schema } ? true : false;

packages/sveltekit/src/lib/model.ts

@@ -47,11 +47,11 @@ export type InitialFormData<T = unknown> = SerializableOptionalFormOptions<T> &
   uiSchema?: UiSchemaRoot;
 };
 
-export interface ValidatedFormData<SendData extends boolean> {
+export interface ValidatedFormData {
   idPrefix: string;
   isValid: boolean;
-  sendData?: SendData;
-  data: SendData extends true ? SchemaValue | undefined : undefined;
+  updateData: boolean;
+  data: SchemaValue | undefined;
   errors: ValidationError[];
 }
 

packages/sveltekit/src/lib/server/server.ts

@@ -38,7 +38,7 @@ import {
   type UnknownEntryConverter
 } from '../internal/convert-form-data-entry.js';
 
-export interface FormHandlerOptions<SendData extends boolean> extends IdOptions {
+export interface FormHandlerOptions extends IdOptions {
   schema: Schema;
   uiSchema?: UiSchemaRoot;
   uiOptionsRegistry?: UiOptionsRegistry;
@@ -48,7 +48,7 @@ export interface FormHandlerOptions<SendData extends boolean> extends IdOptions
   createEntryConverter?: Creatable<EntryConverter<FormDataEntryValue>, FormDataConverterOptions>;
   convertUnknownEntry?: UnknownEntryConverter;
   /** @default false */
-  sendData?: SendData;
+  sendData?: boolean | 'withoutClientSideUpdate';
   /** By default, handles conversion of `File` */
   createReviver?: (formData: FormData) => (key: string, value: any) => any;
 }
@@ -62,7 +62,7 @@ function createDefaultReviver(formData: FormData) {
   };
 }
 
-export function createFormHandler<SendData extends boolean>({
+export function createFormHandler({
   schema,
   uiSchema = {},
   uiOptionsRegistry = {},
@@ -73,9 +73,9 @@ export function createFormHandler<SendData extends boolean>({
   idSeparator = DEFAULT_ID_SEPARATOR,
   idIndexSeparator = DEFAULT_INDEX_SEPARATOR,
   idPseudoSeparator = DEFAULT_ID_PSEUDO_SEPARATOR,
-  sendData,
+  sendData = false,
   createReviver = createDefaultReviver
-}: FormHandlerOptions<SendData>) {
+}: FormHandlerOptions) {
   const validator: Validator = create(createValidator, {
     schema,
     uiSchema,
@@ -98,13 +98,7 @@ export function createFormHandler<SendData extends boolean>({
   return async (
     signal: AbortSignal,
     formData: FormData
-  ): Promise<
-    [
-      ValidatedFormData<SendData>,
-      FormValue,
-      (errors: ValidationError[]) => ValidatedFormData<SendData>
-    ]
-  > => {
+  ): Promise<[ValidatedFormData, FormValue, (errors: ValidationError[]) => ValidatedFormData]> => {
     const idPrefix = formData.get(SJSF_ID_PREFIX);
     if (typeof idPrefix !== 'string') {
       throw new Error(`"${SJSF_ID_PREFIX}" key is missing in FormData or not a string`);
@@ -129,24 +123,25 @@ export function createFormHandler<SendData extends boolean>({
         ? validator.validateFormValue(schema, data)
         : [];
     function validated(errors: ValidationError[]) {
+      const isValid = errors.length === 0
       return {
         idPrefix: idPrefix as string,
-        isValid: errors.length === 0,
-        sendData,
-        data: (sendData ? data : undefined) as SendData extends true ? FormValue : undefined,
+        isValid,
+        data: sendData ? data : undefined,
+        updateData: !isValid && (sendData === 'withoutClientSideUpdate' ? false : sendData),
         errors
-      } satisfies ValidatedFormData<SendData>;
+      } satisfies ValidatedFormData;
     }
     return [validated(errors), data, validated];
   };
 }
 
-export function isValid<T>(vfd: ValidatedFormData<boolean>, data: unknown): data is T {
+export function isValid<T>(vfd: ValidatedFormData, data: unknown): data is T {
   return vfd.isValid;
 }
 
-type FormRecord<F extends string, SendData extends boolean> = {
-  [K in F]: ValidatedFormData<SendData>;
+type FormRecord<F extends string> = {
+  [K in F]: ValidatedFormData;
 };
 
 interface FormMeta {
@@ -155,11 +150,10 @@ interface FormMeta {
 
 export function createAction<
   const F extends string,
-  const SendData extends boolean,
   E extends RequestEvent,
   R extends Record<string, any> | void
 >(
-  options: FormHandlerOptions<SendData> & {
+  options: FormHandlerOptions & {
     name: F;
   },
   userAction: (
@@ -169,26 +163,24 @@ export function createAction<
   ) => MaybePromise<ValidationError[] | R | void>
 ) {
   const handle = createFormHandler(options);
-  return async (
-    event: E
-  ): Promise<(FormRecord<F, SendData> & R) | ActionFailure<FormRecord<F, SendData>>> => {
+  return async (event: E): Promise<(FormRecord<F> & R) | ActionFailure<FormRecord<F>>> => {
     const [form, data, validated] = await handle(
       event.request.signal,
       await event.request.formData()
     );
     if (!form.isValid) {
-      return fail(400, { [options.name]: form } as FormRecord<F, SendData>);
+      return fail(400, { [options.name]: form } as FormRecord<F>);
     }
     let result = await userAction(data, event, form);
     if (Array.isArray(result)) {
       if (result.length > 0) {
         return fail(400, {
           [options.name]: validated(result)
-        } as FormRecord<F, SendData>);
+        } as FormRecord<F>);
       } else {
         result = undefined;
       }
     }
-    return { ...result, [options.name]: form } as FormRecord<F, SendData> & R;
+    return { ...result, [options.name]: form } as FormRecord<F> & R;
   };
 }

packages/sveltekit/src/routes/native-form.ssr.test.ts

@@ -58,15 +58,14 @@ describe.skip('native form SSR', () => {
         form: {
           idPrefix: 'root',
           isValid: false,
-          sendData: true,
           data: 'validated value',
           errors: [
             {
               path: [],
               message: 'validation error message'
             }
           ]
-        } satisfies ValidatedFormData<true>
+        } satisfies ValidatedFormData
       }
     });
     expect(body).toContain('Schema title');
@@ -91,15 +90,14 @@ describe.skip('native form SSR', () => {
         form: {
           idPrefix: 'root',
           isValid: true,
-          sendData: true,
           data: 'validated value',
           errors: [
             {
               path: [],
               message: 'validation error message'
             }
           ]
-        } satisfies ValidatedFormData<true>
+        } satisfies ValidatedFormData
       }
     });
     expect(body).toContain('Schema title');