refactor: update validation schema in dummy-form and tpk-form tests and enhance clearObjectValues utility

Author: remadex

doc-app/app/components/dummy-form.gts

@@ -2,7 +2,16 @@ import Component from '@glimmer/component';
 import { tracked } from '@glimmer/tracking';
 import { action } from '@ember/object';
 import { ImmerChangeset } from 'ember-immer-changeset';
-import { object, string, date, boolean, array, email } from 'zod';
+import {
+  object,
+  string,
+  date,
+  boolean,
+  array,
+  email,
+  union,
+  literal,
+} from 'zod';
 import TpkForm from '@triptyk/ember-input-validation/components/tpk-form';
 
 export default class DummyFormComponent extends Component {
@@ -19,9 +28,9 @@ export default class DummyFormComponent extends Component {
   });
 
   validationSchema = object({
-    firstName: string().min(2, 'At least 2 characters'),
+    firstName: string(),
     lastName: string().min(2, 'At least 2 characters'),
-    email: email('Invalid email'),
+    email: union([literal(''), email()]), // allow empty string or email
     phone: string(),
     birthday: date().max(new Date(), 'Cannot be in the future'),
     languages: array(string()).min(1, 'Select at least one language'),

doc-app/app/styles/app.css

@@ -5,7 +5,7 @@
 @import 'tailwindcss';
 @plugin "daisyui" {
   themes:
-    cupcake --default,
+    corporate --default,
     dark;
 }
 @import '@triptyk/ember-input/dist/app.css';

doc-app/tests/integration/components/ember-input-validation/tpk-form-test.gts

@@ -127,8 +127,7 @@ module('Integration | Component | tpk-form', function (hooks) {
     assert.dom('[data-test-tpk-validation-errors]').hasAnyText();
   });
 
-  // TODO: SHOULD BE FIXED AFTER WE FIND A WAY TO FIND REQUIRED FIELDS FROM ZOD SCHEMA
-  test.skip('Should display an asterisk in the label upon initialization of the form and when adding an element', async function (assert) {
+  test('Should display an asterisk in the label upon initialization of the form and when adding an element', async function (assert) {
     const changeset = new ImmerChangeset({
       email: '',
       address: {
@@ -148,12 +147,12 @@ module('Integration | Component | tpk-form', function (hooks) {
     const validationSchema = object({
       email: email(),
       address: object({
-        street: string(),
+        street: string().min(1),
         city: string(),
       }),
       levels: array(
         object({
-          name: string(),
+          name: string().min(1),
           grade: number(),
         })
       ),

packages/ember-input-validation/src/components/prefabs/tpk-validation-select.gts

@@ -54,6 +54,7 @@ export default class TpkValidationSelectPrefabComponent extends BaseValidationCo
   }
 
   get label() {
+    console.log('label', this.args.label, this.mandatory);
     return this.mandatory ? `${this.args.label} *` : this.args.label;
   }
 
@@ -76,7 +77,7 @@ export default class TpkValidationSelectPrefabComponent extends BaseValidationCo
       ...attributes
     >
       <TpkSelectComponent
-        @label={{@label}}
+        @label={{this.label}}
         @multiple={{@multiple}}
         @disabled={{@disabled}}
         @placeholder={{@placeholder}}

packages/ember-input-validation/src/utils/clear-object.ts

@@ -21,8 +21,14 @@ export function clearObjectValues(
         }
       } else if (typeof obj[key] === 'boolean') {
         newObj[key] = false;
-      } else {
+      } else if (typeof obj[key] === 'number') {
+        newObj[key] = 0;
+      } else if (typeof obj[key] === 'string') {
         newObj[key] = '';
+      } else if (typeof obj[key] === 'undefined') {
+        newObj[key] = undefined;
+      } else {
+        newObj[key] = null;
       }
     }
   }