add tag and small optimizations

chubbyts · Mar 30, 2020 · 8de7df6 · 8de7df6
1 parent a4e8023
commit 8de7df6
Show file tree

Hide file tree

Showing 11 changed files with 171 additions and 62 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -4,12 +4,12 @@
   "private": true,
   "dependencies": {
     "@testing-library/jest-dom": "^5.3.0",
-    "@testing-library/react": "^10.0.1",
-    "@testing-library/user-event": "^10.0.0",
+    "@testing-library/react": "^10.0.2",
+    "@testing-library/user-event": "^10.0.1",
     "@types/jest": "^25.1.4",
-    "@types/node": "^13.9.4",
+    "@types/node": "^13.9.5",
     "@types/qs": "^6.9.1",
-    "@types/react": "^16.9.26",
+    "@types/react": "^16.9.27",
     "@types/react-dom": "^16.9.5",
     "@types/react-router-dom": "^5.1.3",
     "coveralls": "^3.0.11",
@@ -20,7 +20,7 @@
     "qs": "^6.9.3",
     "react": "^16.13.1",
     "react-dom": "^16.13.1",
-    "react-hook-form": "^5.1.3",
+    "react-hook-form": "^5.2.0",
     "react-router-dom": "^5.1.2",
     "react-scripts": "3.4.1",
     "semantic-ui-css": "^2.4.1",

diff --git a/src/Component/Form/PetFilterForm.tsx b/src/Component/Form/PetFilterForm.tsx
@@ -11,12 +11,12 @@ const PetFilterForm: React.FC<PetFilterFormProps> = ({ submitPetFilter, filters,
 
     const { register, handleSubmit } = useForm<PetFilters>({ defaultValues: filters });
 
-    const onSubmit = (data: any) => {
-        Object.keys(data).forEach(key => {
-            data[key] = data[key] !== '' ? data[key] : undefined;
-        });
+    const onSubmit = (filters: PetFilters) => {
+        if ('' === filters.name) {
+            filters.name = undefined;
+        }
 
-        submitPetFilter(data);
+        submitPetFilter(filters);
     };
 
     return (

diff --git a/src/Component/Form/PetFilterFormProps.ts b/src/Component/Form/PetFilterFormProps.ts
@@ -3,7 +3,7 @@ import PetFilters from "../../Model/Pet/PetFilters";
 
 type PetFilterFormProps = {
     submitPetFilter: { (filters: PetFilters): void; },
-    filters?: any,
+    filters?: PetFilters,
     error?: BadRequest
 };
 

diff --git a/src/Component/Form/PetForm.tsx b/src/Component/Form/PetForm.tsx
@@ -11,11 +11,20 @@ const PetForm: React.FC<PetFormProps> = ({ submitPet, pet, error }: PetFormProps
 
     const { register, control, handleSubmit } = useForm<PetRequest>({ defaultValues: pet });
 
-    const vaccinations = useFieldArray({ control, name: 'vaccinations'});
+    const vaccinations = useFieldArray({ control, name: 'vaccinations' });
+
+    const onSubmit = (pet: PetRequest) => {
+        if ('' === pet.tag) {
+            pet.tag = undefined;
+        }
+
+        submitPet(pet);
+    };
 
     return (
-        <Form onSubmit={handleSubmit(submitPet)}>
+        <Form onSubmit={handleSubmit(onSubmit)}>
             <TextField register={register} name='name' label='Name' invalidParameters={invalidParameterByNameDenormalized.name ?? []} />
+            <TextField register={register} name='tag' label='Tag' invalidParameters={invalidParameterByNameDenormalized.tag ?? []} />
             <Form.Field>
                 <label>Vaccination</label>
                 {vaccinations.fields.map((vaccination, i) => {

diff --git a/src/Component/Page/Pet/List.tsx b/src/Component/Page/Pet/List.tsx
@@ -107,6 +107,7 @@ const List: React.FC = () => {
                                     <Link data-testid='sort-pet-name--' to={`/pet?${qs.stringify({ ...query, sort: { ...sort, name: undefined } })}`}> --- </Link>
                                     )
                                 </th>
+                                <th>Tag</th>
                                 <th>Actions</th>
                             </tr>
                         </thead>
@@ -117,6 +118,7 @@ const List: React.FC = () => {
                                     <td>{format(Date.parse(pet.createdAt), 'dd.MM.yyyy - HH:mm:ss', { locale: de })}</td>
                                     <td>{pet.updatedAt && format(Date.parse(pet.updatedAt), 'dd.MM.yyyy - HH:mm:ss', { locale: de })}</td>
                                     <td>{pet.name}</td>
+                                    <td>{pet.tag}</td>
                                     <td>
                                         {pet._links.read ? (
                                             <Button as={Link} to={`/pet/${pet.id}`}>Read</Button>

diff --git a/src/Component/Page/Pet/Read.tsx b/src/Component/Page/Pet/Read.tsx
@@ -65,6 +65,10 @@ const Read: React.FC<Props> = ({ match }: Props) => {
                             <List.Header>Name</List.Header>
                             {pet.name}
                         </List.Item>
+                        <List.Item>
+                            <List.Header>Tag</List.Header>
+                            {pet.tag}
+                        </List.Item>
                         <List.Item>
                             <List.Header>Vaccinations</List.Header>
                             {pet.vaccinations.length > 0 ? (

diff --git a/src/Model/Pet/PetList.ts b/src/Model/Pet/PetList.ts
@@ -7,7 +7,13 @@ class PetList {
     count: number;
     _embedded: Embedded;
     _links: Links;
-    constructor({ offset, limit, count, _embedded, _links }: { offset: number, limit: number, count: number, _embedded: Embedded, _links: Links }) {
+    constructor({ offset, limit, count, _embedded, _links }: {
+        offset: number,
+        limit: number,
+        count: number,
+        _embedded: Embedded,
+        _links: Links
+    }) {
         this.offset = offset;
         this.limit = limit;
         this.count = count;