From da5dc7b9d089fd777db659217aac7845163691a9 Mon Sep 17 00:00:00 2001
From: eric <erotush77@gmail.com>
Date: Mon, 15 Jul 2024 17:20:29 +0300
Subject: [PATCH] Added delete button for contact form in community unit form
---
components/Forms/CommunityUnitsForms.js | 18 +++++++++++++--
components/Forms/RegulationForm.js | 2 +-
controllers/facility/facilityHandlers.js | 29 +++++++++++++++++++++++-
pages/community-units/add.js | 25 ++++++++++++++++++--
4 files changed, 68 insertions(+), 6 deletions(-)
diff --git a/components/Forms/CommunityUnitsForms.js b/components/Forms/CommunityUnitsForms.js
index 42fdbda2..31025b73 100644
--- 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,6 +655,7 @@ function EditCommunityUnitsBasicDeatilsForm(props) {
*
</span>
</label>
+ <div className='flex gap-2 w-full'>
<input
required
type="text"
@@ -661,8 +663,20 @@ function EditCommunityUnitsBasicDeatilsForm(props) {
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
index ee740415..6f74ec35 100644
--- 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
index 9d3f49ed..e625b9fa 100644
--- 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
index cb6ed282..4400df48 100644
--- 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>)
})
}