Merge pull request #423 from ertush/hotfix

Added delete button for contact form in community unit form
ertush · Jul 15, 2024 · e3900ed · e3900ed
2 parents 463d43f + da5dc7b
commit e3900ed
Show file tree

Hide file tree

Showing 4 changed files with 68 additions and 6 deletions.
diff --git a/components/Forms/CommunityUnitsForms.js b/components/Forms/CommunityUnitsForms.js
@@ -1,7 +1,8 @@
 
 import MainLayout from '../MainLayout';
 import CommunityUnitSideMenu from '../CommunityUnitSideMenu';
-import { Select as CustomSelect } from './formComponents/Select'
+import { Select as CustomSelect } from './formComponents/Select';
+
 import Link from 'next/link';
 import * as Tabs from "@radix-ui/react-tabs";
 import {
@@ -654,15 +655,28 @@ function EditCommunityUnitsBasicDeatilsForm(props) {
                       *
                     </span>
                   </label>
+                  <div className='flex gap-2 w-full'>
                   <input
                     required
                     type="text"
                     name={`contact_${i}`}
                     onChange={handleFieldChange}
                     id={`contact_${i}`}
                     defaultValue={contact}
-                    className="flex-none w-full bg-transparent  p-2 flex-grow border placeholder-gray-500 border-gray-400 rounded focus:shadow-none focus:bg-white focus:border-black outline-none"
+                    className="flex-none w-auto bg-transparent  p-2 flex-grow border placeholder-gray-500 border-gray-400 rounded focus:shadow-none focus:bg-white focus:border-black outline-none"
                   />
+
+                    <button 
+                    id={`delete-btn-${i}`}
+                    onClick={ev => {
+                        ev.preventDefault();
+                        setContacts(contacts.filter((_, index) => index !== i))
+
+                    }}
+                    >
+                      <XCircleIcon className='w-7 h-7 text-red-400'/>
+                      </button>
+                      </div>
                 </div>
               </div>
             );

diff --git a/components/Forms/RegulationForm.js b/components/Forms/RegulationForm.js
@@ -235,7 +235,7 @@ function handleLicenseFileChange (e) {
                 options?.data ? 
                 handleRegulationUpdates(options?.token, values, options?.data?.id, fileRef.current, setSubmitting, router, alert, setFormError, submitType)
                 :
-                handleRegulationSubmit(options.token, values, facilityId, setSubmitting, fileRef.current, alert, setFormError)
+                handleRegulationSubmit(options.token, values, facilityId, setSubmitting, fileRef.current, alert, setFormError, router)
 
 
             }}

diff --git a/controllers/facility/facilityHandlers.js b/controllers/facility/facilityHandlers.js
@@ -307,7 +307,7 @@ function handleFacilityContactsSubmit(token, values, facilityId) {
 };
 
 // handleRegulationSubmit
-async function handleRegulationSubmit(token, values, facilityId, setSubmitting, licenseFile, alert, setFormError) {
+async function handleRegulationSubmit(token, values, facilityId, setSubmitting, licenseFile, alert, setFormError, router) {
 
     // console.log({license: licenseFileRef.current})
 
@@ -405,6 +405,19 @@ async function handleRegulationSubmit(token, values, facilityId, setSubmitting,
                     alert.error('Unable to create Facility Department units', {
                         timeout: 10000
                     })
+
+                    const formDataBase64Enc = Buffer.from(JSON.stringify(payload)).toString('base64')
+
+                    router.push({
+                        pathname: `${window.location.origin}/facilities/add`,
+                        query: { 
+                          regulation: formDataBase64Enc,
+                          formId: 4,
+                          facilityId: facilityId,
+                          from: 'submission'
+
+                        }
+                    })
                 }
             })
             .catch(console.error)
@@ -414,6 +427,20 @@ async function handleRegulationSubmit(token, values, facilityId, setSubmitting,
                 timeout: 10000
             })
 
+            const formDataBase64Enc = Buffer.from(JSON.stringify(payload)).toString('base64')
+
+            router.push({
+                pathname: `${window.location.origin}/facilities/add`,
+                query: { 
+                  regulation: formDataBase64Enc,
+                  formId: 4,
+                  facilityId: facilityId,
+                  from: 'submission'
+
+                }
+            })
+
+
             resp.json()
             .then(resp => {
                 const formResponse = []

diff --git a/pages/community-units/add.js b/pages/community-units/add.js
@@ -10,7 +10,8 @@ import StepLabel from '@mui/material/StepLabel';
 import CommunityUnitSideMenu from '../../components/CommunityUnitSideMenu';
 import { 
 	ChevronDoubleRightIcon, 
-	ChevronDoubleLeftIcon, 
+	ChevronDoubleLeftIcon,
+	XCircleIcon, 
 	TrashIcon } from '@heroicons/react/solid';
 import { Select as CustomSelect } from '../../components/Forms/formComponents/Select';
 import Select from 'react-select'
@@ -619,6 +620,7 @@ function CommunityUnitsBasciDetailsForm(props) {
 										defaultValue={Array.isArray(formData?.contacts) ? formData?.contacts[i]?.contact_type : ''}
 									/>
 								</div>
+								<div className='flex w-full gap-2 items-center'>
 								<div className='w-full flex flex-col items-left px-2 justify-  gap-1 gap-x-3 mb-3' >
 									<label
 										htmlFor={`contact_${i}`}
@@ -634,10 +636,29 @@ function CommunityUnitsBasciDetailsForm(props) {
 										type='text'
 										name={`contact_${i}`}
 										defaultValue={Array.isArray(formData?.contacts) ? formData?.contacts[i]?.contact : '' }
-										className='flex-none w-full bg-transparent  p-2 flex-grow border placeholder-gray-500 border-gray-600 focus:shadow-none focus:bg-white focus:border-black outline-none'
+										className='flex-none flex-grow bg-transparent  p-2 w-auto border placeholder-gray-500 border-gray-600 focus:shadow-none focus:bg-white focus:border-black outline-none'
 									/>
 								</div>
 
+								<button 
+                    id={`delete-btn-${i}`}
+                    onClick={ev => {
+                        ev.preventDefault();
+
+						if(Array.isArray(formData?.contacts) && formData.length >= 1) {
+							setFormData({contact: formData?.contact.filter((_, index) => index !== i)})
+						} else {
+							setContactList(contactList.filter((_, index) => index !== i))
+						}
+
+
+
+                    }}
+                    >
+                      <XCircleIcon className='w-7 h-7 text-red-400'/>
+                      </button>
+								</div>
+
 							</div>)
 					})
 					}