Skip to content

Commit

Permalink
Merge pull request #95 from suvarnakale/release-1.0.0
Browse files Browse the repository at this point in the history 
Issue #PS-771 feat: custom buttons introduced in rjsf forms
  • Loading branch information
@itsvick
itsvick authored Aug 5, 2024
2 parents 6313686 + d831347 commit d99617f
Show file tree
Hide file tree
Showing 9 changed files with 421 additions and 380 deletions.
4 changes: 3 additions & 1 deletion public/locales/en/common.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -120,7 +120,9 @@
"LEARNER_CREATED_SUCCESSFULLY": "Leaner has been Successfully Created!",
"FACILITATOR_ADDED_SUCCESSFULLY": "Facilitator added successfully!",
"LEARNER_UPDATED_SUCCESSFULLY": "Learner profile updated successfully!",
"FACILITATOR_UPDATED_SUCCESSFULLY": "Facilitator profile updated successfully!"
"FACILITATOR_UPDATED_SUCCESSFULLY": "Facilitator profile updated successfully!",
"PLEASE_SELECT_THE_CENTER": "Please select the center.",
"CREATE": "Create"
},
"LOGIN_PAGE": {
"USERNAME": "Username",
Expand Down
225 changes: 127 additions & 98 deletions src/components/AddFacilitator.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import { useTranslation } from 'next-i18next';
import { showToastMessage } from './Toastify';
import { editEditUser } from '@/services/ProfileService';
import { tenantId } from '../../app.config';
import FormButtons from './FormButtons';

interface AddFacilitatorModalprops {
open: boolean;
Expand All @@ -41,6 +42,7 @@ const AddFacilitatorModal: React.FC<AddFacilitatorModalprops> = ({
const [uiSchema, setUiSchema] = React.useState<any>();
const [reloadProfile, setReloadProfile] = React.useState(false);
const [email, setEmail] = React.useState('[email protected]');
const [formData, setFormData] = React.useState<any>();

const { t } = useTranslation();
useEffect(() => {
Expand Down Expand Up @@ -108,6 +110,9 @@ const AddFacilitatorModal: React.FC<AddFacilitatorModalprops> = ({
data: IChangeEvent<any, RJSFSchema, any>,
event: React.FormEvent<any>
) => {
setTimeout(() => {
setFormData(data.formData);
});
const target = event.target as HTMLFormElement;
const elementsArray = Array.from(target.elements);

Expand All @@ -126,122 +131,141 @@ const AddFacilitatorModal: React.FC<AddFacilitatorModalprops> = ({

const formData = data.formData;
console.log('Form data submitted:', formData);
const schemaProperties = schema.properties;
setEmail(formData?.email);
const { username, password } = generateUsernameAndPassword('MH', 'F');
};

const apiBody: any = {
username: username,
password: password,
tenantCohortRoleMapping: [
{
tenantId: tenantId,
roleId: RoleId.TEACHER,
cohortId: formData?.assignCenters,
},
],
customFields: [],
};
useEffect(() => {
if (formData) {
handleButtonClick();
}
}, [formData]);

Object.entries(formData).forEach(([fieldKey, fieldValue]) => {
const fieldSchema = schemaProperties[fieldKey];
const fieldId = fieldSchema?.fieldId;
console.log(
`FieldID: ${fieldId}, FieldValue: ${fieldValue}, type: ${typeof fieldValue}`
);
const handleButtonClick = async () => {
console.log('Form data:', formData);
if (formData) {
const schemaProperties = schema.properties;
setEmail(formData?.email);
const { username, password } = generateUsernameAndPassword('MH', 'F');

if (fieldId === null || fieldId === 'null') {
if (typeof fieldValue !== 'object') {
apiBody[fieldKey] = fieldValue;
}
} else {
if (
fieldSchema?.hasOwnProperty('isDropdown') ||
fieldSchema.hasOwnProperty('isCheckbox')
) {
apiBody.customFields.push({
fieldId: fieldId,
value: [String(fieldValue)],
});
const apiBody: any = {
username: username,
password: password,
tenantCohortRoleMapping: [
{
tenantId: tenantId,
roleId: RoleId.TEACHER,
cohortId: formData?.assignCenters,
},
],
customFields: [],
};

Object.entries(formData).forEach(([fieldKey, fieldValue]) => {
const fieldSchema = schemaProperties[fieldKey];
const fieldId = fieldSchema?.fieldId;
console.log(
`FieldID: ${fieldId}, FieldValue: ${fieldValue}, type: ${typeof fieldValue}`
);

if (fieldId === null || fieldId === 'null') {
if (typeof fieldValue !== 'object') {
apiBody[fieldKey] = fieldValue;
}
} else {
if (fieldSchema.checkbox && fieldSchema.type === 'array') {
if (
fieldSchema?.hasOwnProperty('isDropdown') ||
fieldSchema.hasOwnProperty('isCheckbox')
) {
apiBody.customFields.push({
fieldId: fieldId,
value: String(fieldValue).split(','),
value: [String(fieldValue)],
});
} else {
apiBody.customFields.push({
fieldId: fieldId,
value: String(fieldValue),
});
if (fieldSchema.checkbox && fieldSchema.type === 'array') {
if (Array.isArray(fieldValue) && fieldValue.length > 0) {
apiBody.customFields.push({
fieldId: fieldId,
value: String(fieldValue).split(','),
});
}
} else {
apiBody.customFields.push({
fieldId: fieldId,
value: String(fieldValue),
});
}
}
}
}
});
});

if (typeof window !== 'undefined' && window.localStorage) {
const fieldData = JSON.parse(localStorage.getItem('fieldData') ?? '');
if (typeof window !== 'undefined' && window.localStorage) {
const fieldData = JSON.parse(localStorage.getItem('fieldData') ?? '');

if (!isEditModal && fieldData) {
apiBody.customFields.push({
fieldId: fieldData?.state?.blockId,
value: [fieldData?.state?.blockCode],
});
apiBody.customFields.push({
fieldId: fieldData?.state?.stateId,
value: [fieldData?.state?.stateCode],
});
apiBody.customFields.push({
fieldId: fieldData?.state?.districtId,
value: [fieldData?.state?.districtCode],
});
if (!isEditModal && fieldData) {
apiBody.customFields.push({
fieldId: fieldData?.state?.blockId,
value: [fieldData?.state?.blockCode],
});
apiBody.customFields.push({
fieldId: fieldData?.state?.stateId,
value: [fieldData?.state?.stateCode],
});
apiBody.customFields.push({
fieldId: fieldData?.state?.districtId,
value: [fieldData?.state?.districtCode],
});
}
}
}

console.log(apiBody);
try {
if (isEditModal && userId) {
const userData = {
name: apiBody.name,
mobile: apiBody.mobile,
father_name: apiBody.father_name,
};
const customFields = apiBody.customFields;
console.log(customFields);
const object = {
userData: userData,
customFields: customFields,
};
const response = await editEditUser(userId, object);
if (response) {
showToastMessage(
t('COMMON.FACILITATOR_UPDATED_SUCCESSFULLY'),
'success'
);
setReloadProfile(true);
onReload?.();
}
} else {
const response = await createUser(apiBody);
console.log(response);
if (response) {
onFacilitatorAdded?.();
onClose();
showToastMessage(
t('COMMON.FACILITATOR_ADDED_SUCCESSFULLY'),
'success'
);
setOpenModal(true);
console.log(apiBody);
try {
if (isEditModal && userId) {
const userData = {
name: apiBody.name,
mobile: apiBody.mobile,
father_name: apiBody.father_name,
};
const customFields = apiBody.customFields;
console.log(customFields);
const object = {
userData: userData,
customFields: customFields,
};
const response = await editEditUser(userId, object);
if (response) {
showToastMessage(
t('COMMON.FACILITATOR_UPDATED_SUCCESSFULLY'),
'success'
);
setReloadProfile(true);
onReload?.();
}
} else {
showToastMessage(t('COMMON.SOMETHING_WENT_WRONG'), 'error');
if (formData?.assignCenters?.length > 0) {
const response = await createUser(apiBody);
console.log(response);
if (response) {
onFacilitatorAdded?.();
onClose();
showToastMessage(
t('COMMON.FACILITATOR_ADDED_SUCCESSFULLY'),
'success'
);
setOpenModal(true);
} else {
showToastMessage(t('COMMON.SOMETHING_WENT_WRONG'), 'error');
}
} else {
showToastMessage(t('COMMON.PLEASE_SELECT_THE_CENTER'), 'error');
}
}
} catch (error) {
onClose();
showToastMessage(t('COMMON.SOMETHING_WENT_WRONG'), 'error');
setReloadProfile(true);
}
} catch (error) {
onClose();
showToastMessage(t('COMMON.SOMETHING_WENT_WRONG'), 'error');
setReloadProfile(true);
}
};

const handleChange = (event: IChangeEvent<any>) => {
console.log('Form data changed:', event.formData);
};
Expand Down Expand Up @@ -295,7 +319,12 @@ const AddFacilitatorModal: React.FC<AddFacilitatorModalprops> = ({
showErrorList={true}
customFields={customFields}
>
{/* <CustomSubmitButton onClose={primaryActionHandler} /> */}
<FormButtons
formData={formData}
onClick={handleButtonClick}
isCreatedFacilitator={true}
isCreateCentered={false}
/>{' '}
</DynamicForm>
)}
</SimpleModal>
Expand Down
Loading

0 comments on commit d99617f

Please sign in to comment.