From bc64a9bfa7ac60af30caa7b59133da910ca3ab8a Mon Sep 17 00:00:00 2001
From: Jerko Steiner <jerko.steiner@gmail.com>
Date: Wed, 3 Apr 2019 19:42:48 +0800
Subject: [PATCH] Load site on edit

---
 packages/client/src/crud/CRUD.test.tsx  | 34 +++++--------
 packages/client/src/crud/CRUDForm.tsx   |  3 ++
 packages/client/src/crud/CRUDReducer.ts | 65 ++++++++++---------------
 3 files changed, 42 insertions(+), 60 deletions(-)

diff --git a/packages/client/src/crud/CRUD.test.tsx b/packages/client/src/crud/CRUD.test.tsx
index 52f9660..005b044 100644
--- a/packages/client/src/crud/CRUD.test.tsx
+++ b/packages/client/src/crud/CRUD.test.tsx
@@ -312,24 +312,20 @@ describe('CRUD', () => {
     describe('create', () => {
       it('resets form.create state', () => {
         store.dispatch(actions.create({name: 'a'}))
-        expect(store.getState().Crud.form.create).toEqual({
-          item: {
-            name: 'a',
-          },
-          errors: {},
+        expect(store.getState().Crud.form.createItem).toEqual({
+          name: 'a',
         })
+        expect(store.getState().Crud.form.createErrors).toEqual({})
       })
     })
 
     describe('change', () => {
       it('sets value', () => {
         store.dispatch(actions.change({key: 'name', value: 'test'}))
-        expect(store.getState().Crud.form.create).toEqual({
-          item: {
-            name: 'test',
-          },
-          errors: {},
+        expect(store.getState().Crud.form.createItem).toEqual({
+          name: 'test',
         })
+        expect(store.getState().Crud.form.createErrors).toEqual({})
       })
     })
 
@@ -352,20 +348,14 @@ describe('CRUD', () => {
           body: {name: 'test'},
         })).payload
         store.dispatch(actions.edit({id: 100}))
-        expect(store.getState().Crud.form.byId[100]).toEqual({
-          item: {
-            id: 100,
-            name: 'test',
-          },
-          errors: {},
+        expect(store.getState().Crud.form.itemsById[100]).toEqual({
+          id: 100,
+          name: 'test',
         })
         store.dispatch(actions.change({id: 100, key: 'name', value: 'grrr'}))
-        expect(store.getState().Crud.form.byId[100]).toEqual({
-          item: {
-            id: 100,
-            name: 'grrr',
-          },
-          errors: {},
+        expect(store.getState().Crud.form.itemsById[100]).toEqual({
+          id: 100,
+          name: 'grrr',
         })
       })
     })
diff --git a/packages/client/src/crud/CRUDForm.tsx b/packages/client/src/crud/CRUDForm.tsx
index 0ee1264..c4584df 100644
--- a/packages/client/src/crud/CRUDForm.tsx
+++ b/packages/client/src/crud/CRUDForm.tsx
@@ -72,6 +72,9 @@ export class CRUDField<T> extends React.PureComponent<ICRUDFieldProps<T>> {
 }
 
 export class CRUDForm<T> extends React.PureComponent<ICRUDFormProps<T>> {
+  static defaultProps = {
+    errors: {},
+  }
   handleSubmit = (e: React.FormEvent) => {
     e.preventDefault()
     const {onSubmit, item} = this.props
diff --git a/packages/client/src/crud/CRUDReducer.ts b/packages/client/src/crud/CRUDReducer.ts
index 9798e35..c172f2e 100644
--- a/packages/client/src/crud/CRUDReducer.ts
+++ b/packages/client/src/crud/CRUDReducer.ts
@@ -20,14 +20,11 @@ export interface ICRUDState<T extends ICRUDEntity> {
 }
 
 export interface ICRUDForm<T extends ICRUDEntity> {
-  readonly create: {
-    readonly item: Pick<T, Exclude<keyof T, 'id'>>,
-    readonly errors: Partial<Record<keyof T, string>>
-  }
-  readonly byId: Record<number, {
-    readonly item: T,
-    readonly errors: Partial<Record<keyof T, string>>
-  }>
+  readonly createItem: Pick<T, Exclude<keyof T, 'id'>>,
+  readonly createErrors: Partial<Record<keyof T, string>>
+
+  readonly itemsById: Record<number, T>
+  readonly errorsById: Record<number, Partial<Record<keyof T, string>>>
 }
 
 export interface ICRUDStatus {
@@ -54,11 +51,10 @@ export class CRUDReducer<
       ids: [],
       byId: {},
       form: {
-        byId: {},
-        create: {
-          item: newItem,
-          errors: {},
-        },
+        itemsById: {},
+        errorsById: {},
+        createItem: newItem,
+        createErrors: {},
       },
 
       status: {
@@ -188,13 +184,11 @@ export class CRUDReducer<
       ...state,
       form: {
         ...state.form,
-        create: {
-          item: {
-            ...this.newItem,
-            ...payload,
-          },
-          errors: {},
+        createItem: {
+          ...this.newItem,
+          ...payload,
         },
+        createErrors: {},
       },
     }
   }
@@ -204,12 +198,13 @@ export class CRUDReducer<
       ...state,
       form: {
         ...state.form,
-        byId: {
-          ...state.form.byId,
-          [id]: {
-            item: state.byId[id],
-            errors: {},
-          },
+        itemsById: {
+          ...state.form.itemsById,
+          [id]: state.byId[id],
+        },
+        errorsById: {
+          ...state.form.errorsById,
+          [id]: {},
         },
       },
     }
@@ -227,12 +222,9 @@ export class CRUDReducer<
         ...state,
         form: {
           ...state.form,
-          create: {
-            ...state.form.create,
-            item: {
-              ...state.form.create.item,
-              [key]: value,
-            },
+          createItem: {
+            ...state.form.createItem,
+            [key]: value,
           },
         },
       }
@@ -242,14 +234,11 @@ export class CRUDReducer<
       ...state,
       form: {
         ...state.form,
-        byId: {
-          ...state.form.byId,
+        itemsById: {
+          ...state.form.itemsById,
           [id]: {
-            ...state.form.byId[id],
-            item: {
-              ...state.form.byId[id].item,
-              [key]: value,
-            },
+            ...state.form.itemsById[id],
+            [key]: value,
           },
         },
       },