Fix styling and crashign date field

Wholteza · Dec 23, 2023 · 956b480 · 956b480
1 parent fa44f7b
commit 956b480
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 12 deletions.
diff --git a/src/helpers/dynamic-object-helpers.ts b/src/helpers/dynamic-object-helpers.ts
@@ -24,10 +24,10 @@ export const mutatePropOnPath = <K>(
 export const getValueOnPath = <T>(
   dynamicObject: Record<string, never>,
   propertyPath: string[]
-): T => {
+): T | null => {
   const [key, ...rest] = propertyPath;
   if (!rest.length) {
-    return dynamicObject[key] as T;
+    return dynamicObject[key] as T | null;
   }
   return getValueOnPath(dynamicObject[key], rest);
 };

diff --git a/src/hooks/use-form/use-form-helpers.spec.ts b/src/hooks/use-form/use-form-helpers.spec.ts
@@ -78,7 +78,7 @@ describe("getFormValueBasedOnPropertyInformation", () => {
     );
 
     // assert
-    expect(result).toBe(expectedValue.toLocaleDateString());
+    expect(result).toBe(expectedValue.toLocaleDateString("sv-SE"));
     expect(spy).toHaveBeenCalledWith(dynamicObject, information.propertyPath);
   });
   it("throws if type is anything but the implemented ones", () => {

diff --git a/src/hooks/use-form/use-form-helpers.ts b/src/hooks/use-form/use-form-helpers.ts
@@ -11,14 +11,18 @@ export const getFormValueBasedOnPropertyInformation = (
 ): string | number => {
   switch (information.type) {
     case "string":
-      return getValueOnPath<string>(dynamicObject, information.propertyPath);
+      return (
+        getValueOnPath<string>(dynamicObject, information.propertyPath) ?? ""
+      );
     case "number":
-      return getValueOnPath<number>(dynamicObject, information.propertyPath);
+      return (
+        getValueOnPath<number>(dynamicObject, information.propertyPath) ?? 0
+      );
     case "date":
-      return getValueOnPath<Date>(
-        dynamicObject,
-        information.propertyPath
-      ).toLocaleDateString();
+      return (
+        getValueOnPath<Date>(dynamicObject, information.propertyPath) ??
+        new Date(Date.now())
+      ).toLocaleDateString("se-SE");
     default:
       throw new Error(`field type ${information.type} is not implemented`);
   }

diff --git a/src/index.scss b/src/index.scss
@@ -5,6 +5,7 @@ $color-primary-light:  #B8B8FF;
 $color-background:  #F8F7FF;
 $color-secondary-light:  #FFEEDD;
 $color-secondary:  #FFD8BE;
+$color-secondary-text:  color-mix(in srgb, #FFD8BE 40%, black);
 
 @mixin font-family {
   font-family: 'Ubuntu Mono';
@@ -14,7 +15,6 @@ $color-secondary:  #FFD8BE;
 
 @mixin secondary-text-color{
   color: $color-secondary;
-  filter: brightness(50%);
 }
 
 @mixin fade-in-animation {
@@ -75,7 +75,6 @@ body {
   width: 100vw;
   height: 100vh;
   @media (min-width: 768px) {
-    width: 500px;
     margin: 0 auto;
   }
 }
@@ -175,7 +174,7 @@ hr {
     width: 100%;
   }
   label {
-    @include secondary-text-color();
+    color: $color-secondary-text;
     font-weight: 600;
     text-transform: capitalize;
     position: relative;