\r\n
,\r\n );\r\n });\r\n }\r\n\r\n if (!skipSiteInfoValidation) {\r\n let sitesToCheck = siteInfoValid;\r\n\r\n // if siteInfoIdToCheck provided, only the site id provided will have validation check\r\n if (siteInfoIdToCheck) {\r\n sitesToCheck = {\r\n [siteInfoIdToCheck]: siteInfoValid[siteInfoIdToCheck],\r\n };\r\n }\r\n\r\n // adding for temp fix\r\n delete sitesToCheck['studyInfo'];\r\n\r\n Object.entries(sitesToCheck).forEach(([siteInfoId, siteValidationObject]) => {\r\n Object.entries(siteValidationObject).forEach(([key, isValid]) => {\r\n if (!isValid) {\r\n if (!invalidSiteStatus?.[siteInfoId]) {\r\n invalidSiteStatus[siteInfoId] = [];\r\n }\r\n invalidSiteStatus[siteInfoId].push(key);\r\n }\r\n });\r\n });\r\n\r\n Object.entries(invalidSiteStatus).forEach(([siteInfoId, siteError], index) => {\r\n if (siteInfoId.toString() !== '-1') {\r\n siteError.forEach((item, siteErrorIndex) => {\r\n const isLastIndex = siteError.length === siteErrorIndex + 1;\r\n\r\n if (siteErrorIndex === 0) {\r\n const siteName =\r\n applicationDetail.siteInfo.find((item) => item.id.toString() === siteInfoId.toString())\r\n ?.institution ?? 'undefined';\r\n messages.push(\r\n \r\n
\r\n {index + 1}.
{formLookup(item)}\r\n \r\n {validationFailList\r\n .map((validationKey) => {\r\n return studyInfoLookup()?.[validationKey]?.number ?? 'undefined';\r\n })\r\n .join(', ')}\r\n
\r\n {siteErrorIndex + 1}.
{formLookup(item)}\r\n \r\n \r\n {validationFailList\r\n .map((validationKey) => {\r\n return siteInfoLookup()?.[validationKey]?.number ?? 'undefined';\r\n })\r\n .join(', ')}\r\n
\r\n ,\r\n );\r\n });\r\n }\r\n });\r\n }\r\n\r\n let isFormValid = true;\r\n\r\n if (!skipStudyInfoValidation) {\r\n if (invalidStudyKey.length > 0) {\r\n isFormValid = false;\r\n }\r\n }\r\n\r\n if (!skipSiteInfoValidation) {\r\n if (Object.entries(invalidSiteStatus).length > 0) {\r\n isFormValid = false;\r\n }\r\n }\r\n\r\n return {\r\n messages: messages,\r\n isFormValid: isFormValid,\r\n };\r\n};\r\n\r\nexport const isSiteOutlineFormValid = (applicationDetail, siteInfoData) => {\r\n const dataChecked = applicationDetail.applicationForm['p1ConductedHa'];\r\n\r\n if (dataChecked) {\r\n const isExist = applicationDetail.studySiteApply.some(\r\n (item) => item?.siteInfo?.id?.toString() === siteInfoData.id.toString(),\r\n );\r\n\r\n if (!isExist) {\r\n return false;\r\n }\r\n }\r\n\r\n // wait for ha feedback\r\n return true;\r\n};\r\n\r\nexport const isSiteStudyDetailFormValid = (data) => {\r\n const { p2NumSubject, p2SubjectRecruit } = data;\r\n\r\n if (checkNull(p2NumSubject) || checkNull(p2SubjectRecruit)) {\r\n return false;\r\n }\r\n\r\n return true;\r\n};\r\n\r\nexport const checkNull = (value) => {\r\n if (value === undefined || value === null || value === '') {\r\n return true;\r\n }\r\n\r\n return false;\r\n};\r\n\r\nexport const isSiteStudyDetailForProspectiveFormValid = (applicationDetail, data) => {\r\n const { p2NumOfExtra, p2OtherInvestigator, p2WhomWhere } = data;\r\n let { p2StudyDesign } = applicationDetail.applicationForm;\r\n\r\n // no need to input value when p2StudyDesign === 'P' in application detail\r\n if (p2StudyDesign === 'R' || p2StudyDesign === null) {\r\n return true;\r\n }\r\n\r\n if (checkNull(p2NumOfExtra) || checkNull(p2OtherInvestigator)) {\r\n return false;\r\n }\r\n\r\n if (p2OtherInvestigator === true) {\r\n if (checkNull(p2WhomWhere)) {\r\n return false;\r\n }\r\n }\r\n\r\n return true;\r\n};\r\n\r\nexport const isSiteEthicalFormValid = (applicationDetail, data) => {\r\n const { p3InformConsentOthersReason, p3InformConsentPrincipalInv } = data;\r\n const { p3Methodology } = applicationDetail.applicationForm;\r\n\r\n if (p3Methodology === 'N') {\r\n return true;\r\n }\r\n\r\n if (checkNull(p3InformConsentPrincipalInv)) {\r\n return false;\r\n }\r\n\r\n if (p3InformConsentPrincipalInv === 3 && checkNull(p3InformConsentOthersReason)) {\r\n return false;\r\n }\r\n\r\n return true;\r\n};\r\n\r\nexport const isSiteBudgetFormValid = (data) => {\r\n const {\r\n p4ExtraHAResources,\r\n p4ExtraHAResourcesDetails,\r\n p4ExtraHAResourcesAffect,\r\n p4Reimburse,\r\n p4ReimburseFormat,\r\n p4ReimburseReason,\r\n } = data;\r\n\r\n if (checkNull(p4ExtraHAResources) || checkNull(p4Reimburse)) {\r\n return false;\r\n }\r\n\r\n if (p4ExtraHAResources === true && (checkNull(p4ExtraHAResourcesDetails) || checkNull(p4ExtraHAResourcesAffect))) {\r\n return false;\r\n }\r\n\r\n if (p4Reimburse === true && checkNull(p4ReimburseFormat)) {\r\n return false;\r\n }\r\n\r\n if (p4Reimburse === false && checkNull(p4ReimburseReason)) {\r\n return false;\r\n }\r\n\r\n return true;\r\n};\r\n\r\nexport const checkSiteInfoStudent = (siteInfoList, postDataSiteInfo) => {\r\n let res = false;\r\n for (let i of siteInfoList) {\r\n const index = postDataSiteInfo.findIndex((item) => item.id === i.id);\r\n if (i.student) {\r\n if (index !== -1) {\r\n res = postDataSiteInfo[index].student;\r\n } else {\r\n res = true;\r\n }\r\n if (res) {\r\n break;\r\n }\r\n }\r\n }\r\n return res;\r\n};\r\n\r\nexport const checkStudyInfoDocumentUploadValid = ({ applicationDetail, isAmendment, isStudent, formId }) => {\r\n const validationKey = 'documentUploadValid';\r\n const state = getStore().getState();\r\n const validationDetail = state.validation.study;\r\n let studyInfoValidation = validationDetail[validationKey];\r\n\r\n let supportingDocumentRows = []; /** type = 7 */\r\n for (let i of applicationDetail.uploadDocuments) {\r\n if (i.type === 7) {\r\n supportingDocumentRows.push(i);\r\n }\r\n }\r\n\r\n /** check student info */\r\n if (isStudent && !supportingDocumentRows.length && !isAmendment) {\r\n studyInfoValidation.docUpload_7 = false;\r\n } else {\r\n studyInfoValidation.docUpload_7 = true;\r\n }\r\n const isUploadDocFormValid =\r\n Object.keys(studyInfoValidation).filter((key) => {\r\n return studyInfoValidation[key] === false;\r\n }).length === 0;\r\n\r\n store.dispatch({\r\n type: UPDATE_FORM_VALIDITY,\r\n payload: {\r\n type: 'study',\r\n applicationFormId: formId,\r\n formKey: 'documentUploadValid',\r\n isValid: isUploadDocFormValid,\r\n },\r\n });\r\n updateStudyValidation({ validationKey, studyInfoValidation });\r\n};\r\n\r\nexport const isDocumentUploadValid = (applicationDetail, siteInfoData) => {\r\n /** check siteInfo */\r\n const siteInfoId = siteInfoData.id;\r\n const validationKey = 'documentUploadValid';\r\n let valids = {};\r\n const setValid = (key, valid) => {\r\n valids = {\r\n ...valids,\r\n [key]: valid,\r\n };\r\n };\r\n\r\n let valid = true;\r\n let declarationRows = []; /** type = 5 */\r\n let signedApplicationFormRows = []; /** type = 10 */\r\n let indemnityAgreementRows = []; /** type = 6 */\r\n\r\n for (let i of applicationDetail.uploadDocuments) {\r\n if (i.type === 5 && i.siteInfo?.id === siteInfoData.id) {\r\n declarationRows.push(i);\r\n }\r\n if (i.type === 10 && i.siteInfo?.id === siteInfoData.id) {\r\n signedApplicationFormRows.push(i);\r\n }\r\n if (i.type === 6 && i.siteInfo?.id === siteInfoData.id) {\r\n indemnityAgreementRows.push(i);\r\n }\r\n }\r\n\r\n if (declarationRows.length) {\r\n setValid('docUpload_5', true);\r\n } else {\r\n valid = false;\r\n setValid('docUpload_5', false);\r\n }\r\n if (signedApplicationFormRows.length) {\r\n setValid('docUpload_10', true);\r\n } else {\r\n valid = false;\r\n setValid('docUpload_10', false);\r\n }\r\n\r\n if (applicationDetail.applicationForm.p4Sponsor) {\r\n if (indemnityAgreementRows.length) {\r\n setValid('docUpload_6', true);\r\n } else {\r\n valid = false;\r\n setValid('docUpload_6', false);\r\n }\r\n }\r\n\r\n store.dispatch({\r\n type: SET_SITE_VALIDATION,\r\n payload: {\r\n siteInfoId,\r\n [validationKey]: valids,\r\n },\r\n });\r\n return valid;\r\n};\r\n\r\n/** Check valid for Declaration & Endorsement start */\r\nexport const updateStudyValidation = ({ validationKey, studyInfoValidation }) => {\r\n store.dispatch({\r\n type: SET_STUDY_VALIDATION,\r\n payload: {\r\n [validationKey]: studyInfoValidation,\r\n },\r\n });\r\n};\r\nexport const updateSiteValidation = ({ siteInfoId, validationKey, siteInfoValidation }) => {\r\n store.dispatch({\r\n type: SET_SITE_VALIDATION,\r\n payload: {\r\n siteInfoId,\r\n [validationKey]: siteInfoValidation,\r\n },\r\n });\r\n};\r\n\r\nexport const declareStudentAutoFilledRoles = ['Academic Supervisor', 'Site Supervisor'];\r\n\r\nexport const declareInvAutoFilledRoles = ['Principal Investigator', 'Co-investigator'];\r\n\r\nexport const columnKeys = ['role', 'title', 'name', 'position', 'responsibility'];\r\n\r\nexport const checkTableColumnCompleted = (rows) => {\r\n let valid = true;\r\n for (let i of rows) {\r\n for (let n in i) {\r\n if (columnKeys.includes(n) && [undefined, '', null].includes(i[n])) {\r\n valid = false;\r\n break;\r\n }\r\n }\r\n if (!valid) {\r\n break;\r\n }\r\n }\r\n return valid;\r\n};\r\n\r\nexport const checkDeclarationAndEndorsementCompleted = ({\r\n tableAColumnCompleted = true,\r\n HAEndorsementRows,\r\n universitiesEndorsementRows,\r\n siteInfoId,\r\n}) => {\r\n const validationKey = 'declarationAndEndorsementValid';\r\n /** set site info inside valid for A/B/C/D table */\r\n let valids = {};\r\n const setValid = (key, valid) => {\r\n valids = {\r\n ...valids,\r\n [key]: valid,\r\n };\r\n };\r\n\r\n let completed = true;\r\n /** table A */\r\n if (!tableAColumnCompleted) {\r\n completed = false;\r\n setValid(declareInvKey, false);\r\n } else {\r\n setValid(declareInvKey, true);\r\n }\r\n\r\n /** table B/C/D: logic check on completing either part B/C/D only */\r\n if (HAEndorsementRows.length || universitiesEndorsementRows.length) {\r\n setValid(HAEndorsementKey, true);\r\n } else {\r\n completed = false;\r\n setValid(HAEndorsementKey, false);\r\n }\r\n\r\n updateSiteValidation({ siteInfoId, validationKey, siteInfoValidation: valids });\r\n\r\n return completed;\r\n};\r\n\r\nexport const getExistedInDBRows = (applicationDetail, siteInfoData) => {\r\n let HAEndorsementRows = [],\r\n universitiesEndorsementRows = [],\r\n HAUniversitiesEndorsementRows = [];\r\n for (let i of applicationDetail.declare) {\r\n if (i.siteInfo?.id === siteInfoData.id) {\r\n switch (i.endorse) {\r\n case 'H':\r\n HAEndorsementRows.push(i);\r\n break;\r\n case 'U':\r\n universitiesEndorsementRows.push(i);\r\n break;\r\n case 'C':\r\n HAUniversitiesEndorsementRows.push(i);\r\n break;\r\n\r\n default:\r\n break;\r\n }\r\n }\r\n }\r\n return {\r\n HAEndorsementRows: HAEndorsementRows,\r\n universitiesEndorsementRows: universitiesEndorsementRows,\r\n HAUniversitiesEndorsementRows: HAUniversitiesEndorsementRows,\r\n };\r\n};\r\n\r\nexport const mapCurrentSiteRows = (rows, siteInfoId) => {\r\n let newRows = [];\r\n rows?.forEach((item) => {\r\n if (item.siteInfo?.id === siteInfoId) {\r\n newRows.push(item);\r\n }\r\n });\r\n return newRows;\r\n};\r\n\r\nexport const isDeclarationAndEndorsementValid = (applicationDetail, siteInfoData, formId) => {\r\n let rolesCompleted = true;\r\n const declareInvRows = mapCurrentSiteRows(applicationDetail.declareInv);\r\n const declareStudentRows = mapCurrentSiteRows(applicationDetail.declareStudent);\r\n const declareInvValid = checkTableColumnCompleted(declareInvRows);\r\n const declareStudentValid = checkTableColumnCompleted(declareStudentRows);\r\n\r\n let HAEndorsementRows = [];\r\n let universitiesEndorsementRows = [];\r\n\r\n /** check Declaration And Endorsement for completeness */\r\n let currentStatus = rolesCompleted;\r\n if (currentStatus) {\r\n const rows = getExistedInDBRows(applicationDetail, siteInfoData);\r\n HAEndorsementRows = rows.HAEndorsementRows;\r\n universitiesEndorsementRows = rows.universitiesEndorsementRows;\r\n\r\n const siteInfoId = siteInfoData.id;\r\n currentStatus = checkDeclarationAndEndorsementCompleted({\r\n tableAColumnCompleted: declareInvValid && declareStudentValid,\r\n HAEndorsementRows,\r\n universitiesEndorsementRows,\r\n siteInfoId,\r\n });\r\n }\r\n\r\n return rolesCompleted && currentStatus;\r\n};\r\n/** Check valid for Declaration & Endorsement end */\r\n\r\nexport const getSiteInfoValidationObject = (applicationDetail, siteData, formId) => {\r\n return {\r\n teamMember: isSiteTeamMemberFormValid(siteData),\r\n personalParticulars: isSitePersonalParticularFormValid(applicationDetail, siteData),\r\n outlineOfApplication: isSiteOutlineFormValid(applicationDetail, siteData),\r\n studyDetails: isSiteStudyDetailFormValid(siteData),\r\n studyDetailsForProspectiveStudy: isSiteStudyDetailForProspectiveFormValid(applicationDetail, siteData),\r\n ethicalImplications: isSiteEthicalFormValid(applicationDetail, siteData),\r\n budgetResources: isSiteBudgetFormValid(siteData),\r\n documentUploadValid: isDocumentUploadValid(applicationDetail, siteData),\r\n declarationAndEndorsementValid: isDeclarationAndEndorsementValid(applicationDetail, siteData, formId),\r\n };\r\n};\r\n","export const studyInfoLookup = () => {\r\n return {\r\n p1ScientificTitle: {\r\n number: '1.1',\r\n label: 'Scientific Title',\r\n isTextArea: true,\r\n },\r\n p1ShortTitle: {\r\n number: '1.1.1',\r\n label: 'Short Title',\r\n isTextArea: true,\r\n },\r\n p1KeyWords: {\r\n number: '1.1.2',\r\n label: 'Key Words',\r\n isTextArea: true,\r\n },\r\n p1ResProNum: {\r\n number: '1.2',\r\n label: 'Research protocol number',\r\n },\r\n p1LocalInternational: {\r\n number: '2.1',\r\n label: 'Is this a local or international trial?',\r\n },\r\n p1ConductedHa: {\r\n number: '2.2',\r\n label: 'Will the study be conducted in HA hospitals/institutions',\r\n },\r\n studySiteCollab: {\r\n number: '2.3.2',\r\n label: 'Collaborating site(s) in HA',\r\n },\r\n p1ConductedOutOfHa: {\r\n number: '2.3.3',\r\n label: 'Will the study be conducted out-of-HA',\r\n },\r\n studySiteOutOfHA: {\r\n number: '2.3.3',\r\n label: 'Will the study be conducted out-of-HA?',\r\n },\r\n p1ReviewByRecIrb: {\r\n number: '3.1',\r\n label: 'Has the application been reviewed by another Cluster REC/IRB?',\r\n },\r\n p1RecIrbDecision: {\r\n number: '3.1.1',\r\n label: 'What is REC/IRB decision?',\r\n },\r\n p1ProposedStartDate: {\r\n number: '4.1',\r\n label: 'Proposed study start date',\r\n },\r\n p1ProposedEndDate: {\r\n number: '4.2',\r\n label: 'Proposed study end date / date of last follow-up of all recruited subjects, whichever is later',\r\n },\r\n p1SubmissionDate: {\r\n number: '4.3',\r\n label: 'Tentative final report submission date to CIRB/CREC/IRB',\r\n },\r\n p1BriefSummary: {\r\n number: '5',\r\n label: 'Brief Summary of Study',\r\n isTextArea: true,\r\n },\r\n p2Aim: {\r\n number: '6.1',\r\n label: 'Aim of study',\r\n isTextArea: true,\r\n },\r\n p2Hypothesis: {\r\n number: '6.2',\r\n label: 'Hypothesis',\r\n isTextArea: true,\r\n },\r\n p2PrimaryOutcome: {\r\n number: '6.3.1',\r\n label: 'Primary outcome(s)',\r\n isTextArea: true,\r\n },\r\n p2SecondaryOutcome: {\r\n number: '6.3.2',\r\n label: 'Secondary outcome(s)',\r\n isTextArea: true,\r\n },\r\n p2Inclusion: {\r\n number: '7.1',\r\n label: 'Inclusion criteria',\r\n isTextArea: true,\r\n },\r\n p2Exclusion: {\r\n number: '7.2',\r\n label: 'Exclusion criteria',\r\n isTextArea: true,\r\n },\r\n p2Sample: {\r\n number: '7.3.1',\r\n label: 'Sample size',\r\n },\r\n p2Rationale: {\r\n number: '7.3.2',\r\n label: 'Based on the following rationale',\r\n isTextArea: true,\r\n },\r\n p2HAPatients: {\r\n number: '7.3.3',\r\n label: 'Will the study involve HA patients?',\r\n },\r\n p2NumPatients: {\r\n number: '7.3.3.1',\r\n label: 'If yes, estimate the number of patients planned to be involved in the study?',\r\n },\r\n p2RoleHA: {\r\n number: '7.3.3.2',\r\n label: 'If no, specify the role of HA in the study',\r\n isTextArea: true,\r\n },\r\n p2NumSubject: {\r\n number: '7.4',\r\n label: 'Number of subjects to be recruited locally in applying site(s)',\r\n },\r\n p2SubjectRecruit: {\r\n number: '7.5',\r\n label: 'How will subject be identified and recruited',\r\n isTextArea: true,\r\n },\r\n p2StudyDesign: {\r\n number: '8.1',\r\n label: 'Study design',\r\n },\r\n p2StudyNature: {\r\n number: '8.2',\r\n label: 'Study design (Nature)',\r\n },\r\n p2Other: {\r\n number: '8.2.1',\r\n label: 'If Other, specify',\r\n },\r\n p2Control: {\r\n number: '8.3',\r\n label: 'Control',\r\n },\r\n p2GroupAssignment: {\r\n number: '8.4',\r\n label: 'Group assignment',\r\n },\r\n p2DiseaseGroup: {\r\n number: '8.5',\r\n label: 'Disease group (choose the most appropriate one)',\r\n },\r\n p2KeyConditions: {\r\n number: '8.5.1',\r\n label: 'Key conditions under study',\r\n },\r\n p2MethodsOfAnalysis: {\r\n number: '9',\r\n label: 'Methods of Data Analysis',\r\n isTextArea: true,\r\n },\r\n p2PersonalStore: {\r\n number: '10.1',\r\n label: 'Will personal data be stored during and after the study?',\r\n },\r\n p2PersonalHandle: {\r\n number: '10.2',\r\n label: 'How will the personal and study data be handled and stored during and after the study?',\r\n isTextArea: true,\r\n },\r\n p2PersonalAccess: {\r\n number: '10.3',\r\n label: 'Who will have access to the personal and study data during and after the study?',\r\n isTextArea: true,\r\n },\r\n p2PersonalResponse: {\r\n number: '10.4',\r\n label: 'Who will be responsible for safekeeping of the personal and study data during and after the study?',\r\n isTextArea: true,\r\n },\r\n p2DataKeep: {\r\n number: '10.5',\r\n label: 'How many years will the personal and study data be kept after the study?',\r\n },\r\n p2DataAforesaidPeriod: {\r\n number: '10.6',\r\n label: 'Plan arrangement for the personal and study data after completion of the aforesaid storage period?',\r\n isTextArea: true,\r\n },\r\n p2Procedure: {\r\n number: '11.1',\r\n label: 'How does the procedure/treatment differ from current treatment practice?',\r\n },\r\n p2ProcedureOther: {\r\n number: '11.1.1',\r\n label: 'If others, specify',\r\n },\r\n p2MethodAssignment: {\r\n number: '11.1.2',\r\n label: 'Methods of assignment',\r\n },\r\n p2DegreeMasking: {\r\n number: '11.1.3',\r\n label: 'Degree of masking',\r\n },\r\n p2PhaseStudy: {\r\n number: '11.1.4',\r\n label: 'Phase 1 Panels are available in HKU/HKW IRB and the Joint CUHK-NTEC CREC.',\r\n },\r\n p2StudyArticle: {\r\n number: '11.2.1',\r\n label: 'Is there any study article?',\r\n },\r\n studyArticleDetail: {\r\n number: '11.2.2',\r\n label: 'Study article details',\r\n },\r\n StudyArticleLicense: {\r\n number: '11.2.3',\r\n label: 'Study article licence registration',\r\n },\r\n p2CertificateCTC: {\r\n number: '11.2.4',\r\n label: 'Will a Certificate for Clinical Trial (“CTC”) be obtained for the Study? ',\r\n },\r\n p2Justification: {\r\n number: '11.2.4.1',\r\n label: 'If no, justification',\r\n isTextArea: true,\r\n },\r\n p2NumOfExtra: {\r\n number: '11.3',\r\n label: 'Number of extra visits / admission on top of usual care',\r\n },\r\n p2OtherInvestigator: {\r\n number: '11.4',\r\n label: 'Will any of the study interventions / procedures be performed by persons other than the investigators?',\r\n },\r\n p2WhomWhere: {\r\n number: '11.4.1',\r\n label: 'If yes, by whom and where',\r\n },\r\n p2SampleFurtherUse: {\r\n number: '11.5',\r\n label: 'Will biological samples be stored for future use?',\r\n },\r\n p2SamplePurpose: {\r\n number: '11.5.1',\r\n label: 'What is the purpose to store the sample?',\r\n isTextArea: true,\r\n },\r\n p2SampleNature: {\r\n number: '11.5.2',\r\n label: 'State the nature of the sample',\r\n isTextArea: true,\r\n },\r\n p2SampleAnticipate: {\r\n number: '11.5.3',\r\n label: 'Anticipate duration of storage',\r\n },\r\n p2SampleOutsideHK: {\r\n number: '11.5.4',\r\n label: 'Will the samples be sent / stored outside Hong Kong?',\r\n },\r\n p2SampleConsent: {\r\n number: '11.5.5',\r\n label: 'Will consent for future specified usage of the biological samples be obtained from the subject?',\r\n },\r\n p2SampleObtained: {\r\n number: '11.5.5.1',\r\n label: 'When will the consent be obtained?',\r\n },\r\n p2SampleJustification: {\r\n number: '11.5.5.2',\r\n label: 'Justification for consent to be obtained prior to the specific future usage of the sample',\r\n isTextArea: true,\r\n },\r\n p2SampleStated: {\r\n number: '11.5.5.3',\r\n label: 'Where will the consent be stated?',\r\n },\r\n p2NoConsentJustification: {\r\n number: '11.5.5.4',\r\n label: 'Justification for no consent to be obtained',\r\n isTextArea: true,\r\n },\r\n p2Significant: {\r\n number: '12.1',\r\n label: 'Significant difference(s) from usual management',\r\n isTextArea: true,\r\n },\r\n p2Benefits: {\r\n number: '12.2',\r\n label: 'Anticipated benefits to study subjects',\r\n isTextArea: true,\r\n },\r\n p2ProvidedCard: {\r\n number: '12.3',\r\n label: 'Will the subjects be provided with a card indicating their participation in study and means of urgent contact?',\r\n },\r\n p2HowToIdentified: {\r\n number: '12.3.1',\r\n label: 'If no, state how the research subjects can be identified in case of emergency',\r\n isTextArea: true,\r\n },\r\n p2ICHGCP: {\r\n number: '12.4',\r\n label: 'Does the protocol state compliance with the ICH-GCP?',\r\n },\r\n p2ICHGCPJustification: {\r\n number: '12.4.1',\r\n label: 'If no, justification',\r\n isTextArea: true,\r\n },\r\n p3Methodology: {\r\n number: '13.1',\r\n label: 'Methodology of obtaining consent',\r\n },\r\n p3MethodReasons: {\r\n number: '13.1.1',\r\n label: 'State reasons if not use written consent',\r\n isTextArea: true,\r\n },\r\n p3MethodJustification: {\r\n number: '13.1.2',\r\n label: 'Justification for applying to waive the consent requirement (<1,000 characters)',\r\n isTextArea: true,\r\n },\r\n p3InformConsentPrincipalInv: {\r\n number: '13.2',\r\n label: 'Who will carry out the informed consent process with the subject?',\r\n },\r\n p3InformConsentOthersReason: {\r\n number: '13.2',\r\n label: 'Other description',\r\n },\r\n p3Interpreter: {\r\n number: '13.3',\r\n label: 'Will an interpreter be available when required?',\r\n },\r\n p3InterpreterJustification: {\r\n number: '13.3.1',\r\n label: 'If no, justification',\r\n },\r\n p3MinTime: {\r\n number: '13.4',\r\n label: 'In obtaining informed consent from subjects, what is the minimal time given to a subject to consider after explanation has been given?',\r\n },\r\n p3Arrangement: {\r\n number: '13.5',\r\n label: 'If subjects are incompetent in giving consent, what would be the arrangement?',\r\n isTextArea: true,\r\n },\r\n p3IndepCommittee: {\r\n number: '14.1',\r\n label: 'Will an independent committee review data and safety of study?',\r\n },\r\n p3IndepCommitteeJustification: {\r\n number: '14.1.1',\r\n label: 'If no, justification',\r\n isTextArea: true,\r\n },\r\n p3Ethical: {\r\n number: '15',\r\n label: 'Major Ethical Issues',\r\n isTextArea: true,\r\n },\r\n p3PreferenceFull: {\r\n number: '16.1',\r\n label: `Applicant's Preference`,\r\n },\r\n p3Justification: {\r\n number: '16.2',\r\n label: 'Justification',\r\n isTextArea: true,\r\n },\r\n p3ExtraClinical: {\r\n number: '17.1',\r\n label: 'Will study incur extra clinical intervention(s) to subjects?',\r\n },\r\n p3AdditionalRisk: {\r\n number: '17.2',\r\n label: 'Will study impose additional risk to subjects?',\r\n },\r\n checkAtLeastOne: {\r\n number: '17.2.1',\r\n label: 'If yes, please select the following where applicable and provide details',\r\n },\r\n p3AddRiskPhyReason: {\r\n number: '17.2.1',\r\n label: 'Reason of physical',\r\n isTextArea: true,\r\n },\r\n p3AddRiskPsyReason: {\r\n number: '17.2.1',\r\n label: 'Reason of psychological',\r\n isTextArea: true,\r\n },\r\n p3AddRiskRadReason: {\r\n number: '17.2.1',\r\n label: 'Reason of radiation',\r\n isTextArea: true,\r\n },\r\n p3AddRiskOtherReason: {\r\n number: '17.2.1',\r\n label: 'Reason of others',\r\n isTextArea: true,\r\n },\r\n p3Privacy: {\r\n number: '17.3',\r\n label: 'Will study raise privacy concerns?',\r\n },\r\n p3InvolveChildren: {\r\n number: '17.4.1',\r\n label: 'Children or adolescent (of less than 18-year-old)',\r\n },\r\n p3InvolveIlliterates: {\r\n number: '17.4.2',\r\n label: 'Illiterates',\r\n },\r\n p3InvolveIncapacitated: {\r\n number: '17.4.3',\r\n label: 'Mentally incapacitated persons',\r\n },\r\n p3InvolveImpoverished: {\r\n number: '17.4.4',\r\n label: 'Impoverished persons',\r\n },\r\n p3InvolveEthnic: {\r\n number: '17.4.5',\r\n label: 'Ethnic minority groups',\r\n },\r\n p3InvolvePatients: {\r\n number: '17.4.6',\r\n label: 'Patients in emergency conditions',\r\n },\r\n p3InvolvePrisoners: {\r\n number: '17.4.7',\r\n label: 'Prisoners',\r\n },\r\n p3InvolveSubordinates: {\r\n number: '17.4.8',\r\n label: 'Subordinates or students of investigators',\r\n },\r\n p3InvolveOthers: {\r\n number: '17.4.9',\r\n label: 'Others',\r\n },\r\n p3InvolveOtherSpecify: {\r\n number: '17.4.9.1',\r\n label: 'Specify',\r\n },\r\n p3SpecialPrecaution: {\r\n number: '17.5',\r\n label: 'Are there any special precautions to protect the interest of vulnerable subjects?',\r\n isTextArea: true,\r\n },\r\n p3Hazard: {\r\n number: '17.6',\r\n label: 'Will study impose potential hazard to clinical staff?',\r\n },\r\n p3Control: {\r\n number: '17.6.1',\r\n label: 'Control measures to protect the clinical staff',\r\n isTextArea: true,\r\n },\r\n p4Funding: {\r\n number: '18.1',\r\n label: 'Any source of funding?',\r\n },\r\n funding: {\r\n number: '18.1.1',\r\n label: 'Specify the source of funding',\r\n isTextArea: true,\r\n },\r\n p4NonMonetary: {\r\n number: '18.2',\r\n label: 'Any non-monetary support?',\r\n },\r\n support: {\r\n number: '18.2.1',\r\n label: 'Specify the non-monetary support',\r\n },\r\n p4SupportArrange: {\r\n number: '18.2.2',\r\n label: 'Please provide details arrangements of the non-monetary support',\r\n isTextArea: true,\r\n },\r\n p4Sponsor: {\r\n number: '18.3',\r\n label: 'Is it a sponsored study?',\r\n },\r\n p4SponsorType: {\r\n number: '18.3.1',\r\n label: 'Which type of sponsored study?',\r\n },\r\n p4ExtraHAResources: {\r\n number: '19.1',\r\n label: 'Will this study consume extra HA resources?',\r\n },\r\n p4ExtraHAResourcesDetails: {\r\n number: '19.1.1',\r\n label: 'If yes, provide details',\r\n isTextArea: true,\r\n },\r\n p4ExtraHAResourcesAffect: {\r\n number: '19.1.2',\r\n label: 'If extra HA resources is required, how will this affect the HA services of other patients with competing needs?',\r\n isTextArea: true,\r\n },\r\n p4ReimburseFormat: {\r\n number: '19.2.1',\r\n label: 'If yes, state the format of reimbursement',\r\n isTextArea: true,\r\n },\r\n p4ReimburseReason: {\r\n number: '19.2.2',\r\n label: 'If no, state the reason(s)',\r\n isTextArea: true,\r\n },\r\n p4Charged: {\r\n number: '20.1',\r\n label: 'Will the subjects be charged for the study article/service?',\r\n },\r\n p4FinArrangement: {\r\n number: '20.1.1',\r\n label: 'If yes, state the financial arrangement',\r\n isTextArea: true,\r\n },\r\n p4ConAvailable: {\r\n number: '20.2',\r\n label: 'Will the study article continue to be available to subjects after the study (if subjects benefited from it) until it is commercially available?',\r\n },\r\n p4PlanFinArrangement: {\r\n number: '20.2.1',\r\n label: 'If yes, state the planned financial arrangement',\r\n },\r\n p4ImpactDisease: {\r\n number: '20.2.2',\r\n label: 'If no, will there be any impact on disease management of the study subject?',\r\n isTextArea: true,\r\n },\r\n p4DiseaseArrangement: {\r\n number: '20.2.2.1',\r\n label: 'Provide arrangement',\r\n isTextArea: true,\r\n },\r\n p4Explain: {\r\n number: '20.3',\r\n label: 'Does the consent form explain the above arrangement?',\r\n },\r\n p4Rewards: {\r\n number: '20.4',\r\n label: 'Will subjects receive any material rewards (including payments)?',\r\n },\r\n p4RewardsNature: {\r\n number: '20.4.1',\r\n label: 'Reward nature',\r\n },\r\n p4RewardsOther: {\r\n number: '20.4.1',\r\n label: 'Others',\r\n isTextArea: true,\r\n },\r\n p4RewardsAmount: {\r\n number: '20.4.2',\r\n label: 'Amount of payment (in HK$)',\r\n },\r\n p4RewardsMode: {\r\n number: '20.4.3',\r\n label: 'Mode of payment',\r\n },\r\n p4RewardsSchedule: {\r\n number: '20.4.3',\r\n label: 'Schedule',\r\n },\r\n p4Responsible: {\r\n number: '21.1',\r\n label: 'The organization / individual responsible for the study',\r\n },\r\n collaborating: {\r\n number: '21.2',\r\n label: 'Collaborating parties that jointly take on the responsibilities for the study',\r\n },\r\n p4Indemnify: {\r\n number: '21.3.1',\r\n label: 'For sponsored clinical research or where commercial interest is involved, will the sponsor indemnify study related claims?',\r\n },\r\n p4IndemnifyResponsible: {\r\n number: '21.3.1.1',\r\n label: 'If no, specify the reason and who will be responsible for the indemnity',\r\n },\r\n p4IndemnifyBaseOnHA: {\r\n number: '21.3.1.2',\r\n label: 'Is the indemnity agreement based on the HA approved form?',\r\n },\r\n p4Insurance: {\r\n number: '21.4',\r\n label: 'Will an insurance policy be arranged for the study?',\r\n },\r\n p4AgreementSigned: {\r\n number: '21.5',\r\n label: 'Will a Clinical Trial Agreement or other legal agreement/contract(s) be signed with the sponsor/supporting party?',\r\n },\r\n /** document upload start */\r\n docUpload_0: {\r\n number: '22',\r\n label: 'Research Protocol (Mandatory)',\r\n },\r\n docUpload_1: {\r\n number: '23',\r\n label: 'Subject Information Sheet and Informed Consent Form (Supplementary)',\r\n },\r\n docUpload_2: {\r\n number: '24',\r\n label: \"Investigator's Brochure (Supplementary)\",\r\n },\r\n docUpload_3: {\r\n number: '25',\r\n label: 'Written information for subject, such as recruitment advertisement, etc (Supplementary)',\r\n },\r\n docUpload_4: {\r\n number: '26',\r\n label: 'Questionnaires (Supplementary)',\r\n },\r\n docUpload_5: {\r\n number: '27',\r\n label: 'Conflict of Interest Declaration by all Investigators (Mandatory) (*To Complete in Site info)',\r\n },\r\n docUpload_6: {\r\n number: '28',\r\n label: 'Indemnity Agreement (Mandatory for sponsored trial) (*To Complete in Site info)',\r\n },\r\n docUpload_cti: {\r\n number: '29',\r\n label: 'Clinical Trial Insurance Certificate (Mandatory for sponsored trial)',\r\n },\r\n docUpload_11: {\r\n number: '30',\r\n label: 'Other Documents – Study based (Supplementary)',\r\n },\r\n docUpload_7: {\r\n number: '31',\r\n label: 'Supporting document from Academia (Mandatory for student project)',\r\n },\r\n docUpload_8: {\r\n number: '32',\r\n label: 'CIRB/CREC/IRB decision document of clinical research ethics review for cross-cluster study (Mandatory if applicable)',\r\n },\r\n docUpload_9: {\r\n number: '33',\r\n label: 'Other funding source(s) (Supplementary)',\r\n },\r\n docUpload_10: {\r\n number: '34',\r\n label: 'Signed Application Form – Declaration and Endorsement (Mandatory) (*To Complete in Site info)',\r\n },\r\n\r\n /** document upload end */\r\n };\r\n};\r\n\r\nexport const siteInfoLookup = () => {\r\n return {\r\n title: {\r\n number: '1',\r\n label: 'Title (e.g. Mr, Mrs, Ms, Miss, Dr)',\r\n },\r\n surname: {\r\n number: '1',\r\n label: 'Surname',\r\n },\r\n firstName: {\r\n number: '1',\r\n label: 'First Name',\r\n },\r\n chineseName: {\r\n number: '1',\r\n label: 'Name in Chinese',\r\n },\r\n atLeastOneSelected: {\r\n number: '2',\r\n label: 'At one position should be selected',\r\n },\r\n haStaff: {\r\n number: '2.1',\r\n label: 'HA Staff (Including HA Honorary staff)',\r\n },\r\n haPosition: {\r\n number: '2.1.1',\r\n label: 'Position',\r\n },\r\n haDepartment: {\r\n number: '2.1.2',\r\n label: 'Department / Unit',\r\n },\r\n haClusterCode: {\r\n number: '2.1.3',\r\n label: 'Cluster',\r\n },\r\n haHospitalCode: {\r\n number: '2.1.4',\r\n label: 'Hospital',\r\n },\r\n haOther: {\r\n number: '2.1.4.1',\r\n label: 'If Other, specify',\r\n },\r\n uniStaff: {\r\n number: '2.2',\r\n label: 'University Staff',\r\n },\r\n uniPosition: {\r\n number: '2.2.1',\r\n label: 'Position',\r\n },\r\n uniDepartment: {\r\n number: '2.2.2',\r\n label: 'Department / School / Faculty',\r\n },\r\n university: {\r\n number: '2.2.3',\r\n label: 'University',\r\n },\r\n uniOther: {\r\n number: '2.2.3.1',\r\n label: 'If Other, specify',\r\n },\r\n student: {\r\n number: '2.3',\r\n label: 'Student',\r\n },\r\n studentFull: {\r\n number: '2.3.1',\r\n label: 'Full-time / Part-time',\r\n },\r\n studentGraduate: {\r\n number: '2.3.1.1',\r\n label: 'Undergraduate / Post-graduate',\r\n },\r\n studentDept: {\r\n number: '2.3.1.2',\r\n label: 'Department / School / Faculty',\r\n },\r\n studentInst: {\r\n number: '2.3.1.3',\r\n label: 'Institute',\r\n },\r\n supervisorName: {\r\n number: '2.3.2',\r\n label: 'Name of Academic Supervisor',\r\n },\r\n supervisorDept: {\r\n number: '2.3.2.1',\r\n label: 'Department / School / Faculty',\r\n },\r\n supervisorInst: {\r\n number: '2.3.2.2',\r\n label: 'Institute',\r\n },\r\n siteSupervisorName: {\r\n number: '2.3.3',\r\n label: 'Name of Site supervisor',\r\n },\r\n siteSupervisorDept: {\r\n number: '2.3.3.1',\r\n label: 'Department / Unit',\r\n },\r\n siteSupervisorHospCode: {\r\n number: '2.3.3.2',\r\n label: 'Hospital',\r\n },\r\n siteSupervisorOther: {\r\n number: '2.3.3.2.1',\r\n label: 'If Other, specify',\r\n },\r\n phone: {\r\n number: '2.4',\r\n label: 'Phone Number',\r\n },\r\n email: {\r\n number: '2.5',\r\n label: 'E-mail address',\r\n },\r\n mailing: {\r\n number: '2.6',\r\n label: 'Mailing address',\r\n },\r\n cvFileName: {\r\n number: '2.7',\r\n label: 'CV File Upload',\r\n },\r\n coiInvolved: {\r\n number: '3',\r\n label: 'Any Co-investigators Involved in this study?',\r\n },\r\n coi: {\r\n number: '3',\r\n label: 'Co-investigators Members',\r\n },\r\n studySiteApply: {\r\n number: '2.3.1',\r\n label: 'Applying site(s) in HA',\r\n },\r\n p2NumSubject: {\r\n number: '7.4',\r\n label: 'No. of subjects to be recruited in the site(s) stated in Q.2.3.1 above.',\r\n },\r\n p2SubjectRecruit: {\r\n number: '7.5',\r\n label: 'How will subject be identified and recruited',\r\n isTextArea: true,\r\n },\r\n p2NumOfExtra: {\r\n number: '11.3',\r\n label: 'Number of extra visits / admission on top of usual care',\r\n },\r\n p2OtherInvestigator: {\r\n number: '11.4',\r\n label: 'Will any of the study interventions / procedures be performed by persons other than the investigators?',\r\n },\r\n p2WhomWhere: {\r\n number: '11.4.1',\r\n label: 'If yes, by whom and where',\r\n },\r\n p3InformConsentPrincipalInv: {\r\n number: '13.2',\r\n label: 'Who will carry out the informed consent process with the subject?',\r\n },\r\n p3InformConsentOthersReason: {\r\n number: '13.2',\r\n label: 'Others',\r\n },\r\n p4ExtraHAResources: {\r\n number: '19.1',\r\n label: 'Will this study consume extra HA resources?',\r\n },\r\n p4ExtraHAResourcesDetails: {\r\n number: '19.1.1',\r\n label: 'If yes, provide details',\r\n isTextArea: true,\r\n },\r\n p4ExtraHAResourcesAffect: {\r\n number: '19.1.2',\r\n label: 'If extra HA resources is required, how will this affect the HA services of other patients with competing needs?',\r\n isTextArea: true,\r\n },\r\n p4Reimburse: {\r\n number: '19.2',\r\n label: 'Will the study site (hospital) receive reimbursement for the study?',\r\n },\r\n p4ReimburseFormat: {\r\n number: '19.2.1',\r\n label: 'If yes, state the format of reimbursement',\r\n isTextArea: true,\r\n },\r\n p4ReimburseReason: {\r\n number: '19.2.2',\r\n label: 'If no, state the reason(s)',\r\n },\r\n /** document upload start */\r\n docUpload_1: {\r\n number: '23',\r\n label: 'Subject Information Sheet and Informed Consent Form (Supplementary)',\r\n },\r\n docUpload_3: {\r\n number: '25',\r\n label: 'Written information for subject, such as recruitment advertisement, etc (Supplementary)',\r\n },\r\n docUpload_4: {\r\n number: '26',\r\n label: 'Questionnaires (Supplementary)',\r\n },\r\n docUpload_5: {\r\n number: '27',\r\n label: 'Conflict of Interest Declaration by all Investigators (Mandatory)',\r\n },\r\n docUpload_6: {\r\n number: '28',\r\n label: 'Indemnity Agreement (Mandatory for sponsored trial)',\r\n },\r\n docUpload_11: {\r\n number: '30',\r\n label: 'Other Documents – Site Information (Supplementary)',\r\n },\r\n docUpload_10: {\r\n number: '34',\r\n label: 'Signed DECLARATION AND ENDORSEMENT (Mandatory)',\r\n },\r\n /** document upload end */\r\n /** Declaration And Endorsement start */\r\n declareInv: {\r\n number: 'A',\r\n sortKey: 'A',\r\n popupTitle: 'Declaration by Principal Investigator and other Investigator(s)',\r\n },\r\n H: {\r\n number: 'B/C',\r\n sortKey: 'B',\r\n popupTitle: 'Endorsement by COS or Authorised Representative³ of HA',\r\n },\r\n U: {\r\n number: 'B/C',\r\n sortKey: 'C',\r\n popupTitle: 'Endorsement by Head of Department⁴ of the Universities',\r\n },\r\n C: {\r\n number: 'D',\r\n sortKey: 'D',\r\n popupTitle: 'Endorsement by COS(s) or Head(s) of the Collaborating Department(s) in HA or in Universities',\r\n },\r\n /** Declaration And Endorsement end */\r\n };\r\n};\r\n","import { put, select, takeEvery } from 'redux-saga/effects';\r\nimport { safeSaga } from 'store';\r\nimport {\r\n RESET_DOCUMENT_UPLOAD,\r\n SET_DOCUMENT_UPLOAD,\r\n UPDATE_STUDENT,\r\n SET_APPLICATION_DETAIL_POST_DATA,\r\n} from 'store/key';\r\nimport { produce } from 'utility/general';\r\nimport { checkSiteInfoStudent, checkStudyInfoDocumentUploadValid } from 'utility/formValidate';\r\n\r\nconst getInitialState = () => ({\r\n researchProtocolRows: [],\r\n insuranceCertificateRows: [],\r\n informedConsentRows: [],\r\n brochureRows: [],\r\n writtenRows: [],\r\n questionnairesRows: [],\r\n declarationRows: [],\r\n indemnityAgreementRows: [],\r\n otherDocumentsRows: [],\r\n supportingDocumentRows: [],\r\n decisionDocumentRows: [],\r\n otherFundingSourceRows: [],\r\n signedApplicationFormRows: [],\r\n\r\n /** will set data when student check/unCehck */\r\n suDocDeleteRequestIds: [],\r\n handledSuDocDeleteRequest: [],\r\n});\r\n\r\nfunction* updateStudent(action) {\r\n const { documentUpload, applicationDetailPostData, applicationDetail } = yield select();\r\n\r\n if (action.payload === undefined) return; \r\n const {\r\n formId,\r\n isAmendment,\r\n student,\r\n } = action.payload;\r\n applicationDetailPostData.applicationFormId = formId;\r\n const postData = applicationDetailPostData.postData;\r\n\r\n // check all site's student is true/false\r\n const siteInfoList = applicationDetail[formId].siteInfo ?? [];\r\n const postDataSiteInfo = postData.siteInfo ?? [];\r\n let isStudent = student ? true : checkSiteInfoStudent(siteInfoList, postDataSiteInfo);\r\n if (isStudent === undefined) return;\r\n\r\n /** un-save data */\r\n const postUploadDocuments = postData?.uploadDocuments ?? [];\r\n const postSuDocRows = postUploadDocuments?.filter(item => item.type === 7) ?? [];\r\n const postSuDocIds = postSuDocRows?.map(item => item.id) ?? [];\r\n\r\n /** records in db */\r\n const uploadDocumentsInDb = applicationDetail[formId].uploadDocuments ?? [];\r\n const suDocDeleteRequestIds = uploadDocumentsInDb?.filter(item => item.type === 7 && !documentUpload.handledSuDocDeleteRequest.includes(item.id))?.map(item => item.id) ?? [];\r\n\r\n const currentDeleteRequest = applicationDetailPostData?.deleteRequest?.uploadDocuments ?? [];\r\n const currentDeleteRequestIds = currentDeleteRequest?.map(item => item.id) ?? [];\r\n\r\n if (isStudent) {\r\n /** remove records which exist in DB to deleteRequest */\r\n suDocDeleteRequestIds?.forEach((id) => {\r\n if (currentDeleteRequestIds.includes(id)) {\r\n const index = currentDeleteRequest.findIndex(item => item.id === id);\r\n if (applicationDetailPostData.deleteRequest.uploadDocuments?.length) {\r\n applicationDetailPostData.deleteRequest.uploadDocuments.splice(index, 1);\r\n }\r\n }\r\n });\r\n if (applicationDetailPostData.deleteRequest.uploadDocuments && !applicationDetailPostData.deleteRequest.uploadDocuments.length) {\r\n delete applicationDetailPostData.deleteRequest.uploadDocuments;\r\n }\r\n\r\n documentUpload.suDocDeleteRequestIds = [];\r\n } else {\r\n /** hidden(delete) data for postData */\r\n postUploadDocuments?.forEach((item, index) => {\r\n if (postSuDocIds.includes(item.id)) {\r\n if (applicationDetailPostData.postData.uploadDocuments?.length) {\r\n applicationDetailPostData.postData.uploadDocuments.splice(index, 1);\r\n }\r\n }\r\n });\r\n if (applicationDetailPostData.postData.uploadDocuments && !applicationDetailPostData.postData.uploadDocuments.length) {\r\n delete applicationDetailPostData.postData.uploadDocuments;\r\n }\r\n\r\n /** add records which exist in DB to deleteRequest */\r\n suDocDeleteRequestIds?.forEach((id) => {\r\n if (!applicationDetailPostData.deleteRequest.uploadDocuments) {\r\n applicationDetailPostData.deleteRequest.uploadDocuments = [];\r\n }\r\n if (!currentDeleteRequestIds.includes(id)) {\r\n applicationDetailPostData.deleteRequest.uploadDocuments.push({ id: id });\r\n }\r\n });\r\n\r\n documentUpload.suDocDeleteRequestIds = suDocDeleteRequestIds;\r\n };\r\n\r\n checkStudyInfoDocumentUploadValid({ applicationDetail: applicationDetail[formId], isAmendment, isStudent, formId });\r\n\r\n yield put({\r\n type: SET_APPLICATION_DETAIL_POST_DATA,\r\n payload: applicationDetailPostData,\r\n });\r\n\r\n yield put({\r\n type: SET_DOCUMENT_UPLOAD,\r\n payload: documentUpload,\r\n });\r\n}\r\n\r\nconst reducer = (state = getInitialState(), action) => {\r\n switch (action.type) {\r\n case RESET_DOCUMENT_UPLOAD:\r\n return getInitialState();\r\n case SET_DOCUMENT_UPLOAD:\r\n const newState = produce(state, (draft) => {\r\n Object.entries(action.payload).forEach(([key, value]) => {\r\n draft[key] = action.payload[key];\r\n });\r\n });\r\n return newState;\r\n default:\r\n return state;\r\n }\r\n};\r\n\r\nexport function* watchDocumentUpload() {\r\n yield takeEvery(UPDATE_STUDENT, safeSaga(updateStudent));\r\n}\r\n\r\nexport default reducer;\r\n","import { SET_TEXT_VALIDATION, CLEAR_TEXT_VALIDATION } from 'store/key';\r\nimport { produce } from 'utility/general';\r\n\r\nconst initialState = {};\r\n\r\nexport const setTextValidation = (data) => ({\r\n type: SET_TEXT_VALIDATION,\r\n payload: data,\r\n});\r\n\r\nconst reducer = (state = initialState, action) => {\r\n switch (action.type) {\r\n case SET_TEXT_VALIDATION:\r\n const newState = produce(state, (draft) => {\r\n Object.entries(action.payload).forEach(([key, value]) => {\r\n draft[key] = action.payload[key];\r\n });\r\n });\r\n return newState;\r\n case CLEAR_TEXT_VALIDATION:\r\n return {};\r\n default:\r\n return state;\r\n }\r\n};\r\nexport default reducer;\r\n","import { put, select, takeEvery } from 'redux-saga/effects';\r\nimport { safeSaga } from 'store';\r\nimport {\r\n RESET_DECLARATION_AND_ENDORSEMENT,\r\n SET_DECLARATION_AND_ENDORSEMENT,\r\n UPDATE_COI_INVOLVED,\r\n SET_APPLICATION_DETAIL_POST_DATA,\r\n UPDATE_DECLARATION_NORMAL_POST_DATA,\r\n DELETE_DECLARATION_NORMAL_DATA,\r\n UPDATE_DECLARATION_STUDENT_POST_DATA,\r\n UPDATE_DECLARE_STUDENT,\r\n} from 'store/key';\r\nimport { produce } from 'utility/general';\r\nimport {\r\n declareInvAutoFilledRoles,\r\n declareStudentAutoFilledRoles,\r\n} from 'utility/formValidate';\r\nimport {\r\n declareStudentKey,\r\n declareInvKey,\r\n HAEndorsementKey,\r\n universitiesEndorsementKey,\r\n HAUniversitiesEndorsementKey,\r\n} from 'constants/globalEnum';\r\n\r\nconst getInitialState = () => ({\r\n declareStudentRows: [],\r\n declareInvRows: [],\r\n HAEndorsementRows: [],\r\n universitiesEndorsementRows: [],\r\n HAUniversitiesEndorsementRows: [],\r\n unSaveDeletionIds: [], /** id: un-save & deleted & existedInDB row's id */\r\n removeRequestCoiIds: [], /** id: remove request coi row's id */\r\n unSaveDecalreStudentRows: [], /** rows: deleted but unSave records for decalreStudentRows */\r\n AcademicSvTextFieldOnBlur: false, /** use for Declaration Academic Supervisor \"auto-filled\" when Academic Supervisor's textField onBlur */\r\n SiteSvTextFieldOnBlur: false, /** use for Declaration Site Supervisor \"auto-filled\" when Site Supervisor's textField onBlur */\r\n\r\n declareInvDefaultRow: {\r\n role: '',\r\n title: '',\r\n name: '',\r\n position: '',\r\n responsibility: '',\r\n signDate: null,\r\n },\r\n declareStudentDefaultRow: {\r\n role: '',\r\n title: '',\r\n name: '',\r\n position: '',\r\n responsibility: '',\r\n signDate: null,\r\n },\r\n /** update when student check/uncheck */\r\n postDeclareStudentRows: [],\r\n /** update when coiInvolved check/uncheck */\r\n postCoiRows: [],\r\n});\r\n\r\nfunction* updateDeclareStudent(action) {\r\n const {\r\n declarationAndEndorsement,\r\n applicationDetailPostData,\r\n applicationDetail,\r\n } = yield select();\r\n\r\n if (action.payload === undefined) return;\r\n\r\n const {\r\n student,\r\n formId,\r\n siteInfoId,\r\n } = action.payload;\r\n if (student === undefined) return;\r\n\r\n applicationDetailPostData.applicationFormId = formId;\r\n const postData = JSON.parse(JSON.stringify(applicationDetailPostData.postData));\r\n\r\n /** un-save data */\r\n const postDeclareStudentRows = postData?.declareStudent?.filter(item => item.siteInfo?.id === siteInfoId) ?? [];\r\n const postDeclareStudentIds = postDeclareStudentRows?.map(item => item.id) ?? []; // To be re-open futher\r\n\r\n /** records in db */\r\n const uploadDeclareStudentInDb = applicationDetail[formId].declareStudent?.filter(item => item.siteInfoId === siteInfoId) ?? [];\r\n const declareStudentDeleteRequestIds = uploadDeclareStudentInDb?.filter(item => !declarationAndEndorsement.unSaveDeletionIds.includes(item.id))?.map(item => item.id) ?? [];\r\n\r\n const currentDeleteRequest = applicationDetailPostData?.deleteRequest?.declareStudent ?? [];\r\n const currentDeleteRequestIds = currentDeleteRequest?.map(item => item.id) ?? [];\r\n\r\n if (student) {\r\n /** re-add hidden data for postData */\r\n // To be re-open futher\r\n const newRows = declarationAndEndorsement.postDeclareStudentRows;\r\n newRows?.forEach(item => {\r\n if (!postDeclareStudentIds.includes(item.id)) {\r\n if (!applicationDetailPostData.postData.declareStudent) {\r\n applicationDetailPostData.postData.declareStudent = [];\r\n }\r\n applicationDetailPostData.postData.declareStudent?.push(item);\r\n }\r\n });\r\n\r\n /** remove records which exist in DB to deleteRequest */\r\n declareStudentDeleteRequestIds?.forEach((id) => {\r\n if (currentDeleteRequestIds.includes(id)) {\r\n const index = currentDeleteRequest.findIndex(item => item.id === id);\r\n if (applicationDetailPostData.deleteRequest.declareStudent?.length) {\r\n applicationDetailPostData.deleteRequest.declareStudent.splice(index, 1);\r\n }\r\n }\r\n });\r\n if (applicationDetailPostData.deleteRequest.declareStudent && !applicationDetailPostData.deleteRequest.declareStudent.length) {\r\n delete applicationDetailPostData.deleteRequest.declareStudent;\r\n };\r\n declarationAndEndorsement.postDeclareStudentRows = [];\r\n } else {\r\n /** hidden(delete) data for postData */\r\n postDeclareStudentIds?.forEach(id => {\r\n if (applicationDetailPostData.postData.declareStudent?.length) {\r\n const index = applicationDetailPostData.postData.declareStudent.findIndex(row => row.id === id);\r\n if (index === -1) return;\r\n applicationDetailPostData.postData.declareStudent.splice(index, 1);\r\n }\r\n });\r\n if (applicationDetailPostData.postData.declareStudent && !applicationDetailPostData.postData.declareStudent.length) {\r\n delete applicationDetailPostData.postData.declareStudent;\r\n }\r\n\r\n /** add records which exist in DB to deleteRequest */\r\n declareStudentDeleteRequestIds?.forEach((id) => {\r\n if (!applicationDetailPostData.deleteRequest.declareStudent) {\r\n applicationDetailPostData.deleteRequest.declareStudent = [];\r\n }\r\n if (!currentDeleteRequestIds.includes(id)) {\r\n applicationDetailPostData.deleteRequest.declareStudent.push({ id: id, siteInfo: { id: siteInfoId } });\r\n }\r\n });\r\n\r\n declarationAndEndorsement.postDeclareStudentRows = postDeclareStudentRows;\r\n };\r\n\r\n yield put({\r\n type: SET_APPLICATION_DETAIL_POST_DATA,\r\n payload: applicationDetailPostData,\r\n });\r\n yield put({\r\n type: SET_DECLARATION_AND_ENDORSEMENT,\r\n payload: declarationAndEndorsement,\r\n });\r\n};\r\n\r\nfunction* updateCoiInvolved(action) {\r\n const {\r\n declarationAndEndorsement,\r\n applicationDetailPostData,\r\n applicationDetail,\r\n } = yield select();\r\n\r\n if (action.payload === undefined) return;\r\n\r\n const {\r\n coiInvolved,\r\n formId,\r\n siteInfoId,\r\n } = action.payload;\r\n if (coiInvolved === undefined) return;\r\n\r\n applicationDetailPostData.applicationFormId = formId;\r\n const postData = JSON.parse(JSON.stringify(applicationDetailPostData.postData));\r\n\r\n /** un-save data */\r\n const postDeclareInv = postData?.declareInv?.filter(item => item.siteInfo?.id === siteInfoId) ?? [];\r\n const roleName = declareInvAutoFilledRoles[1];\r\n const postCoiRows = postDeclareInv?.filter(item => item.role === roleName) ?? [];\r\n const postCoiIds = postCoiRows?.map(item => item.id) ?? [];\r\n const postDeclareInvIds = postDeclareInv?.map(item => item.id) ?? []; // To be re-open futher\r\n\r\n /** records in db */\r\n const uploadDeclareInvInDb = applicationDetail[formId].declareInv?.filter(item => item.siteInfoId === siteInfoId) ?? [];\r\n const coiDeleteRequestIds = uploadDeclareInvInDb?.filter(item => item.role === roleName && !declarationAndEndorsement.unSaveDeletionIds.includes(item.id))?.map(item => item.id) ?? [];\r\n\r\n const currentDeleteRequest = applicationDetailPostData?.deleteRequest?.declareInv ?? [];\r\n const currentDeleteRequestIds = currentDeleteRequest?.map(item => item.id) ?? [];\r\n\r\n if (coiInvolved) {\r\n /** re-add hidden data for postData */\r\n // To be re-open futher\r\n declarationAndEndorsement.postCoiRows?.forEach(item => {\r\n if (!postDeclareInvIds.includes(item.id)) {\r\n if (!applicationDetailPostData.postData.declareInv) {\r\n applicationDetailPostData.postData.declareInv = [];\r\n }\r\n applicationDetailPostData.postData.declareInv?.push(item);\r\n }\r\n });\r\n\r\n /** remove records which exist in DB to deleteRequest */\r\n coiDeleteRequestIds?.forEach((id) => {\r\n if (currentDeleteRequestIds.includes(id)) {\r\n const index = currentDeleteRequest.findIndex(item => item.id === id);\r\n if (applicationDetailPostData.deleteRequest.declareInv?.length) {\r\n applicationDetailPostData.deleteRequest.declareInv.splice(index, 1);\r\n }\r\n }\r\n });\r\n if (applicationDetailPostData.deleteRequest.declareInv && !applicationDetailPostData.deleteRequest.declareInv.length) {\r\n delete applicationDetailPostData.deleteRequest.declareInv;\r\n }\r\n declarationAndEndorsement.postCoiRows = [];\r\n } else {\r\n /** hidden(delete) data for postData */\r\n postCoiIds?.forEach(id => {\r\n if (applicationDetailPostData.postData.declareInv?.length) {\r\n const index = applicationDetailPostData.postData.declareInv.findIndex(row => row.id === id);\r\n if (index === -1) return;\r\n applicationDetailPostData.postData.declareInv.splice(index, 1);\r\n }\r\n });\r\n if (applicationDetailPostData.postData.declareInv && !applicationDetailPostData.postData.declareInv.length) {\r\n delete applicationDetailPostData.postData.declareInv;\r\n }\r\n\r\n /** add records which exist in DB to deleteRequest */\r\n coiDeleteRequestIds?.forEach((id) => {\r\n if (!applicationDetailPostData.deleteRequest.declareInv) {\r\n applicationDetailPostData.deleteRequest.declareInv = [];\r\n }\r\n if (!currentDeleteRequestIds.includes(id)) {\r\n applicationDetailPostData.deleteRequest.declareInv.push({ id: id, siteInfo: { id: siteInfoId } });\r\n }\r\n });\r\n\r\n declarationAndEndorsement.postCoiRows = postCoiRows;\r\n };\r\n\r\n yield put({\r\n type: SET_APPLICATION_DETAIL_POST_DATA,\r\n payload: applicationDetailPostData,\r\n });\r\n yield put({\r\n type: SET_DECLARATION_AND_ENDORSEMENT,\r\n payload: declarationAndEndorsement,\r\n });\r\n};\r\n\r\nfunction* updatePostDataList(action) {\r\n const {\r\n applicationDetailPostData,\r\n } = yield select();\r\n\r\n const { rows, type, formId, siteInfoId } = action.payload;\r\n\r\n if (!rows.length) return;\r\n\r\n applicationDetailPostData.applicationFormId = formId;\r\n\r\n const newPostData = JSON.parse(JSON.stringify(applicationDetailPostData.postData));\r\n const postDeclareStudent = newPostData.declareStudent ?? [];\r\n const postDeclareInv = newPostData.declareInv ?? [];\r\n const postDeclare = newPostData.declare ?? [];\r\n\r\n let key = 'declare';\r\n let postData = postDeclare;\r\n\r\n if (type === declareInvKey) {\r\n key = declareInvKey;\r\n postData = postDeclareInv;\r\n } else if (type === declareStudentKey) {\r\n key = declareStudentKey;\r\n postData = postDeclareStudent;\r\n };\r\n\r\n let requestData = rows.map(item => {\r\n let row = {\r\n ...item,\r\n siteInfo: { id: siteInfoId },\r\n };\r\n if (item.signDate) {\r\n row.signDate = new Date(item.signDate);\r\n };\r\n\r\n if (type !== declareInvKey && type !== declareStudentKey) {\r\n row.endorse = type;\r\n };\r\n\r\n /** delete record when repeated */\r\n const existedIndex = postData.findIndex((i) => i?.id === item?.id);\r\n if (existedIndex !== -1) {\r\n postData.splice(existedIndex, 1);\r\n };\r\n\r\n return row;\r\n });\r\n \r\n applicationDetailPostData.postData[key] = [...postData, ...requestData];\r\n\r\n yield put({\r\n type: SET_APPLICATION_DETAIL_POST_DATA,\r\n payload: applicationDetailPostData,\r\n });\r\n};\r\n\r\n/** check if need to auto-filled for investigators */\r\nconst checkNotAutoFilled = (roleName, list) => {\r\n let notFilled = true;\r\n for (let i of list) {\r\n if (roleName.toUpperCase() === i.role.toUpperCase()) {\r\n notFilled = false;\r\n break;\r\n }\r\n }\r\n return notFilled;\r\n};\r\n\r\nfunction* updateDeclarationStudentPostData(action) {\r\n const {\r\n declarationAndEndorsement,\r\n } = yield select();\r\n\r\n if (action.payload === undefined) return;\r\n const {\r\n formId,\r\n siteInfoId,\r\n roleNameIndex,\r\n supervisorName,\r\n siteSupervisorName,\r\n } = action.payload;\r\n \r\n const currentSiteDeclareStudentRows = declarationAndEndorsement.declareStudentRows.filter(item => item.siteInfo?.id === siteInfoId);\r\n /** if PI investigator is existed, break */\r\n if (!checkNotAutoFilled(declareStudentAutoFilledRoles[roleNameIndex], currentSiteDeclareStudentRows)) return;\r\n\r\n const list = declarationAndEndorsement.declareStudentRows;\r\n let newRows = [];\r\n const key = 'temp_';\r\n switch (roleNameIndex) {\r\n case 0:\r\n /** P2.3.2: Auto-filled when p2.3.2 completed-filled */\r\n newRows.push({\r\n ...declarationAndEndorsement.declareStudentDefaultRow,\r\n role: declareStudentAutoFilledRoles[0],\r\n id: key + 'p232',\r\n name: supervisorName,\r\n siteInfo: { id: siteInfoId },\r\n });\r\n break;\r\n\r\n case 1:\r\n /** P2.3.3: Auto-filled when p2.3.3 completed-filled */\r\n newRows.push({\r\n ...declarationAndEndorsement.declareStudentDefaultRow,\r\n role: declareStudentAutoFilledRoles[1],\r\n id: key + 'p233',\r\n name: siteSupervisorName,\r\n siteInfo: { id: siteInfoId },\r\n });\r\n break;\r\n\r\n default:\r\n break;\r\n }\r\n\r\n if (newRows.length) {\r\n const rows = [...list, ...newRows];\r\n declarationAndEndorsement.declareStudentRows = rows;\r\n\r\n yield updatePostDataList({\r\n payload: { rows: newRows, type: declareStudentKey, siteInfoId, formId },\r\n });\r\n\r\n yield put({\r\n type: SET_DECLARATION_AND_ENDORSEMENT,\r\n payload: declarationAndEndorsement,\r\n });\r\n };\r\n};\r\n\r\nfunction* updateDeclarationNormalPostData(action) {\r\n const {\r\n declarationAndEndorsement,\r\n } = yield select();\r\n\r\n if (action.payload === undefined) return;\r\n const {\r\n formId,\r\n siteInfoId,\r\n row,\r\n roleNameIndex,\r\n firstName,\r\n surname,\r\n title,\r\n } = action.payload;\r\n\r\n const currentSiteDeclareInvRows = declarationAndEndorsement.declareInvRows.filter(item => item.siteInfo?.id === siteInfoId);\r\n /** if PI investigator is existed, break */\r\n if (roleNameIndex === 0 && !checkNotAutoFilled(declareInvAutoFilledRoles[0], currentSiteDeclareInvRows)) return;\r\n\r\n const list = declarationAndEndorsement.declareInvRows;\r\n let newRows = [];\r\n let coiList = [];\r\n const key = 'temp_';\r\n switch (roleNameIndex) {\r\n case 0:\r\n /** Auto-filled record refer from p1 (role, title, name) when p1 completed-filled */\r\n newRows.push({\r\n ...declarationAndEndorsement.declareInvDefaultRow,\r\n role: declareInvAutoFilledRoles[roleNameIndex],\r\n id: key + 'p1',\r\n name: `${firstName} ${surname}`,\r\n title: title,\r\n siteInfo: { id: siteInfoId },\r\n });\r\n break;\r\n\r\n case 1:\r\n /** Auto-filled records refer from p3 (Co-investigators) & when p3 add records */\r\n coiList.push({\r\n ...declarationAndEndorsement.declareInvDefaultRow,\r\n role: declareInvAutoFilledRoles[roleNameIndex],\r\n id: row.id,\r\n title: row.title,\r\n name: `${row.firstName} ${row.surname}`,\r\n siteInfo: { id: siteInfoId },\r\n });\r\n break;\r\n\r\n default:\r\n break;\r\n };\r\n\r\n if (newRows.length || coiList.length) {\r\n const rows = [...list, ...newRows, ...coiList];\r\n declarationAndEndorsement.declareInvRows = rows;\r\n \r\n yield updatePostDataList({\r\n payload: { rows: [...newRows, ...coiList], type: declareInvKey, siteInfoId, formId },\r\n });\r\n\r\n yield put({\r\n type: SET_DECLARATION_AND_ENDORSEMENT,\r\n payload: declarationAndEndorsement,\r\n });\r\n };\r\n};\r\n\r\nfunction* deleteTablePostDataRow(action) {\r\n const {\r\n declarationAndEndorsement,\r\n applicationDetailPostData,\r\n applicationDetail,\r\n } = yield select();\r\n\r\n const { row, key, formId, siteInfoId, isHandleDelete } = action.payload;\r\n applicationDetailPostData.applicationFormId = formId;\r\n\r\n let newKey = 'declare';\r\n if (key !== 'declare') {\r\n newKey = key;\r\n }\r\n const list = applicationDetail[formId][newKey] ?? [];\r\n const isExistInDB = list.findIndex(item => item.id === row.id) !== -1;\r\n\r\n if (isExistInDB) {\r\n /** add data to deleteRequest */\r\n if (applicationDetailPostData.deleteRequest[newKey] === undefined) {\r\n applicationDetailPostData.deleteRequest[newKey] = [];\r\n };\r\n applicationDetailPostData.deleteRequest[newKey].push({\r\n id: row.id,\r\n siteInfo: {\r\n id: siteInfoId,\r\n }\r\n });\r\n\r\n yield put({\r\n type: SET_APPLICATION_DETAIL_POST_DATA,\r\n payload: applicationDetailPostData,\r\n });\r\n // if (coiInvolved && key === declareInvKey) {\r\n // dispatch({\r\n // type: SET_DECLARATION_AND_ENDORSEMENT,\r\n // payload: {\r\n // removeRequestCoiIds: [...removeRequestCoiIds, row?.id],\r\n // },\r\n // });\r\n // }\r\n\r\n if (isHandleDelete) {\r\n declarationAndEndorsement.unSaveDeletionIds = [...declarationAndEndorsement.unSaveDeletionIds, row?.id];\r\n yield put({\r\n type: SET_DECLARATION_AND_ENDORSEMENT,\r\n payload: declarationAndEndorsement,\r\n });\r\n };\r\n } else {\r\n /** delete PostData */\r\n const postData = JSON.parse(JSON.stringify(applicationDetailPostData.postData));\r\n const newPostData = postData[newKey] ?? [];\r\n\r\n /** delete record when repeated */\r\n const existedIndex = newPostData.findIndex((i) => i?.id === row?.id);\r\n if (existedIndex !== -1) {\r\n newPostData.splice(existedIndex, 1);\r\n applicationDetailPostData.postData[newKey] = newPostData;\r\n yield put({\r\n type: SET_APPLICATION_DETAIL_POST_DATA,\r\n payload: applicationDetailPostData,\r\n });\r\n };\r\n }\r\n};\r\n\r\nfunction* deleteRow(action) {\r\n const {\r\n declarationAndEndorsement,\r\n } = yield select();\r\n\r\n const { row, key, formId, siteInfoId,} = action.payload;\r\n\r\n const typeList = {\r\n [declareStudentKey]: 'declareStudentRows',\r\n [declareInvKey]: 'declareInvRows',\r\n [HAEndorsementKey]: 'HAEndorsementRows',\r\n [universitiesEndorsementKey]: 'universitiesEndorsementRows',\r\n [HAUniversitiesEndorsementKey]: 'HAUniversitiesEndorsementRows',\r\n };\r\n const type = typeList[key];\r\n if (!row || !type) return;\r\n const list = declarationAndEndorsement[type];\r\n const rowsCopy = [...list];\r\n const index = list.findIndex((item, index) => {\r\n return item?.id === row?.id;\r\n });\r\n if (index !== -1) {\r\n yield deleteTablePostDataRow({\r\n payload: {\r\n row, key, formId, siteInfoId, isHandleDelete: true \r\n }\r\n });\r\n\r\n /** delete record when repeated */\r\n rowsCopy.splice(index, 1);\r\n declarationAndEndorsement[type] = rowsCopy;\r\n\r\n yield put({\r\n type: SET_DECLARATION_AND_ENDORSEMENT,\r\n payload: declarationAndEndorsement,\r\n });\r\n }\r\n};\r\n\r\n/** delete coi record when co-i table had deletion */\r\nfunction* deleteDeclarationNormalData(action) {\r\n const {\r\n declarationAndEndorsement,\r\n } = yield select();\r\n\r\n if (action.payload === undefined) return;\r\n const {\r\n formId,\r\n siteInfoId,\r\n deletionCoiRowIndex,\r\n } = action.payload;\r\n\r\n const list = declarationAndEndorsement.declareInvRows?.filter(item => item.siteInfo.id === siteInfoId);\r\n \r\n let declareCoiList = [];\r\n list.forEach(item => {\r\n if (item.role === declareInvAutoFilledRoles[1]) {\r\n declareCoiList.push(item);\r\n }\r\n });\r\n if (declareCoiList[deletionCoiRowIndex] !== undefined) {\r\n yield deleteRow({\r\n payload: {\r\n row: declareCoiList[deletionCoiRowIndex],\r\n key: declareInvKey,\r\n formId,\r\n siteInfoId,\r\n }\r\n })\r\n };\r\n};\r\n\r\nconst reducer = (state = getInitialState(), action) => {\r\n switch (action.type) {\r\n case RESET_DECLARATION_AND_ENDORSEMENT:\r\n return getInitialState();\r\n case SET_DECLARATION_AND_ENDORSEMENT:\r\n const newState = produce(state, (draft) => {\r\n Object.entries(action.payload).forEach(([key, value]) => {\r\n draft[key] = action.payload[key];\r\n });\r\n });\r\n return newState;\r\n default:\r\n return state;\r\n }\r\n};\r\n\r\nexport function* watchDeclarationAndEndorsement() {\r\n yield takeEvery(UPDATE_COI_INVOLVED, safeSaga(updateCoiInvolved));\r\n yield takeEvery(UPDATE_DECLARATION_NORMAL_POST_DATA, safeSaga(updateDeclarationNormalPostData));\r\n yield takeEvery(UPDATE_DECLARATION_STUDENT_POST_DATA, safeSaga(updateDeclarationStudentPostData));\r\n yield takeEvery(DELETE_DECLARATION_NORMAL_DATA, safeSaga(deleteDeclarationNormalData));\r\n yield takeEvery(UPDATE_DECLARE_STUDENT, safeSaga(updateDeclareStudent));\r\n}\r\n\r\nexport default reducer;\r\n","import { call, put, select, takeEvery } from 'redux-saga/effects';\r\nimport {\r\n CREATE_REVIEWER,\r\n CREATE_REVIEW_PANEL,\r\n DELETE_REVIEWER,\r\n DELETE_REVIEW_PANEL,\r\n EDIT_REVIEWER,\r\n EDIT_REVIEW_PANEL,\r\n SET_REVIEWER,\r\n GET_REVIEWER_LIST,\r\n} from 'store/key';\r\nimport { produce } from 'utility/general';\r\nimport { setGlobalLoading } from 'store/global/reducer';\r\n\r\nimport API from 'api/call';\r\nimport { safeSaga } from 'store';\r\n\r\nconst initialState = {\r\n reviewerList: [\r\n ],\r\n reviewerTotal: 0,\r\n reviewPanelList: [\r\n ],\r\n};\r\n\r\nconst getMaxId = (list, key) => {\r\n const ids = list.map((item) => item.id);\r\n ids.sort((a, b) => b - a);\r\n return ids[0];\r\n};\r\n\r\nfunction* getReviewerList(action) {\r\n const { params, callback } = action.payload;\r\n const { reviewer } = yield select();\r\n \r\n try {\r\n const result = yield call(API.reviewer.getReviewerList, { params });\r\n const res = result.data.result;\r\n reviewer.reviewerList = res.data;\r\n reviewer.reviewerTotal = res.total;\r\n\r\n yield put({\r\n type: SET_REVIEWER,\r\n payload: reviewer,\r\n });\r\n\r\n callback?.();\r\n } catch (error) {\r\n console.log('create reviewer failed:', error);\r\n };\r\n}\r\n\r\nfunction* createReviewer(action) {\r\n const { data, callback } = action.payload;\r\n setGlobalLoading(true);\r\n try {\r\n yield call(API.reviewer.addReviewerAccount, data);\r\n callback?.();\r\n } catch(error) {\r\n console.log('create reviewer failed:', error);\r\n };\r\n setGlobalLoading(false);\r\n}\r\n\r\nfunction* editReviewer(action) {\r\n const { data, callback } = action.payload;\r\n setGlobalLoading(true);\r\n try {\r\n yield call(API.reviewer.updateReviewerAccount, data);\r\n\r\n callback?.();\r\n } catch (error) {\r\n console.log('edit reviewer failed:', error);\r\n };\r\n setGlobalLoading(false);\r\n}\r\n\r\nfunction* deleteReviewer(action) {\r\n const { id, callback } = action.payload;\r\n setGlobalLoading(true);\r\n try {\r\n yield call(API.reviewer.deleteReviewerAccount, { id: id });\r\n\r\n callback?.();\r\n } catch (error) {\r\n console.log('delete reviewer failed:', error);\r\n };\r\n setGlobalLoading(false);\r\n}\r\n\r\nfunction* createReviewPanel(action) {\r\n const row = action.payload;\r\n const { reviewer } = yield select();\r\n const index = (Number(getMaxId(reviewer.reviewPanelList, 'id')) + 1).toString();\r\n reviewer.reviewPanelList.unshift({ ...row, id: index ? index : '0' });\r\n yield put({\r\n type: SET_REVIEWER,\r\n payload: reviewer,\r\n });\r\n}\r\n\r\nfunction* editReviewPanel(action) {\r\n const row = action.payload;\r\n const { reviewer } = yield select();\r\n\r\n let list = reviewer.reviewPanelList;\r\n const index = list.findIndex((i) => i.id === row.id);\r\n reviewer.reviewPanelList[index] = { ...row };\r\n\r\n yield put({\r\n type: SET_REVIEWER,\r\n payload: reviewer,\r\n });\r\n}\r\n\r\nfunction* deleteReviewPanel(action) {\r\n const row = action.payload;\r\n const { reviewer } = yield select();\r\n let list = reviewer.reviewPanelList;\r\n const index = list.findIndex((i) => i.id === row.id);\r\n reviewer.reviewPanelList.splice(index, 1);\r\n yield put({\r\n type: SET_REVIEWER,\r\n payload: reviewer,\r\n });\r\n}\r\n\r\nconst reducer = (state = initialState, action) => {\r\n switch (action.type) {\r\n case SET_REVIEWER:\r\n const newState = produce(state, (draft) => {\r\n Object.entries(action.payload).forEach(([key, value]) => {\r\n draft[key] = action.payload[key];\r\n });\r\n });\r\n return newState;\r\n default:\r\n return state;\r\n }\r\n};\r\n\r\nexport function* watchReviewer() {\r\n yield takeEvery(GET_REVIEWER_LIST, safeSaga(getReviewerList));\r\n yield takeEvery(CREATE_REVIEWER, safeSaga(createReviewer));\r\n yield takeEvery(EDIT_REVIEWER, safeSaga(editReviewer));\r\n yield takeEvery(DELETE_REVIEWER, safeSaga(deleteReviewer));\r\n yield takeEvery(CREATE_REVIEW_PANEL, safeSaga(createReviewPanel));\r\n yield takeEvery(EDIT_REVIEW_PANEL, safeSaga(editReviewPanel));\r\n yield takeEvery(DELETE_REVIEW_PANEL, safeSaga(deleteReviewPanel));\r\n}\r\n\r\nexport default reducer;\r\n","import { call, put, select, takeEvery } from 'redux-saga/effects';\r\nimport {\r\n SET_REVIEW_PANEL,\r\n GET_REVIEW_PANEL_LIST,\r\n DELETE_REVIEW_PANEL_BUY_ID,\r\n GET_REVIEW_PANEL_BUY_ID,\r\n GET_REVIEW_PANEL_MEMBER_LIST,\r\n ADD_REVIEW_PANEL_DATA,\r\n EDIT_REVIEW_PANEL_DATA\r\n} from 'store/key';\r\nimport { produce } from 'utility/general';\r\nimport { setGlobalLoading } from 'store/global/reducer';\r\n\r\nimport API from 'api/call';\r\nimport { safeSaga } from 'store';\r\n\r\nconst initialState = {\r\n reviewPanelList: [\r\n ],\r\n reviewPanelTotal: 0,\r\n reviewPanelMemberList:null\r\n};\r\n\r\nfunction* getReviewPanelList(action) {\r\n const { params, callback } = action.payload;\r\n const { reviewPanel } = yield select();\r\n try {\r\n const result = yield call(API.reviewPanel.getReviewPanelList, { params });\r\n const res = result.data.result;\r\n reviewPanel.reviewPanelList = res.data;\r\n reviewPanel.reviewPanelTotal = res.total;\r\n yield put({\r\n type: SET_REVIEW_PANEL,\r\n payload: reviewPanel,\r\n });\r\n\r\n callback?.(res.data.length);\r\n } catch (error) {\r\n console.log('create reviewer failed:', error);\r\n };\r\n}\r\nfunction* deleteReviewPanel(action) {\r\n const {row,callback} = action.payload;\r\n setGlobalLoading(true);\r\n try {\r\n yield call(API.reviewPanel.deleteReviewPanel, row.id);\r\n callback?.();\r\n } catch (error) {\r\n console.log('emailDomain reducer.js error', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\nfunction* getReviewPanelById(action) {\r\n const { id, callback } = action.payload;\r\n try {\r\n const result = yield call(API.reviewPanel.getReviewPanelById, id);\r\n const res = result.data.result;\r\n callback?.(res);\r\n } catch (error) {\r\n console.log('create reviewer failed:', error);\r\n };\r\n}\r\nfunction* getReviewPanelMemberList(action) {\r\n const { params,callback } = action.payload;\r\n try {\r\n const result = yield call(API.reviewPanel.getReviewPanelMemberList, {params});\r\n const { reviewPanel } = yield select();\r\n reviewPanel.reviewPanelMemberList = result.data.result;\r\n yield put({\r\n type: SET_REVIEW_PANEL,\r\n payload: reviewPanel,\r\n });\r\n callback?.()\r\n } catch (error) {\r\n console.log('create reviewer failed:', error);\r\n };\r\n}\r\n\r\nfunction* addReviewPanel(action) {\r\n const { data,callback } = action.payload;\r\n setGlobalLoading(true);\r\n try {\r\n const res = yield call(API.reviewPanel.addReviewPanel, data);\r\n callback?.(res)\r\n } catch (error) {\r\n console.log('emailDomain reducer.js error', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\nfunction* editReviewPanel(action) {\r\n const { data,id,callback } = action.payload;\r\n setGlobalLoading(true);\r\n try {\r\n const res = yield call(API.reviewPanel.editReviewPanel, {data,id});\r\n callback?.(res)\r\n } catch (error) {\r\n console.log('emailDomain reducer.js error', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\nconst reducer = (state = initialState, action) => {\r\n switch (action.type) {\r\n case SET_REVIEW_PANEL:\r\n const newState = produce(state, (draft) => {\r\n Object.entries(action.payload).forEach(([key, value]) => {\r\n draft[key] = action.payload[key];\r\n });\r\n });\r\n return newState;\r\n default:\r\n return state;\r\n }\r\n};\r\n\r\nexport function* watchReviewPanel() {\r\n yield takeEvery(GET_REVIEW_PANEL_LIST, safeSaga(getReviewPanelList));\r\n yield takeEvery(DELETE_REVIEW_PANEL_BUY_ID, safeSaga(deleteReviewPanel));\r\n yield takeEvery(GET_REVIEW_PANEL_BUY_ID, safeSaga(getReviewPanelById));\r\n yield takeEvery(GET_REVIEW_PANEL_MEMBER_LIST, safeSaga(getReviewPanelMemberList));\r\n yield takeEvery(ADD_REVIEW_PANEL_DATA, safeSaga(addReviewPanel));\r\n yield takeEvery(EDIT_REVIEW_PANEL_DATA, safeSaga(editReviewPanel));\r\n}\r\n\r\nexport default reducer;\r\n","import { call, put, select, takeEvery } from 'redux-saga/effects';\r\nimport {\r\n SET_ARRANGE_MEETING,\r\n GET_APPLICATION_DOC_BYPARAMS,\r\n GET_MEETING_ARRANGEMENT_MEMBER_LIST,\r\n ADD_MEETING_ARRANGEMENT_FORM,\r\n EDIT_MEETING_ARRANGEMENT_FORM,\r\n GET_MEETING_ARRANGE_LIST,\r\n GET_MEETING_ARRANGEMENT_FORM_DETAIL,\r\n} from 'store/key';\r\nimport { produce } from 'utility/general';\r\nimport { setGlobal, setGlobalLoading } from 'store/global/reducer';\r\nimport API from 'api/call';\r\nimport { safeSaga } from 'store';\r\nimport { ERROR } from 'utility/errorCode';\r\n\r\nconst initialState = {\r\n applicationDocData: null,\r\n meetingArrangementMemberList: null,\r\n meetingArrangeList: [],\r\n meetingArrangeTotal: 0,\r\n};\r\n\r\nfunction* getApplicationDocByParams(action) {\r\n const { params, callback } = action.payload;\r\n const { arrangeMeeting } = yield select();\r\n try {\r\n const result = yield call(API.arrangeMeeting.getApplicationDocByParams, { params });\r\n let data = result?.data?.result;\r\n data?.result.forEach((ele) => {\r\n ele.id = `${ele.documentId}${ele.documentType}`;\r\n });\r\n arrangeMeeting.applicationDocData = data;\r\n yield put({\r\n type: SET_ARRANGE_MEETING,\r\n payload: arrangeMeeting,\r\n });\r\n\r\n callback?.();\r\n } catch (error) {\r\n console.log('create reviewer failed:', error);\r\n }\r\n}\r\nfunction* getMeetingArrangementMemberList(action) {\r\n const { params, callback } = action.payload;\r\n const { arrangeMeeting } = yield select();\r\n try {\r\n const result = yield call(API.arrangeMeeting.getMeetingArrangementMemberList, { params });\r\n arrangeMeeting.meetingArrangementMemberList = result?.data?.result;\r\n yield put({\r\n type: SET_ARRANGE_MEETING,\r\n payload: arrangeMeeting,\r\n });\r\n\r\n callback?.();\r\n } catch (error) {\r\n console.log('create reviewer failed:', error);\r\n }\r\n}\r\nfunction* addMeetingArrangementForm(action) {\r\n const { data, callback } = action.payload;\r\n setGlobalLoading(true);\r\n try {\r\n const result = yield call(API.arrangeMeeting.addMeetingArrangementForm, { data });\r\n\r\n if (result.data.status === ERROR) {\r\n yield put(\r\n setGlobal({\r\n isErrorShow: true,\r\n errorMessage: decodeURIComponent(result.data?.errorMessage ?? 'Arrange meeting failed.'),\r\n errorTitle: 'Reminder',\r\n }),\r\n );\r\n\r\n throw new Error(result.data?.errorMessage);\r\n }\r\n\r\n callback?.();\r\n } catch (error) {\r\n console.log('create reviewer failed:', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\n\r\nfunction* editMeetingArrangementForm(action) {\r\n const { data, callback } = action.payload;\r\n setGlobalLoading(true);\r\n try {\r\n const result = yield call(API.arrangeMeeting.editMeetingArrangementForm, { data });\r\n\r\n if (result.data.status === ERROR) {\r\n yield put(\r\n setGlobal({\r\n isErrorShow: true,\r\n errorMessage: decodeURIComponent(result.data?.errorMessage ?? 'Arrange meeting edit failed.'),\r\n errorTitle: 'Reminder',\r\n }),\r\n );\r\n\r\n throw new Error(result.data?.errorMessage);\r\n }\r\n\r\n callback?.();\r\n } catch (error) {\r\n console.log('edit reviewer failed:', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\n\r\nfunction* getMeetingArrangeList(action) {\r\n const { params, callback } = action.payload;\r\n const { arrangeMeeting } = yield select();\r\n try {\r\n const result = yield call(API.arrangeMeeting.getMeetingArrangeList, params);\r\n const res = result.data.result;\r\n arrangeMeeting.meetingArrangeList = res.data;\r\n arrangeMeeting.meetingArrangeTotal = res.total;\r\n\r\n yield put({\r\n type: SET_ARRANGE_MEETING,\r\n payload: arrangeMeeting,\r\n });\r\n\r\n callback?.();\r\n } catch (error) {\r\n console.log('create reviewer failed:', error);\r\n }\r\n}\r\nfunction* getMeetingArrangementFormDetail(action) {\r\n const { params, callback } = action.payload;\r\n setGlobalLoading(true);\r\n try {\r\n const result = yield call(API.arrangeMeeting.getMeetingArrangementFormDetail, params);\r\n const res = result.data.result;\r\n callback?.(res);\r\n } catch (error) {\r\n console.log('create reviewer failed:', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\n\r\nconst reducer = (state = initialState, action) => {\r\n switch (action.type) {\r\n case SET_ARRANGE_MEETING:\r\n const newState = produce(state, (draft) => {\r\n Object.entries(action.payload).forEach(([key, value]) => {\r\n draft[key] = action.payload[key];\r\n });\r\n });\r\n return newState;\r\n default:\r\n return state;\r\n }\r\n};\r\nexport function* watchArrangeMeeting() {\r\n yield takeEvery(GET_APPLICATION_DOC_BYPARAMS, safeSaga(getApplicationDocByParams));\r\n yield takeEvery(GET_MEETING_ARRANGEMENT_MEMBER_LIST, safeSaga(getMeetingArrangementMemberList));\r\n yield takeEvery(ADD_MEETING_ARRANGEMENT_FORM, safeSaga(addMeetingArrangementForm));\r\n yield takeEvery(EDIT_MEETING_ARRANGEMENT_FORM, safeSaga(editMeetingArrangementForm));\r\n yield takeEvery(GET_MEETING_ARRANGE_LIST, safeSaga(getMeetingArrangeList));\r\n yield takeEvery(GET_MEETING_ARRANGEMENT_FORM_DETAIL, safeSaga(getMeetingArrangementFormDetail));\r\n}\r\n\r\nexport default reducer;\r\n","import { call, takeEvery } from 'redux-saga/effects';\r\nimport { SET_REVIEWER_RESULT, ADD_MEETING_ARRANGEMENT_REVIEWER_RESULT, GET_TYPEOFREVIEW } from 'store/key';\r\nimport { produce } from 'utility/general';\r\nimport { setGlobalLoading } from 'store/global/reducer';\r\nimport API from 'api/call';\r\nimport { safeSaga } from 'store';\r\n\r\nconst initialState = {};\r\n\r\nfunction* addMeetingReviewerResult(action) {\r\n const { data, callback } = action.payload;\r\n setGlobalLoading(true);\r\n try {\r\n yield call(API.confirmResult.addMeetingReviewerResult, { ...data });\r\n\r\n callback?.();\r\n } catch (error) {\r\n console.log('create reviewer failed:', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\n\r\nfunction* getTypeOfReview(action) {\r\n const { params, callback } = action.payload;\r\n setGlobalLoading(true);\r\n try {\r\n const result = yield call(API.confirmResult.getTypeOfReview, { params });\r\n const res = result.data.result;\r\n callback?.(res);\r\n } catch (error) {\r\n console.log('create reviewer failed:', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\n\r\nconst reducer = (state = initialState, action) => {\r\n switch (action.type) {\r\n case SET_REVIEWER_RESULT:\r\n const newState = produce(state, (draft) => {\r\n Object.entries(action.payload).forEach(([key, value]) => {\r\n draft[key] = action.payload[key];\r\n });\r\n });\r\n return newState;\r\n default:\r\n return state;\r\n }\r\n};\r\nexport function* watchConfirmResult() {\r\n yield takeEvery(ADD_MEETING_ARRANGEMENT_REVIEWER_RESULT, safeSaga(addMeetingReviewerResult));\r\n yield takeEvery(GET_TYPEOFREVIEW, safeSaga(getTypeOfReview));\r\n}\r\n\r\nexport default reducer;\r\n","import { call, put, select, takeEvery } from 'redux-saga/effects';\r\nimport {\r\n GET_CONSOLIDATION_DETAIL,\r\n SAVE_CONSOLIDATION_DETAIL,\r\n SUBMIT_CONSOLIDATION_DETAIL,\r\n SET_CONSOLIDATION,\r\n CHECK_CONSOLIDATION_UPDATE,\r\n DOWNLOAD_APPROVAL_LETTER,\r\n GET_DOWNLOAD_DOCUMENT,\r\n RESET_CONSOLIDATION,\r\n} from 'store/key';\r\nimport { produce } from 'utility/general';\r\nimport { setGlobalLoading } from 'store/global/reducer';\r\nimport API from 'api/call';\r\nimport { safeSaga } from 'store';\r\nimport {\r\n SAVE_BEFORE_NAVIGATION,\r\n CONSOLIDATION_CONFIRM,\r\n SAVE_BEFORE_DOWNLOAD_APPROVAL_LETTER,\r\n} from 'utility/frontendMessage';\r\nimport store from 'store';\r\nimport { AMENDMENT_FORM, INIT_APPLICATION } from 'utility/postApprovalLookUp';\r\n\r\nconst getInitialState = () => ({\r\n detail: {\r\n decision: null,\r\n comment: null,\r\n decisionDate: null,\r\n approvalExpiryDate: null,\r\n refNo: null,\r\n uploadTempId: null,\r\n attendMeetingUserId: null,\r\n },\r\n uploadTempName: null,\r\n tempFile: null,\r\n remoteDetail: null,\r\n refNoValid: null,\r\n forceErrorDisplay: null,\r\n commentValid: null,\r\n decisionValid: null,\r\n id: null,\r\n rows: [],\r\n formStatus: null,\r\n loading: false,\r\n});\r\n\r\nfunction* getConsolidationDetail(action) {\r\n const { formId, documentType } = action.payload;\r\n const { consolidationDetail } = yield select();\r\n\r\n consolidationDetail.loading = true;\r\n yield put({\r\n type: SET_CONSOLIDATION,\r\n payload: consolidationDetail,\r\n });\r\n try {\r\n const result = yield call(API.consolidation.getConsolidationDetail, { documentType, docId: formId });\r\n const res = result.data.result;\r\n\r\n /** set detail data */\r\n const newDetail = consolidationDetail.detail;\r\n for (let key in newDetail) {\r\n consolidationDetail.detail[key] = res[key] ?? null;\r\n }\r\n\r\n consolidationDetail.remoteDetail = res;\r\n\r\n /** set attendMeetingUserId */\r\n let attendMeetingList = [];\r\n res.panelMembers.forEach((item) => {\r\n if (item.attendMeeting) {\r\n attendMeetingList.push(item.userId);\r\n }\r\n });\r\n\r\n consolidationDetail.remoteDetail.attendMeetingUserId = null;\r\n if (attendMeetingList.length) {\r\n consolidationDetail.detail.attendMeetingUserId = attendMeetingList;\r\n consolidationDetail.remoteDetail.attendMeetingUserId = attendMeetingList;\r\n }\r\n /** set attendMeetingUserId end */\r\n\r\n consolidationDetail.rows = res.panelMembers ?? [];\r\n consolidationDetail.formStatus = res.formStatus;\r\n consolidationDetail.uploadTempName = res.uploadTempName;\r\n consolidationDetail.id = res.id;\r\n } catch (error) {\r\n console.log('consolidation failed:', error);\r\n }\r\n consolidationDetail.loading = false;\r\n yield put({\r\n type: SET_CONSOLIDATION,\r\n payload: consolidationDetail,\r\n });\r\n}\r\n\r\nfunction* saveConsolidationDetail(action) {\r\n const { formId, callback, documentType } = action.payload;\r\n const { consolidationDetail } = yield select();\r\n\r\n setGlobalLoading(true);\r\n try {\r\n const data = {\r\n documentId: formId,\r\n documentType: documentType,\r\n id: consolidationDetail.id,\r\n decision: consolidationDetail.detail.decision,\r\n comment: consolidationDetail.detail.comment,\r\n decisionDate: consolidationDetail.detail.decisionDate\r\n ? new Date(consolidationDetail.detail.decisionDate)\r\n : null,\r\n approvalExpiryDate: consolidationDetail.detail.approvalExpiryDate\r\n ? new Date(consolidationDetail.detail.approvalExpiryDate)\r\n : null,\r\n refNo: consolidationDetail.detail.refNo,\r\n uploadTempId: consolidationDetail.detail.uploadTempId,\r\n attendMeetingUserId: consolidationDetail.detail.attendMeetingUserId,\r\n };\r\n\r\n yield call(API.consolidation.saveConsolidationDetail, data);\r\n\r\n yield getConsolidationDetail({\r\n payload: {\r\n formId,\r\n documentType,\r\n },\r\n });\r\n callback?.();\r\n } catch (error) {\r\n console.log('consolidation failed:', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\n\r\nconst checkValid = (consolidationDetail, isPostApproval, documentType) => {\r\n const { refNoValid, commentValid, decisionValid } = consolidationDetail;\r\n\r\n const { decisionDate, uploadTempId } = consolidationDetail.detail;\r\n\r\n let valid = true;\r\n\r\n if (!refNoValid && !isPostApproval) {\r\n valid = false;\r\n }\r\n\r\n if (uploadTempId === null && [INIT_APPLICATION, AMENDMENT_FORM].includes(documentType)) {\r\n valid = false;\r\n }\r\n\r\n if (!commentValid) {\r\n valid = false;\r\n }\r\n\r\n if (!decisionValid) {\r\n valid = false;\r\n }\r\n\r\n if (!decisionDate) {\r\n valid = false;\r\n }\r\n\r\n return valid;\r\n};\r\n\r\nfunction* submitConsolidationDetail(action) {\r\n const { callback, isPostApproval, formId, showDialog, documentType } = action.payload;\r\n const { consolidationDetail } = yield select();\r\n\r\n consolidationDetail.forceErrorDisplay = true;\r\n\r\n if (checkValid(consolidationDetail, isPostApproval, documentType)) {\r\n const isSave = yield showDialog({\r\n description: CONSOLIDATION_CONFIRM,\r\n });\r\n if (!isSave) return;\r\n\r\n setGlobalLoading(true);\r\n try {\r\n let data = {\r\n documentId: formId,\r\n documentType: documentType,\r\n id: consolidationDetail.id,\r\n decision: consolidationDetail.detail.decision,\r\n comment: consolidationDetail.detail.comment,\r\n decisionDate: consolidationDetail.detail.decisionDate\r\n ? new Date(consolidationDetail.detail.decisionDate)\r\n : null,\r\n uploadTempId: consolidationDetail.detail.uploadTempId,\r\n attendMeetingUserId: consolidationDetail.detail.attendMeetingUserId,\r\n };\r\n\r\n if (!isPostApproval) {\r\n data.refNo = consolidationDetail.detail.refNo;\r\n data.approvalExpiryDate = consolidationDetail.detail.approvalExpiryDate\r\n ? new Date(consolidationDetail.detail.approvalExpiryDate)\r\n : null;\r\n }\r\n\r\n yield call(API.consolidation.submitConsolidationDetail, data);\r\n callback?.();\r\n } catch (error) {\r\n console.log('consolidation failed:', error);\r\n }\r\n setGlobalLoading(false);\r\n } else {\r\n yield put({\r\n type: SET_CONSOLIDATION,\r\n payload: consolidationDetail,\r\n });\r\n }\r\n}\r\n\r\nconst checkSaveData = (consolidationDetail) => {\r\n const remoteDetail = consolidationDetail.remoteDetail;\r\n if (!remoteDetail) return false;\r\n\r\n let hasUpdated = false;\r\n const newDetail = consolidationDetail.detail;\r\n for (let key in newDetail) {\r\n if (newDetail[key] !== remoteDetail[key]) {\r\n if (key === 'attendMeetingUserId') {\r\n // check attendMeetingUserId\r\n const ids = newDetail[key];\r\n if (ids?.length) {\r\n if (remoteDetail.attendMeetingUserId === null) {\r\n hasUpdated = true;\r\n break;\r\n } else {\r\n const newRemoteIds = JSON.stringify(remoteDetail.attendMeetingUserId.sort());\r\n const newIds = JSON.stringify(ids.sort());\r\n if (newRemoteIds !== newIds) {\r\n hasUpdated = true;\r\n break;\r\n }\r\n }\r\n } else {\r\n if (remoteDetail.attendMeetingUserId !== null) {\r\n hasUpdated = true;\r\n break;\r\n }\r\n }\r\n } else {\r\n hasUpdated = true;\r\n break;\r\n }\r\n }\r\n }\r\n\r\n return hasUpdated;\r\n};\r\n\r\nfunction* checkConsolidationUpdate(action) {\r\n const { callback, showDialog, formId, documentType } = action.payload;\r\n const { consolidationDetail } = yield select();\r\n\r\n const hasUpdated = checkSaveData(consolidationDetail);\r\n if (hasUpdated) {\r\n const res = yield showDialog({\r\n description: SAVE_BEFORE_NAVIGATION,\r\n });\r\n if (res) {\r\n yield saveConsolidationDetail({\r\n payload: {\r\n formId,\r\n documentType,\r\n callback: () => callback?.(true),\r\n },\r\n });\r\n }\r\n } else {\r\n callback?.(false);\r\n }\r\n}\r\n\r\nfunction* downloadApprovalLetter(action) {\r\n const { showDialog, formId, msg, documentType } = action.payload;\r\n const { consolidationDetail } = yield select();\r\n const { decision, refNo, decisionDate } = consolidationDetail.detail;\r\n\r\n if (!decision || !refNo) {\r\n showDialog({\r\n description: msg,\r\n disableCancelButton: true,\r\n });\r\n return;\r\n }\r\n\r\n /** save comsolidation before download when: consolidationDetail.id === null or has data changed */\r\n const hasUpdated = checkSaveData(consolidationDetail);\r\n\r\n const downloadFunc = () => {\r\n store.dispatch({\r\n type: GET_DOWNLOAD_DOCUMENT,\r\n payload: {\r\n data: {\r\n decision,\r\n decisionDate,\r\n refNo,\r\n docType: documentType,\r\n docId: formId,\r\n },\r\n apiUrl: API.consolidation.generateApprovalLetter,\r\n },\r\n });\r\n };\r\n\r\n if (consolidationDetail.id === null || hasUpdated) {\r\n const res = yield showDialog({\r\n description: SAVE_BEFORE_DOWNLOAD_APPROVAL_LETTER,\r\n });\r\n if (res) {\r\n yield saveConsolidationDetail({\r\n payload: {\r\n formId,\r\n documentType,\r\n },\r\n });\r\n downloadFunc();\r\n }\r\n } else {\r\n downloadFunc();\r\n }\r\n}\r\n\r\nconst reducer = (state = getInitialState(), action) => {\r\n switch (action.type) {\r\n case RESET_CONSOLIDATION:\r\n return getInitialState();\r\n case SET_CONSOLIDATION:\r\n const newState = produce(state, (draft) => {\r\n Object.entries(action.payload).forEach(([key, value]) => {\r\n draft[key] = action.payload[key];\r\n });\r\n });\r\n return newState;\r\n default:\r\n return state;\r\n }\r\n};\r\n\r\nexport function* watchConsolidationDetail() {\r\n yield takeEvery(GET_CONSOLIDATION_DETAIL, safeSaga(getConsolidationDetail));\r\n yield takeEvery(SAVE_CONSOLIDATION_DETAIL, safeSaga(saveConsolidationDetail));\r\n yield takeEvery(SUBMIT_CONSOLIDATION_DETAIL, safeSaga(submitConsolidationDetail));\r\n yield takeEvery(CHECK_CONSOLIDATION_UPDATE, safeSaga(checkConsolidationUpdate));\r\n yield takeEvery(DOWNLOAD_APPROVAL_LETTER, safeSaga(downloadApprovalLetter));\r\n}\r\n\r\nexport default reducer;\r\n","import { call, put, select, takeEvery } from 'redux-saga/effects';\r\nimport { SET_SUSAR_REPORT, SAVE_SUSAR, UP_DATA_INITIAL, GET_SUSAR, SUBMIT_SUSAR } from 'store/key';\r\nimport { produce } from 'utility/general';\r\nimport { setGlobalLoading } from 'store/global/reducer';\r\nimport API from 'api/call';\r\nimport { safeSaga } from 'store';\r\nimport store from 'store';\r\nimport { setGlobal } from 'store/global/reducer';\r\nimport { statusLookup } from 'utility/lookup';\r\n\r\nconst initialState = {\r\n reportData: null,\r\n remoteDetail: {\r\n actualStudyStartDate: null,\r\n isNotYetStarted: null,\r\n recruitedSubjectNo: null,\r\n totalNumberReportsSubmitted: null,\r\n anyRecommendation: null,\r\n isAlterationRequired: null,\r\n addSupplements: [],\r\n deleteSupplements: [],\r\n signedFileName: '',\r\n signedFileId: '',\r\n },\r\n rows: [],\r\n remoteDocIds: [],\r\n isLoading: false,\r\n forceErrorDisplay: false,\r\n oldData: {\r\n actualStudyStartDate: null,\r\n isNotYetStarted: null,\r\n recruitedSubjectNo: null,\r\n totalNumberReportsSubmitted: null,\r\n anyRecommendation: null,\r\n isAlterationRequired: null,\r\n },\r\n};\r\nfunction* upDataInitial(action) {\r\n const { key, value } = action.payload;\r\n const { susarReport } = yield select();\r\n susarReport[key] = value;\r\n yield put({\r\n type: SET_SUSAR_REPORT,\r\n payload: susarReport,\r\n });\r\n}\r\n\r\nfunction* getSusar(action) {\r\n const { docType, reportId, appId, isFormCreate, onPermissionError } = action.payload;\r\n const { susarReport } = yield select();\r\n susarReport.isLoading = true;\r\n susarReport.forceErrorDisplay = false;\r\n\r\n yield put({\r\n type: SET_SUSAR_REPORT,\r\n payload: susarReport,\r\n });\r\n\r\n try {\r\n let data = { docType: docType };\r\n if (isFormCreate) {\r\n data.appId = appId;\r\n data.reportId = null;\r\n } else {\r\n data.reportId = reportId;\r\n }\r\n\r\n const res = yield call(API.postApprovalActivities.getReportDetail, data);\r\n const detail = res.data.result;\r\n susarReport.remoteDetail = detail;\r\n susarReport.remoteDetail.addSupplements = [];\r\n susarReport.remoteDetail.deleteSupplements = [];\r\n susarReport.rows = detail.supplementDocuments ?? [];\r\n susarReport.remoteDocIds = detail.supplementDocuments?.map((item) => item.id);\r\n\r\n susarReport.oldData.actualStudyStartDate = detail.actualStudyStartDate;\r\n susarReport.oldData.isNotYetStarted = detail.isNotYetStarted;\r\n susarReport.oldData.recruitedSubjectNo = detail.recruitedSubjectNo;\r\n susarReport.oldData.totalNumberReportsSubmitted = detail.totalNumberReportsSubmitted;\r\n susarReport.oldData.anyRecommendation = detail.anyRecommendation;\r\n susarReport.oldData.isAlterationRequired = detail.isAlterationRequired;\r\n\r\n if (!isFormCreate) {\r\n let subNo = null,\r\n statusDisplay = null;\r\n if (detail.subNo) {\r\n subNo = detail.subNo;\r\n }\r\n if (detail.lastStatus !== null) {\r\n statusDisplay =\r\n statusLookup.find((item) => {\r\n return detail.lastStatus === item.key;\r\n })?.statusDisplay || null;\r\n }\r\n store.dispatch(\r\n setGlobal({\r\n postApprovalReportData: {\r\n [reportId]: {\r\n showNavigationSubNo: subNo,\r\n showNavigationStatus: statusDisplay,\r\n },\r\n },\r\n }),\r\n );\r\n }\r\n } catch (error) {\r\n console.log('get susar report detail failed:', error);\r\n return onPermissionError?.();\r\n }\r\n\r\n susarReport.isLoading = false;\r\n yield put({\r\n type: SET_SUSAR_REPORT,\r\n payload: susarReport,\r\n });\r\n}\r\n\r\nfunction* saveSusar(action) {\r\n const { callback, reportId, appId, isFormCreate, signedFileId } = action.payload;\r\n const { susarReport } = yield select();\r\n\r\n setGlobalLoading(true);\r\n try {\r\n const {\r\n actualStudyStartDate,\r\n isNotYetStarted,\r\n recruitedSubjectNo,\r\n totalNumberReportsSubmitted,\r\n anyRecommendation,\r\n isAlterationRequired,\r\n addSupplements,\r\n deleteSupplements,\r\n } = susarReport.remoteDetail;\r\n\r\n let data = {\r\n actualStudyStartDate: actualStudyStartDate ? new Date(actualStudyStartDate) : null,\r\n isNotYetStarted,\r\n recruitedSubjectNo,\r\n totalNumberReportsSubmitted,\r\n isAlterationRequired,\r\n anyRecommendation,\r\n addSupplements,\r\n deleteSupplements,\r\n appId: appId ?? susarReport.remoteDetail.appId,\r\n signedFileId,\r\n };\r\n\r\n if (!isFormCreate) {\r\n data.reportId = reportId;\r\n }\r\n\r\n const res = yield call(API.susarReport.saveSusar, data);\r\n\r\n const newReportId = res.data.result.reportId;\r\n callback?.(newReportId);\r\n } catch (error) {\r\n console.log('create/save susar failed:', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\n\r\nfunction* submitSusar(action) {\r\n const { callback, reportId, appId, isFormCreate, signedFileId } = action.payload;\r\n const { susarReport } = yield select();\r\n\r\n setGlobalLoading(true);\r\n try {\r\n const {\r\n actualStudyStartDate,\r\n isNotYetStarted,\r\n recruitedSubjectNo,\r\n totalNumberReportsSubmitted,\r\n anyRecommendation,\r\n isAlterationRequired,\r\n addSupplements,\r\n deleteSupplements,\r\n } = susarReport.remoteDetail;\r\n\r\n let data = {\r\n actualStudyStartDate: actualStudyStartDate ? new Date(actualStudyStartDate) : null,\r\n isNotYetStarted,\r\n recruitedSubjectNo,\r\n totalNumberReportsSubmitted,\r\n isAlterationRequired,\r\n anyRecommendation,\r\n addSupplements,\r\n deleteSupplements,\r\n appId: appId ?? susarReport.remoteDetail.appId,\r\n signedFileId,\r\n };\r\n\r\n if (!isFormCreate) {\r\n data.reportId = reportId;\r\n }\r\n\r\n yield call(API.susarReport.submitSusar, data);\r\n\r\n callback?.();\r\n } catch (error) {\r\n console.log('submit susar failed:', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\n\r\nconst reducer = (state = initialState, action) => {\r\n switch (action.type) {\r\n case SET_SUSAR_REPORT:\r\n const newState = produce(state, (draft) => {\r\n Object.entries(action.payload).forEach(([key, value]) => {\r\n draft[key] = action.payload[key];\r\n });\r\n });\r\n return newState;\r\n default:\r\n return state;\r\n }\r\n};\r\nexport function* watchSusarReport() {\r\n yield takeEvery(UP_DATA_INITIAL, safeSaga(upDataInitial));\r\n yield takeEvery(GET_SUSAR, safeSaga(getSusar));\r\n yield takeEvery(SAVE_SUSAR, safeSaga(saveSusar));\r\n yield takeEvery(SUBMIT_SUSAR, safeSaga(submitSusar));\r\n}\r\n\r\nexport default reducer;\r\n","import { call, put, select, takeEvery } from 'redux-saga/effects';\r\nimport {\r\n SET_MISCELLANEOUS_REPORT,\r\n SAVE_MISCELLANEOUS,\r\n UP_DATA_INITIAL,\r\n GET_MISCELLANEOUS,\r\n SUBMIT_MISCELLANEOUS,\r\n} from 'store/key';\r\nimport { produce } from 'utility/general';\r\nimport { setGlobalLoading } from 'store/global/reducer';\r\nimport API from 'api/call';\r\nimport { safeSaga } from 'store';\r\nimport store from 'store';\r\nimport { setGlobal } from 'store/global/reducer';\r\nimport { statusLookup } from 'utility/lookup';\r\n\r\nconst initialState = {\r\n reportData: null,\r\n remoteDetail: {\r\n actualStudyStartDate: null,\r\n isNotYetStarted: false,\r\n addSupplements: [],\r\n deleteSupplements: [],\r\n listOfSubmittedInformation: null,\r\n remarkOfOthers: null,\r\n typeOfSubmittedInformation: null,\r\n signedFileName: '',\r\n signedFileId: '',\r\n },\r\n rows: [],\r\n remoteDocIds: [],\r\n isLoading: false,\r\n forceErrorDisplay: false,\r\n oldData: {\r\n actualStudyStartDate: null,\r\n isNotYetStarted: false,\r\n listOfSubmittedInformation: null,\r\n remarkOfOthers: null,\r\n typeOfSubmittedInformation: null,\r\n },\r\n};\r\nfunction* upDataInitial(action) {\r\n const { key, value } = action.payload;\r\n const { miscellaneousReport } = yield select();\r\n miscellaneousReport[key] = value;\r\n yield put({\r\n type: SET_MISCELLANEOUS_REPORT,\r\n payload: miscellaneousReport,\r\n });\r\n}\r\n\r\nfunction* getMiscellaneous(action) {\r\n const { docType, reportId, appId, isFormCreate, siteId, onPermissionError } = action.payload;\r\n const { miscellaneousReport } = yield select();\r\n miscellaneousReport.isLoading = true;\r\n miscellaneousReport.forceErrorDisplay = false;\r\n yield put({\r\n type: SET_MISCELLANEOUS_REPORT,\r\n payload: miscellaneousReport,\r\n });\r\n\r\n try {\r\n let data = { docType: docType };\r\n if (isFormCreate) {\r\n data.appId = parseInt(appId);\r\n data.reportId = null;\r\n if (siteId) {\r\n data.siteId = parseInt(siteId);\r\n }\r\n } else {\r\n data.reportId = parseInt(reportId);\r\n }\r\n\r\n const res = yield call(API.postApprovalActivities.getReportDetail, data);\r\n const detail = res.data.result;\r\n\r\n miscellaneousReport.remoteDetail = detail;\r\n miscellaneousReport.remoteDetail.addSupplements = [];\r\n miscellaneousReport.remoteDetail.deleteSupplements = [];\r\n miscellaneousReport.rows = detail.supplementDocuments ?? [];\r\n miscellaneousReport.remoteDocIds = detail.supplementDocuments?.map((item) => item.id) ?? [];\r\n\r\n miscellaneousReport.oldData.actualStudyStartDate = detail.actualStudyStartDate;\r\n miscellaneousReport.oldData.isNotYetStarted = detail.isNotYetStarted;\r\n miscellaneousReport.oldData.listOfSubmittedInformation = detail.listOfSubmittedInformation;\r\n miscellaneousReport.oldData.remarkOfOthers = detail.remarkOfOthers;\r\n miscellaneousReport.oldData.typeOfSubmittedInformation = detail.typeOfSubmittedInformation;\r\n\r\n if (detail.typeOfSubmittedInformation === 'B') {\r\n miscellaneousReport.remoteDetail.typeOfSubmittedInformation = 'newInformation,others';\r\n miscellaneousReport.oldData.typeOfSubmittedInformation = 'newInformation,others';\r\n }\r\n if (detail.typeOfSubmittedInformation === 'N' || detail.typeOfSubmittedInformation === 'null') {\r\n miscellaneousReport.remoteDetail.typeOfSubmittedInformation = 'newInformation';\r\n miscellaneousReport.oldData.typeOfSubmittedInformation = 'newInformation';\r\n }\r\n if (detail.typeOfSubmittedInformation === 'O') {\r\n miscellaneousReport.remoteDetail.typeOfSubmittedInformation = 'others';\r\n miscellaneousReport.oldData.typeOfSubmittedInformation = 'others';\r\n }\r\n\r\n if (detail.isNotYetStarted === null) {\r\n miscellaneousReport.remoteDetail.isNotYetStarted = false;\r\n }\r\n\r\n if (!isFormCreate) {\r\n let subNo = null,\r\n statusDisplay = null;\r\n if (detail.subNo) {\r\n subNo = detail.subNo;\r\n }\r\n if (detail.lastStatus !== null) {\r\n statusDisplay =\r\n statusLookup.find((item) => {\r\n return detail.lastStatus === item.key;\r\n })?.statusDisplay || null;\r\n }\r\n store.dispatch(\r\n setGlobal({\r\n postApprovalReportData: {\r\n [reportId]: {\r\n showNavigationSubNo: subNo,\r\n showNavigationStatus: statusDisplay,\r\n },\r\n },\r\n }),\r\n );\r\n }\r\n } catch (error) {\r\n console.log('%c 150909 reducer.js error', 'background: green', error)\r\n return onPermissionError?.();\r\n }\r\n\r\n miscellaneousReport.isLoading = false;\r\n\r\n yield put({\r\n type: SET_MISCELLANEOUS_REPORT,\r\n payload: miscellaneousReport,\r\n });\r\n}\r\n\r\nfunction* saveMiscellaneous(action) {\r\n const { callback, reportId, appId, isFormCreate, signedFileId, siteId } = action.payload;\r\n const { miscellaneousReport } = yield select();\r\n setGlobalLoading(true);\r\n try {\r\n const {\r\n actualStudyStartDate,\r\n isNotYetStarted,\r\n addSupplements,\r\n deleteSupplements,\r\n listOfSubmittedInformation = null,\r\n remarkOfOthers = null,\r\n typeOfSubmittedInformation,\r\n } = miscellaneousReport.remoteDetail;\r\n\r\n let data = {\r\n actualStudyStartDate: actualStudyStartDate ? new Date(actualStudyStartDate) : null,\r\n isNotYetStarted,\r\n addSupplements,\r\n deleteSupplements,\r\n listOfSubmittedInformation,\r\n remarkOfOthers,\r\n typeOfSubmittedInformation,\r\n appId: appId ?? miscellaneousReport.remoteDetail.appId,\r\n signedFileId,\r\n };\r\n\r\n if (siteId) {\r\n data.siteId = parseInt(siteId);\r\n }\r\n\r\n if (!isFormCreate) {\r\n data.reportId = reportId;\r\n }\r\n\r\n if (isNotYetStarted === null) {\r\n data.isNotYetStarted = false;\r\n }\r\n\r\n if (typeOfSubmittedInformation === null) {\r\n data.typeOfSubmittedInformation = 'N';\r\n } else {\r\n if (!typeOfSubmittedInformation.includes('others')) {\r\n data.remarkOfOthers = null;\r\n data.typeOfSubmittedInformation = 'N';\r\n }\r\n\r\n if (!typeOfSubmittedInformation.includes('newInformation')) {\r\n data.typeOfSubmittedInformation = 'O';\r\n }\r\n\r\n if (\r\n typeOfSubmittedInformation.includes('others') &&\r\n typeOfSubmittedInformation.includes('newInformation')\r\n ) {\r\n data.typeOfSubmittedInformation = 'B';\r\n }\r\n }\r\n\r\n console.log('reduce data', data);\r\n const res = yield call(API.miscellaneousReport.saveMiscellaneous, data);\r\n\r\n const newReportId = res.data.result.reportId;\r\n callback?.(newReportId);\r\n } catch (error) {\r\n console.log('create/save miscellaneous failed:', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\n\r\nfunction* submitMiscellaneous(action) {\r\n const { callback, reportId, appId, isFormCreate, signedFileId, siteId } = action.payload;\r\n const { miscellaneousReport } = yield select();\r\n setGlobalLoading(true);\r\n try {\r\n const {\r\n actualStudyStartDate,\r\n isNotYetStarted,\r\n addSupplements,\r\n deleteSupplements,\r\n listOfSubmittedInformation,\r\n remarkOfOthers,\r\n typeOfSubmittedInformation,\r\n } = miscellaneousReport.remoteDetail;\r\n\r\n let data = {\r\n actualStudyStartDate: actualStudyStartDate ? new Date(actualStudyStartDate) : null,\r\n isNotYetStarted,\r\n addSupplements,\r\n deleteSupplements,\r\n listOfSubmittedInformation,\r\n remarkOfOthers,\r\n typeOfSubmittedInformation,\r\n appId: appId ?? miscellaneousReport.remoteDetail.appId,\r\n signedFileId,\r\n };\r\n\r\n if (isNotYetStarted === null) {\r\n data.isNotYetStarted = false;\r\n }\r\n\r\n if (siteId) {\r\n data.siteId = parseInt(siteId);\r\n }\r\n\r\n if (!isFormCreate) {\r\n data.reportId = parseInt(reportId);\r\n }\r\n\r\n if (typeOfSubmittedInformation === null) {\r\n data.typeOfSubmittedInformation = 'N';\r\n } else {\r\n if (!typeOfSubmittedInformation.includes('others')) {\r\n data.remarkOfOthers = null;\r\n data.typeOfSubmittedInformation = 'N';\r\n }\r\n\r\n if (!typeOfSubmittedInformation.includes('newInformation')) {\r\n data.typeOfSubmittedInformation = 'O';\r\n }\r\n\r\n if (\r\n typeOfSubmittedInformation.includes('others') &&\r\n typeOfSubmittedInformation.includes('newInformation')\r\n ) {\r\n data.typeOfSubmittedInformation = 'B';\r\n }\r\n }\r\n\r\n console.log('submit reducer', data);\r\n\r\n yield call(API.miscellaneousReport.submitMiscellaneous, data);\r\n\r\n // const newReportId = res.data.result.reportId;\r\n callback?.();\r\n } catch (error) {\r\n console.log('submit miscellaneous failed:', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\n\r\nconst reducer = (state = initialState, action) => {\r\n switch (action.type) {\r\n case SET_MISCELLANEOUS_REPORT:\r\n const newState = produce(state, (draft) => {\r\n Object.entries(action.payload).forEach(([key, value]) => {\r\n draft[key] = action.payload[key];\r\n });\r\n });\r\n return newState;\r\n default:\r\n return state;\r\n }\r\n};\r\nexport function* watchMiscellaneousReport() {\r\n yield takeEvery(UP_DATA_INITIAL, safeSaga(upDataInitial));\r\n yield takeEvery(GET_MISCELLANEOUS, safeSaga(getMiscellaneous));\r\n yield takeEvery(SAVE_MISCELLANEOUS, safeSaga(saveMiscellaneous));\r\n yield takeEvery(SUBMIT_MISCELLANEOUS, safeSaga(submitMiscellaneous));\r\n}\r\n\r\nexport default reducer;\r\n","import { call, put, select, takeEvery } from 'redux-saga/effects';\r\nimport { SET_PROGRESS_REPORT, GET_PROGRESS_REPORT, SAVE_PROGRESS_REPORT } from 'store/key';\r\nimport { produce } from 'utility/general';\r\nimport API from 'api/call';\r\nimport { safeSaga } from 'store';\r\nimport { PROGRESS_REPORT } from 'utility/postApprovalLookUp';\r\nimport { setGlobal } from 'store/global/reducer';\r\n\r\nconst initialState = {\r\n // reportData: null,\r\n remoteDetail: {},\r\n // rows: [],\r\n // remoteDocIds: [],\r\n isLoading: false,\r\n // forceErrorDisplay: false,\r\n};\r\n\r\n// function* upDataInitial(action) {\r\n// const { key, value } = action.payload;\r\n// const { susarReport } = yield select();\r\n// susarReport[key] = value;\r\n// yield put({\r\n// type: SET_SUSAR_REPORT,\r\n// payload: susarReport,\r\n// });\r\n// }\r\n\r\nfunction* saveProgressReport(action) {\r\n const { callback, data, final, onError, isSubmit = false } = action.payload;\r\n\r\n // data should include reportId / siteId & appId\r\n\r\n try {\r\n const api = isSubmit ? API.progressReport.submitProgressReport : API.progressReport.saveProgressReport;\r\n\r\n const res = yield call(api, data);\r\n\r\n const newReportId = res.data.result?.reportId;\r\n\r\n callback?.(newReportId);\r\n } catch (error) {\r\n console.log('create/save progress failed:', error);\r\n onError?.();\r\n }\r\n\r\n final?.();\r\n}\r\n\r\nfunction* getProgressReport(action) {\r\n const { docType = PROGRESS_REPORT, reportId, appId, siteId, isLoading = true, final, callback, onPermissionError } = action.payload;\r\n const { progressReport } = yield select();\r\n\r\n try {\r\n // clear data from another form\r\n yield put(\r\n setGlobal({\r\n postApprovalReportData: {\r\n [reportId]: {\r\n showNavigationSubNo: null,\r\n showNavigationStatus: null,\r\n },\r\n },\r\n }),\r\n );\r\n let data = { docType };\r\n\r\n if (reportId) {\r\n data.reportId = reportId;\r\n } else {\r\n data.appId = appId;\r\n data.siteId = siteId;\r\n }\r\n\r\n if (isLoading) {\r\n yield put({\r\n type: SET_PROGRESS_REPORT,\r\n payload: {\r\n isLoading: true,\r\n },\r\n });\r\n }\r\n\r\n const res = yield call(API.postApprovalActivities.getReportDetail, data);\r\n const detail = res.data.result;\r\n progressReport.remoteDetail = detail;\r\n progressReport.isLoading = false;\r\n\r\n yield put({\r\n type: SET_PROGRESS_REPORT,\r\n payload: progressReport,\r\n });\r\n\r\n callback?.(progressReport);\r\n } catch (error) {\r\n console.log('get susar report detail failed:', error);\r\n\r\n onPermissionError?.();\r\n return final?.();\r\n\r\n // yield put({\r\n // type: SET_PROGRESS_REPORT,\r\n // payload: {\r\n // isLoading: false,\r\n // },\r\n // });\r\n }\r\n\r\n final?.();\r\n}\r\n\r\n// function* saveSusar(action) {\r\n// const { callback, reportId, appId, isFormCreate } = action.payload;\r\n// const { susarReport } = yield select();\r\n\r\n// setGlobalLoading(true);\r\n// try {\r\n// const {\r\n// actualStudyStartDate,\r\n// isNotYetStarted,\r\n// recruitedSubjectNo,\r\n// totalNumberReportsSubmitted,\r\n// anyRecommendation,\r\n// isAlterationRequired,\r\n// addSupplements,\r\n// deleteSupplements,\r\n// } = susarReport.remoteDetail;\r\n\r\n// let data = {\r\n// actualStudyStartDate: actualStudyStartDate ? new Date(actualStudyStartDate) : null,\r\n// isNotYetStarted,\r\n// recruitedSubjectNo,\r\n// totalNumberReportsSubmitted,\r\n// isAlterationRequired,\r\n// anyRecommendation,\r\n// addSupplements,\r\n// deleteSupplements,\r\n// appId: appId ?? susarReport.remoteDetail.appId,\r\n// };\r\n\r\n// if (!isFormCreate) {\r\n// data.reportId = reportId;\r\n// }\r\n\r\n// const res = yield call(API.susarReport.saveSusar, data);\r\n\r\n// const newReportId = res.data.result.reportId;\r\n// callback?.(newReportId);\r\n// } catch (error) {\r\n// console.log('create/save susar failed:', error);\r\n// }\r\n// setGlobalLoading(false);\r\n// }\r\n\r\n// function* submitSusar(action) {\r\n// const { callback, reportId, appId, isFormCreate } = action.payload;\r\n// const { susarReport } = yield select();\r\n\r\n// setGlobalLoading(true);\r\n// try {\r\n// const {\r\n// actualStudyStartDate,\r\n// isNotYetStarted,\r\n// recruitedSubjectNo,\r\n// totalNumberReportsSubmitted,\r\n// anyRecommendation,\r\n// isAlterationRequired,\r\n// addSupplements,\r\n// deleteSupplements,\r\n// } = susarReport.remoteDetail;\r\n\r\n// let data = {\r\n// actualStudyStartDate: actualStudyStartDate ? new Date(actualStudyStartDate) : null,\r\n// isNotYetStarted,\r\n// recruitedSubjectNo,\r\n// totalNumberReportsSubmitted,\r\n// isAlterationRequired,\r\n// anyRecommendation,\r\n// addSupplements,\r\n// deleteSupplements,\r\n// appId: appId ?? susarReport.remoteDetail.appId,\r\n// };\r\n\r\n// if (!isFormCreate) {\r\n// data.reportId = reportId;\r\n// }\r\n\r\n// yield call(API.susarReport.submitSusar, data);\r\n\r\n// callback?.();\r\n// } catch (error) {\r\n// console.log('submit susar failed:', error);\r\n// }\r\n// setGlobalLoading(false);\r\n// }\r\n\r\nconst reducer = (state = initialState, action) => {\r\n switch (action.type) {\r\n case SET_PROGRESS_REPORT:\r\n const newState = produce(state, (draft) => {\r\n Object.entries(action.payload).forEach(([key, value]) => {\r\n draft[key] = action.payload[key];\r\n });\r\n });\r\n return newState;\r\n default:\r\n return state;\r\n }\r\n};\r\nexport function* watchProgressReport() {\r\n yield takeEvery(GET_PROGRESS_REPORT, safeSaga(getProgressReport));\r\n yield takeEvery(SAVE_PROGRESS_REPORT, safeSaga(saveProgressReport));\r\n}\r\n\r\nexport default reducer;\r\n","import { call, put, select, takeEvery } from 'redux-saga/effects';\r\nimport { SET_PROTOCOL_DEVIATION_REPORT, SAVE_PROTOCOL_DEVIATION, UP_DATA_INITIAL, GET_PROTOCOL_DEVIATION, SUBMIT_PROTOCOL_DEVIATION } from 'store/key';\r\nimport { produce } from 'utility/general';\r\nimport { setGlobalLoading } from 'store/global/reducer';\r\nimport API from 'api/call';\r\nimport { safeSaga } from 'store';\r\nimport store from 'store';\r\nimport { setGlobal } from 'store/global/reducer';\r\nimport { statusLookup } from 'utility/lookup';\r\n\r\nconst initialState = {\r\n reportData: null,\r\n remoteDetail: {\r\n actualStudyStartDate: null,\r\n isNotYetStarted: false,\r\n addSupplements: [],\r\n deleteSupplements: [],\r\n studySite:null,\r\n signedFileName: '',\r\n signedFileId: '',\r\n protocolDeviationReportDetails:[{}],\r\n },\r\n rows: [],\r\n remoteDocIds: [],\r\n isLoading: false,\r\n forceErrorDisplay: false,\r\n oldData: {\r\n actualStudyStartDate: null,\r\n isNotYetStarted: false,\r\n studySite:null,\r\n protocolDeviationReportDetails:[{}],\r\n },\r\n};\r\nfunction* upDataInitial(action) {\r\n const { key, value } = action.payload;\r\n const { protocolDeviationReport } = yield select();\r\n protocolDeviationReport[key] = value;\r\n yield put({\r\n type: SET_PROTOCOL_DEVIATION_REPORT,\r\n payload: protocolDeviationReport,\r\n });\r\n}\r\n\r\nfunction* getProtocolDeviation(action) {\r\n const { docType, reportId, appId, isFormCreate, siteId } = action.payload;\r\n const { protocolDeviationReport } = yield select();\r\n protocolDeviationReport.isLoading = true;\r\n protocolDeviationReport.forceErrorDisplay = false;\r\n\r\n yield put({\r\n type: SET_PROTOCOL_DEVIATION_REPORT,\r\n payload: protocolDeviationReport,\r\n });\r\n\r\n try {\r\n let data = { docType: docType };\r\n if (isFormCreate) {\r\n data.appId = appId;\r\n data.reportId = null;\r\n if (siteId) {\r\n data.siteId = parseInt(siteId);\r\n }\r\n } else {\r\n data.reportId = reportId;\r\n }\r\n\r\n const res = yield call(API.postApprovalActivities.getReportDetail, data);\r\n const detail = res.data.result;\r\n protocolDeviationReport.remoteDetail = detail;\r\n protocolDeviationReport.remoteDetail.addSupplements = [];\r\n protocolDeviationReport.remoteDetail.deleteSupplements = [];\r\n protocolDeviationReport.rows = detail.supplementDocuments ?? [];\r\n protocolDeviationReport.remoteDocIds = detail.supplementDocuments?.map((item) => item.id);\r\n\r\n protocolDeviationReport.oldData.actualStudyStartDate = detail.actualStudyStartDate;\r\n protocolDeviationReport.oldData.isNotYetStarted = detail.isNotYetStarted;\r\n protocolDeviationReport.oldData.studySite = detail.studySite;\r\n protocolDeviationReport.oldData.protocolDeviationReportDetails = detail.protocolDeviationReportDetails;\r\n\r\n if (!isFormCreate) {\r\n let subNo = null,\r\n statusDisplay = null;\r\n if (detail.subNo) {\r\n subNo = detail.subNo;\r\n }\r\n if (detail.lastStatus !== null) {\r\n statusDisplay =\r\n statusLookup.find((item) => {\r\n return detail.lastStatus === item.key;\r\n })?.statusDisplay || null;\r\n }\r\n store.dispatch(\r\n setGlobal({\r\n postApprovalReportData: {\r\n [reportId]: {\r\n showNavigationSubNo: subNo,\r\n showNavigationStatus: statusDisplay,\r\n },\r\n },\r\n }),\r\n );\r\n }\r\n } catch (error) {\r\n console.log('get protocolDeviation report detail failed:', error);\r\n }\r\n\r\n protocolDeviationReport.isLoading = false;\r\n yield put({\r\n type: SET_PROTOCOL_DEVIATION_REPORT,\r\n payload: protocolDeviationReport,\r\n });\r\n}\r\n\r\nfunction* saveProtocolDeviation(action) {\r\n const { callback, reportId, appId, isFormCreate, signedFileId,siteId } = action.payload;\r\n const { protocolDeviationReport } = yield select();\r\n\r\n setGlobalLoading(true);\r\n try {\r\n const {\r\n actualStudyStartDate,\r\n isNotYetStarted,\r\n addSupplements,\r\n deleteSupplements,\r\n studySite,\r\n piSiteName,\r\n protocolDeviationReportDetails,\r\n } = protocolDeviationReport.remoteDetail;\r\n\r\n let data = {\r\n actualStudyStartDate: actualStudyStartDate ? new Date(actualStudyStartDate) : null,\r\n isNotYetStarted,\r\n addSupplements,\r\n deleteSupplements,\r\n studySite,\r\n piSiteName,\r\n protocolDeviationReportDetails,\r\n appId: appId ?? protocolDeviationReport.remoteDetail.appId,\r\n signedFileId,\r\n siteId,\r\n };\r\n\r\n if (!isFormCreate) {\r\n data.reportId = reportId;\r\n }\r\n\r\n if(isNotYetStarted === null){\r\n data.isNotYetStarted = false;\r\n }\r\n\r\n if (siteId) {\r\n data.siteId = parseInt(siteId);\r\n }\r\n\r\n console.log('save reducer',data);\r\n\r\n const res = yield call(API.protocolDeviationReport.saveProtocolDeviation, data);\r\n\r\n const newReportId = res.data.result.reportId;\r\n callback?.(newReportId);\r\n } catch (error) {\r\n console.log('create/save protocolDeviation failed:', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\n\r\nfunction* submitProtocolDeviation(action) {\r\n const { callback, reportId, appId, isFormCreate, signedFileId,siteId } = action.payload;\r\n const { protocolDeviationReport } = yield select();\r\n\r\n setGlobalLoading(true);\r\n try {\r\n const {\r\n actualStudyStartDate,\r\n isNotYetStarted,\r\n addSupplements,\r\n deleteSupplements,\r\n studySite,\r\n piSiteName,\r\n protocolDeviationReportDetails,\r\n } = protocolDeviationReport.remoteDetail;\r\n\r\n let data = {\r\n actualStudyStartDate: actualStudyStartDate ? new Date(actualStudyStartDate) : null,\r\n isNotYetStarted,\r\n addSupplements,\r\n deleteSupplements,\r\n studySite,\r\n piSiteName,\r\n protocolDeviationReportDetails,\r\n appId: appId ?? protocolDeviationReport.remoteDetail.appId,\r\n siteId,\r\n signedFileId,\r\n };\r\n\r\n if (!isFormCreate) {\r\n data.reportId = reportId;\r\n }\r\n\r\n if (siteId) {\r\n data.siteId = parseInt(siteId);\r\n }\r\n\r\n console.log('submit reducer',data);\r\n\r\n yield call(API.protocolDeviationReport.submitProtocolDeviation, data);\r\n\r\n callback?.();\r\n } catch (error) {\r\n console.log('submit protocolDeviation failed:', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\n\r\nconst reducer = (state = initialState, action) => {\r\n switch (action.type) {\r\n case SET_PROTOCOL_DEVIATION_REPORT:\r\n const newState = produce(state, (draft) => {\r\n Object.entries(action.payload).forEach(([key, value]) => {\r\n draft[key] = action.payload[key];\r\n });\r\n });\r\n return newState;\r\n default:\r\n return state;\r\n }\r\n};\r\nexport function* watchProtocolDeviationReport() {\r\n yield takeEvery(UP_DATA_INITIAL, safeSaga(upDataInitial));\r\n yield takeEvery(GET_PROTOCOL_DEVIATION, safeSaga(getProtocolDeviation));\r\n yield takeEvery(SAVE_PROTOCOL_DEVIATION, safeSaga(saveProtocolDeviation));\r\n yield takeEvery(SUBMIT_PROTOCOL_DEVIATION, safeSaga(submitProtocolDeviation));\r\n}\r\n\r\nexport default reducer;\r\n","import { call, put, select, takeEvery } from 'redux-saga/effects';\r\nimport { SET_LOCAL_SAE_REPORT, SAVE_LOCAL_SAE, GET_LOCAL_SAE, SUBMIT_LOCAL_SAE } from 'store/key';\r\nimport { produce } from 'utility/general';\r\nimport { setGlobalLoading } from 'store/global/reducer';\r\nimport API from 'api/call';\r\nimport { safeSaga } from 'store';\r\nimport store from 'store';\r\nimport { setGlobal } from 'store/global/reducer';\r\nimport { statusLookup } from 'utility/lookup';\r\n\r\nconst initialState = {\r\n reportData: null,\r\n remoteDetail: {\r\n addSupplements: [],\r\n deleteSupplements: [],\r\n actualStudyStartDate: null,\r\n isNotYetStarted: null,\r\n recruitedSubjectNo: null,\r\n expiryDate: null,\r\n nameOfStudySite: null,\r\n subjectOutcome: null,\r\n causeOfDeath: null,\r\n subjectRefCode: null,\r\n subjectRefInitials: null,\r\n subjectRefSex: null,\r\n subjectRefAge: null,\r\n relevantMedicalHistory: null,\r\n natureOfSae: null,\r\n saeStartDate: null,\r\n saeStopDate: null,\r\n saeNotResolved: null,\r\n typeOfSae: null,\r\n frequency: null,\r\n isDeath: null,\r\n isLiftThreatening: null,\r\n isSignificantDisability: null,\r\n isRequiredHospitalization: null,\r\n isPersisentDisability: null,\r\n isProlongedHospitalization: null,\r\n isCongenitalAnomaly: null,\r\n isNone: null,\r\n isOther: null,\r\n suspectedRelationship: null,\r\n affectedSubjectNone: null,\r\n affectedSubjectAdjustedDosage: null,\r\n affectedSubjectInterrupt: null,\r\n affectedSubjectDiscontinued: null,\r\n alterationRequired: null,\r\n recommendation: null,\r\n },\r\n rows: [],\r\n remoteDocIds: [],\r\n isLoading: false,\r\n forceErrorDisplay: false,\r\n oldData: {\r\n actualStudyStartDate: null,\r\n isNotYetStarted: null,\r\n recruitedSubjectNo: null,\r\n expiryDate: null,\r\n nameOfStudySite: null,\r\n subjectOutcome: null,\r\n causeOfDeath: null,\r\n subjectRefCode: null,\r\n subjectRefInitials: null,\r\n subjectRefSex: null,\r\n subjectRefAge: null,\r\n relevantMedicalHistory: null,\r\n natureOfSae: null,\r\n saeStartDate: null,\r\n saeStopDate: null,\r\n saeNotResolved: null,\r\n typeOfSae: null,\r\n frequency: null,\r\n isDeath: null,\r\n isLiftThreatening: null,\r\n isSignificantDisability: null,\r\n isRequiredHospitalization: null,\r\n isPersisentDisability: null,\r\n isProlongedHospitalization: null,\r\n isCongenitalAnomaly: null,\r\n isNone: null,\r\n isOther: null,\r\n suspectedRelationship: null,\r\n affectedSubjectNone: null,\r\n affectedSubjectAdjustedDosage: null,\r\n affectedSubjectInterrupt: null,\r\n affectedSubjectDiscontinued: null,\r\n alterationRequired: null,\r\n recommendation: null,\r\n },\r\n};\r\n\r\nfunction* getLocalSAE(action) {\r\n const { docType, reportId, appId, isFormCreate, siteId, onPermissionError } = action.payload;\r\n const { localSAEReport } = yield select();\r\n localSAEReport.isLoading = true;\r\n localSAEReport.forceErrorDisplay = false;\r\n\r\n yield put({\r\n type: SET_LOCAL_SAE_REPORT,\r\n payload: localSAEReport,\r\n });\r\n\r\n try {\r\n let data = { docType: docType, siteId };\r\n if (isFormCreate) {\r\n data.appId = appId;\r\n data.reportId = null;\r\n } else {\r\n data.reportId = reportId;\r\n }\r\n\r\n const res = yield call(API.postApprovalActivities.getReportDetail, data);\r\n const detail = res.data.result;\r\n localSAEReport.remoteDetail = detail;\r\n localSAEReport.remoteDetail.addSupplements = [];\r\n localSAEReport.remoteDetail.deleteSupplements = [];\r\n localSAEReport.rows = detail.supplementDocuments ?? [];\r\n localSAEReport.remoteDocIds = detail.supplementDocuments?.map((item) => item.id) ?? [];\r\n\r\n Object.keys(localSAEReport.oldData).forEach((key) => {\r\n localSAEReport.oldData[key] = detail[key];\r\n });\r\n\r\n if (!isFormCreate) {\r\n let subNo = null,\r\n statusDisplay = null;\r\n if (detail.subNo) {\r\n subNo = detail.subNo;\r\n }\r\n if (detail.lastStatus !== null) {\r\n statusDisplay =\r\n statusLookup.find((item) => {\r\n return detail.lastStatus === item.key;\r\n })?.statusDisplay || null;\r\n }\r\n store.dispatch(\r\n setGlobal({\r\n postApprovalReportData: {\r\n [reportId]: {\r\n showNavigationSubNo: subNo,\r\n showNavigationStatus: statusDisplay,\r\n },\r\n },\r\n }),\r\n );\r\n }\r\n } catch (error) {\r\n console.log('get localSAE report detail failed:', error);\r\n return onPermissionError?.();\r\n }\r\n\r\n localSAEReport.isLoading = false;\r\n yield put({\r\n type: SET_LOCAL_SAE_REPORT,\r\n payload: localSAEReport,\r\n });\r\n}\r\n\r\nfunction* saveLocalSAE(action) {\r\n const { callback, reportId, appId, isFormCreate, signedFileId, siteId } = action.payload;\r\n const { localSAEReport } = yield select();\r\n\r\n setGlobalLoading(true);\r\n try {\r\n const {\r\n actualStudyStartDate,\r\n isNotYetStarted,\r\n recruitedSubjectNo,\r\n addSupplements,\r\n deleteSupplements,\r\n expiryDate,\r\n nameOfStudySite,\r\n subjectOutcome,\r\n causeOfDeath,\r\n subjectRefCode,\r\n subjectRefInitials,\r\n subjectRefSex,\r\n subjectRefAge,\r\n relevantMedicalHistory,\r\n natureOfSae,\r\n saeStartDate,\r\n saeStopDate,\r\n saeNotResolved,\r\n typeOfSae,\r\n frequency,\r\n isDeath,\r\n isLiftThreatening,\r\n isSignificantDisability,\r\n isRequiredHospitalization,\r\n isPersisentDisability,\r\n isProlongedHospitalization,\r\n isCongenitalAnomaly,\r\n isNone,\r\n isOther,\r\n suspectedRelationship,\r\n affectedSubjectNone,\r\n affectedSubjectAdjustedDosage,\r\n affectedSubjectInterrupt,\r\n affectedSubjectDiscontinued,\r\n alterationRequired,\r\n recommendation,\r\n } = localSAEReport.remoteDetail;\r\n\r\n let data = {\r\n actualStudyStartDate: actualStudyStartDate ? new Date(actualStudyStartDate) : null,\r\n isNotYetStarted,\r\n recruitedSubjectNo,\r\n addSupplements,\r\n deleteSupplements,\r\n appId: appId ?? localSAEReport.remoteDetail.appId,\r\n signedFileId,\r\n siteId,\r\n expiryDate,\r\n nameOfStudySite,\r\n subjectOutcome,\r\n causeOfDeath,\r\n subjectRefCode,\r\n subjectRefInitials,\r\n subjectRefSex,\r\n subjectRefAge,\r\n relevantMedicalHistory,\r\n natureOfSae,\r\n saeStartDate,\r\n saeStopDate,\r\n saeNotResolved,\r\n typeOfSae,\r\n frequency,\r\n isDeath,\r\n isLiftThreatening,\r\n isSignificantDisability,\r\n isRequiredHospitalization,\r\n isPersisentDisability,\r\n isProlongedHospitalization,\r\n isCongenitalAnomaly,\r\n isNone,\r\n isOther,\r\n suspectedRelationship,\r\n affectedSubjectNone,\r\n affectedSubjectAdjustedDosage,\r\n affectedSubjectInterrupt,\r\n affectedSubjectDiscontinued,\r\n alterationRequired,\r\n recommendation,\r\n };\r\n\r\n if (!isFormCreate) {\r\n data.reportId = reportId;\r\n }\r\n\r\n const res = yield call(API.localSAEReport.saveLocalSAE, data);\r\n\r\n const newReportId = res.data.result.reportId;\r\n callback?.(newReportId);\r\n } catch (error) {\r\n console.log('create/save localSAE failed:', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\n\r\nfunction* submitLocalSAE(action) {\r\n const { callback, reportId, appId, isFormCreate, signedFileId, siteId } = action.payload;\r\n const { localSAEReport } = yield select();\r\n\r\n setGlobalLoading(true);\r\n try {\r\n const {\r\n actualStudyStartDate,\r\n isNotYetStarted,\r\n recruitedSubjectNo,\r\n addSupplements,\r\n deleteSupplements,\r\n expiryDate,\r\n nameOfStudySite,\r\n subjectOutcome,\r\n causeOfDeath,\r\n subjectRefCode,\r\n subjectRefInitials,\r\n subjectRefSex,\r\n subjectRefAge,\r\n relevantMedicalHistory,\r\n natureOfSae,\r\n saeStartDate,\r\n saeStopDate,\r\n saeNotResolved,\r\n typeOfSae,\r\n frequency,\r\n isDeath,\r\n isLiftThreatening,\r\n isSignificantDisability,\r\n isRequiredHospitalization,\r\n isPersisentDisability,\r\n isProlongedHospitalization,\r\n isCongenitalAnomaly,\r\n isNone,\r\n isOther,\r\n suspectedRelationship,\r\n affectedSubjectNone,\r\n affectedSubjectAdjustedDosage,\r\n affectedSubjectInterrupt,\r\n affectedSubjectDiscontinued,\r\n alterationRequired,\r\n recommendation,\r\n } = localSAEReport.remoteDetail;\r\n\r\n let data = {\r\n actualStudyStartDate: actualStudyStartDate ? new Date(actualStudyStartDate) : null,\r\n isNotYetStarted,\r\n recruitedSubjectNo,\r\n addSupplements,\r\n deleteSupplements,\r\n appId: appId ?? localSAEReport.remoteDetail.appId,\r\n signedFileId,\r\n expiryDate,\r\n nameOfStudySite,\r\n subjectOutcome,\r\n causeOfDeath,\r\n subjectRefCode,\r\n subjectRefInitials,\r\n subjectRefSex,\r\n subjectRefAge,\r\n relevantMedicalHistory,\r\n natureOfSae,\r\n saeStartDate,\r\n saeStopDate,\r\n saeNotResolved,\r\n typeOfSae,\r\n frequency,\r\n isDeath,\r\n isLiftThreatening,\r\n isSignificantDisability,\r\n isRequiredHospitalization,\r\n isPersisentDisability,\r\n isProlongedHospitalization,\r\n isCongenitalAnomaly,\r\n isNone,\r\n isOther,\r\n suspectedRelationship,\r\n affectedSubjectNone,\r\n affectedSubjectAdjustedDosage,\r\n affectedSubjectInterrupt,\r\n affectedSubjectDiscontinued,\r\n alterationRequired,\r\n recommendation,\r\n };\r\n\r\n if (!isFormCreate) {\r\n data.reportId = reportId;\r\n } else {\r\n data.siteId = siteId;\r\n }\r\n\r\n yield call(API.localSAEReport.submitLocalSAE, data);\r\n\r\n callback?.();\r\n } catch (error) {\r\n console.log('submit localSAE failed:', error);\r\n }\r\n setGlobalLoading(false);\r\n}\r\n\r\nconst reducer = (state = initialState, action) => {\r\n switch (action.type) {\r\n case SET_LOCAL_SAE_REPORT:\r\n const newState = produce(state, (draft) => {\r\n Object.entries(action.payload).forEach(([key, value]) => {\r\n draft[key] = action.payload[key];\r\n });\r\n });\r\n return newState;\r\n default:\r\n return state;\r\n }\r\n};\r\nexport function* watchLocalSAEReport() {\r\n yield takeEvery(GET_LOCAL_SAE, safeSaga(getLocalSAE));\r\n yield takeEvery(SAVE_LOCAL_SAE, safeSaga(saveLocalSAE));\r\n yield takeEvery(SUBMIT_LOCAL_SAE, safeSaga(submitLocalSAE));\r\n}\r\n\r\nexport default reducer;\r\n","import { call, put, select, takeEvery } from 'redux-saga/effects';\r\nimport { produce } from 'utility/general';\r\nimport API from 'api/call';\r\nimport { safeSaga } from 'store';\r\nimport { FINAL_REPORT } from 'utility/postApprovalLookUp';\r\nimport { GET_FINAL_REPORT, SAVE_FINAL_REPORT, SET_FINAL_REPORT } from 'store/key';\r\nimport { setGlobal } from 'store/global/reducer';\r\n\r\nconst initialState = {\r\n remoteDetail: {},\r\n isLoading: false,\r\n};\r\n\r\nfunction* saveFinalReport(action) {\r\n const { callback, data, final, onError, isSubmit = false } = action.payload;\r\n\r\n // data should include reportId / siteId & appId\r\n\r\n try {\r\n const api = isSubmit ? API.finalReport.submitFinalReport : API.finalReport.saveFinalReport;\r\n\r\n const res = yield call(api, data);\r\n\r\n const newReportId = res.data.result?.reportId;\r\n\r\n callback?.(newReportId);\r\n } catch (error) {\r\n console.log('create/save progress failed:', error);\r\n onError?.();\r\n }\r\n\r\n final?.();\r\n}\r\n\r\nfunction* getFinalReport(action) {\r\n const { docType = FINAL_REPORT, reportId, appId, isLoading = true, final, callback, onPermissionError } = action.payload;\r\n const { finalReport } = yield select();\r\n\r\n try {\r\n // clear data from another form\r\n yield put(\r\n setGlobal({\r\n postApprovalReportData: {\r\n [reportId]: {\r\n showNavigationSubNo: null,\r\n showNavigationStatus: null,\r\n },\r\n },\r\n }),\r\n );\r\n\r\n let data = { docType };\r\n\r\n if (reportId) {\r\n data.reportId = reportId;\r\n } else {\r\n data.appId = appId;\r\n }\r\n\r\n if (isLoading) {\r\n yield put({\r\n type: SET_FINAL_REPORT,\r\n payload: {\r\n isLoading: true,\r\n },\r\n });\r\n }\r\n\r\n const res = yield call(API.postApprovalActivities.getReportDetail, data);\r\n const detail = res.data.result;\r\n finalReport.remoteDetail = detail;\r\n finalReport.isLoading = false;\r\n\r\n yield put({\r\n type: SET_FINAL_REPORT,\r\n payload: finalReport,\r\n });\r\n\r\n callback?.(finalReport);\r\n } catch (error) {\r\n console.log('get susar report detail failed:', error);\r\n\r\n // if(error?.response?.data?.errorMessage.includes('You do not have')) {\r\n \r\n // }\r\n\r\n return onPermissionError?.()\r\n\r\n // yield put({\r\n // type: SET_FINAL_REPORT,\r\n // payload: {\r\n // isLoading: false,\r\n // },\r\n // });\r\n }\r\n\r\n final?.();\r\n}\r\n\r\nconst reducer = (state = initialState, action) => {\r\n switch (action.type) {\r\n case SET_FINAL_REPORT:\r\n const newState = produce(state, (draft) => {\r\n Object.entries(action.payload).forEach(([key, value]) => {\r\n draft[key] = action.payload[key];\r\n });\r\n });\r\n return newState;\r\n default:\r\n return state;\r\n }\r\n};\r\nexport function* watchFinalReport() {\r\n yield takeEvery(GET_FINAL_REPORT, safeSaga(getFinalReport));\r\n yield takeEvery(SAVE_FINAL_REPORT, safeSaga(saveFinalReport));\r\n}\r\n\r\nexport default reducer;\r\n","// import { configureStore } from '@reduxjs/toolkit';\r\nimport globalReducer from './global/reducer';\r\nimport createSagaMiddleware from 'redux-saga';\r\nimport 'regenerator-runtime/runtime';\r\nimport userReducer, { watchUser } from './user/reducer';\r\nimport applicationReducer, { watchApplication } from './application/reducer';\r\nimport dialogReducer from './dialog/reducer';\r\nimport postApprovalReducer, { watchPostApprovalDocument } from './postApproval/reducer';\r\nimport SystemReducer, { watchSystem } from './system/reducer';\r\nimport columnReducer from './column/columnReducer';\r\nimport landingReducer, { watchLanding } from './landing/reducer';\r\nimport applicationDetailReducer, { watchApplicationDetail } from './applicationDetail/reducer';\r\nimport SystemMessageReducer from './system/systemMessageReducer';\r\nimport tableReducer from './table/reducer';\r\nimport notificationReducer, { watchNotification } from './notification/reducer';\r\nimport { applyMiddleware, combineReducers, createStore, compose } from 'redux';\r\nimport { all } from 'redux-saga/effects';\r\nimport applicationDetailPostDataReducer, {\r\n watchApplicationDetailPostData,\r\n} from './applicationDetail/applicationDetailPostDataReducer';\r\nimport userAccountReducer, { watchUserAccount } from './userAccount/reducer';\r\nimport emailDomainReducer, { watchEmailDomain } from './emailDomain/reducer';\r\nimport globalVariablesReducer, { watchGlobalVariables } from './globalVariables/reducer';\r\nimport broadcastMessageReducer, { watchBroadcastMessage } from './broadcastMessage/reducer';\r\nimport emailTemplateReducer, { watchEditEmailTemplate } from './emailTemplate/reducer';\r\nimport menuReducer, { watchMenu } from './menu/reducer';\r\nimport applicationDetailValidReducer, {\r\n watchApplicationDetailValid,\r\n} from './applicationDetail/applicationDetailValidReducer';\r\nimport searchReducer, { watchSearch } from './search/reducer';\r\nimport validationReducer from './validation/reducer';\r\nimport clinicalStudyCategorizationReducer, {\r\n watchClinicalStudyCategorization,\r\n} from './applicationDetail/clinicalStudyCategorizationReducer';\r\nimport documentUploadReducer, { watchDocumentUpload } from './applicationDetail/documentUploadReducer';\r\nimport textLengthReducer from './textLength/reducer';\r\nimport declarationAndEndorsementReducer, {\r\n watchDeclarationAndEndorsement,\r\n} from './applicationDetail/declarationAndEndorsementReducer';\r\nimport reviewerReducer, { watchReviewer } from './reviewer/reducer';\r\nimport reviewPanelReducer, { watchReviewPanel } from './reviewPanel/reducer';\r\nimport arrangeMeetingReducer, { watchArrangeMeeting } from './arrangeMeeting/reducer';\r\nimport confirmResultReducer, { watchConfirmResult } from './confirmResult/reducer';\r\nimport consolidationDetailReducer, { watchConsolidationDetail } from './consolidation/reducer';\r\nimport susarReportReducer, { watchSusarReport } from './susarReport/reducer';\r\nimport miscellaneousReportReducer, { watchMiscellaneousReport } from './miscellaneousReport/reducer';\r\nimport progressReportReducer, { watchProgressReport } from './progressReport/reducer';\r\nimport protocolDeviationReportReducer, { watchProtocolDeviationReport } from './protocolDeviationReport/reducer';\r\nimport localSAEReportReducer, { watchLocalSAEReport } from './localSAEReport/reducer';\r\nimport finalReducer, { watchFinalReport } from './finalReport/reducer';\r\n\r\nconst rootReducer = combineReducers({\r\n column: columnReducer,\r\n global: globalReducer,\r\n user: userReducer,\r\n application: applicationReducer,\r\n dialog: dialogReducer,\r\n postApproval: postApprovalReducer,\r\n system: SystemReducer,\r\n systemMessage: SystemMessageReducer,\r\n notification: notificationReducer,\r\n landing: landingReducer,\r\n applicationDetail: applicationDetailReducer,\r\n applicationDetailPostData: applicationDetailPostDataReducer,\r\n userAccount: userAccountReducer,\r\n emailDomain: emailDomainReducer,\r\n globalVariables: globalVariablesReducer,\r\n broadcastMessage: broadcastMessageReducer,\r\n emailTemplate: emailTemplateReducer,\r\n applicationDetailValid: applicationDetailValidReducer,\r\n menu: menuReducer,\r\n search: searchReducer,\r\n validation: validationReducer,\r\n table: tableReducer,\r\n clinicalStudyCategorization: clinicalStudyCategorizationReducer,\r\n documentUpload: documentUploadReducer,\r\n declarationAndEndorsement: declarationAndEndorsementReducer,\r\n textLength: textLengthReducer,\r\n reviewer: reviewerReducer,\r\n reviewPanel: reviewPanelReducer,\r\n arrangeMeeting: arrangeMeetingReducer,\r\n confirmResult: confirmResultReducer,\r\n consolidationDetail: consolidationDetailReducer,\r\n susarReport: susarReportReducer,\r\n miscellaneousReport: miscellaneousReportReducer,\r\n progressReport: progressReportReducer,\r\n protocolDeviationReport: protocolDeviationReportReducer,\r\n localSAEReport: localSAEReportReducer,\r\n finalReport: finalReducer,\r\n});\r\n\r\nfunction* rootSaga() {\r\n yield all([\r\n watchApplication(),\r\n watchUser(),\r\n watchPostApprovalDocument(),\r\n watchSystem(),\r\n watchLanding(),\r\n watchApplicationDetail(),\r\n watchApplicationDetailPostData(),\r\n watchUserAccount(),\r\n watchEmailDomain(),\r\n watchGlobalVariables(),\r\n watchBroadcastMessage(),\r\n watchEditEmailTemplate(),\r\n watchApplicationDetailValid(),\r\n watchMenu(),\r\n watchNotification(),\r\n watchSearch(),\r\n watchClinicalStudyCategorization(),\r\n watchDocumentUpload(),\r\n watchDeclarationAndEndorsement(),\r\n watchReviewer(),\r\n watchReviewPanel(),\r\n watchArrangeMeeting(),\r\n watchConfirmResult(),\r\n watchConsolidationDetail(),\r\n watchSusarReport(),\r\n watchMiscellaneousReport(),\r\n watchProgressReport(),\r\n watchProtocolDeviationReport(),\r\n watchLocalSAEReport(),\r\n watchFinalReport(),\r\n ]);\r\n}\r\n\r\nconst sagaMiddleware = createSagaMiddleware({\r\n onError: (err) => {\r\n console.log('161843 index.js err', err);\r\n },\r\n});\r\n\r\nconst middleware = [sagaMiddleware];\r\n\r\nconst composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;\r\nconst store = createStore(rootReducer, {}, composeEnhancers(applyMiddleware(...middleware)));\r\n\r\nexport default store;\r\n\r\nexport const getStore = () => {\r\n return store;\r\n};\r\n\r\nexport const safeSaga = (func) => {\r\n return function* (args) {\r\n try {\r\n yield* func(args);\r\n } catch (error) {\r\n console.log('162112 index.js error', error);\r\n // yield put(setSagaError({ saga: func.name, args, error }));\r\n }\r\n };\r\n};\r\n\r\nsagaMiddleware.run(rootSaga);\r\n","import {\r\n APPLICANT,\r\n DRAFT,\r\n RETURNED,\r\n userRoles,\r\n APPROVED,\r\n ACKNOWLEDGED,\r\n DISAPPROVED,\r\n TAB_COMMENT,\r\n TAB_AMENDMENT,\r\n TAB_REVIEWER_COMMENT,\r\n TAB_CONSOLIDATION,\r\n COMPLETED,\r\n TAB_MEETINGARRANGE,\r\n REVIEWER,\r\n} from './lookup';\r\nimport _, { cloneDeep, isEmpty } from 'lodash';\r\nimport CommonRegex from 'constants/CommonRegex';\r\nimport { getStore } from 'store';\r\nimport moment from 'moment';\r\nimport api from 'api/call';\r\nimport { CTC, CTI, PostApprovalFormType } from 'utility/postApprovalLookUp';\r\nimport {\r\n LOGOUT_USER,\r\n DELETE_REMOVE_REQUEST,\r\n FETCH_NOTIFICATION_COUNT_OF_UNREAD,\r\n SET_APPLICATION_DETAIL_POST_DATA,\r\n} from 'store/key';\r\nimport { LOGIN_SESSION_EXPIRED, MULTIPLE_LOGIN_LOGOUT } from './frontendMessage';\r\nimport { DATA_NOT_FOUND, EXPIRED } from './errorCode';\r\nimport { setGlobal } from 'store/global/reducer';\r\n\r\nlet isFormChanging = false;\r\nlet isRefreshingToken = false;\r\n\r\nexport const waitUntilNoTokenRefresh = async () => {\r\n for (let i = 0; i < 10000; i++) {\r\n if (!isRefreshingToken) {\r\n break;\r\n }\r\n\r\n await sleep(1000);\r\n }\r\n\r\n return true;\r\n};\r\n\r\nexport const when = (condition, render) => (condition ? render() : null);\r\n\r\nexport const applicantHasReportPermission = (reportData) => {\r\n const { user } = getStore().getState();\r\n const ci = reportData?.ciAndCid ?? [];\r\n const pi = reportData?.piAndPid ?? [];\r\n const email = user.detail.email.toLowerCase();\r\n const site = reportData?.siteInstruction;\r\n\r\n let hasPermission = false;\r\n\r\n if (site && site !== 'Study Info') {\r\n pi.forEach((item) => {\r\n if (item.toLowerCase() === email) {\r\n hasPermission = true;\r\n }\r\n });\r\n\r\n return hasPermission;\r\n } else {\r\n ci.forEach((item) => {\r\n if (item.toLowerCase() === email) {\r\n hasPermission = true;\r\n }\r\n });\r\n\r\n return hasPermission;\r\n }\r\n};\r\n\r\n// report data is required if application status is in \"Draft\"\r\nexport const postApprovalPermissionChecking = ({ currentTab, status, documentType, reportData }) => {\r\n const { user } = getStore().getState();\r\n\r\n if (currentTab === TAB_CONSOLIDATION) {\r\n // Screen of View only when check consolidation APPROVED, ACKNOWLEDGED, DISAPPROVED\r\n return ![APPROVED, ACKNOWLEDGED, DISAPPROVED].includes(status);\r\n }\r\n\r\n if (currentTab === PostApprovalFormType.COMMENT) {\r\n return true;\r\n }\r\n\r\n // cti only need to check if returned status of report, status === null is not applicable for CTI\r\n if ([CTC, CTI].includes(documentType)) {\r\n if (user.role === APPLICANT && status === RETURNED) {\r\n return applicantHasReportPermission(reportData);\r\n }\r\n }\r\n\r\n // the form has not yet created\r\n if (user.role === APPLICANT && status === null) {\r\n return true;\r\n }\r\n\r\n // for other report case\r\n if (user.role === APPLICANT && [DRAFT, RETURNED].includes(status)) {\r\n return applicantHasReportPermission(reportData);\r\n }\r\n\r\n // if not the above case, mainly not applicant case\r\n return false;\r\n};\r\n\r\nexport const checkBackendVersionForUpdate = () => {\r\n const backendVersion = getStore().getState().global.backendVersion;\r\n\r\n // if backend version is updated tell the frontend version to reload if user is logout\r\n api.version.getBackendVersion().then((res) => {\r\n if (backendVersion !== res.data) {\r\n window.location.reload();\r\n }\r\n });\r\n};\r\n\r\nexport const updateIsRefreshToken = (isUpdating) => {\r\n isRefreshingToken = isUpdating;\r\n};\r\n\r\nexport const getIsRefreshingToken = () => {\r\n return isRefreshingToken;\r\n};\r\n\r\nexport const getNotificationCountOfUnread = () => {\r\n const { dispatch } = getStore();\r\n\r\n dispatch({\r\n type: FETCH_NOTIFICATION_COUNT_OF_UNREAD,\r\n payload: {},\r\n });\r\n};\r\n\r\nexport const compareEmail = (email1, email2) => {\r\n return email1?.toLowerCase() === email2?.toLowerCase();\r\n};\r\n\r\nexport const updateFormChanging = (isUpdate) => {\r\n isFormChanging = isUpdate;\r\n};\r\n\r\nexport const getFormChanging = () => {\r\n return isFormChanging;\r\n};\r\n\r\nexport const hasAmendmentDetails = async (formId) => {\r\n const res = await api.amendment.getAmendmentForm(formId);\r\n return res.data.result?.amendmentForm?.id !== 0;\r\n};\r\n\r\nexport const handleRefreshTokenException = async (result) => {\r\n const store = getStore();\r\n\r\n if (result.data?.status === DATA_NOT_FOUND) {\r\n store.dispatch(\r\n setGlobal({\r\n isErrorShow: true,\r\n errorTitle: 'Session Expired',\r\n errorMessage: result.data?.errorMessage,\r\n }),\r\n );\r\n\r\n store.dispatch({\r\n type: LOGOUT_USER,\r\n });\r\n\r\n throw new Error(result.data?.errorMessage || 'no message');\r\n } else if (result.data?.status === EXPIRED) {\r\n store.dispatch({\r\n type: LOGOUT_USER,\r\n });\r\n\r\n window.location.replace('/?post-dialog=session-expired');\r\n\r\n throw new Error('session expired');\r\n }\r\n};\r\n\r\nexport const amendmentClearMessage = (\r\n \r\n
\r\n);\r\n\r\nconst topics = {};\r\n\r\nexport const subscribe = (topic, fn) => {\r\n if (!topics[topic]) topics[topic] = {};\r\n const id = generateRandomId();\r\n topics[topic][id] = fn;\r\n return () => {\r\n topics[topic][id] = null;\r\n delete topics[topic][id];\r\n };\r\n};\r\n\r\nexport const sleep = async (ms) => {\r\n await new Promise((r) => setTimeout(r, ms));\r\n};\r\n\r\nexport const publish = async ({ topic, args, callback }) => {\r\n if (!topics[topic]) return;\r\n\r\n const listOfCurrentTopic = Object.values(topics[topic]);\r\n\r\n for (let i = 0; i < listOfCurrentTopic.length; i++) {\r\n const currentTopic = listOfCurrentTopic[i];\r\n await currentTopic(args, callback);\r\n }\r\n};\r\n\r\nexport const downloadLocalFile = (file) => {\r\n const fr = new FileReader();\r\n fr.readAsDataURL(file);\r\n\r\n const blob = new Blob([file], { type: 'application/pdf' });\r\n\r\n const objectURL = window.URL.createObjectURL(blob);\r\n\r\n const link = document.createElement('a');\r\n link.href = objectURL;\r\n link.download = file.name;\r\n document.body.appendChild(link);\r\n link.click();\r\n link.remove();\r\n};\r\n\r\nexport const produce = (base, processFunction) => {\r\n if (typeof base === 'function') {\r\n return (prevState) => {\r\n return updateState(base)(prevState);\r\n };\r\n } else {\r\n return updateValue(base, processFunction);\r\n }\r\n};\r\n\r\nexport const isSiteAddedInAmendment = (applicationDetail, siteInfoId) => {\r\n const siteInfo = applicationDetail.siteInfo.find((item) => item.id === siteInfoId);\r\n\r\n if (!siteInfo) {\r\n console.error('no site is found by the siteInfo');\r\n return false;\r\n }\r\n\r\n const isSiteAddedInAmendment =\r\n new Date(siteInfo.createDtm).getTime() > new Date(applicationDetail.applicationForm.createDtm).getTime() + 5000;\r\n\r\n return isSiteAddedInAmendment;\r\n};\r\n\r\nexport const checkIfSiteIdExistInApplication = async () => {};\r\n\r\nexport const waitUntilFormUpdate = async () => {\r\n let hasChange = false;\r\n\r\n if (isFormChanging) {\r\n hasChange = true;\r\n await sleep(400);\r\n }\r\n\r\n return hasChange;\r\n};\r\n\r\nexport const toHalfWidthUnicode = (chars) => {\r\n try {\r\n let ascii = '';\r\n for (let i = 0, l = chars.length; i < l; i++) {\r\n let c = chars[i].charCodeAt(0);\r\n\r\n // make sure we only convert half-full width char\r\n if (c >= 0xff00 && c <= 0xffef) {\r\n c = 0xff & (c + 0x20);\r\n }\r\n\r\n ascii += String.fromCharCode(c);\r\n }\r\n\r\n return ascii;\r\n } catch (error) {\r\n console.log('%c 120149 general.js error', 'background: green', error);\r\n return chars;\r\n }\r\n};\r\n\r\nexport const isFormChanged = async () => {\r\n if (isFormChanging) {\r\n await sleep(300);\r\n }\r\n\r\n const { applicationDetailPostData } = getStore().getState();\r\n const { deleteRequest, postData, removeRequest } = applicationDetailPostData;\r\n\r\n let hasChange = false;\r\n\r\n if (!isEmpty(deleteRequest) || !isEmpty(postData) || !isEmpty(removeRequest)) {\r\n hasChange = true;\r\n }\r\n\r\n return hasChange;\r\n};\r\n\r\nexport const handleFileVirus = (error) => {\r\n if (error?.response?.data?.filename) {\r\n return { fileName: error?.response?.data?.filename, hasVirus: true };\r\n }\r\n\r\n return { hasVirus: false };\r\n};\r\n\r\nexport const permissionChecking = ({\r\n tabType, // either info or hospital or amendment or comment\r\n siteInfoId,\r\n applicationDetail,\r\n isAmendmentCreate = false,\r\n isAmendmentEdit = false,\r\n amendmentType, // either study or site\r\n amendId,\r\n}) => {\r\n if ([TAB_AMENDMENT, TAB_COMMENT, TAB_REVIEWER_COMMENT, TAB_MEETINGARRANGE].includes(tabType)) {\r\n return true;\r\n }\r\n\r\n const { user } = getStore().getState();\r\n\r\n const currentUserEmail = user.detail.email;\r\n const currentRole = user.role;\r\n const appStatus = applicationDetail.status?.statusId;\r\n\r\n if (tabType === TAB_CONSOLIDATION && appStatus === COMPLETED) {\r\n return false;\r\n }\r\n\r\n if (tabType === TAB_CONSOLIDATION) {\r\n // Screen of View only when check consolidation APPROVED, ACKNOWLEDGED, DISAPPROVED\r\n return ![APPROVED, ACKNOWLEDGED, DISAPPROVED].includes(appStatus);\r\n }\r\n\r\n // enable edit if user role is applicant only\r\n if (currentRole !== APPLICANT) {\r\n return false;\r\n }\r\n\r\n // check if is amendment create\r\n if (isAmendmentCreate) {\r\n // checking permission in amendment form\r\n if (amendmentType === 'study' && tabType === 'info') {\r\n return true;\r\n }\r\n\r\n if (amendmentType === 'site') {\r\n // eslint-disable-next-line eqeqeq\r\n if (tabType === 'hospital' && siteInfoId == amendId) {\r\n return true;\r\n }\r\n }\r\n\r\n return false;\r\n }\r\n\r\n // enable edit if status is draft or returned\r\n if (appStatus === DRAFT || appStatus === RETURNED) {\r\n // check if is amendment edit\r\n if (isAmendmentEdit) {\r\n if (tabType === 'info') {\r\n let hasPermission = false;\r\n\r\n // check if email is authorized to the study-info\r\n if (currentUserEmail?.toLowerCase() === applicationDetail.applicationForm.email?.toLowerCase()) {\r\n hasPermission = true;\r\n }\r\n\r\n if (currentUserEmail?.toLowerCase() === applicationDetail.historyCi?.toLowerCase()) {\r\n hasPermission = true;\r\n }\r\n\r\n applicationDetail.ciDelegation.forEach((item) => {\r\n if (item.email?.toLowerCase() === currentUserEmail?.toLowerCase()) {\r\n hasPermission = true;\r\n }\r\n });\r\n\r\n // if underAmendment is false, disable permission\r\n if (applicationDetail.applicationForm.underAmendment === false) {\r\n hasPermission = false;\r\n }\r\n\r\n return hasPermission;\r\n } else {\r\n const allowedSite = [...applicationDetail.pi, ...applicationDetail.piDelegation].find(\r\n (item) =>\r\n currentUserEmail?.toLowerCase() === item.email?.toLowerCase() &&\r\n item.siteInfo.id === siteInfoId,\r\n )?.siteInfo;\r\n\r\n // no permission\r\n if (!allowedSite) {\r\n return false;\r\n }\r\n\r\n const isNewlySite = isSiteAddedInAmendment(applicationDetail, siteInfoId);\r\n\r\n if (!isNewlySite) {\r\n if (allowedSite?.id === siteInfoId && allowedSite?.underAmendment === true) {\r\n return true;\r\n }\r\n } else {\r\n // if the site is send to ci, disable form editing\r\n if (allowedSite.status === 1) {\r\n return false;\r\n } else {\r\n return true;\r\n }\r\n }\r\n return false;\r\n }\r\n }\r\n\r\n // check if the user is authorize to edit study-info with application id: applicationDetail.applicationForm.id\r\n if (tabType === 'info') {\r\n let hasPermission = false;\r\n\r\n if (currentUserEmail?.toLowerCase() === applicationDetail.applicationForm.email?.toLowerCase()) {\r\n hasPermission = true;\r\n }\r\n\r\n applicationDetail.ciDelegation.forEach((item) => {\r\n if (item.email?.toLowerCase() === currentUserEmail?.toLowerCase()) {\r\n hasPermission = true;\r\n }\r\n });\r\n\r\n return hasPermission;\r\n } else {\r\n // check if the user is authorize to edit site-info\r\n\r\n // check if the application is in draft && has send to ci, disable edit function of site\r\n const currentSiteInfo = applicationDetail.siteInfo.find((item) => item.id === siteInfoId);\r\n // status === 1: the form is submitted to ci\r\n if (currentSiteInfo?.status === 1) {\r\n return false;\r\n }\r\n\r\n // check if the user are one of the site in site-info\r\n const allowedSiteId = [...applicationDetail.pi, ...applicationDetail.piDelegation].find(\r\n (item) =>\r\n currentUserEmail?.toLowerCase() === item.email?.toLowerCase() && item.siteInfo.id === siteInfoId,\r\n )?.siteInfo?.id;\r\n\r\n if (allowedSiteId === siteInfoId) {\r\n return true;\r\n }\r\n\r\n return false;\r\n }\r\n }\r\n};\r\n\r\nexport const getDialogContent = (type) => {\r\n if (type === 'session-expired') {\r\n return {\r\n description: LOGIN_SESSION_EXPIRED,\r\n title: 'Session Expired',\r\n };\r\n } else if (type === 'multiple-login') {\r\n return {\r\n description: MULTIPLE_LOGIN_LOGOUT,\r\n title: 'Session Expired',\r\n };\r\n }\r\n\r\n return {\r\n description: 'null',\r\n title: 'null',\r\n };\r\n};\r\n\r\nexport const getClusterByWorkflow = (workflow, isCI = false) => {\r\n // remove workflow related filtering (Site PI only) by HA user on 19/1/2024\r\n if (!isCI) {\r\n return ['HKEC', 'HKWC', 'KCC', 'KEC', 'KWC', 'NTEC', 'NTWC', 'HAHO', 'OTHERS'];\r\n }\r\n\r\n if (workflow === 'I') {\r\n return ['HKEC', 'HKWC', 'KCC', 'KEC', 'KWC', 'NTEC', 'NTWC', 'HAHO'];\r\n } else if (workflow === 'H') {\r\n return ['HKWC', 'OTHERS'];\r\n } else if (workflow === 'N') {\r\n return ['NTEC', 'OTHERS'];\r\n } else {\r\n return [];\r\n }\r\n};\r\n\r\nexport const isAuthorizedEmail = (email = '') => {\r\n const store = getStore();\r\n\r\n const { emailDomain } = store.getState();\r\n\r\n const isExist = emailDomain?.emailDomainList?.some((item) => {\r\n const inputEmailDomain = email.split('@')?.[1];\r\n return item.email?.toLowerCase() === inputEmailDomain?.toLocaleLowerCase();\r\n });\r\n\r\n return isExist;\r\n};\r\n\r\nexport const getReplacedValue = (value, replacedValue) => {\r\n let result = value;\r\n\r\n if (replacedValue !== null && replacedValue !== undefined) {\r\n result = replacedValue;\r\n }\r\n\r\n return result;\r\n};\r\n\r\nexport const initializeTableData = ({ tableKey, currentTableData, siteInfoId }) => {\r\n const { applicationDetailPostData } = getStore().getState();\r\n\r\n const tempTableData = cloneDeep(currentTableData);\r\n\r\n let tablePostData;\r\n\r\n // table belongs to site\r\n if (siteInfoId) {\r\n tablePostData =\r\n applicationDetailPostData.postData?.[tableKey]?.filter((item) => item?.siteInfo?.id === siteInfoId) ?? [];\r\n } else {\r\n // table belongs to study-info\r\n tablePostData =\r\n applicationDetailPostData.postData?.[tableKey]?.filter((item) => item.siteInfo === undefined) ?? [];\r\n }\r\n\r\n tablePostData.forEach((dataItem) => {\r\n const index = tempTableData.findIndex((rowItem) => {\r\n return rowItem.id === dataItem.id;\r\n });\r\n\r\n if (index !== -1) {\r\n tempTableData[index] = dataItem;\r\n } else {\r\n tempTableData.push(dataItem);\r\n }\r\n });\r\n\r\n // handle delete case of table\r\n applicationDetailPostData?.deleteRequest?.[tableKey]?.forEach((deleteRequestItem) => {\r\n const index = tempTableData.findIndex((item) => item.id === deleteRequestItem.id);\r\n if (index !== -1) {\r\n tempTableData.splice(index, 1);\r\n }\r\n });\r\n\r\n return tempTableData;\r\n};\r\n\r\nexport const getTimeWithTimeZone = (dateString) => {\r\n // adding 28800 second to the utc timestamp, and force frontend to display in Hong kong timezone (+08:00).\r\n const currentTimestamp = new Date(dateString).getTime() + 28800 * 1000;\r\n return moment(currentTimestamp).utc();\r\n};\r\n\r\nexport const addRemoveRequest = ({ applicationFormId, name, siteInfoId = -1 }) => {\r\n const { getState, dispatch } = getStore();\r\n const { applicationDetailPostData } = getState();\r\n applicationDetailPostData.applicationFormId = applicationFormId;\r\n\r\n // case of adding remove request to the site\r\n if (siteInfoId !== -1) {\r\n if (!applicationDetailPostData.removeRequest?.siteInfo) {\r\n applicationDetailPostData.removeRequest.siteInfo = {};\r\n }\r\n\r\n if (!applicationDetailPostData.removeRequest.siteInfo?.[siteInfoId]) {\r\n applicationDetailPostData.removeRequest.siteInfo[siteInfoId] = [];\r\n }\r\n\r\n if (!applicationDetailPostData.removeRequest.siteInfo[siteInfoId].includes(name)) {\r\n if (typeof name === 'string') {\r\n applicationDetailPostData.removeRequest.siteInfo[siteInfoId].push(name);\r\n } else {\r\n applicationDetailPostData.removeRequest.siteInfo[siteInfoId].push(...name);\r\n }\r\n }\r\n } else {\r\n if (!applicationDetailPostData.removeRequest?.applicationForm) {\r\n applicationDetailPostData.removeRequest.applicationForm = {};\r\n }\r\n\r\n if (!applicationDetailPostData.removeRequest.applicationForm[applicationFormId]) {\r\n applicationDetailPostData.removeRequest.applicationForm[applicationFormId] = [];\r\n }\r\n\r\n if (!applicationDetailPostData.removeRequest.applicationForm[applicationFormId].includes(name)) {\r\n if (typeof name === 'string') {\r\n applicationDetailPostData.removeRequest.applicationForm[applicationFormId].push(name);\r\n } else {\r\n applicationDetailPostData.removeRequest.applicationForm[applicationFormId].push(...name);\r\n }\r\n }\r\n }\r\n\r\n dispatch({\r\n type: SET_APPLICATION_DETAIL_POST_DATA,\r\n payload: applicationDetailPostData,\r\n });\r\n};\r\n\r\nexport const deleteRemoveRequest = ({ siteInfoId = -1, keys = [], applicationFormId = -1 }) => {\r\n const { dispatch } = getStore();\r\n\r\n dispatch({\r\n type: DELETE_REMOVE_REQUEST,\r\n payload: {\r\n applicationFormId,\r\n siteInfoId,\r\n keys,\r\n },\r\n });\r\n};\r\n\r\nexport const validateEmail = (email) => {\r\n const re = new RegExp(CommonRegex.REGEX_EMAIL);\r\n return re.test(String(email).toLowerCase());\r\n};\r\n\r\nexport const updateValue = (base, processFunction) => {\r\n let newBase = _.cloneDeep(base);\r\n processFunction(newBase);\r\n return newBase;\r\n};\r\n\r\nexport const updateState = (processFunction) => (prevState) => {\r\n let newBase = _.cloneDeep(prevState);\r\n processFunction(newBase);\r\n return newBase;\r\n};\r\n\r\nexport const getClusterDisplayFromHospital = (hospitalCode) => {\r\n const store = getStore();\r\n const hospitals = store.getState().system?.hospitals ?? [];\r\n\r\n const clusterCode = hospitals?.find((item) => {\r\n const isExist = item.hospital.some((item) => {\r\n return item.hospitalCode === hospitalCode;\r\n });\r\n\r\n return isExist;\r\n })?.clusterCode;\r\n\r\n return clusterCode;\r\n};\r\n\r\nexport const getClusterDisplayFromId = (clusterId) => {\r\n const store = getStore();\r\n\r\n const hospitals = store.getState().system?.hospitals ?? [];\r\n return hospitals.find((item) => item.clusterId === clusterId)?.clusterCode ?? 'Not Found';\r\n};\r\n\r\nconst hasNumber = (string) => {\r\n return new RegExp(CommonRegex.REGEX_NUMBER).test(string);\r\n};\r\n\r\nconst hasLowerCase = (string) => {\r\n return new RegExp(CommonRegex.REGEX_LOWER_CASE).test(string);\r\n};\r\n\r\nconst hasUpperCase = (string) => {\r\n return new RegExp(CommonRegex.REGEX_UPPER_CASE).test(string);\r\n};\r\n\r\nexport const checkPasswordValidity = (passCode = '') => {\r\n if (passCode.length < 8) {\r\n return false;\r\n }\r\n\r\n if (!hasNumber(passCode)) {\r\n return false;\r\n }\r\n\r\n if (!hasLowerCase(passCode)) {\r\n return false;\r\n }\r\n\r\n if (!hasUpperCase(passCode)) {\r\n return false;\r\n }\r\n\r\n return true;\r\n};\r\n\r\nexport const generateRandomId = (length = 20) => {\r\n let result = '';\r\n const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';\r\n const charactersLength = characters.length;\r\n for (let i = 0; i < length; i++) {\r\n result += characters.charAt(Math.floor(Math.random() * charactersLength));\r\n }\r\n return result;\r\n};\r\n\r\nexport const isPendingCheck = (application, user) => {\r\n const { statusId, siteResponseList, pendingReview } = application;\r\n\r\n if (user.role !== APPLICANT && user.role !== REVIEWER) {\r\n return false;\r\n }\r\n\r\n if (user.role === REVIEWER && pendingReview === true) {\r\n return true;\r\n }\r\n\r\n // only draft and returned status with applicant role will display the pending indicator\r\n if (statusId === DRAFT || statusId === RETURNED) {\r\n const userDetail = user.detail;\r\n\r\n // user is not loaded\r\n if (!userDetail) {\r\n return false;\r\n }\r\n\r\n const isCI = application?.ci?.some((item) => item.toLowerCase() === userDetail.email.toLowerCase());\r\n\r\n if (isCI) {\r\n // in draft or return status, ci need to submit or wait site to finish their task\r\n if (statusId === DRAFT || statusId === RETURNED) {\r\n return true;\r\n }\r\n }\r\n\r\n let isSitePI = false;\r\n let institution = '';\r\n\r\n Object.entries(application.pi).forEach(([institutionKey, listOfPI]) => {\r\n listOfPI.forEach((item) => {\r\n if (item.toLowerCase() === userDetail.email.toLowerCase()) {\r\n isSitePI = true;\r\n institution = institutionKey;\r\n }\r\n });\r\n });\r\n\r\n if (isSitePI) {\r\n const currentSiteStatus = siteResponseList.find((item) => item.code === institution);\r\n return !currentSiteStatus?.completed;\r\n }\r\n }\r\n\r\n return false;\r\n};\r\n\r\nexport const getUserPermissions = (role) => {\r\n const currentUser = userRoles.find((item) => item.key === role);\r\n\r\n return currentUser.folder\r\n .map((item) => {\r\n return item.display !== '-' ? item.key : null;\r\n })\r\n .filter((item) => {\r\n return item !== null;\r\n });\r\n};\r\n\r\nexport const getStatusFromFolder = (folder, userRole) => {\r\n const currentRoleFolder = userRoles.find((item) => item.key === userRole)?.folder;\r\n\r\n if (!currentRoleFolder) {\r\n return [];\r\n }\r\n\r\n return currentRoleFolder.filter((item) => {\r\n return item.display === folder;\r\n });\r\n};\r\n\r\nexport const getFolderDisplayPath = (role, statusKey) => {\r\n const menu = getStore().getState().menu.data;\r\n const routes = menu?.find((item) => item.url === '/applications')?.subRoute || [];\r\n\r\n const currentUser = userRoles.find((item) => item.key === role);\r\n const display = currentUser.folder.find((item) => item.key === statusKey)?.display;\r\n\r\n const url = routes?.find((item) => item.desc === display)?.url || '/all';\r\n\r\n return url;\r\n};\r\n\r\nexport const generateRandomNumberString = () => {\r\n return Math.floor(Math.random() * 10000).toString();\r\n};\r\n\r\nexport const getHospitalItem = (hospitalCode) => {\r\n const { getState } = getStore();\r\n const hospitalList = getState().system.formattedHospitalData ?? [];\r\n const index = hospitalList.findIndex((i) => i.hospitalCode === hospitalCode);\r\n if (index === -1) {\r\n return {};\r\n }\r\n return hospitalList[index];\r\n};\r\n\r\nexport const checkCIAmendment = (applicationDetail, userDetail) => {\r\n const isCIHistory = compareEmail(applicationDetail.historyCi, userDetail?.email);\r\n // const isCI\r\n const isCIDelegation = applicationDetail.ciDelegation.some((item) => compareEmail(item.email, userDetail?.email));\r\n\r\n return isCIHistory || isCIDelegation;\r\n};\r\n\r\nexport const isHighlight = (applicationDetail, siteInfoId, formId, tabType, keys, istable = false) => {\r\n let ishl = false;\r\n const changedItem = applicationDetail?.changedItem?.changedItem;\r\n const siteInfo = changedItem.siteInfo;\r\n if (tabType === 'hospital') {\r\n keys.forEach((key) => {\r\n if (!istable) {\r\n if (siteInfo && siteInfo[`${siteInfoId}`] && siteInfo[`${siteInfoId}`].indexOf(key) > -1) {\r\n ishl = true;\r\n return;\r\n }\r\n } else {\r\n if (\r\n // eslint-disable-next-line eqeqeq\r\n changedItem[key] != undefined &&\r\n changedItem[key][siteInfoId] !== undefined &&\r\n changedItem[key][siteInfoId].length\r\n ) {\r\n ishl = true;\r\n return;\r\n }\r\n }\r\n });\r\n } else {\r\n keys.forEach((key) => {\r\n if (!istable) {\r\n if (\r\n changedItem &&\r\n changedItem.applicationForm &&\r\n changedItem.applicationForm[`${formId}`] &&\r\n changedItem.applicationForm[`${formId}`].indexOf(key) > -1\r\n ) {\r\n ishl = true;\r\n return;\r\n }\r\n } else {\r\n if (\r\n // eslint-disable-next-line eqeqeq\r\n changedItem[key] != undefined &&\r\n changedItem[key][formId] !== undefined &&\r\n changedItem[key][formId].length\r\n ) {\r\n ishl = true;\r\n return;\r\n }\r\n }\r\n });\r\n }\r\n return ishl;\r\n};\r\n\r\nexport const emptyShow = (text) => {\r\n if (!text) return '-';\r\n return text;\r\n};\r\n\r\nexport const piDelegationColumns = [\r\n { field: 'email', headerName: 'Email', width: 200 },\r\n { field: 'title', headerName: 'Title', width: 130, tooltip: 'e.g. Dr/Mr/Mrs/Ms/Prof.' },\r\n {\r\n field: 'surname',\r\n headerName: 'Surname',\r\n width: 120,\r\n valueGetter: (params) => params.getValue('surname'),\r\n },\r\n {\r\n field: 'firstName',\r\n headerName: 'First name',\r\n width: 120,\r\n valueGetter: (params) => params.getValue('firstName'),\r\n },\r\n { field: 'cluster', headerName: 'Cluster', width: 100 },\r\n {\r\n field: 'institution',\r\n headerName: 'Hospital / Institution',\r\n // tooltip: (\r\n // - Reason for change
\r\n - Proposed by
\r\n - Will change increase risk to participants?
\r\n - Actual Study Start Date
\r\n \r\n //
\r\n // ),\r\n width: 120,\r\n },\r\n {\r\n field: 'department',\r\n headerName: 'Department',\r\n width: 160,\r\n },\r\n];\r\n\r\nexport const ciDelegationColumns = [\r\n { field: 'email', headerName: 'Email', width: 200 },\r\n { field: 'title', headerName: 'Title', width: 130, tooltip: 'e.g. Dr/Mr/Mrs/Ms/Prof.' },\r\n {\r\n field: 'surname',\r\n headerName: 'Surname',\r\n width: 120,\r\n valueGetter: (params) => params.getValue('surname'),\r\n },\r\n {\r\n field: 'firstName',\r\n headerName: 'First name',\r\n width: 120,\r\n valueGetter: (params) => params.getValue('firstName'),\r\n },\r\n { field: 'position', headerName: 'Position', width: 100 },\r\n { field: 'cluster', headerName: 'Cluster', width: 100 },\r\n {\r\n field: 'institution',\r\n headerName: 'Hospital / Institution',\r\n // tooltip: (\r\n // Central IRB: Site PI shall be an employee/appointee of HA
\r\n // \r\n // HKU/HA HKW IRB: Site PI shall be an employee/appointee/student of the HKU or HA HKWC\r\n //
\r\n // \r\n // Joint CUHK-NTEC CREC: Site PI shall be an employee/appointee/student of the CUHK or HA NTEC\r\n //
\r\n // \r\n //
\r\n // ),\r\n width: 120,\r\n },\r\n {\r\n field: 'department',\r\n headerName: 'Department',\r\n width: 160,\r\n },\r\n];\r\n","import { setItem } from 'storage';\r\nimport { SET_COLUMN } from 'store/key';\r\nimport { produce } from 'utility/general';\r\n\r\nexport const defaultPostApprovalColumn = [\r\n {\r\n key: 'pending',\r\n },\r\n {\r\n key: 'subNo',\r\n },\r\n {\r\n key: 'p1scientificTitle',\r\n },\r\n {\r\n key: 'updateDtm',\r\n },\r\n {\r\n key: 'documentType',\r\n },\r\n {\r\n key: 'statusId',\r\n },\r\n {\r\n key: 'expiryDate',\r\n },\r\n {\r\n key: 'action',\r\n },\r\n];\r\n\r\nexport const defaultApplicationColumn = [\r\n {\r\n key: 'subTable',\r\n },\r\n {\r\n key: 'refNo',\r\n },\r\n {\r\n key: 'pending',\r\n },\r\n {\r\n key: 'appNo',\r\n },\r\n {\r\n key: 'subNo',\r\n },\r\n {\r\n key: 'updateDtm',\r\n },\r\n {\r\n key: 'p1scientificTitle',\r\n },\r\n {\r\n key: 'coordinator',\r\n },\r\n {\r\n key: 'siteResponseList',\r\n },\r\n {\r\n key: 'statusId',\r\n },\r\n {\r\n key: 'action',\r\n },\r\n {\r\n key: 'updateBy',\r\n },\r\n {\r\n key: 'expiryDate',\r\n },\r\n];\r\n\r\nconst initialState = { application: defaultApplicationColumn, postApproval: defaultPostApprovalColumn };\r\nexport const APPLICATION_COLUMN = 'application_column_2';\r\nexport const POST_APPROVAL_COLUMN = 'post_approval_column_3';\r\n\r\nconst reducer = (state = initialState, action) => {\r\n switch (action.type) {\r\n case SET_COLUMN:\r\n const newState = produce(state, (draft) => {\r\n Object.entries(action.payload).forEach(([key, value]) => {\r\n draft[key] = action.payload[key];\r\n });\r\n });\r\n return newState;\r\n default:\r\n return state;\r\n }\r\n};\r\n\r\nexport const updateApplicationColumn = (data) => {\r\n setItem(APPLICATION_COLUMN, data);\r\n return {\r\n type: SET_COLUMN,\r\n payload: { application: data },\r\n };\r\n};\r\n\r\nexport const updatePostApprovalColumn = (data) => {\r\n setItem(POST_APPROVAL_COLUMN, data);\r\n return {\r\n type: SET_COLUMN,\r\n payload: { postApproval: data },\r\n };\r\n};\r\n\r\nexport default reducer;\r\n","import { useEffect, useState } from 'react';\r\nimport { useSelector, useDispatch } from 'react-redux';\r\nimport { getItem, KEYS } from 'storage';\r\nimport {\r\n APPLICATION_COLUMN,\r\n defaultPostApprovalColumn,\r\n POST_APPROVAL_COLUMN,\r\n updateApplicationColumn,\r\n updatePostApprovalColumn,\r\n defaultApplicationColumn,\r\n} from 'store/column/reducer';\r\nimport { INITIAL_SYSTEM_GLOBAL_DATA, UPDATE_USER } from 'store/key';\r\nimport { APPLICANT } from 'utility/lookup';\r\nimport api from 'api/call';\r\nimport { setGlobal } from 'store/global/reducer';\r\n\r\nconst useInitialize = () => {\r\n // blocking api here\r\n const dispatch = useDispatch();\r\n const [isInit, setInit] = useState(false);\r\n const [isSystemDataInit, setSystemDataInit] = useState(false);\r\n const isLogin = useSelector((state) => state.user.isLogin);\r\n\r\n // update / initialize user reducer before the application load\r\n useEffect(() => {\r\n const isLogin = getItem(KEYS.USER_IS_LOGIN, false);\r\n const email = getItem(KEYS.USER_EMAIL, '');\r\n const lastLogin = getItem(KEYS.USER_LAST_LOGIN);\r\n const role = getItem(KEYS.USER_ROLE, APPLICANT);\r\n const applicationColumn = getItem(APPLICATION_COLUMN) || defaultApplicationColumn;\r\n const postApprovalColumn = getItem(POST_APPROVAL_COLUMN) || defaultPostApprovalColumn;\r\n\r\n api.version.getBackendVersion().then((res) => {\r\n dispatch(\r\n setGlobal({\r\n backendVersion: res.data,\r\n }),\r\n );\r\n });\r\n\r\n dispatch(updateApplicationColumn(applicationColumn));\r\n dispatch(updatePostApprovalColumn(postApprovalColumn));\r\n\r\n dispatch({\r\n type: UPDATE_USER,\r\n payload: {\r\n email,\r\n isLogin,\r\n role,\r\n lastLogin,\r\n },\r\n });\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n dispatch({\r\n type: INITIAL_SYSTEM_GLOBAL_DATA,\r\n payload: {\r\n callback: () => {\r\n setSystemDataInit(true);\r\n },\r\n },\r\n });\r\n // eslint-disable-next-line\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (isLogin !== null && isSystemDataInit) {\r\n setInit(true);\r\n }\r\n }, [isLogin, isSystemDataInit]);\r\n\r\n return isInit;\r\n};\r\n\r\nexport default useInitialize;\r\n","import React from 'react';\r\nimport styled from 'styled-components/macro';\r\n\r\nconst SLayout = styled.div`\r\n font-size: 16px;\r\n font-weight: bold;\r\n`;\r\n\r\nconst TextHeader = ({ children, className, style, underline, italic }) => {\r\n return (\r\n Central IRB: Site PI shall be an employee/appointee of HA
\r\n // \r\n // HKU/HA HKW IRB: Site PI shall be an employee/appointee/student of the HKU or HA HKWC\r\n //
\r\n // \r\n // Joint CUHK-NTEC CREC: Site PI shall be an employee/appointee/student of the CUHK or HA NTEC\r\n //
\r\n // \r\n {item}\r\n
\r\n );\r\n })}\r\n \r\n }\r\n {...extra}\r\n >\r\n \r\n {iconStyle ? (\r\n \r\n Number Cannot smaller than {minNumber}\r\n
\r\n )}\r\n {numberField && !checkNull(value) && value > maxNumber && (\r\n \r\n Number Cannot larger than {maxNumber}\r\n
\r\n )}\r\n \r\n \r\n {componentValue.map((item, index) => {\r\n const itemParams = remarkParams.find((inputItem) => {\r\n return item.key.toString() === inputItem.key.toString();\r\n });\r\n const inputParams = itemParams?.params ?? {};\r\n const SRadioLayoutStyle = itemParams?.SRadioLayoutStyle ?? {};\r\n const SDisplayLayoutStyle = itemParams?.SDisplayLayoutStyle ?? {};\r\n return (\r\n \r\n {item.display} \r\n {item.tooltip && \r\n );\r\n })}\r\n \r\n {forceErrorDisplay && isRequired && !isValueExist() && (\r\n
\r\n );\r\n};\r\n\r\nexport default CustomCheckbox;\r\n","import React from 'react';\r\nimport styled from 'styled-components/macro';\r\n\r\nconst SLayout = styled.div`\r\n font-size: 14px;\r\n font-weight: bold;\r\n`;\r\n\r\nconst TextSubHeader = ({ children, className, style = {} }) => {\r\n return (\r\n \r\n {\r\n onSelect(e, item);\r\n }}\r\n size=\"small\"\r\n />\r\n {getDisableStatus() && (\r\n
\r\n\r\n This field is required.
\r\n )}\r\n \r\n
\r\n \r\n )}\r\n {!displayContentNextLine && (\r\n \r\n \r\n {label}\r\n\r\n {labelTooltip && \r\n (*To Complete in Site info)\r\n
\r\n )}\r\n \r\n \r\n
\r\n )}\r\n \r\n \r\n {children}\r\n \r\n {loading && (\r\n \r\n \r\n )}\r\n
\r\n \r\n
\r\n ) : (\r\n \r\n
\r\n \r\n \r\n {enableDownload ? (\r\n downloadFile(index, upload)}>\r\n {upload.name}\r\n \r\n ) : (\r\n upload.name\r\n )}\r\n \r\n {enableRemove && (\r\n onRemove(index)} />\r\n )}\r\n
\r\n );\r\n })\r\n ) : (\r\n \r\n {data} \r\n
\r\n )}\r\n \r\n \r\n \r\n \r\n
\r\n );\r\n}\r\n","import { Drawer } from '@material-ui/core';\r\nimport CustomButton from 'components/CustomInput/Button';\r\nimport TextHeader from 'components/CustomText/TextHeader';\r\nimport UploadButtons from 'components/UploadButton';\r\nimport React from 'react';\r\nimport { useDispatch } from 'react-redux';\r\nimport { setGlobal } from 'store/global/reducer';\r\nimport styled from 'styled-components/macro';\r\n\r\nconst SLayout = styled.div`\r\n padding: 15px;\r\n`;\r\n\r\nconst SHeader = styled.div``;\r\n\r\nconst SContent = styled.div`\r\n margin-top: 30px;\r\n`;\r\n\r\nconst SActionLayout = styled.div`\r\n margin-top: 30px;\r\n display: flex;\r\n justify-content: flex-end;\r\n`;\r\n\r\nconst CTADrawer = ({ isShow, onClose = () => null }) => {\r\n const dispatch = useDispatch();\r\n\r\n const closeDrawer = () => {\r\n dispatch(\r\n setGlobal({\r\n showCTAUploadDrawer: false,\r\n }),\r\n );\r\n };\r\n\r\n return (\r\n Please Upload your file before submitting
\r\n \r\n
\r\n This field is required.
\r\n )}\r\n \r\n );\r\n};\r\n\r\nexport default CustomRadio;\r\n","import React from 'react';\r\nimport { useLocation } from 'react-router';\r\nimport CustomTextField from '../Input/CustomTextField';\r\nimport HospitalOrInstitutions from 'components/Global/HospitalOrInstitutions';\r\nimport CustomSelect from 'components/Input/CustomSelect';\r\nimport CustomDatePicker from 'components/Input/CustomDatePicker';\r\nimport PasswordTextField from 'components/Input/PasswordTextField';\r\nimport UploadFileInput from 'components/uploadFile/uploadFileInput';\r\nimport { Grid, Typography } from '@material-ui/core';\r\nimport UploadDisplay from 'components/uploadFile/UploadDisplay';\r\nimport ClusterSelection from 'components/ClusterSelection';\r\nimport CustomCheckbox from 'components/CustomCheckbox';\r\nimport { isArray } from 'lodash';\r\nimport CustomRadio from 'components/CustomRadio';\r\n\r\n/**\r\n * @description: Mapping TextField\r\n * @param {Object} props\r\n * @param {Object} props.item\r\n * @param {Function} props.handleFormData textFiled onChange\r\n * @param {Boolean} props.isAuthorizedEmail Autocomplete freeSolo\r\n * @param {Boolean} props.multiple upload multiple\r\n * @return {Element} return an element\r\n */\r\nconst MapTextField = (props) => {\r\n const {\r\n item,\r\n handleFormData,\r\n isAuthorizedEmail = true,\r\n multiple,\r\n isNoSpace,\r\n isTrim,\r\n confirmPasswordNotMatchPassword,\r\n forceErrorDisplay,\r\n isValidValue = () => null,\r\n minLength,\r\n maxLength,\r\n freeSolo,\r\n onRemove,\r\n showErrorWhenOnBlur,\r\n localTime,\r\n ...rest\r\n } = props;\r\n\r\n const location = useLocation();\r\n const isAmendmentForm = location?.pathname?.includes('application-amendment-detail');\r\n\r\n let extra = {};\r\n\r\n if (item.validators?.length) {\r\n extra = { validators: item.validators };\r\n }\r\n\r\n let html = null;\r\n console.log('item:', item)\r\n console.log(\"showRed\", isAmendmentForm && item.showRed)\r\n switch (item.type) {\r\n case 'radio':\r\n html = (\r\n \r\n {\r\n const selected = value.find((item) => item.value === true);\r\n handleFormData(\r\n {\r\n target: {\r\n name: key,\r\n value: selected.key,\r\n },\r\n },\r\n item.type,\r\n );\r\n }}\r\n {...rest}\r\n {...extra}\r\n />\r\n
\r\n );\r\n break;\r\n case 'input':\r\n html = (\r\n onSortLabelClick(row)}>\r\n
\r\n );\r\n } else {\r\n return (\r\n \r\n {isExpandRow && (\r\n \r\n \r\n Edit\r\n \r\n )}\r\n\r\n {columns\r\n .filter((item) => !item.hiddenInTableColumn)\r\n .map((item, index) => {\r\n const content = (\r\n \r\n
\r\n );\r\n\r\n if (item.fixWidth) {\r\n return (\r\n \r\n {item.headerName} {item.tooltip &&
\r\n\r\n {isSortable && !item.disableItemSort && (\r\n \r\n {getSortArrow(item)}\r\n
\r\n )}\r\n \r\n \r\n {isExpandRow && (\r\n \r\n {\r\n if (getIsToggleDisabled()) {\r\n return;\r\n }\r\n\r\n onExpandToggle(row.id, !shouldToggle);\r\n }}\r\n >\r\n {getIsToggleDisabled() ? (\r\n \r\n {\r\n onEdit(row);\r\n }}\r\n >\r\n \r\n onCheckboxChange(row)}\r\n checked={isCheckboxCheck(row)}\r\n disabled={\r\n isCheckboxCheck(row)\r\n ? false\r\n : row.disabledItemCheckbox\r\n ? row.disabledItemCheckbox\r\n : disabledCheckbox\r\n }\r\n >\r\n \r\n )}\r\n\r\n {columns\r\n .filter((item) => !item.hiddenInTableColumn)\r\n .map((item, index) => {\r\n const isLastIndex = columns.filter((item) => !item.hiddenInTableColumn).length - 1 === index;\r\n\r\n const extraProps = {};\r\n const extraStyle = {};\r\n const valueProps = {};\r\n const valueStyle = {};\r\n\r\n const HoverComponent = item.hoverComponent;\r\n\r\n if (item.goToPath) {\r\n valueProps.onClick = () => item.goToPath({ row });\r\n valueStyle.cursor = 'pointer';\r\n valueStyle.color = '#0079bf';\r\n }\r\n\r\n if (item.hoverComponent) {\r\n extraProps.onMouseEnter = (e) => handlePopoverOpen(e, item.field);\r\n extraProps.onMouseLeave = handlePopoverClose;\r\n }\r\n\r\n if (item.dotNotion) {\r\n extraStyle.overflow = 'hidden';\r\n extraStyle.whiteSpace = 'noWrap';\r\n extraStyle.textOverflow = 'ellipsis';\r\n extraStyle.width = getFieldWidth(item.field);\r\n extraStyle.top = '50%';\r\n }\r\n\r\n const Wrapper = item.dotNotion ? SDotStyle : SNormal;\r\n\r\n if (!item.textNotWrap) {\r\n valueStyle.whiteSpace = 'pre-line';\r\n }\r\n\r\n return (\r\n \r\n \r\n
\r\n\r\n {item.hoverComponent && (\r\n \r\n {item.hoverComponent && item.dotNotion && (\r\n \r\n \r\n {getRowValue(item.field, row[item.field], item.defaultValue)}\r\n \r\n \r\n
\r\n text placeholder
\r\n )}\r\n\r\n \r\n \r\n \r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nconst TableLoading = ({ parentWidth, tableUid }) => {\r\n const scrollLeft = useSelector((state) => state.table[`table-${tableUid}-scrollLeft`]);\r\n const scrollHeight = useSelector((state) => state.table[`table-${tableUid}-scrollHeight`]);\r\n\r\n return (\r\n \r\n
\r\n No Data
\r\n \r\n \r\n {\r\n dispatch(\r\n setTableUI({\r\n [`table-${tableUid}-scrollHeight`]: containerRef.current.scrollTop,\r\n [`table-${tableUid}-scrollLeft`]: containerRef.current.scrollLeft,\r\n }),\r\n );\r\n }}\r\n >\r\n {showGroupTab && getTableGroupHeader()}\r\n setHeaderWidth(width)}\r\n rows={rows}\r\n showGroupTab={showGroupTab}\r\n />\r\n {getSortData(rows)?.length === 0 && (\r\n
\r\n \r\n \r\n \r\n {getSortData(rows)?.map((row, index) => {\r\n const rowId = row.id;\r\n const shouldToggle = toggleStatus.find((item) => item.id === rowId)?.isToggle;\r\n const previousToggleId = getSortData(rows)?.[index - 1]?.id;\r\n const previousToggleStatus = toggleStatus?.find(\r\n (item) => item.id === previousToggleId,\r\n )?.isToggle;\r\n const shouldShowTopBorder = previousToggleStatus;\r\n\r\n return (\r\n
\r\n {loading && \r\n {\r\n setToggleStatus(\r\n produce((draft) => {\r\n const index = draft.findIndex((item) => item.id === id);\r\n if (index !== -1) {\r\n draft[index].isToggle = isExpand;\r\n }\r\n }),\r\n );\r\n }}\r\n />\r\n
\r\n );\r\n })}\r\n \r\n Email: hacco@ha.org.hk\r\n
\r\n \r\n Email: hkch.ro@ha.org.hk\r\n
\r\n \r\n Email: hkwirb@ha.org.hk\r\n
\r\n \r\n Email: crec@cuhk.edu.hk\r\n
\r\n \r\n Email: crerportal@ha.org.hk\r\n
\r\n \r\n {openPopup && \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n Resend Account Activation\r\n \r\n \r\n
\r\n \r\n\r\n {/* Email */}\r\n Login
\r\n Don't have an account?
\r\n \r\n Sign Up\r\n \r\n \r\n {page} \r\n
\r\n \r\n \r\n Applying IRB / REC\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n {\r\n checkValidation('email', isValid);\r\n }}\r\n value={getData('email')}\r\n disabled={isEmailLoading}\r\n onChange={onChange}\r\n showErrorWhenOnBlur\r\n />\r\n
\r\n \r\n \r\n Load Profile\r\n \r\n
\r\n \r\n {\r\n checkValidation('department', isValid);\r\n }}\r\n value={getData('department')}\r\n onChange={onChange}\r\n />\r\n
\r\n \r\n {\r\n checkValidation('cluster', isValid);\r\n }}\r\n value={getData('cluster')}\r\n forceErrorDisplay={forceErrorDisplay}\r\n onChange={(e) => {\r\n onChange(e);\r\n }}\r\n />\r\n
\r\n \r\n {\r\n checkValidation('institution', isValid);\r\n }}\r\n forceErrorDisplay={forceErrorDisplay}\r\n allowClusters={allowClusterInHospital}\r\n disabled={!getData('cluster')}\r\n disableHKU={getData('workflow') === 'N'}\r\n disableCUHK={getData('workflow') === 'H'}\r\n isAuthorizedEmail={true} // must be authorized people to create the team member form\r\n hospitalOrInstitution={getData('institution')}\r\n setHospitalOrInstitution={onChange}\r\n onFocus={() => setHospitalHover(true)}\r\n onBlur={() => setHospitalHover(false)}\r\n />\r\n \r\n \r\n
\r\n }\r\n />\r\n \r\n \r\n \r\n Central IRB: Coordinating Investigator shall be an employee/appointee of HA\r\n
\r\n \r\n HKU/HA HKW IRB: Coordinating Investigator shall be an\r\n employee/appointee/student of the HKU or HA HKWC\r\n
\r\n \r\n Joint CUHK-NTEC CREC: Coordinating Investigator shall be an\r\n employee/appointee/student of the CUHK or HA NTEC\r\n
\r\n \r\n //
\r\n // ),\r\n width: 120,\r\n },\r\n {\r\n field: 'department',\r\n headerName: 'Department',\r\n width: 160,\r\n },\r\n {\r\n field: 'endEffectiveDate',\r\n headerName: 'End effective date',\r\n width: 150,\r\n valueGetter: (params) => {\r\n if (params.value) {\r\n return getTimeWithTimeZone(params.value).format('YYYY-MM-DD');\r\n }\r\n\r\n return '-';\r\n },\r\n },\r\n ]);\r\n\r\n return {\r\n columns,\r\n rows,\r\n openPopup,\r\n setOpenPopup,\r\n selectedRow,\r\n triggerFormCreate,\r\n onRecordUpdate,\r\n handleEditClick,\r\n setRows,\r\n handleDeleteAfterCreation,\r\n handleCreateAfterCreation,\r\n handleEditAfterCreation,\r\n isEdit,\r\n };\r\n};\r\n\r\nexport default useSitePIData;\r\n","import React, { useState } from 'react';\r\nimport Dialog from '@material-ui/core/Dialog';\r\nimport DialogActions from '@material-ui/core/DialogActions';\r\nimport DialogContent from '@material-ui/core/DialogContent';\r\nimport DialogContentText from '@material-ui/core/DialogContentText';\r\nimport DialogTitle from '@material-ui/core/DialogTitle';\r\nimport CustomButton from 'components/CustomInput/Button';\r\nimport styled from 'styled-components';\r\nimport { IconButton } from '@material-ui/core';\r\nimport CloseIcon from '@material-ui/icons/Close';\r\nimport UploadWrapper from 'components/UploadWrapper';\r\nimport { produce } from 'utility/general';\r\nimport UploadDisplay from 'components/uploadFile/UploadDisplay';\r\n\r\nconst SContent = styled.div`\r\n min-width: 400px;\r\n font-weight: 500;\r\n`;\r\n\r\nconst CustomDialog = ({\r\n children,\r\n onConfirm = () => null,\r\n onCancel,\r\n isShow = false,\r\n title = '',\r\n description = '',\r\n confirmText = 'Confirm',\r\n cancelText = 'Cancel',\r\n loading = false,\r\n disableCancelButton = false,\r\n showUploadButton = false,\r\n width = 400,\r\n maxWidth = 'sm',\r\n}) => {\r\n const [isFileUploading, setFileUploading] = useState(false);\r\n\r\n const [uploadFileNames, setUploadFileNames] = useState([]);\r\n\r\n const onFileUploaded = (list) => {\r\n setUploadFileNames([...uploadFileNames, ...list]);\r\n setFileUploading(false);\r\n };\r\n\r\n const onFileRemove = (index) => {\r\n setUploadFileNames(\r\n produce((draft) => {\r\n draft.splice(index, 1);\r\n }),\r\n );\r\n };\r\n\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default CustomDialog;\r\n","import React, { useEffect, useState } from 'react';\r\nimport styled from 'styled-components/macro';\r\nimport CustomDialog from 'components/CustomDialog';\r\nimport CustomTextField from 'components/Input/CustomTextField';\r\nimport HospitalOrInstitutions from 'components/Global/HospitalOrInstitutions';\r\nimport ClusterSelection from 'components/ClusterSelection';\r\nimport CustomButton from 'components/CustomInput/Button';\r\nimport { getClusterByWorkflow, produce } from 'utility/general';\r\nimport api from 'api/call';\r\nimport { APPLICANT } from 'utility/lookup';\r\n\r\nconst SLayout = styled.div``;\r\n\r\nconst SSection = styled.div`\r\n margin-top: 20px;\r\n`;\r\n\r\nconst SRowLayout = styled.div`\r\n display: flex;\r\n justify-content: space-between;\r\n margin-top: 20px;\r\n\r\n & > div:nth-child(2) {\r\n padding-left: 20px;\r\n }\r\n`;\r\n\r\nconst SEvenChild = styled.div`\r\n flex-grow: 1;\r\n`;\r\n\r\nconst MemberDialog = ({\r\n title,\r\n isShow = true,\r\n onDialogCancel,\r\n onCreateSubmit,\r\n workflow = '',\r\n showFullName = false,\r\n disableHKU = false,\r\n disableCUHK = false,\r\n isDelegateDialog = false,\r\n restrictApplicant = false,\r\n disablePosition = false,\r\n disableCluster = false,\r\n isSIDelegation = false,\r\n disableClusterChange = false,\r\n disableInstitutionChange = false,\r\n selectedRow = {},\r\n onEditSubmit = (data) => null,\r\n isEdit = false,\r\n}) => {\r\n const [dialogData, setDialogData] = useState(selectedRow);\r\n const [isEmailLoading, setEmailLoading] = useState(false);\r\n const [validation, setValidation] = useState({});\r\n const [forceErrorDisplay, setForceErrorDisplay] = useState(false);\r\n const [allowClusters, setAllowClusters] = useState([]);\r\n const [allowClusterForHospital, setAllowClusterForHospital] = useState([]);\r\n\r\n useEffect(() => {\r\n if (isSIDelegation) {\r\n setAllowClusters([]);\r\n if (selectedRow?.cluster) {\r\n setAllowClusterForHospital([selectedRow?.cluster]);\r\n }\r\n } else if (!isDelegateDialog || isSIDelegation) {\r\n const clusters = getClusterByWorkflow(workflow, false);\r\n setAllowClusters(clusters);\r\n if (selectedRow?.cluster) {\r\n setAllowClusterForHospital([selectedRow?.cluster]);\r\n }\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [workflow, isDelegateDialog, isSIDelegation]);\r\n\r\n useEffect(() => {\r\n if (selectedRow?.cluster) {\r\n setAllowClusterForHospital([selectedRow?.cluster]);\r\n }\r\n }, [selectedRow]);\r\n\r\n useEffect(() => {\r\n if (isShow) {\r\n setDialogData(selectedRow);\r\n }\r\n\r\n setForceErrorDisplay(false);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [isShow]);\r\n\r\n const onProfileLoad = async () => {\r\n if (!validation['email']) {\r\n return;\r\n }\r\n\r\n try {\r\n setEmailLoading(true);\r\n const res = await api.user.getUserByEmail(dialogData?.email ?? '', restrictApplicant ? APPLICANT : '');\r\n const { contact, firstName, surname, title, email } = res.data.result;\r\n\r\n const dataToUpdate = produce(dialogData, (draft) => {\r\n draft['contact'] = contact;\r\n // draft['institution'] = institution;\r\n draft['firstName'] = firstName;\r\n draft['surname'] = surname;\r\n draft['title'] = title;\r\n draft['email'] = email;\r\n // draft['cluster'] = cluster;\r\n });\r\n\r\n setDialogData(dataToUpdate); // set local component data\r\n } catch (error) {\r\n console.log('173307 LeadPrincipalinfo.jsx error', error);\r\n }\r\n\r\n setEmailLoading(false);\r\n };\r\n\r\n const onChange = (e) => {\r\n const { name, value } = e.target;\r\n\r\n // narrow the choice of hospital selection\r\n if (name === 'cluster') {\r\n setAllowClusterForHospital([value]);\r\n }\r\n\r\n setDialogData(\r\n produce((draft) => {\r\n draft[name] = value;\r\n\r\n if (name === 'cluster') {\r\n delete draft.institution;\r\n }\r\n }),\r\n );\r\n };\r\n\r\n const onSubmit = async () => {\r\n setForceErrorDisplay(true);\r\n\r\n const isFormValid = Object.values(validation).every((item) => item);\r\n\r\n if (!isFormValid) {\r\n return;\r\n }\r\n\r\n try {\r\n setEmailLoading(true);\r\n\r\n await api.user.getUserByEmail(dialogData.email, restrictApplicant ? APPLICANT : '');\r\n\r\n if (isEdit) {\r\n onEditSubmit(dialogData);\r\n } else {\r\n await onCreateSubmit(dialogData, { isDelegateDialog }, () => {\r\n setDialogData({});\r\n });\r\n }\r\n\r\n //reset dialog data when data is added\r\n } catch (error) {\r\n console.log('163745 MemberDialog.jsx error', error);\r\n // showDialog({\r\n // description: INVALID_EMAIL_USER,\r\n // disableCancelButton: true,\r\n // });\r\n }\r\n\r\n setEmailLoading(false);\r\n };\r\n\r\n const isFreeTextInHospital = () => {\r\n if (\r\n isDelegateDialog\r\n // && dialogData.cluster === 'OTHERS'\r\n ) {\r\n return true;\r\n }\r\n\r\n return false;\r\n };\r\n\r\n return (\r\n Central IRB: Site PI shall be an employee/appointee of HA
\r\n // \r\n // HKU/HA HKW IRB: Site PI shall be an employee/appointee/student of the HKU or HA HKWC\r\n //
\r\n // \r\n // Joint CUHK-NTEC CREC: Site PI shall be an employee/appointee/student of the CUHK or HA NTEC\r\n //
\r\n // \r\n
\r\n \r\n {\r\n setValidation(\r\n produce((draft) => {\r\n draft.email = isValid;\r\n }),\r\n );\r\n }}\r\n onChange={onChange}\r\n showErrorWhenOnBlur\r\n />\r\n
\r\n\r\n \r\n \r\n Load Profile\r\n \r\n
\r\n \r\n \r\n \r\n Information of Site PI(s)\r\n {' '}\r\n \r\n {\r\n if (!workflow) {\r\n showDialog({\r\n description: SELECT_WORKFLOW_FIRST,\r\n disableCancelButton: true,\r\n });\r\n } else {\r\n triggerFormCreate(true);\r\n }\r\n }}\r\n >\r\n Add\r\n \r\n
\r\n\r\n {openPopup && (\r\n \r\n //
\r\n // ),\r\n },\r\n {\r\n field: 'department',\r\n headerName: 'Department',\r\n width: 120,\r\n },\r\n ];\r\n\r\n return {\r\n columns,\r\n rows,\r\n openPopup,\r\n setOpenPopup,\r\n selectedRow,\r\n triggerCreateForm,\r\n onRecordUpdate,\r\n handleEditClick,\r\n setRows,\r\n handleDeleteAfterCreation,\r\n handleEditAfterCreation,\r\n handleCreateAfterCreation,\r\n isEdit, // onEditSubmit,\r\n };\r\n};\r\n\r\nexport default useLeadPITableData;\r\n","import React, { useEffect } from 'react';\r\nimport TextSubHeader from 'components/CustomText/TextSubHeader';\r\nimport CustomButton from 'components/CustomInput/Button';\r\nimport CustomTable from 'components/CustomTable';\r\nimport useLeadPITableData from 'hooks/tableData/useLeadPITableData';\r\nimport TipsIcon from 'components/TipsIcon';\r\nimport styled from 'styled-components';\r\nimport MemberDialog from './MemberDialog';\r\nimport useDialog from 'components/ConfirmDialog/useDialog';\r\nimport { EMAIL_EXIST_EMAIL, THREE_SITE_PI_ALLOWED } from 'utility/frontendMessage';\r\nimport { compareEmail, produce } from 'utility/general';\r\nimport { getStore } from 'store';\r\n\r\nconst SHeaderLayout = styled.div`\r\n padding-bottom: 10px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n`;\r\n\r\nconst CIDelegationTable = ({\r\n onTableChange = (data) => null,\r\n defaultData = [],\r\n isFormCreate = false,\r\n disableOnPermission = false,\r\n applicationDetail,\r\n piTableData = [],\r\n onTableDataUpdate = (data) => null,\r\n isAmendmentCreate = false,\r\n isAmendmentEdit = false,\r\n isHighlight,\r\n}) => {\r\n const {\r\n openPopup,\r\n setOpenPopup,\r\n columns,\r\n rows,\r\n triggerCreateForm,\r\n onRecordUpdate,\r\n handleDeleteAfterCreation,\r\n handleEditAfterCreation,\r\n handleCreateAfterCreation,\r\n setRows,\r\n selectedRow,\r\n isEdit,\r\n handleEditClick,\r\n } = useLeadPITableData({ formId: applicationDetail?.applicationForm?.id });\r\n\r\n const showDialog = useDialog();\r\n\r\n const isAmendment = isAmendmentCreate || isAmendmentEdit;\r\n\r\n // initialize the study-info postData if edit data exist\r\n useEffect(() => {\r\n const { applicationDetailPostData } = getStore().getState();\r\n const ciDelegation = applicationDetailPostData.postData?.ciDelegation ?? [];\r\n setRows([...rows, ...ciDelegation]);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n // update table data to parent\r\n useEffect(() => {\r\n onTableDataUpdate(rows);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [rows]);\r\n\r\n const checkEmailExistInForm = (data, isUpdate = false) => {\r\n let isExist = false;\r\n\r\n // piTableData.forEach((item) => {\r\n // if (item.email === data.email) {\r\n // isExist = true;\r\n // }\r\n // });\r\n\r\n rows.filter((item) => {\r\n if (isUpdate) {\r\n return item.id !== data.id;\r\n }\r\n\r\n return true;\r\n }).forEach((item) => {\r\n if (compareEmail(item.email, data.email)) {\r\n isExist = true;\r\n }\r\n });\r\n\r\n return isExist;\r\n };\r\n\r\n const onDataCreate = async (data) => {\r\n let isEmailExistInTeamMember = checkEmailExistInForm(data);\r\n\r\n if (isEmailExistInTeamMember) {\r\n return await showDialog({\r\n description: EMAIL_EXIST_EMAIL,\r\n disableCancelButton: true,\r\n });\r\n }\r\n\r\n // creating a brand new initial application form\r\n if (isFormCreate) {\r\n onRecordUpdate(data);\r\n setOpenPopup(false);\r\n // notify parent the whole post data of the table\r\n onTableChange([...rows, data]);\r\n } else {\r\n handleCreateAfterCreation(data);\r\n setOpenPopup(false);\r\n }\r\n };\r\n\r\n const onEditData = async (data) => {\r\n let isEmailExistInTeamMember = checkEmailExistInForm(data, true);\r\n\r\n if (isEmailExistInTeamMember) {\r\n return await showDialog({\r\n description: EMAIL_EXIST_EMAIL,\r\n disableCancelButton: true,\r\n });\r\n }\r\n\r\n if (isFormCreate) {\r\n const newRows = produce(rows, (draft) => {\r\n const index = draft.findIndex((item) => {\r\n return item.id === data.id;\r\n });\r\n\r\n draft[index] = data;\r\n });\r\n\r\n onTableChange(newRows);\r\n setOpenPopup(false);\r\n setRows(newRows);\r\n } else {\r\n handleEditAfterCreation(data);\r\n setOpenPopup(false);\r\n }\r\n };\r\n\r\n const onDeleteData = (data) => {\r\n if (isFormCreate) {\r\n const newRows = produce(rows, (draft) => {\r\n const index = draft.findIndex((item) => item.id === data.id);\r\n draft.splice(index, 1);\r\n });\r\n\r\n onTableChange(newRows);\r\n setOpenPopup(false);\r\n setRows(newRows);\r\n } else {\r\n handleDeleteAfterCreation(data);\r\n }\r\n };\r\n\r\n return (\r\n Central IRB: Coordinating Investigator shall be an employee/appointee of HA
\r\n // \r\n // HKU/HA HKW IRB: Coordinating Investigator shall be an employee/appointee/student of the HKU or\r\n // HA HKWC\r\n //
\r\n // \r\n // Joint CUHK-NTEC CREC: Coordinating Investigator shall be an employee/appointee/student of the\r\n // CUHK or HK NTEC\r\n //
\r\n // \r\n \r\n \r\n \r\n Coordinating Investigator's Delegation\r\n \r\n \r\n {\r\n if (rows.length >= 3) {\r\n return showDialog({\r\n description: THREE_SITE_PI_ALLOWED,\r\n disableCancelButton: true,\r\n });\r\n }\r\n\r\n triggerCreateForm();\r\n }}\r\n >\r\n Add\r\n \r\n \r\n {openPopup && (\r\n setOpenPopup(false)}\r\n onCreateSubmit={onDataCreate}\r\n onEditSubmit={onEditData}\r\n isEdit={isEdit}\r\n />\r\n )}\r\n\r\n
\r\n );\r\n};\r\n\r\nexport default CIDelegationTable;\r\n","import useDialog from 'components/ConfirmDialog/useDialog';\r\nimport usePrevious from 'hooks/usePrevious';\r\nimport { isEqual } from 'lodash';\r\nimport { useEffect, useState } from 'react';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { ADD_DELETE_REQUEST, UPDATE_APPLICATION_DETAIL_POST_DATA } from 'store/key';\r\nimport { THREE_SITE_PI_ALLOWED } from 'utility/frontendMessage';\r\nimport { generateRandomId, produce } from 'utility/general';\r\n\r\nconst useSiteDelegationData = ({ formId = -1, siteInfoId = -1, workflow = '' }) => {\r\n const [openPopup, setOpenPopup] = useState(false);\r\n const [selectedRow, setSelectedRow] = useState({});\r\n const serverTableKey = 'piDelegation';\r\n const updatePostData = useSelector((state) => state.applicationDetailPostData.postData[serverTableKey]);\r\n const remoteData = useSelector((state) => state.applicationDetail?.[formId]?.[serverTableKey]);\r\n const dispatch = useDispatch();\r\n const showDialog = useDialog();\r\n const [isEdit, setEdit] = useState(false);\r\n\r\n const [rows, setRows] = useState(remoteData ?? []);\r\n const previousData = usePrevious(remoteData);\r\n\r\n // update row when remote data update\r\n useEffect(() => {\r\n if (!isEqual(previousData, remoteData)) {\r\n setRows(remoteData);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [remoteData]);\r\n\r\n // useEffect(() => {\r\n // const newRows = cloneDeep(remoteData);\r\n\r\n // updatePostData?.forEach((item) => {\r\n // const index = newRows.findIndex((row) => row.id === item.id);\r\n\r\n // if (index !== -1) {\r\n // newRows[index] = item;\r\n // } else {\r\n // newRows.push(item);\r\n // }\r\n // });\r\n\r\n // setRows(newRows);\r\n\r\n // // setRows([...remoteData, ...(updatePostData ?? [])]);\r\n // // eslint-disable-next-line react-hooks/exhaustive-deps\r\n // }, [updatePostData]);\r\n\r\n const handleEditClick = (row) => {\r\n setEdit(true);\r\n setSelectedRow(row);\r\n setOpenPopup(true);\r\n };\r\n\r\n const triggerFormCreate = async (id) => {\r\n\r\n if (rows.length >= 3) {\r\n return showDialog({\r\n description: THREE_SITE_PI_ALLOWED,\r\n disableCancelButton: true,\r\n });\r\n }\r\n\r\n setEdit(false);\r\n setSelectedRow({});\r\n setOpenPopup(true);\r\n };\r\n\r\n const onRecordUpdate = async (data) => {\r\n setRows(\r\n produce((draft) => {\r\n data.id = `temp_${generateRandomId()}`;\r\n draft.push(data);\r\n }),\r\n );\r\n };\r\n\r\n const handleEditAfterCreation = (row) => {\r\n let postData = updatePostData ?? [];\r\n row.siteInfo = { id: siteInfoId };\r\n\r\n const index = postData.findIndex((item) => {\r\n return item.id === row.id;\r\n });\r\n\r\n if (index === -1) {\r\n postData.push(row);\r\n } else {\r\n postData[index] = row;\r\n }\r\n\r\n // update post data\r\n dispatch({\r\n type: UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n payload: {\r\n type: serverTableKey,\r\n data: postData,\r\n applicationFormId: formId,\r\n },\r\n });\r\n\r\n //update local data\r\n setRows(\r\n produce((draft) => {\r\n const index = draft.findIndex((item) => {\r\n return item.id === row.id;\r\n });\r\n\r\n draft[index] = row;\r\n }),\r\n );\r\n };\r\n\r\n const handleCreateAfterCreation = async (data) => {\r\n data.id = `temp_${generateRandomId()}`;\r\n data.siteInfo = { id: siteInfoId };\r\n\r\n const newRows = produce(rows, (draft) => {\r\n draft.push(data);\r\n });\r\n setRows(newRows);\r\n dispatch({\r\n type: UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n payload: {\r\n type: serverTableKey,\r\n data: [...(updatePostData ?? []), data],\r\n applicationFormId: formId,\r\n },\r\n });\r\n };\r\n\r\n const handleDeleteAfterCreation = async (row) => {\r\n setRows(\r\n produce((draft) => {\r\n const index = draft.findIndex((item) => {\r\n return item.id === row.id;\r\n });\r\n\r\n if (index !== -1) {\r\n draft.splice(index, 1);\r\n }\r\n }),\r\n );\r\n\r\n // skip if id starts with temp_, e.g. not exist in server\r\n if (row.id.toString().startsWith('temp_')) {\r\n let postData = updatePostData ?? [];\r\n\r\n const index = postData.findIndex((item) => {\r\n return item.id === row.id;\r\n });\r\n\r\n if (index !== -1) {\r\n postData.splice(index, 1);\r\n }\r\n\r\n dispatch({\r\n type: UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n payload: {\r\n type: serverTableKey,\r\n data: postData,\r\n applicationFormId: formId,\r\n },\r\n });\r\n\r\n return;\r\n }\r\n\r\n dispatch({\r\n type: ADD_DELETE_REQUEST,\r\n payload: {\r\n type: serverTableKey,\r\n id: row.id,\r\n siteInfoId,\r\n applicationFormId: formId,\r\n },\r\n });\r\n };\r\n\r\n const [columns] = useState([\r\n { field: 'email', headerName: 'Email', width: 200 },\r\n { field: 'title', headerName: 'Title', width: 130, tooltip: 'e.g. Dr/Mr/Mrs/Ms/Prof.' },\r\n {\r\n field: 'surname',\r\n headerName: 'Surname',\r\n width: 120,\r\n valueGetter: (params) => params.getValue('surname'),\r\n },\r\n {\r\n field: 'firstName',\r\n headerName: 'First name',\r\n width: 120,\r\n valueGetter: (params) => params.getValue('firstName'),\r\n },\r\n { field: 'cluster', headerName: 'Cluster', width: 100 },\r\n {\r\n field: 'institution',\r\n headerName: 'Hospital / Institution',\r\n // tooltip: (\r\n // \r\n //
\r\n // ),\r\n width: 120,\r\n },\r\n {\r\n field: 'department',\r\n headerName: 'Department',\r\n width: 160,\r\n },\r\n ]);\r\n\r\n const getFilteredRow = () => {\r\n return rows.filter((item) => {\r\n return item.siteInfo.id === siteInfoId;\r\n });\r\n };\r\n\r\n return {\r\n columns,\r\n rows: getFilteredRow(rows),\r\n setRows,\r\n openPopup,\r\n setOpenPopup,\r\n selectedRow,\r\n triggerFormCreate,\r\n onRecordUpdate,\r\n handleEditClick,\r\n handleDeleteAfterCreation,\r\n handleCreateAfterCreation,\r\n handleEditAfterCreation,\r\n isEdit,\r\n };\r\n};\r\n\r\nexport default useSiteDelegationData;\r\n","import React, { useEffect } from 'react';\r\nimport TextSubHeader from 'components/CustomText/TextSubHeader';\r\nimport CustomButton from 'components/CustomInput/Button';\r\nimport CustomTable from 'components/CustomTable';\r\n// import PopupInput from 'components/Application/TeamMemberForm/PopupInput';\r\nimport useSitePIDelegateData from 'hooks/tableData/useSitePIDelegateData';\r\nimport MemberDialog from './MemberDialog';\r\nimport useDialog from 'components/ConfirmDialog/useDialog';\r\nimport { EMAIL_EXIST_EMAIL } from 'utility/frontendMessage';\r\nimport { compareEmail, initializeTableData } from 'utility/general';\r\n\r\nconst SiteDelegationTable = ({\r\n applicationDetail,\r\n siteInfoId,\r\n disableOnPermission = false,\r\n isAmendmentCreate = false,\r\n isAmendmentEdit = false,\r\n isHighlight = () => {},\r\n}) => {\r\n const {\r\n openPopup,\r\n setOpenPopup,\r\n columns,\r\n rows,\r\n selectedRow,\r\n handleEditClick,\r\n handleEditAfterCreation,\r\n handleCreateAfterCreation,\r\n handleDeleteAfterCreation,\r\n triggerFormCreate,\r\n isEdit,\r\n setRows,\r\n } = useSitePIDelegateData({ formId: applicationDetail?.applicationForm?.id, siteInfoId });\r\n\r\n const showDialog = useDialog();\r\n\r\n const isAmendment = isAmendmentCreate || isAmendmentEdit;\r\n\r\n // initialize the site-info postData if edit data exist\r\n useEffect(() => {\r\n const newData = initializeTableData({\r\n tableKey: 'piDelegation',\r\n currentTableData: rows,\r\n siteInfoId,\r\n });\r\n\r\n setRows(newData);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n return (\r\n <>\r\n - Central IRB workflow: \"Site PI's Delegation shall be an employee/appointee of HA\"
\r\n // \r\n // - Joint CUHK-NTEC CREC workflow: \"Site PI's Delegation shall be an employee/appointee/student of\r\n // the CUHK or HA NTEC\"\r\n //
\r\n // \r\n // - HKU/HA HKW IRB: \"Site PI's Delegation shall be an employee/appointee/student of the HKU or HA\r\n // HKWC\"\r\n //
\r\n // \r\n {isFormCreate && (\r\n \r\n \r\n {isClone ? 'Clone' : 'Create'}\r\n \r\n \r\n Cancel\r\n \r\n \r\n )}\r\n \r\n \r\n Team Member Form\r\n \r\n {tabType !== 'hospital' && (\r\n <>\r\n \r\n setCIDelegateData(data)}\r\n onTableChange={(data) => {\r\n onFormUpdate('ciDelegation', data);\r\n onPostDataUpdate('ciDelegation', data);\r\n }}\r\n isHighlight={isHighlight}\r\n isAmendmentCreate={isAmendmentCreate}\r\n isAmendmentEdit={isAmendmentEdit}\r\n applicationCreateDtm={applicationCreateDtm}\r\n />\r\n \r\n \r\n )}\r\n {(tabType === 'info' || isFormCreate) && (\r\n \r\n setPITableData(data)}\r\n isHighlight={isHighlight}\r\n isAmendmentCreate={isAmendmentCreate}\r\n isAmendmentEdit={isAmendmentEdit}\r\n applicationCreateDtm={applicationCreateDtm}\r\n />\r\n \r\n )}\r\n {!isFormCreate && tabType === 'hospital' && (\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default TeamMemberForm;\r\n","import React, { useState, useEffect } from 'react';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport { CircularProgress, Typography, Grid } from '@material-ui/core';\r\nimport { useHistory } from 'react-router';\r\nimport API from 'api/call';\r\nimport { useSelector } from 'react-redux';\r\nimport CustomButton from 'components/CustomInput/Button';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n root: {\r\n display: 'flex',\r\n '& > * + *': {\r\n marginLeft: theme.spacing(2),\r\n },\r\n flex: 1,\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n },\r\n button: {\r\n marginTop: theme.spacing(2),\r\n },\r\n text: {\r\n fontSize: '30px !important'\r\n }\r\n}));\r\n\r\nexport default function AccountActivation(props) {\r\n const classes = useStyles();\r\n const systemMessage = useSelector(state => state.systemMessage.systemMessage);\r\n\r\n const [displayText, setDisplayText] = useState('');\r\n const [isError, setIsError] = useState(false);\r\n\r\n const history = useHistory();\r\n const token = history.location.search.split('?token=')[1];\r\n\r\n const callAccountActivation = () => {\r\n API.user.accountActivation({ token: token }).then(res => {\r\n setDisplayText(systemMessage.accountActivated);\r\n }).catch(err => {\r\n setDisplayText(err.response?.data?.errorMessage);\r\n setIsError(true);\r\n });\r\n };\r\n\r\n const toLoginPage = () => {\r\n props.setIsAccountActivationUrl(false);\r\n history.replace('/');\r\n };\r\n\r\n useEffect(() => {\r\n callAccountActivation();\r\n // eslint-disable-next-line\r\n }, []);\r\n\r\n return (\r\n \r\n \r\n {displayText ? \r\n \r\n {displayText} \r\n \r\n \r\n \r\n Go to Login\r\n \r\n \r\n \r\n : \r\n
\r\n );\r\n}\r\n","import React, { useState } from 'react';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport { Grid, Typography, Link, Paper } from '@material-ui/core';\r\nimport { useHistory } from 'react-router-dom';\r\nimport PasswordTextField from 'components/Input/PasswordTextField';\r\nimport CustomButton from 'components/CustomInput/Button/index';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport API from 'api/call';\r\nimport MsgBox from 'components/MsgBox/MsgBox';\r\nimport { setGlobalLoading } from 'store/global/reducer';\r\nimport { SYSTEM_HANDLE_FORCE_CHECK_VALIDATION } from 'store/key';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n container: {\r\n marginTop: theme.spacing(4),\r\n flex: 1,\r\n overflow: 'auto',\r\n },\r\n box: {\r\n width: 500,\r\n padding: theme.spacing(2),\r\n },\r\n title: {\r\n fontWeight: 'bold',\r\n fontSize: '24px',\r\n paddingBottom: theme.spacing(4),\r\n },\r\n item: {\r\n marginTop: theme.spacing(2),\r\n },\r\n footer: {\r\n paddingTop: theme.spacing(6),\r\n paddingBottom: theme.spacing(2),\r\n },\r\n}));\r\n\r\nconst ResetPassword = (props) => {\r\n const classes = useStyles();\r\n const dispatch = useDispatch();\r\n\r\n const { setIsResetPasswordUrl } = props;\r\n const history = useHistory();\r\n const token = history.location.search.split('?token=')[1];\r\n\r\n const systemMessage = useSelector(state => state.systemMessage.systemMessage);\r\n\r\n const [warningMsg, setWarningMsg] = useState(null);\r\n \r\n const [formData, setFormData] = useState({\r\n password: {\r\n value: '',\r\n label: 'Password',\r\n name: 'password',\r\n type: 'password',\r\n },\r\n confirmPassword: {\r\n value: '',\r\n label: 'Confirm Password',\r\n name: 'confirmPassword',\r\n type: 'password',\r\n },\r\n });\r\n const [forceShowError, setForceShowError] = useState(false);\r\n const [passwordValid, setPasswordValid] = useState(true);\r\n const [confirmPasswordValid, setConfirmPasswordValid] = useState(true);\r\n\r\n const checkFormDataValid = () => {\r\n let isValid = true;\r\n for (let i in formData) {\r\n if (!formData[i].value) {\r\n isValid = false;\r\n break;\r\n };\r\n }\r\n return isValid;\r\n };\r\n\r\n const handleFormDataChange = (e) => {\r\n const { name, value } = e.target;\r\n\r\n setFormData({\r\n ...formData,\r\n [name]: {\r\n ...formData[name],\r\n value: value\r\n },\r\n });\r\n };\r\n\r\n const confirm = () => {\r\n //update global state isLogin in user reducer\r\n setForceShowError(true);\r\n if (passwordValid && confirmPasswordValid && checkFormDataValid()) {\r\n setGlobalLoading(true);\r\n API.user.resetPassword({\r\n token: token, \r\n password: formData.password.value,\r\n confirmPassword: formData.confirmPassword.value,\r\n }).then(res => {\r\n setWarningMsg({\r\n type: 'confirm',\r\n message: systemMessage.resetPassCodeSuccess,\r\n footerActions: [\r\n {\r\n label: 'Confirm',\r\n clicked: () => {\r\n setWarningMsg(null);\r\n back();\r\n },\r\n },\r\n ],\r\n });\r\n }).finally(() => {\r\n setGlobalLoading(false);\r\n });\r\n }\r\n };\r\n const back = () => {\r\n setIsResetPasswordUrl(false);\r\n history.replace('/');\r\n };\r\n const reset = () => {\r\n setFormData({\r\n ...formData,\r\n password: {...formData.password, value: ''},\r\n confirmPassword: {...formData.confirmPassword, value: ''},\r\n });\r\n dispatch({\r\n type: SYSTEM_HANDLE_FORCE_CHECK_VALIDATION,\r\n payload: {\r\n forceCheckValidation: true\r\n },\r\n });\r\n };\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {/* \r\n */}\r\n
\r\n );\r\n}\r\n","import React, { useEffect, useState } from 'react';\r\nimport TextSubHeader from 'components/CustomText/TextSubHeader';\r\nimport styled from 'styled-components';\r\n\r\n// const useStyles = makeStyles((theme) => ({\r\n// root: {\r\n// marginTop: theme.spacing(4),\r\n// },\r\n// container: {\r\n// border: '1px solid #ddd',\r\n// paddingLeft: theme.spacing(2),\r\n// paddingRight: theme.spacing(2),\r\n// marginTop: theme.spacing(2),\r\n// },\r\n// title: {\r\n// marginRight: theme.spacing(4),\r\n// fontWeight: 'bold',\r\n// },\r\n// item: {\r\n// paddingTop: theme.spacing(1),\r\n// paddingBottom: theme.spacing(1),\r\n// },\r\n// content: {\r\n// paddingTop: theme.spacing(1),\r\n// paddingBottom: theme.spacing(1),\r\n// paddingRight: theme.spacing(8),\r\n// },\r\n// diver: {\r\n// width: '100%',\r\n// },\r\n// number: {\r\n// width: '50px',\r\n// height: '30px',\r\n// },\r\n// }));\r\n\r\nconst SContainer = styled.div`\r\n border-radius: 5px;\r\n border: 1px solid #dcdcdc;\r\n margin-top: 10px;\r\n`;\r\n\r\nconst SRow = styled.div`\r\n display: flex;\r\n padding: 8px;\r\n justify-content: space-between;\r\n`;\r\n\r\nconst SItem = styled.div`\r\n display: flex;\r\n width: 30%;\r\n justify-content: space-between;\r\n align-items: center;\r\n`;\r\n\r\nconst SCount = styled.div`\r\n border-radius: 15px;\r\n background: #3f51b5;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n color: #fff;\r\n width: 50px;\r\n padding: 5px 0px;\r\n`;\r\n\r\nconst SDivider = styled.div`\r\n height: 1px;\r\n background: #dcdcdc;\r\n width: 100%;\r\n`;\r\n\r\nconst PanelMemberComposition = ({ memberComposition = [] }) => {\r\n // const classes = useStyles();\r\n const [list, setList] = useState({\r\n member: 0,\r\n female: 0,\r\n male: 0,\r\n scientificMember: 0,\r\n nonScientificMember: 0,\r\n independentMember: 0,\r\n });\r\n\r\n useEffect(() => {\r\n let data = {\r\n member: memberComposition.length,\r\n female: 0,\r\n male: 0,\r\n scientificMember: 0,\r\n nonScientificMember: 0,\r\n independentMember: 0,\r\n };\r\n memberComposition.forEach((element) => {\r\n // data.female=element.gender==='F'?++data.female\r\n if (element.gender === 'F' || element.gender === 'Female') data.female += 1;\r\n if (element.gender === 'M') data.male += 1;\r\n if (element.background === 'Scientific') data.scientificMember += 1;\r\n if (element.background === 'Non-Scientific') data.nonScientificMember += 1;\r\n if (element.independent?.toString() === '1') data.independentMember += 1;\r\n });\r\n setList(data);\r\n }, [memberComposition]);\r\n\r\n return (\r\n Meeting Case:
\r\n \r\n {\r\n handleChangeValue('handleChangeValue', e.target.value);\r\n console.log('e.target.value: ', e.target.value);\r\n setCaseSelection(e.target.value);\r\n }}\r\n choices={MeetingCaseChoices}\r\n label=\"Meeting ID\"\r\n isRequired\r\n forceErrorDisplay={forceErrorDisplay}\r\n />\r\n
\r\n Type of Review:
\r\n \r\n {isEditMode ? (\r\n handleChangeValue('typeOfReview', e.target.value)}\r\n choices={typeOfReview}\r\n label=\"Type of Review\"\r\n isRequired\r\n forceErrorDisplay={forceErrorDisplay}\r\n />\r\n ) : (\r\n typeOfReview.find((item) => item.key === saveData.typeOfReview)?.display || '-'\r\n )}\r\n
\r\n Review Due Date:
\r\n \r\n {isEditMode ? (\r\n handleChangeValue('reviewDueDate', new Date(date))}\r\n />\r\n ) : saveData.reviewDueDate ? (\r\n moment(saveData.reviewDueDate).format('YYYY-MM-DD')\r\n ) : (\r\n '-'\r\n )}\r\n
\r\n Review Meeting Date:
\r\n \r\n {isEditMode ? (\r\n handleChangeValue('reviewMeetingDate', new Date(date))}\r\n />\r\n ) : saveData.reviewMeetingDate ? (\r\n moment(saveData.reviewMeetingDate).format('YYYY-MM-DD')\r\n ) : (\r\n '-'\r\n )}\r\n
\r\n Review Circulation Date:
\r\n \r\n {isEditMode ? (\r\n handleChangeValue('reviewCirculationDate', new Date(date))}\r\n />\r\n ) : saveData.reviewCirculationDate ? (\r\n moment(saveData.reviewCirculationDate).format('YYYY-MM-DD')\r\n ) : (\r\n '-'\r\n )}\r\n
\r\n Review Panel:
\r\n \r\n {}}\r\n choices={[\r\n { key: '0', display: 'Panel 1' },\r\n { key: '1', display: 'Panel 2' },\r\n ]}\r\n placeholder={'Please choose your decision'}\r\n />\r\n
\r\n \r\n Panel Member Composition \r\n\r\n \r\n \r\n \r\n Members: \r\n {list.member} \r\n \r\n \r\n \r\n \r\n Female: \r\n {list.female} \r\n \r\n \r\n Male: \r\n {list.male} \r\n \r\n \r\n \r\n \r\n Scientific Member: \r\n {list.scientificMember} \r\n \r\n \r\n Non-Scientific Member: \r\n {list.nonScientificMember} \r\n \r\n \r\n Independent Member: \r\n {list.independentMember} \r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nexport default PanelMemberComposition;\r\n","import CustomButton from 'components/CustomInput/Button';\r\nimport { Checkbox } from '@material-ui/core';\r\nimport { cloneDeep } from 'lodash';\r\nimport { useEffect, useState } from 'react';\r\n\r\nconst useSearchMember = ({ selectedRows, setSelectedRows, meetingArrangementMemberList, isEditMode, specialList }) => {\r\n const [isDisabledAll, setIsDisabledAll] = useState(false);\r\n\r\n const checkedAll = () => {\r\n let newSpecialList = cloneDeep(specialList);\r\n let newSelectedRows = cloneDeep(selectedRows);\r\n newSpecialList.forEach((item) => {\r\n let index = newSelectedRows.findIndex((ele) => ele.specialId === item.specialId);\r\n if (index >= 0) {\r\n if (!newSelectedRows[index].list.find((ele) => ele.id === item.panelNameId)) {\r\n newSelectedRows[index].list.push(...item.list);\r\n }\r\n } else {\r\n newSelectedRows.push(item);\r\n }\r\n });\r\n setSelectedRows(newSelectedRows);\r\n };\r\n\r\n const handleCheck = (value, id) => {\r\n if (!isEditMode) return;\r\n let newSelectedRows = [...selectedRows];\r\n newSelectedRows.forEach((item) => {\r\n if (id === item.id) {\r\n item.chairman = value;\r\n }\r\n });\r\n setSelectedRows(newSelectedRows);\r\n };\r\n\r\n const handleChecked = (row) => {\r\n let newSelectedRows = cloneDeep(selectedRows);\r\n let index = selectedRows.findIndex((item) => item.specialId === row.specialId);\r\n if (index >= 0) {\r\n newSelectedRows[index].list.push(...row.list);\r\n newSelectedRows[index].id = row.specialId;\r\n } else {\r\n newSelectedRows = [...newSelectedRows, { ...row, id: row.specialId }];\r\n }\r\n setSelectedRows(newSelectedRows);\r\n };\r\n\r\n useEffect(() => {\r\n let isDisabled = true;\r\n let newSpecialList = cloneDeep(specialList);\r\n if (selectedRows.length === 0) {\r\n setIsDisabledAll(false);\r\n return;\r\n }\r\n newSpecialList.forEach((item) => {\r\n if (!selectedRows.find((ele) => ele.specialId === item.specialId)) {\r\n isDisabled = false;\r\n return;\r\n } else {\r\n selectedRows.forEach((el) => {\r\n if (\r\n el.specialId === item.specialId &&\r\n !el.list.find((ele) => ele.id === item.panelNameId) &&\r\n el.list.length > 0\r\n ) {\r\n isDisabled = false;\r\n return;\r\n }\r\n });\r\n }\r\n });\r\n setIsDisabledAll(isDisabled);\r\n }, [selectedRows, specialList]);\r\n\r\n const gender = (type) => {\r\n let gender = type || '-';\r\n switch (type) {\r\n case 'M':\r\n gender = 'Male';\r\n break;\r\n case 'F':\r\n gender = 'Female';\r\n break;\r\n default:\r\n break;\r\n }\r\n return gender;\r\n };\r\n\r\n // const fetchMember = (key, isDesc) => {\r\n // console.log('%c 154532 useSearchMember.js key, isDesc', 'background: green', key, isDesc);\r\n\r\n // dispatch({\r\n // type: GET_MEETING_ARRANGEMENT_MEMBER_LIST,\r\n // payload: {\r\n // params: {},\r\n // callback: () => {\r\n // // setIsMemberLoading(false);\r\n // // setIsSeach(params);\r\n // },\r\n // },\r\n // });\r\n // };\r\n\r\n const columns = [\r\n {\r\n field: 'action',\r\n headerName: (\r\n \r\n \r\n {' '}\r\n Add All\r\n \r\n
\r\n ),\r\n disableItemSort: true,\r\n valueGetter: (params) => {\r\n let isExist = true;\r\n if (params.row.list.length === 0) {\r\n isExist = selectedRows.some((item) => item.specialId === params.row.specialId);\r\n } else {\r\n isExist = selectedRows.some(\r\n (item) =>\r\n item.specialId === params.row.specialId &&\r\n item.list.find((ele) => ele.id === params.row.list[0]?.id),\r\n );\r\n }\r\n return (\r\n \r\n Showing {total ? ((page - 1) * pageSize + 1) : 0} to {getCurrentPageRange()} of {total} entries\r\n
\r\n \r\n setOpenPopup(false)}\r\n >\r\n Added Member: \r\n
\r\n \r\n \r\n \r\n Search Panel Member: \r\n
\r\n \r\n \r\n \r\n \r\n {\r\n setSearchCriteria({ ...searchCriteria, page: 1, pageSize });\r\n getReviewPanelMemberList({ ...searchCriteria, page: 1, pageSize });\r\n }}\r\n />\r\n \r\n {\r\n setSearchCriteria({ ...searchCriteria, page: 1 });\r\n getReviewPanelMemberList({ ...searchCriteria, page: 1 });\r\n }}\r\n >\r\n Search\r\n \r\n \r\n Reset\r\n \r\n
\r\n \r\n {\r\n setSearchCriteria({ ...searchCriteria, paramKey: e.target.value, page: 1 });\r\n getReviewPanelMemberList({\r\n ...searchCriteria,\r\n paramKey: e.target.value,\r\n page: 1,\r\n });\r\n }}\r\n choices={listOfCriteria}\r\n />\r\n
\r\n \r\n \r\n setSearchCriteria({ ...searchCriteria, paramValue: e.target.value })\r\n }\r\n onPressEnter={() => {\r\n setSearchCriteria({ ...searchCriteria, page: 1 });\r\n getReviewPanelMemberList({ ...searchCriteria, page: 1 });\r\n }}\r\n />\r\n
\r\n \r\n
\r\n \r\n {\r\n setSearchCriteria({ ...searchCriteria, page });\r\n getReviewPanelMemberList({ ...searchCriteria, page });\r\n }}\r\n />\r\n
\r\n\r\n \r\n\r\n \r\n deleteSelectedRow(item)}\r\n skipMaxHeight={false}\r\n maxHeight={280}\r\n />\r\n
\r\n \r\n Panel Member: \r\n {isEditMode && (\r\n setOpenPopup(true)}>\r\n Add\r\n \r\n )}\r\n
\r\n\r\n \r\n deleteSelectedRow(item, true)}\r\n columns={currentColumns}\r\n rows={selectedList}\r\n allowResize\r\n fullWidthTable={true}\r\n />\r\n
\r\n \r\n );\r\n};\r\n\r\nexport default AddPanelMemberDialog;\r\n","import React, { useEffect, useRef, useState } from 'react';\r\nimport { Paper, Checkbox } from '@material-ui/core';\r\nimport { useHistory } from 'react-router';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { setGlobalLoading } from 'store/global/reducer';\r\nimport styled from 'styled-components';\r\nimport api from 'api/call';\r\nimport useDialog from 'components/ConfirmDialog/useDialog';\r\nimport { GET_MEETING_ARRANGEMENT_FORM_DETAIL } from 'store/key';\r\nimport TextFieldContainer from './components/TextFieldContainer';\r\nimport PanelMemberComposition from './components/PanelMemberComposition';\r\nimport AddPanelMemberDialog from './AddPanelMemberDialog';\r\nimport TextHeader from 'components/CustomText/TextHeader';\r\n\r\nconst SHeaderLayout = styled.div`\r\n height: 55px;\r\n display: flex;\r\n padding: 0px 15px;\r\n align-items: center;\r\n background: #ecebf3;\r\n overflow: 'hidden';\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n right: 0;\r\n`;\r\n\r\nconst SLayout = styled.div`\r\n padding: 10px;\r\n position: absolute;\r\n left: 0px;\r\n right: 0px;\r\n top: ${(props) => props.positionTop}px;\r\n overflow: auto;\r\n bottom: 5px;\r\n`;\r\n\r\n// applicationDetail = {} means team member form is creating without previous data\r\nconst MeetingArrangement = (props) => {\r\n const history = useHistory();\r\n const dispatch = useDispatch();\r\n const showDialog = useDialog();\r\n const meetingCase = props.meetingCase;\r\n const [saveData, setSaveData] = useState({\r\n applicationList: [],\r\n panelMemberList: [],\r\n\r\n notSendNotification: false,\r\n typeOfReview: null,\r\n reviewDueDate: null,\r\n reviewMeetingDate: null,\r\n reviewCirculationDate: null,\r\n });\r\n const [caseSelection, setCaseSelection] = useState(0);\r\n const [forceErrorDisplay, setForceErrorDisplay] = useState(false);\r\n\r\n useEffect(() => {\r\n let id = meetingCase[caseSelection];\r\n console.log('id: ', id);\r\n if (id) {\r\n dispatch({\r\n type: GET_MEETING_ARRANGEMENT_FORM_DETAIL,\r\n payload: {\r\n params: { id },\r\n callback: (res) => {\r\n setSaveData({\r\n ...saveData,\r\n ...res,\r\n applicationList: res?.meetingArrangementFormDocument || [],\r\n panelMemberList: res?.meetingArrangementFormMember || [],\r\n meetingCase: meetingCase,\r\n caseSelection: caseSelection,\r\n });\r\n },\r\n },\r\n });\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [caseSelection]);\r\n\r\n // const isEditMode = id === undefined;\r\n const isEditMode = false;\r\n const handleConfirm = () => {\r\n if (saveData.typeOfReview === null) {\r\n setForceErrorDisplay(true);\r\n return;\r\n }\r\n\r\n let data = { ...saveData, meetingArrangementDocument: [], meetingArrangementMember: [] };\r\n delete data.applicationList;\r\n delete data.panelMemberList;\r\n data.meetingArrangementDocument = saveData.applicationList.reduce(\r\n (group, curP) =>\r\n group.concat({\r\n documentType: curP.documentType,\r\n documentId: curP.documentId,\r\n refNo: curP.refNo,\r\n confirmedDate: curP.confirmDate,\r\n }),\r\n [],\r\n );\r\n saveData.panelMemberList.forEach((ele) => {\r\n data.meetingArrangementMember.push({\r\n userId: ele.id,\r\n // isChairman: ele.chairman || false,\r\n panelId: ele?.list?.reduce((group, curP) => group.concat(curP.id), []) || [],\r\n });\r\n });\r\n if (data.meetingArrangementDocument.length === 0) {\r\n showDialog({\r\n description: NO_APPLICATION_DATA,\r\n disableCancelButton: true,\r\n });\r\n return;\r\n }\r\n // if (\r\n // data.meetingArrangementMember.length > 0 &&\r\n // !data.meetingArrangementMember.find((item) => item.isChairman)\r\n // ) {\r\n // showDialog({\r\n // description: NO_CHAIRMAN,\r\n // disableCancelButton: true,\r\n // });\r\n // return;\r\n // }\r\n // console.log(data)\r\n dispatch({\r\n type: ADD_MEETING_ARRANGEMENT_FORM,\r\n payload: {\r\n data,\r\n callback: () => {\r\n showDialog({\r\n description: CREATED_ARRANGE_MEETING,\r\n disableCancelButton: true,\r\n });\r\n history.goBack();\r\n },\r\n },\r\n });\r\n };\r\n const reset = () => {\r\n setSaveData({\r\n applicationList: [],\r\n panelMemberList: [],\r\n notSendNotification: false,\r\n typeOfReview: null,\r\n reviewDueDate: null,\r\n reviewMeetingDate: null,\r\n reviewCirculationDate: null,\r\n });\r\n };\r\n const handleSave = (data) => {\r\n setSaveData({ ...saveData, ...data });\r\n };\r\n\r\n return (\r\n \r\n Meeting Arrangement \r\n \r\n {currentApplication?.appNo && (\r\n CRER Application No: {currentApplication.appNo} \r\n )}\r\n \r\n \r\n \r\n \r\n\r\n \r\n
\r\n \r\n );\r\n })}\r\n\r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nexport default MeetingArrangement;\r\n","export default __webpack_public_path__ + \"static/media/logo.921fb4fd.jpg\";","const { useSelector } = require('react-redux');\r\n\r\nconst useCurrentApplication = ({ id }) => {\r\n const detail = useSelector((state) => state.applicationDetail);\r\n const currentApplication = detail?.[id]?.applicationForm;\r\n\r\n if (!currentApplication) {\r\n console.error('no application is found');\r\n }\r\n\r\n return currentApplication;\r\n};\r\n\r\nexport default useCurrentApplication;\r\n","import { Checkbox, Divider, Grid, Paper } from '@material-ui/core';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport React, { useEffect, useState } from 'react';\r\nimport logo from 'assets/images/logo.jpg';\r\nimport styled from 'styled-components';\r\nimport TextHeader from 'components/CustomText/TextHeader';\r\nimport TextSubHeader from 'components/CustomText/TextSubHeader';\r\nimport CustomTextField from 'components/Input/CustomTextField';\r\nimport useCurrentApplication from 'hooks/useCurrentApplication';\r\nimport { UPDATE_FORM_VALIDITY } from 'store/key';\r\nimport { useDispatch } from 'react-redux';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n paperMargin: {\r\n margin: 10,\r\n },\r\n gridPadding: {\r\n padding: 10,\r\n },\r\n loginLogo: {\r\n objectFit: 'contain',\r\n height: 120,\r\n },\r\n}));\r\n\r\nconst SLayout = styled.div`\r\n font-size: 13px;\r\n`;\r\n\r\nconst SAppNumberLayout = styled.div`\r\n position: absolute;\r\n top: 20px;\r\n right: 20px;\r\n font-size: 16px;\r\n`;\r\n\r\nfunction InstructionFormLayout({ type, defaultData, onFormUpdate = () => null, formId, disableOnPermission = false }) {\r\n const classes = useStyles();\r\n const [postData, setPostData] = useState({});\r\n const dispatch = useDispatch();\r\n\r\n const currentApplication = useCurrentApplication({ id: formId });\r\n\r\n useEffect(() => {\r\n dispatch({\r\n type: UPDATE_FORM_VALIDITY,\r\n payload: {\r\n type: 'study',\r\n applicationFormId: formId,\r\n formKey: 'instruction',\r\n isValid: getData('acknowledgment'),\r\n },\r\n });\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [defaultData]);\r\n\r\n const getData = (key) => {\r\n return postData[key] ?? defaultData[key];\r\n };\r\n\r\n const onFieldChange = (e) => {\r\n const { checked } = e.target;\r\n\r\n setPostData((prevData) => {\r\n return {\r\n ...prevData,\r\n acknowledgment: checked,\r\n };\r\n });\r\n\r\n onFormUpdate('acknowledgment', checked);\r\n\r\n dispatch({\r\n type: UPDATE_FORM_VALIDITY,\r\n payload: {\r\n type: 'study',\r\n applicationFormId: formId,\r\n formKey: 'instruction',\r\n isValid: checked,\r\n },\r\n });\r\n };\r\n\r\n const Instructions = [\r\n 'Central Institutional Review Board / Cluster Research Ethics Committee/Institutional Review Board (“CIRB/CREC/IRB”) is dedicated to oversee clinical studies conducted by Hospital Authority (\"HA\")/University personnel in the Cluster with the aim of protecting the rights, safety and well-being of the human subjects recruited for the studies. The Applicant / Principal Investigator must be designated to take the final responsibility for protecting the rights, safety and well-being of subjects recruited from the Cluster.',\r\n 'Please submit the application via online system, enter all information required and upload relevant application dossier files to the required fields.',\r\n // 'This form is only fully functional with Microsoft Silverlight. This form can only support retrieval of the following attachments - [1] Common Image files, [2] HTML and XML files, [3] Media files, [4] Microsoft Office files (except .mdb files), [5] PDF files, [6] Text files.',\r\n // 'This Form does not support certain symbol and text format adjustment. For example, enter text “beta” instead of symbol “β” or copy and paste “β” from another source, and use symbol ^ to indicate “power”, e.g. 4x10^3 instead of 4x10³.',\r\n 'Research protocol, investigator brochures, consent forms, and written materials to subjects must be uniquely identified, for example, by Application Reference Number, document numbers, version numbers and dates.',\r\n `For information on research ethics and methodology, please visit HA Research Ethics Intranet Website (http://cetm.home/ces/re/Home.aspx)`,\r\n 'The handling and storage for data containing personal identity must comply with HA Clinical Data Policy Manual and other prevailing HA policies and university policies if applicable.',\r\n `Selected information will be passed to the HA's and University's Central Register of Clinical Research for the purpose of central record and risk management.`,\r\n 'Information will be passed to corresponding Central IRB / CREC/IRB for the purpose of research ethics review. ',\r\n ];\r\n\r\n const Reminder = [\r\n {\r\n title: 'Hospital Authority as a Research Institution',\r\n content:\r\n 'The HA is a body corporate established under the Hospital Authority Ordinance (Chapter 113 of the laws of Hong Kong). In addition to the primary responsibilities of establishing, managing, controlling and developing the public hospital system in Hong Kong and advising the Hong Kong government on healthcare policies and strategies, the HA also has the responsibility to promote, assist and take part in research relating to hospital services (Chapter 113, Section 4(f) (ii) of the laws of Hong Kong).',\r\n },\r\n {\r\n title: 'Local Regulation on Clinical Studies of Pharmaceutical Products',\r\n content:\r\n 'Clinical studies of pharmaceutical products are regulated in Hong Kong under the Pharmacy and Poisons Regulations (Chapter 138A Regulation 36B of the laws of Hong Kong). For the purpose of regulatory compliance, a Certificate for Clinical Trial (\"CTC\") shall be obtained before initiation of clinical study of pharmaceutical product. ',\r\n },\r\n {\r\n title: 'Acceptance of Sponsorship for Clinical Research',\r\n content:\r\n 'The HA is a statutory independent organization funded by public revenue and has a set of policies and guidelines on acceptance of sponsorship in order to manage and avoid possible conflict of interest situations. Please take note of the “Key Points to Note for Acceptance of Sponsorship” if sponsorship to the clinical research is expected. ',\r\n },\r\n ];\r\n\r\n return (\r\n \r\n {/*
\r\n */}\r\n setCaseSelection(value)}\r\n />\r\n
\r\n \r\n
\r\n {(saveData.typeOfReview === 0 || saveData.typeOfReview === 1) && (\r\n \r\n
\r\n \r\n \r\n setSaveData({ ...saveData, notSendNotification: e.target.checked })\r\n }\r\n disabled={!isEditMode}\r\n />\r\n
\r\n \r\n Do not send notification and email to all reviewers\r\n
\r\n \r\n
\r\n )}\r\n \r\n 
\r\n
\r\n \r\n Hospital Authority \r\n \r\n Clinical Research Ethics Review Application Form\r\n \r\n
\r\n \r\n Instructions to applicant \r\n
\r\n {Instructions.map((item, idex) => {\r\n return (\r\n \r\n {idex + 1}.\r\n
\r\n \r\n Reminder \r\n
\r\n {Reminder.map((item, idex) => {\r\n return (\r\n {idex + 1}.
\r\n \r\n {item.title} \r\n
\r\n \r\n );\r\n })}\r\n \r\n\r\n {item.content}
\r\n \r\n
\r\n \r\n \r\n
\r\n Acknowledgement of instructions and reminder
\r\n \r\n {item.label}\r\n {item.labelTooltip &&
\r\n HA Staff (Including HA Honorary staff)
\r\n \r\n
\r\n University Staff
\r\n Student
\r\n \r\n
\r\n \r\n
\r\n CV:
\r\n \r\n updateSiteValidation('cvFileName', isValid)}\r\n files={\r\n getData('cvFileName')\r\n ? [{ name: getData('cvFileName'), downloadId: siteInfoId }]\r\n : []\r\n }\r\n enableRemove={!!getData('cvFileName')}\r\n onRemove={onCVFileRemove}\r\n />\r\n
\r\n \r\n {\r\n // clear the input form\r\n onClose();\r\n }}\r\n width={500}\r\n onConfirm={() => {\r\n const isValid = Object.values(validation).every((item) => item);\r\n\r\n if (!isValid) {\r\n setForceErrorDisplay(true);\r\n return;\r\n }\r\n\r\n onSubmit();\r\n }}\r\n >\r\n {Object.values(defaultFormList)?.map((item, index) => {\r\n if (item.type === 'subTitle') {\r\n return (\r\n
\r\n );\r\n }\r\n\r\n return (\r\n \r\n \r\n {item.name}\r\n
\r\n \r\n
\r\n );\r\n })}\r\n \r\n \r\n );\r\n};\r\n\r\nexport default TableDialog;\r\n","import React, { useEffect, useState } from 'react';\r\nimport { Paper, Grid } from '@material-ui/core';\r\nimport TextHeader from 'components/CustomText/TextHeader';\r\nimport styled from 'styled-components';\r\nimport NumberListFormItem from './NumberListFormItem';\r\nimport CustomTextField from 'components/Input/CustomTextField';\r\nimport CustomTable from 'components/CustomTable';\r\nimport CustomButton from 'components/CustomInput/Button';\r\nimport PopupInput from 'components/Application/TeamMemberForm/PopupInput';\r\nimport useStudySiteOutOfWithHAData from 'hooks/tableData/useStudySiteOutOfWithHAData';\r\nimport useApplyingSiteData from 'hooks/tableData/useApplyingSiteData';\r\nimport useCollaboratingSiteData from 'hooks/tableData/useCollaboratingSiteData';\r\nimport CustomDatePicker from 'components/Input/CustomDatePicker';\r\nimport { addRemoveRequest, initializeTableData, produce, isHighlight as isHL } from 'utility/general';\r\nimport CustomOutlineSelect from 'components/Input/CustomOutlineSelect';\r\nimport DataListener from './DataListener';\r\nimport TableDialog from './TableDialog';\r\nimport { useSelector } from 'react-redux';\r\nimport { useDispatch } from 'react-redux';\r\nimport { SET_SITE_VALIDATION, SET_STUDY_VALIDATION, UPDATE_FORM_VALIDITY } from 'store/key';\r\nimport { getStore } from 'store';\r\nimport { APPLICANT, DRAFT, RETURNED } from 'utility/lookup';\r\n\r\nconst SPaperLayout = styled.div`\r\n padding: 10px;\r\n`;\r\n\r\nconst SLayout = styled.div`\r\n padding: 10px;\r\n`;\r\n\r\nfunction OutlineOfApplicationFormLayout({\r\n tabType,\r\n defaultData = {},\r\n formId = -1,\r\n siteInfoId,\r\n disableOnPermission = false,\r\n onFormUpdate = (key, formPostData) => null,\r\n onTableUpdate = (tableKey, tableData) => null,\r\n applicationDetail,\r\n applicationCreateDtm,\r\n isAmendmentCreate,\r\n isAmendmentEdit,\r\n}) {\r\n const [postData, setPostData] = useState({});\r\n const [studyInfoValidation, setStudyInfoValidation] = useState({});\r\n const [siteInfoValidation, setSiteInfoValidation] = useState({});\r\n const user = useSelector((state) => state.user);\r\n const { statusId } = applicationDetail.status;\r\n\r\n const isAmendment = isAmendmentCreate || isAmendmentEdit;\r\n\r\n const validationKey = 'outlineOfApplication';\r\n\r\n const isStudyValid = useSelector(\r\n (state) => state.applicationDetailValid.isApplicationFormDetailValid?.[validationKey],\r\n );\r\n\r\n const isSiteValid = useSelector(\r\n (state) => state.applicationDetailValid.siteInfoValid?.[siteInfoId]?.[validationKey],\r\n );\r\n\r\n const isConductInPostData = useSelector(\r\n (state) => state.applicationDetailPostData?.postData?.applicationForm?.p1ConductedHa,\r\n );\r\n\r\n const dispatch = useDispatch();\r\n\r\n // update study-info validity to the reducer\r\n useEffect(() => {\r\n const validations = Object.values(studyInfoValidation);\r\n\r\n // data is not initialized\r\n if (validations.length === 0) {\r\n return;\r\n }\r\n\r\n const currentStatus = validations.every((item) => item);\r\n\r\n if (currentStatus !== isStudyValid) {\r\n dispatch({\r\n type: UPDATE_FORM_VALIDITY,\r\n payload: {\r\n type: 'study',\r\n applicationFormId: formId,\r\n formKey: validationKey,\r\n isValid: currentStatus,\r\n },\r\n });\r\n }\r\n\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [studyInfoValidation]);\r\n\r\n // update site-info validity to the reducer\r\n useEffect(() => {\r\n const validations = Object.values(siteInfoValidation);\r\n\r\n // data is not initialized\r\n if (validations.length === 0) {\r\n return;\r\n }\r\n\r\n const currentStatus = validations.every((item) => item);\r\n\r\n if (currentStatus !== isSiteValid) {\r\n dispatch({\r\n type: UPDATE_FORM_VALIDITY,\r\n payload: {\r\n type: 'site',\r\n applicationFormId: formId,\r\n siteInfoId: siteInfoId,\r\n formKey: validationKey,\r\n isValid: currentStatus,\r\n },\r\n });\r\n }\r\n\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [siteInfoValidation]);\r\n\r\n const updateStudyValidation = (name, isValidate) => {\r\n setStudyInfoValidation(\r\n produce((draft) => {\r\n if (name === 'p1ProposedStartDate' && isAmendment) {\r\n draft[name] = true;\r\n } else {\r\n draft[name] = isValidate;\r\n }\r\n }),\r\n );\r\n };\r\n\r\n const updateSiteValidation = (name, isValidate) => {\r\n setSiteInfoValidation(\r\n produce((draft) => {\r\n draft[name] = isValidate;\r\n }),\r\n );\r\n };\r\n\r\n // when siteInfoValidation change, update the reducer\r\n useEffect(() => {\r\n dispatch({\r\n type: SET_SITE_VALIDATION,\r\n payload: {\r\n siteInfoId,\r\n [validationKey]: siteInfoValidation,\r\n },\r\n });\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [siteInfoValidation]);\r\n\r\n // when studyInfoValidation change, update the reducer\r\n useEffect(() => {\r\n dispatch({\r\n type: SET_STUDY_VALIDATION,\r\n payload: {\r\n [validationKey]: studyInfoValidation,\r\n },\r\n });\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [studyInfoValidation]);\r\n\r\n const {\r\n openPopup: openApplyingSitePopup,\r\n setOpenPopup: setApplyingSiteOpenPopup,\r\n columns: applyingSiteColumns,\r\n rows: applyingSiteRows,\r\n setRows: applyingSiteSetRows,\r\n defaultFormList: defaultApplyingSiteFormList,\r\n handleRowCreate: handleApplyingSiteRowCreate,\r\n onRecordUpdate: handleApplyingSiteRecordUpdate,\r\n handleEditClick: handleApplyingSiteEditClick,\r\n handleDelete: handleApplyingSiteDelete,\r\n onEditSubmit: onEditApplyingSiteSubmit,\r\n isEdit: isApplyingSiteEdit,\r\n emptyTableData: onApplyingSiteDataEmpty,\r\n recoverDataCreation: recoverApplyingSiteDataCreation,\r\n } = useApplyingSiteData({ formId, siteInfoId });\r\n\r\n const {\r\n openPopup: openCollaboratingSitePopup,\r\n setOpenPopup: setCollaboratingSiteOpenPopup,\r\n columns: collaboratingSiteColumns,\r\n rows: collaboratingSiteRows,\r\n setRows: setCollaboratingSiteRows,\r\n defaultFormList: defaultCollaboratingSiteFormList,\r\n handleRowCreate: handleCollaboratingSiteRowCreate,\r\n onRecordUpdate: handleCollaboratingSiteRecordUpdate,\r\n handleEditClick: handleCollaboratingSiteEditClick,\r\n handleDelete: handleCollaboratingSiteDelete,\r\n onEditSubmit: onEditCollaboratingSiteSubmit,\r\n onDataEmpty: onCollaboratingSiteDataEmpty,\r\n recoverDataCreation: recoverCollaboratingSiteDataCreation,\r\n isEdit: isCollaboratingSiteEdit,\r\n removeAllTempData: removeAllCollaboratingTempData,\r\n } = useCollaboratingSiteData({ formId });\r\n\r\n const {\r\n openPopup: openStudySiteWithHAPopup,\r\n setOpenPopup: setStudySiteWithHAOpenPopup,\r\n columns: studySiteWithHAColumns,\r\n rows: studySiteWithHARows,\r\n setRows: setStudySiteWithHARows,\r\n defaultFormList: defaultStudySiteWithHAFormList,\r\n selectedRow: selectedStudySiteWithHARow,\r\n handleRowCreate: handleStudySiteWithHARowCreate,\r\n onRecordUpdate: handleStudySiteWithHARecordUpdate,\r\n handleEditClick: handleStudySiteWithHAEditClick,\r\n handleDelete: handleStudySiteWithHADelete,\r\n onEditSubmit: onEditStudySiteWithHASubmit,\r\n removeAllTempData: removeAllStudySiteOutOfWithHATempData,\r\n onDataEmpty: onStudySiteOutOfWithHADataEmpty,\r\n recoverDataCreation: recoverStudySiteOutOfWithHADataCreation,\r\n } = useStudySiteOutOfWithHAData({ formId });\r\n\r\n // initialize the site-info postData if edit data exist\r\n useEffect(() => {\r\n if (tabType === 'hospital') {\r\n const newData = initializeTableData({\r\n tableKey: 'studySiteApply',\r\n currentTableData: applyingSiteRows,\r\n siteInfoId,\r\n });\r\n\r\n applyingSiteSetRows(newData);\r\n }\r\n\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n // initialize the study-info postData if edit data exist\r\n useEffect(() => {\r\n if (tabType === 'info') {\r\n const { applicationDetailPostData } = getStore().getState();\r\n const postData = applicationDetailPostData.postData?.applicationForm ?? {};\r\n setPostData(postData);\r\n\r\n const studySiteCollabData = initializeTableData({\r\n tableKey: 'studySiteCollab',\r\n currentTableData: collaboratingSiteRows,\r\n });\r\n\r\n setCollaboratingSiteRows(studySiteCollabData);\r\n\r\n const studySiteOutOfHAData = initializeTableData({\r\n tableKey: 'studySiteOutOfHA',\r\n currentTableData: studySiteWithHARows,\r\n });\r\n\r\n setStudySiteWithHARows(studySiteOutOfHAData);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n checkSiteFormValid();\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [tabType]);\r\n\r\n const shouldDisplayTips = () => {\r\n if ((statusId === DRAFT || statusId === RETURNED) && user.role === APPLICANT) {\r\n // if (statusId === DRAFT && user.role === APPLICANT) {\r\n return true;\r\n }\r\n\r\n return false;\r\n };\r\n\r\n const checkSiteFormValid = () => {\r\n if (tabType === 'hospital') {\r\n const isValid = true;\r\n\r\n if (isValid) {\r\n dispatch({\r\n type: UPDATE_FORM_VALIDITY,\r\n payload: {\r\n type: 'site',\r\n applicationFormId: formId,\r\n siteInfoId: siteInfoId,\r\n formKey: validationKey,\r\n isValid: true,\r\n },\r\n });\r\n }\r\n }\r\n };\r\n\r\n const isConduct = () => {\r\n const valueOfApplication = applicationDetail?.applicationForm?.p1ConductedHa;\r\n const valueOfPostData = isConductInPostData;\r\n\r\n if (valueOfPostData !== undefined && valueOfPostData !== null) {\r\n return valueOfPostData;\r\n } else {\r\n return !!valueOfApplication;\r\n }\r\n };\r\n\r\n const getData = (key) => {\r\n if (postData[key] === null) {\r\n return postData[key];\r\n }\r\n\r\n return postData[key] ?? defaultData[key];\r\n };\r\n\r\n const onFieldChange = (e) => {\r\n const { name, value } = e.target;\r\n\r\n setPostData((prevData) => {\r\n return {\r\n ...prevData,\r\n [name]: value,\r\n };\r\n });\r\n\r\n onFormUpdate(name, value);\r\n };\r\n\r\n const isHighlight = (keys, istable = false) => {\r\n return isHL(applicationDetail, siteInfoId, formId, tabType, keys, istable);\r\n };\r\n\r\n const updateAllSitesValidation = (isConduct) => {\r\n const sites = applicationDetail.siteInfo;\r\n\r\n if (isConduct) {\r\n // check table data, if no data exist, update site info validation\r\n sites.forEach((item) => {\r\n const siteInfoId = item.id;\r\n const hasTableDataExist = applicationDetail.studySiteApply.some((item) => item.id === siteInfoId);\r\n dispatch({\r\n type: UPDATE_FORM_VALIDITY,\r\n payload: {\r\n type: 'site',\r\n applicationFormId: formId,\r\n siteInfoId: siteInfoId,\r\n formKey: validationKey,\r\n isValid: hasTableDataExist,\r\n },\r\n });\r\n });\r\n } else {\r\n sites.forEach((item) => {\r\n const siteInfoId = item.id;\r\n\r\n dispatch({\r\n type: UPDATE_FORM_VALIDITY,\r\n payload: {\r\n type: 'site',\r\n applicationFormId: formId,\r\n siteInfoId: siteInfoId,\r\n formKey: validationKey,\r\n isValid: true,\r\n },\r\n });\r\n });\r\n }\r\n };\r\n\r\n return (\r\n {item.label}:
\r\n \r\n {\r\n setValidation(\r\n produce((draft) => {\r\n draft[item.name] = e;\r\n }),\r\n );\r\n }}\r\n forceErrorDisplay={forceErrorDisplay}\r\n item={item}\r\n handleFormData={(e) => {\r\n item?.onChange?.(e);\r\n }}\r\n />\r\n
\r\n \r\n {\r\n onFieldChange(e);\r\n onStudyDesignChanged(e);\r\n }}\r\n choices={[\r\n { key: 0, display: 'Case report/series' },\r\n { key: 1, display: 'Case-control study' },\r\n { key: 2, display: 'Cohort study (Compare different cohorts)' },\r\n { key: 3, display: 'Cross-sectional study' },\r\n { key: 4, display: 'Diagnostic test (correlation) study' },\r\n { key: 5, display: 'Non-randomized controlled trial' },\r\n { key: 6, display: 'Qualitative study' },\r\n { key: 7, display: 'Questionnaire survey' },\r\n { key: 8, display: 'Randomized controlled trial' },\r\n { key: 10, display: 'Registry' },\r\n { key: 9, display: 'Others' }\r\n ]}\r\n />\r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n {\r\n onMultipleCheckboxChange(\r\n 'p3InformConsentPrincipalInv',\r\n key,\r\n value,\r\n siteInfoId,\r\n );\r\n }}\r\n value={getP3InformConsentPrincipalInvValue()}\r\n />\r\n
\r\n \r\n \r\n ) : (\r\n <>\r\n \r\n {\r\n onMultipleCheckboxChange(\r\n 'p3InformConsentPrincipalInv',\r\n key,\r\n value,\r\n siteInfoId,\r\n );\r\n }}\r\n value={getP3InformConsentPrincipalInvValue()}\r\n />\r\n
\r\n \r\n\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n ),\r\n },\r\n });\r\n\r\n const getLabelName = (key) => {\r\n return defaultFormList[key]?.label ?? 'undefined';\r\n };\r\n\r\n const recoverDataCreation = async (item) => {\r\n // handle edited data recovery\r\n const updatedPostData = [];\r\n\r\n rows.forEach((item) => {\r\n const remoteDataObject = remoteData.find((remoteItem) => {\r\n return remoteItem.id === item.id;\r\n });\r\n\r\n if (remoteDataObject) {\r\n const isSame = Object.entries(item).every(([key, value]) => {\r\n // remove exception\r\n if (key === 'siteInfo' || key === 'applicationForm') {\r\n return true;\r\n }\r\n\r\n return remoteDataObject[key] === value;\r\n });\r\n\r\n if (!isSame) {\r\n /** delete type when type==='' */\r\n if (item.type === '') {\r\n // delete item.type;\r\n item.type = null;\r\n }\r\n updatedPostData.push(item);\r\n }\r\n }\r\n });\r\n\r\n const postData = rows.filter((row) => {\r\n const isDataCreation = row.id.toString().startsWith('temp_');\r\n\r\n if (!isDataCreation) {\r\n dispatch({\r\n type: REMOVE_DELETE_REQUEST,\r\n payload: {\r\n type: serverTableKey,\r\n id: row.id,\r\n applicationFormId: formId,\r\n },\r\n });\r\n }\r\n\r\n return isDataCreation;\r\n });\r\n\r\n dispatch({\r\n type: UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n payload: {\r\n type: serverTableKey,\r\n data: [...postData, ...updatedPostData],\r\n applicationFormId: formId,\r\n },\r\n });\r\n };\r\n\r\n const onDataEmpty = async (item) => {\r\n remoteData?.forEach((row) => {\r\n dispatch({\r\n type: ADD_DELETE_REQUEST,\r\n payload: {\r\n type: serverTableKey,\r\n id: row.id,\r\n applicationFormId: formId,\r\n },\r\n });\r\n });\r\n\r\n dispatch({\r\n type: UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n payload: {\r\n type: serverTableKey,\r\n data: [],\r\n applicationFormId: formId,\r\n },\r\n });\r\n };\r\n\r\n const handleEditClick = (row) => {\r\n setSelectedRow(row);\r\n setOpenPopup(true);\r\n };\r\n\r\n const handleRowCreate = async (id) => {\r\n setSelectedRow(null);\r\n setOpenPopup(true);\r\n };\r\n\r\n const handleDelete = async (row) => {\r\n setRows(\r\n produce((draft) => {\r\n const index = draft.findIndex((item) => {\r\n return item.id === row.id;\r\n });\r\n\r\n if (index !== -1) {\r\n draft.splice(index, 1);\r\n }\r\n }),\r\n );\r\n\r\n // skip if id starts with temp_, e.g. not exist in server\r\n if (row.id.toString().startsWith('temp_')) {\r\n let postData = updatePostData ?? [];\r\n\r\n const index = postData.findIndex((item) => {\r\n return item.id === row.id;\r\n });\r\n\r\n if (index !== -1) {\r\n postData.splice(index, 1);\r\n }\r\n\r\n dispatch({\r\n type: UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n payload: {\r\n type: serverTableKey,\r\n data: postData,\r\n applicationFormId: formId,\r\n },\r\n });\r\n\r\n return;\r\n }\r\n\r\n dispatch({\r\n type: ADD_DELETE_REQUEST,\r\n payload: {\r\n type: serverTableKey,\r\n id: row.id,\r\n applicationFormId: formId,\r\n },\r\n });\r\n };\r\n\r\n const onRecordUpdate = async (data) => {\r\n data.id = `temp_${generateRandomId()}`;\r\n const newRows = produce(rows, (draft) => {\r\n draft.push(data);\r\n });\r\n setRows(newRows);\r\n\r\n /** delete type when type==='' */\r\n if (data.type === '') {\r\n // delete data.type;\r\n data.type = null;\r\n }\r\n\r\n dispatch({\r\n type: UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n payload: {\r\n type: serverTableKey,\r\n data: [...(updatePostData ?? []), data],\r\n applicationFormId: formId,\r\n },\r\n });\r\n };\r\n\r\n const onEditSubmit = (row) => {\r\n let postData = updatePostData ?? [];\r\n\r\n const index = postData.findIndex((item) => {\r\n return item.id === row.id;\r\n });\r\n\r\n /** delete type when type==='' */\r\n if (row.type === '') {\r\n // delete row.type;\r\n row.type = null;\r\n }\r\n if (index === -1) {\r\n postData.push(row);\r\n } else {\r\n postData[index] = row;\r\n }\r\n\r\n dispatch({\r\n type: UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n payload: {\r\n type: serverTableKey,\r\n data: postData,\r\n applicationFormId: formId,\r\n },\r\n });\r\n\r\n //update local data\r\n setRows(\r\n produce((draft) => {\r\n const index = draft.findIndex((item) => {\r\n return item.id === row.id;\r\n });\r\n\r\n draft[index] = row;\r\n }),\r\n );\r\n };\r\n\r\n const [columns] = useState([\r\n {\r\n field: 'commercial',\r\n headerName: getLabelName('commercial'),\r\n width: 150,\r\n valueGetter: (params) => {\r\n if (params.value) {\r\n return 'Commercial';\r\n } else {\r\n return 'Non-commercial';\r\n }\r\n },\r\n },\r\n {\r\n field: 'type',\r\n headerName: getLabelName('type'),\r\n width: 150,\r\n valueGetter: (params) => {\r\n return getChoiceLabel('type', params.value);\r\n },\r\n },\r\n { field: 'name', headerName: getLabelName('name'), width: 200 },\r\n {\r\n field: 'ownership',\r\n headerName: getLabelName('ownership'),\r\n width: 150,\r\n tooltip: 'Does the aforementioned organization/party has ownership of the study data?',\r\n },\r\n {\r\n field: 'majorRight',\r\n headerName: getLabelName('majorRight'),\r\n width: 300,\r\n tooltip: (\r\n E.g.
\r\n - Intellectual property right
\r\n - Developing and manufacturing investigational product
\r\n - Designing the clinical study
\r\n - Developing the study protocol
\r\n - Quality management
\r\n - Data analysis
\r\n - Reporting
\r\n - Regulatory responsibility
\r\n - Legal responsibility
\r\n - Financing the study
\r\n \r\n
\r\n ),\r\n },\r\n ]);\r\n\r\n return {\r\n columns,\r\n rows,\r\n openPopup,\r\n setOpenPopup,\r\n defaultFormList,\r\n selectedRow,\r\n handleRowCreate,\r\n onRecordUpdate,\r\n handleEditClick,\r\n setRows,\r\n handleDelete,\r\n onEditSubmit,\r\n recoverDataCreation,\r\n onDataEmpty,\r\n removeAllTempData,\r\n };\r\n};\r\n\r\nexport default useSourceFundingData;\r\n","import usePrevious from 'hooks/usePrevious';\r\nimport { isEqual } from 'lodash';\r\nimport { useEffect, useState } from 'react';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { ADD_DELETE_REQUEST, UPDATE_APPLICATION_DETAIL_POST_DATA } from 'store/key';\r\nimport { generateRandomId, produce } from 'utility/general';\r\n\r\nconst useCollaboratingPartyData = ({ formId = -1, siteInfoId = -1 }) => {\r\n const [openPopup, setOpenPopup] = useState(false);\r\n const [selectedRow, setSelectedRow] = useState(null);\r\n\r\n const serverTableKey = 'collaborating';\r\n const remoteData = useSelector((state) => state.applicationDetail?.[formId]?.[serverTableKey]);\r\n const updatePostData = useSelector((state) => state.applicationDetailPostData.postData[serverTableKey]);\r\n const dispatch = useDispatch();\r\n const [rows, setRows] = useState(remoteData ?? []);\r\n const previousData = usePrevious(remoteData);\r\n\r\n // update row when remote data update\r\n useEffect(() => {\r\n if (!isEqual(previousData, remoteData)) {\r\n setRows(remoteData);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [remoteData]);\r\n\r\n const removeAllTempData = () => {\r\n setRows(\r\n rows.filter((item) => {\r\n return !item.id.toString().startsWith('temp_');\r\n }),\r\n );\r\n };\r\n\r\n const defaultFormList = {\r\n // number: {\r\n // value: '',\r\n // label: 'No.',\r\n // name: 'number',\r\n // type: 'input',\r\n // disabled: true,\r\n // // validators: ['isRequired'],\r\n // },\r\n name: {\r\n value: '',\r\n label: 'Name of organization / individual',\r\n name: 'name',\r\n type: 'input',\r\n validators: ['isRequired'],\r\n maxLength: 255,\r\n },\r\n };\r\n\r\n const handleEditClick = (row) => {\r\n setSelectedRow(row);\r\n setOpenPopup(true);\r\n };\r\n\r\n const handleRowCreate = async (id) => {\r\n setSelectedRow(null);\r\n setOpenPopup(true);\r\n };\r\n\r\n const handleDelete = async (row) => {\r\n setRows(\r\n produce((draft) => {\r\n const index = draft.findIndex((item) => {\r\n return item.id === row.id;\r\n });\r\n\r\n if (index !== -1) {\r\n draft.splice(index, 1);\r\n }\r\n }),\r\n );\r\n\r\n // skip if id starts with temp_, e.g. not exist in server\r\n if (row.id.toString().startsWith('temp_')) {\r\n let postData = updatePostData ?? [];\r\n\r\n const index = postData.findIndex((item) => {\r\n return item.id === row.id;\r\n });\r\n\r\n if (index !== -1) {\r\n postData.splice(index, 1);\r\n }\r\n\r\n dispatch({\r\n type: UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n payload: {\r\n type: serverTableKey,\r\n data: postData,\r\n applicationFormId: formId,\r\n },\r\n });\r\n\r\n return;\r\n }\r\n\r\n dispatch({\r\n type: ADD_DELETE_REQUEST,\r\n payload: {\r\n type: serverTableKey,\r\n id: row.id,\r\n siteInfoId,\r\n applicationFormId: formId,\r\n },\r\n });\r\n };\r\n\r\n const onRecordUpdate = async (data) => {\r\n data.id = `temp_${generateRandomId()}`;\r\n const newRows = produce(rows, (draft) => {\r\n draft.push(data);\r\n });\r\n setRows(newRows);\r\n dispatch({\r\n type: UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n payload: {\r\n type: serverTableKey,\r\n data: [...(updatePostData ?? []), data],\r\n applicationFormId: formId,\r\n },\r\n });\r\n };\r\n\r\n const onEditSubmit = (row) => {\r\n let postData = updatePostData ?? [];\r\n\r\n const index = postData.findIndex((item) => {\r\n return item.id === row.id;\r\n });\r\n\r\n if (index === -1) {\r\n postData.push(row);\r\n } else {\r\n postData[index] = row;\r\n }\r\n\r\n dispatch({\r\n type: UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n payload: {\r\n type: serverTableKey,\r\n data: postData,\r\n applicationFormId: formId,\r\n },\r\n });\r\n\r\n //update local data\r\n setRows(\r\n produce((draft) => {\r\n const index = draft.findIndex((item) => {\r\n return item.id === row.id;\r\n });\r\n\r\n draft[index] = row;\r\n }),\r\n );\r\n };\r\n\r\n const columns = [\r\n {\r\n field: 'id',\r\n headerName: 'No.',\r\n fixWidth: true,\r\n valueGetter: (params, index) => {\r\n // if (params.row.id.toString().startsWith('temp_')) {\r\n // return '-';\r\n // }\r\n\r\n return index + 1;\r\n },\r\n width: 80,\r\n },\r\n { field: 'name', headerName: 'Name of organization / individual', width: 400 },\r\n ];\r\n\r\n return {\r\n columns,\r\n rows,\r\n openPopup,\r\n setOpenPopup,\r\n defaultFormList,\r\n selectedRow,\r\n handleRowCreate,\r\n onRecordUpdate,\r\n handleEditClick,\r\n handleDelete,\r\n setRows,\r\n onEditSubmit,\r\n removeAllTempData,\r\n };\r\n};\r\n\r\nexport default useCollaboratingPartyData;\r\n","import usePrevious from 'hooks/usePrevious';\r\nimport { isEqual } from 'lodash';\r\nimport { useEffect, useState } from 'react';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { ADD_DELETE_REQUEST, REMOVE_DELETE_REQUEST, UPDATE_APPLICATION_DETAIL_POST_DATA } from 'store/key';\r\nimport { generateRandomId, produce } from 'utility/general';\r\n\r\nconst useNonMonetaryData = ({ formId = 1, siteInfoId = -1 }) => {\r\n const [openPopup, setOpenPopup] = useState(false);\r\n const [selectedRow, setSelectedRow] = useState(null);\r\n\r\n const serverTableKey = 'support';\r\n const remoteData = useSelector((state) => state.applicationDetail?.[formId]?.[serverTableKey]);\r\n const updatePostData = useSelector((state) => state.applicationDetailPostData.postData[serverTableKey]);\r\n const dispatch = useDispatch();\r\n const [rows, setRows] = useState(remoteData);\r\n const previousData = usePrevious(remoteData);\r\n\r\n // update row when remote data update\r\n useEffect(() => {\r\n if (!isEqual(previousData, remoteData)) {\r\n setRows(remoteData);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [remoteData]);\r\n\r\n const removeAllTempData = () => {\r\n setRows(\r\n rows.filter((item) => {\r\n return !item.id.toString().startsWith('temp_');\r\n }),\r\n );\r\n };\r\n\r\n const [choice] = useState({\r\n type: [\r\n { key: 0, label: 'Drug' },\r\n { key: 1, label: 'Consumable' },\r\n { key: 2, label: 'Equipment' },\r\n { key: 3, label: 'Research Assistant' },\r\n { key: 4, label: 'Others, please specify' },\r\n ],\r\n });\r\n\r\n const [defaultFormList] = useState({\r\n commercial: {\r\n value: '',\r\n label: 'Commercial / Non-commercial',\r\n name: 'commercial',\r\n type: 'boolean',\r\n trueValue: 'Commercial',\r\n falseValue: 'Non-commercial',\r\n isRequired: true,\r\n },\r\n type: {\r\n value: '',\r\n label: 'Type of Support',\r\n name: 'type',\r\n type: 'select',\r\n operators: choice['type'],\r\n validators: ['isRequired'],\r\n },\r\n name: {\r\n value: '',\r\n label: 'Name of organization / party',\r\n name: 'name',\r\n type: 'input',\r\n validators: ['isRequired'],\r\n maxLength: 255,\r\n },\r\n ownership: {\r\n value: '',\r\n label: 'Study data Ownership',\r\n name: 'ownership',\r\n type: 'boolean',\r\n isRequired: true,\r\n },\r\n });\r\n\r\n const getChoiceLabel = (type, key) => {\r\n return (\r\n choice[type]?.find((item) => {\r\n return item.key === key;\r\n })?.label ?? 'undefined'\r\n );\r\n };\r\n\r\n const handleEditClick = (row) => {\r\n setSelectedRow(row);\r\n setOpenPopup(true);\r\n };\r\n\r\n const handleRowCreate = async (id) => {\r\n setSelectedRow(null);\r\n setOpenPopup(true);\r\n };\r\n\r\n const onRecordUpdate = async (data) => {\r\n data.id = `temp_${generateRandomId()}`;\r\n\r\n const newRows = produce(rows, (draft) => {\r\n draft.push(data);\r\n });\r\n setRows(newRows);\r\n dispatch({\r\n type: UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n payload: {\r\n type: serverTableKey,\r\n data: [...(updatePostData ?? []), data],\r\n applicationFormId: formId,\r\n },\r\n });\r\n };\r\n\r\n const onEditSubmit = (row) => {\r\n let postData = updatePostData ?? [];\r\n\r\n const index = postData.findIndex((item) => {\r\n return item.id === row.id;\r\n });\r\n\r\n if (index === -1) {\r\n postData.push(row);\r\n } else {\r\n postData[index] = row;\r\n }\r\n\r\n dispatch({\r\n type: UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n payload: {\r\n type: serverTableKey,\r\n data: postData,\r\n applicationFormId: formId,\r\n },\r\n });\r\n\r\n //update local data\r\n setRows(\r\n produce((draft) => {\r\n const index = draft.findIndex((item) => {\r\n return item.id === row.id;\r\n });\r\n\r\n draft[index] = row;\r\n }),\r\n );\r\n };\r\n\r\n const recoverDataCreation = async (item) => {\r\n // handle edited data recovery\r\n const updatedPostData = [];\r\n\r\n rows.forEach((item) => {\r\n const remoteDataObject = remoteData.find((remoteItem) => {\r\n return remoteItem.id === item.id;\r\n });\r\n\r\n if (remoteDataObject) {\r\n const isSame = Object.entries(item).every(([key, value]) => {\r\n // remove exception\r\n if (key === 'siteInfo' || key === 'applicationForm') {\r\n return true;\r\n }\r\n\r\n return remoteDataObject[key] === value;\r\n });\r\n\r\n if (!isSame) {\r\n updatedPostData.push(item);\r\n }\r\n }\r\n });\r\n\r\n const postData = rows.filter((row) => {\r\n const isDataCreation = row.id.toString().startsWith('temp_');\r\n\r\n if (!isDataCreation) {\r\n dispatch({\r\n type: REMOVE_DELETE_REQUEST,\r\n payload: {\r\n type: serverTableKey,\r\n id: row.id,\r\n applicationFormId: formId,\r\n },\r\n });\r\n }\r\n\r\n return isDataCreation;\r\n });\r\n\r\n dispatch({\r\n type: UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n payload: {\r\n type: serverTableKey,\r\n data: [...postData, ...updatedPostData],\r\n applicationFormId: formId,\r\n },\r\n });\r\n };\r\n\r\n const onDataEmpty = async (item) => {\r\n remoteData?.forEach((row) => {\r\n dispatch({\r\n type: ADD_DELETE_REQUEST,\r\n payload: {\r\n type: serverTableKey,\r\n id: row.id,\r\n siteInfoId,\r\n applicationFormId: formId,\r\n },\r\n });\r\n });\r\n\r\n dispatch({\r\n type: UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n payload: {\r\n type: serverTableKey,\r\n data: [],\r\n applicationFormId: formId,\r\n },\r\n });\r\n };\r\n\r\n const handleDelete = async (row) => {\r\n setRows(\r\n produce((draft) => {\r\n const index = draft.findIndex((item) => {\r\n return item.id === row.id;\r\n });\r\n\r\n if (index !== -1) {\r\n draft.splice(index, 1);\r\n }\r\n }),\r\n );\r\n\r\n // skip if id starts with temp_, e.g. not exist in server\r\n if (row.id.toString().startsWith('temp_')) {\r\n let postData = updatePostData ?? [];\r\n\r\n const index = postData.findIndex((item) => {\r\n return item.id === row.id;\r\n });\r\n\r\n if (index !== -1) {\r\n postData.splice(index, 1);\r\n }\r\n\r\n dispatch({\r\n type: UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n payload: {\r\n type: serverTableKey,\r\n data: postData,\r\n applicationFormId: formId,\r\n },\r\n });\r\n\r\n return;\r\n }\r\n\r\n dispatch({\r\n type: ADD_DELETE_REQUEST,\r\n payload: {\r\n type: serverTableKey,\r\n id: row.id,\r\n siteInfoId,\r\n applicationFormId: formId,\r\n },\r\n });\r\n };\r\n\r\n const getLabelName = (key) => {\r\n return defaultFormList[key]?.label ?? 'undefined';\r\n };\r\n\r\n const columns = [\r\n {\r\n field: 'commercial',\r\n headerName: getLabelName('commercial'),\r\n width: 150,\r\n valueGetter: (params) => {\r\n return params.value ? 'Commercial' : 'Non-commercial';\r\n },\r\n },\r\n {\r\n field: 'type',\r\n headerName: getLabelName('type'),\r\n width: 200,\r\n valueGetter: (params) => {\r\n return getChoiceLabel('type', params.value);\r\n },\r\n },\r\n { field: 'name', headerName: getLabelName('name'), width: 250 },\r\n {\r\n field: 'ownership',\r\n headerName: getLabelName('ownership'),\r\n width: 200,\r\n tooltip: 'Does the aforementioned organization/party has ownership of the study data?',\r\n },\r\n ];\r\n\r\n return {\r\n columns,\r\n rows,\r\n openPopup,\r\n setOpenPopup,\r\n defaultFormList,\r\n selectedRow,\r\n handleRowCreate,\r\n onRecordUpdate,\r\n handleEditClick,\r\n setRows,\r\n handleDelete,\r\n onEditSubmit,\r\n onDataEmpty,\r\n recoverDataCreation,\r\n removeAllTempData,\r\n };\r\n};\r\n\r\nexport default useNonMonetaryData;\r\n","import { Paper, Grid } from '@material-ui/core';\r\nimport CustomCheckbox from 'components/CustomCheckbox';\r\nimport TextHeader from 'components/CustomText/TextHeader';\r\nimport CustomTextField from 'components/Input/CustomTextField';\r\nimport React, { useEffect, useState } from 'react';\r\nimport styled from 'styled-components';\r\nimport NumberListFormItem from './NumberListFormItem';\r\nimport CustomTable from 'components/CustomTable';\r\nimport CustomButton from 'components/CustomInput/Button';\r\nimport PopupInput from 'components/Application/TeamMemberForm/PopupInput';\r\nimport useSourceFundingData from 'hooks/tableData/useSourceFundingData';\r\nimport useCollaboratingPartyData from 'hooks/tableData/useCollaboratingPartyData';\r\nimport useNonMonetaryData from 'hooks/tableData/useNonMonetaryData';\r\nimport { initializeTableData, produce, isHighlight as isHL } from 'utility/general';\r\nimport DataListener from './DataListener';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { SET_SITE_VALIDATION, SET_STUDY_VALIDATION, UPDATE_FORM_VALIDITY } from 'store/key';\r\nimport { getStore } from 'store';\r\n\r\nconst SPaperLayout = styled.div`\r\n padding: 10px;\r\n`;\r\n\r\nconst SLayout = styled.div`\r\n padding: 10px;\r\n`;\r\n\r\nexport default function BudgetFormLayout({\r\n tabType,\r\n formId,\r\n defaultData = {},\r\n disableOnPermission = false,\r\n onFormUpdate = (key, value) => null,\r\n applicationDetail = {},\r\n siteInfoId,\r\n isAmendmentEdit = false,\r\n isAmendmentCreate = false,\r\n onSiteInfoUpdate = (siteInfoId, key, value) => null,\r\n applicationCreateDtm,\r\n}) {\r\n const {\r\n openPopup: openFundPopup,\r\n setOpenPopup: setFundOpenPopup,\r\n columns: fundColumns,\r\n rows: fundRows,\r\n setRows: setFundRows,\r\n defaultFormList: defaultFundFormList,\r\n selectedRow: selectedFundRow,\r\n handleRowCreate: handleFundRowCreate,\r\n onRecordUpdate: handleFundRecordUpdate,\r\n handleEditClick: handleFundEditClick,\r\n handleDelete: handleFundDelete,\r\n onEditSubmit: onFundEditSubmit,\r\n onDataEmpty: onFundDataEmpty,\r\n recoverDataCreation: recoverFundDataCreation,\r\n removeAllTempData: removeAllSourceFundingTempData,\r\n } = useSourceFundingData({ formId });\r\n\r\n const {\r\n openPopup: openNonMonetaryPopup,\r\n setOpenPopup: setNonMonetaryOpenPopup,\r\n columns: nonMonetaryColumns,\r\n rows: nonMonetaryRows,\r\n setRows: setNonMonetaryRows,\r\n defaultFormList: defaultNonMonetaryFormList,\r\n selectedRow: selectedNonMonetaryRow,\r\n handleRowCreate: handleNonMonetaryRowCreate,\r\n onRecordUpdate: handleNonMonetaryRecordUpdate,\r\n handleEditClick: handleNonMonetaryEditClick,\r\n handleDelete: handleNonMonetaryDelete,\r\n onEditSubmit: onMonMonetaryEditSubmit,\r\n onDataEmpty: onNonMonetaryDataEmpty,\r\n recoverDataCreation: recoverNonMonetaryDataCreation,\r\n removeAllTempData: removeAllNonMonetaryTempData,\r\n } = useNonMonetaryData({ formId });\r\n\r\n const {\r\n openPopup: openCollaboratePopup,\r\n setOpenPopup: setCollaborateOpenPopup,\r\n columns: collaborateColumns,\r\n rows: collaborateRows,\r\n setRows: setCollaborateRows,\r\n defaultFormList: defaultCollaborateFormList,\r\n selectedRow: selectedCollaborateRow,\r\n handleRowCreate: handleCollaborateRowCreate,\r\n onRecordUpdate: handleCollaborateRecordUpdate,\r\n handleEditClick: handleCollaborateEditClick,\r\n handleDelete: handleCollaborateDelete,\r\n onEditSubmit: onCollaborateEditSubmit,\r\n removeAllTempData: removeAllCollaboratingTempData,\r\n } = useCollaboratingPartyData({ formId });\r\n\r\n const [postData, setPostData] = useState({});\r\n const [sitePostData, setSitePostData] = useState({});\r\n\r\n const [studyInfoValidation, setStudyInfoValidation] = useState({});\r\n const [siteInfoValidation, setSiteInfoValidation] = useState({});\r\n\r\n const validationKey = 'budgetResources';\r\n\r\n const isStudyValid = useSelector(\r\n (state) => state.applicationDetailValid.isApplicationFormDetailValid?.[validationKey],\r\n );\r\n\r\n const isSiteValid = useSelector(\r\n (state) => state.applicationDetailValid.siteInfoValid?.[siteInfoId]?.[validationKey],\r\n );\r\n\r\n const dispatch = useDispatch();\r\n const isAmendment = isAmendmentEdit || isAmendmentCreate;\r\n\r\n // initialize the study-info postData if edit data exist\r\n useEffect(() => {\r\n if (tabType === 'info') {\r\n const { applicationDetailPostData } = getStore().getState();\r\n const postData = applicationDetailPostData.postData?.applicationForm ?? {};\r\n setPostData(postData);\r\n\r\n const fundingData = initializeTableData({\r\n tableKey: 'funding',\r\n currentTableData: fundRows,\r\n });\r\n\r\n setFundRows(fundingData);\r\n\r\n const supportData = initializeTableData({\r\n tableKey: 'support',\r\n currentTableData: nonMonetaryRows,\r\n });\r\n\r\n setNonMonetaryRows(supportData);\r\n\r\n const collaboratingData = initializeTableData({\r\n tableKey: 'collaborating',\r\n currentTableData: collaborateRows,\r\n });\r\n\r\n setCollaborateRows(collaboratingData);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n // initialize the postData if edit exist\r\n useEffect(() => {\r\n if (tabType === 'hospital') {\r\n const { applicationDetailPostData } = getStore().getState();\r\n const siteInfo = applicationDetailPostData.postData.siteInfo;\r\n const currentSiteInfoPostData = siteInfo?.find((item) => item.id === siteInfoId);\r\n setSitePostData(currentSiteInfoPostData ? { [siteInfoId]: currentSiteInfoPostData } : {});\r\n }\r\n\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n // update study-info validity to the reducer\r\n useEffect(() => {\r\n const validations = Object.values(studyInfoValidation);\r\n\r\n // data is not initialized\r\n if (validations.length === 0) {\r\n return;\r\n }\r\n\r\n const currentStatus = validations.every((item) => item);\r\n\r\n if (currentStatus !== isStudyValid) {\r\n dispatch({\r\n type: UPDATE_FORM_VALIDITY,\r\n payload: {\r\n type: 'study',\r\n applicationFormId: formId,\r\n formKey: validationKey,\r\n isValid: currentStatus,\r\n },\r\n });\r\n }\r\n\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [studyInfoValidation]);\r\n\r\n // update site-info validity to the reducer\r\n useEffect(() => {\r\n const validations = Object.values(siteInfoValidation);\r\n\r\n // data is not initialized\r\n if (validations.length === 0) {\r\n return;\r\n }\r\n\r\n const currentStatus = validations.every((item) => item);\r\n\r\n if (currentStatus !== isSiteValid) {\r\n dispatch({\r\n type: UPDATE_FORM_VALIDITY,\r\n payload: {\r\n type: 'site',\r\n applicationFormId: formId,\r\n siteInfoId: siteInfoId,\r\n formKey: validationKey,\r\n isValid: currentStatus,\r\n },\r\n });\r\n }\r\n\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [siteInfoValidation]);\r\n\r\n const updateStudyValidation = (name, isValidate) => {\r\n setStudyInfoValidation(\r\n produce((draft) => {\r\n draft[name] = isValidate;\r\n }),\r\n );\r\n };\r\n\r\n const updateSiteValidation = (name, isValidate) => {\r\n setSiteInfoValidation(\r\n produce((draft) => {\r\n draft[name] = isValidate;\r\n }),\r\n );\r\n };\r\n\r\n // when studyInfoValidation change, update the reducer\r\n useEffect(() => {\r\n dispatch({\r\n type: SET_STUDY_VALIDATION,\r\n payload: {\r\n [validationKey]: studyInfoValidation,\r\n },\r\n });\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [studyInfoValidation]);\r\n\r\n // when siteInfoValidation change, update the reducer\r\n useEffect(() => {\r\n dispatch({\r\n type: SET_SITE_VALIDATION,\r\n payload: {\r\n siteInfoId,\r\n [validationKey]: siteInfoValidation,\r\n },\r\n });\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [siteInfoValidation]);\r\n\r\n const getData = (key) => {\r\n return postData[key] ?? defaultData[key];\r\n };\r\n\r\n const isValueExistInField = (fieldKey, allowedKeys = []) => {\r\n const data = getData(fieldKey);\r\n\r\n if (allowedKeys.includes(data)) {\r\n return true;\r\n }\r\n return false;\r\n };\r\n\r\n const onFieldChange = (e) => {\r\n const { name, value } = e.target;\r\n\r\n setPostData((prevData) => {\r\n return {\r\n ...prevData,\r\n [name]: value,\r\n };\r\n });\r\n\r\n // setPostData(\r\n // produce((draft) => {\r\n // draft[name] = value;\r\n // }),\r\n // );\r\n\r\n onFormUpdate(name, value);\r\n };\r\n\r\n const getDefaultData = (key) => {\r\n const site = applicationDetail.siteInfo.find((item) => {\r\n return item.id === siteInfoId;\r\n });\r\n\r\n return site?.[key];\r\n };\r\n\r\n const getSiteData = (key) => {\r\n return sitePostData?.[siteInfoId]?.[key] ?? getDefaultData(key);\r\n };\r\n\r\n const onSiteFieldChange = (e) => {\r\n const { value, name } = e.target;\r\n\r\n setSitePostData((prevData) => {\r\n const newData = produce(prevData, (draft) => {\r\n if (!draft[siteInfoId]) {\r\n draft[siteInfoId] = {};\r\n }\r\n\r\n draft[siteInfoId][name] = value;\r\n });\r\n\r\n return newData;\r\n });\r\n\r\n onSiteInfoUpdate(siteInfoId, name, value);\r\n };\r\n\r\n const isHighlight = (keys, istable = false) => {\r\n return isHL(applicationDetail, siteInfoId, formId, tabType, keys, istable);\r\n };\r\n\r\n return (\r\n E.g.
\r\n - Intellectual property right
\r\n - Developing and manufacturing investigational product
\r\n - Designing the clinical study
\r\n - Developing the study protocol
\r\n - Quality management
\r\n - Data analysis
\r\n - Reporting
\r\n - Regulatory responsibility
\r\n - Legal responsibility
\r\n - Financing the study
\r\n \r\n \r\n Form can be downloaded from “Useful Information/User Manual” via the navigation bar on\r\n the left.\r\n \r\n
\r\n )}\r\n \r\n ) : null;\r\n });\r\n };\r\n\r\n return (\r\n \r\n {openPopup && (\r\n \r\n \r\n {contentMapping()}\r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nexport default DocumentUploadFormLayout;\r\n","import { makeStyles } from '@material-ui/core/styles';\r\nimport React, { useState, useEffect } from 'react';\r\nimport { Paper, Grid, Checkbox, FormGroup, FormControlLabel, Link } from '@material-ui/core';\r\nimport CustomTable from 'components/CustomTable';\r\nimport { useSelector, useDispatch } from 'react-redux';\r\nimport {\r\n UPDATE_APPLICATION_DETAIL_POST_DATA,\r\n UPDATE_REMOVE_REQUEST_DATA,\r\n UPDATE_FORM_VALIDITY,\r\n UPDATE_CLINICAL_STUDY_CATEGORIZATION,\r\n} from 'store/key';\r\nimport MsgBox from 'components/MsgBox/MsgBox';\r\nimport { getSystemMessage } from 'store/system/systemMessageReducer';\r\nimport { colorMain } from 'constants/color';\r\nimport { isEqual } from 'lodash';\r\nimport usePrevious from 'hooks/usePrevious';\r\nimport TextHeader from 'components/CustomText/TextHeader';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n paperMargin: {\r\n margin: 10,\r\n },\r\n gridPadding: {\r\n padding: 10,\r\n },\r\n formTitleWeight: {\r\n fontWeight: 'bold',\r\n },\r\n subTitle: {\r\n paddingBottom: theme.spacing(2),\r\n },\r\n subTitleItem: {\r\n paddingBottom: theme.spacing(1),\r\n },\r\n channelBox: {\r\n paddingTop: theme.spacing(2),\r\n paddingBottom: theme.spacing(2),\r\n },\r\n channelItem: {\r\n paddingTop: theme.spacing(2),\r\n paddingBottom: theme.spacing(2),\r\n flexWrap: 'nowrap',\r\n justifyContent: 'flex-start',\r\n borderBottom: '1px solid #dcdcdc',\r\n },\r\n channelTitle: {\r\n paddingRight: theme.spacing(2),\r\n whiteSpace: 'nowrap',\r\n fontWeight: 'bold',\r\n },\r\n channelDetail: {},\r\n btn: {\r\n marginRight: theme.spacing(2),\r\n },\r\n}));\r\n\r\nconst ClinicalStudyCategorizationFormLayout = (props) => {\r\n const classes = useStyles();\r\n\r\n const { formId, disableOnPermission } = props;\r\n\r\n const [warningMsg, setWarningMsg] = useState(null);\r\n\r\n const dispatch = useDispatch();\r\n\r\n const role = useSelector((state) => state.user.role);\r\n const applicationDetail = useSelector((state) => state.applicationDetail[formId]);\r\n const applicationDetailPostData = useSelector((state) => state.applicationDetailPostData);\r\n const clinicalStudyCategorization = useSelector((state) => state.clinicalStudyCategorization);\r\n\r\n const { defaultRows, rows, channel, defaultResultList, mapResultList, formCompleted } = clinicalStudyCategorization;\r\n\r\n const applicationForm = applicationDetail?.applicationForm ?? {};\r\n\r\n const prevApplicationForm = usePrevious(applicationForm);\r\n\r\n const postApplicationForm = applicationDetailPostData.postData.applicationForm ?? {};\r\n const psotRemoveRequestApplicationForm = applicationDetailPostData.removeRequest.applicationForm ?? {};\r\n const psotRemoveRequestList = psotRemoveRequestApplicationForm[formId] ?? [];\r\n\r\n const workflow = postApplicationForm.workflow ?? applicationForm.workflow;\r\n const postWorkflow = postApplicationForm.workflow;\r\n\r\n const columns = [\r\n { field: 'riskGroup', headerName: 'Risk Group', width: 280 },\r\n { field: 'number', headerName: 'No.', width: 80 },\r\n { field: 'riskFactors', headerName: 'Risk Factors', width: 380 },\r\n {\r\n field: 'action',\r\n headerName: 'Yes / No',\r\n width: 280,\r\n renderCell: (params) => {\r\n return (\r\n \r\n \r\n Document Upload\r\n \r\n
\r\n \r\n {warningMsg ? (\r\n setWarningMsg(null)}\r\n />\r\n ) : null}\r\n \r\n \r\n \r\n \r\n Note to Investigator:\r\n \r\n \r\n Please complete the following Clinical Study Categorization Form and submit the Form\r\n together with each application for research ethics review. Upon receipt of an application,\r\n the Secretariat will verify the information on the form and arrange for appropriate initial\r\n review through Full Review, Expedited Review or Full Review by Phase 1 Panel.\r\n \r\n \r\n \r\n \r\n \r\n {mapChannelContent(channel)}\r\n \r\n \r\n \r\n Click{' '}\r\n \r\n here\r\n \r\n for Notes for Completion of the Clinical Study Categorization Form\r\n \r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nexport default ClinicalStudyCategorizationFormLayout;\r\n","export const colorMain = '#3f51b5';","import { useEffect, useState, useRef } from 'react';\r\nimport { getHospitalItem } from 'utility/general';\r\nimport { getTimeWithTimeZone } from 'utility/general';\r\nimport { useSelector, useDispatch } from 'react-redux';\r\nimport { SET_DECLARATION_AND_ENDORSEMENT } from 'store/key';\r\n// import usePrevious from 'hooks/usePrevious';\r\n// import { isEqual } from 'lodash';\r\n\r\nconst useDeclarationAndEndorsementData = (props) => {\r\n const {\r\n applicationDetail,\r\n siteInfoId,\r\n removeRequestCoiIds,\r\n // formId,\r\n } = props;\r\n const declareStudentList = applicationDetail.declareStudent ?? [];\r\n const declareList = applicationDetail.declare ?? [];\r\n const declareInvList = applicationDetail.declareInv ?? [];\r\n\r\n const dispatch = useDispatch();\r\n const declarationAndEndorsement = useSelector((state) => state.declarationAndEndorsement);\r\n\r\n let {\r\n declareStudentRows,\r\n declareInvRows,\r\n HAEndorsementRows,\r\n universitiesEndorsementRows,\r\n HAUniversitiesEndorsementRows,\r\n } = declarationAndEndorsement;\r\n\r\n /** map each site/study rows data */\r\n const mapRows = (rows) => {\r\n let newRows = [];\r\n rows?.forEach((item) => {\r\n if (item.siteInfo?.id === siteInfoId) {\r\n newRows.push(item);\r\n }\r\n });\r\n return newRows;\r\n };\r\n\r\n const [newDeclareStudentRows, setNewDeclareStudentRows] = useState([]); // useState(declareStudentRows.length ? mapRows(declareStudentRows) : []);\r\n const [newDeclareInvRows, setNewDeclareInvRows] = useState([]); //useState(declareInvRows.length ? mapRows(declareInvRows) : []);\r\n const [newHAEndorsementRows, setNewHAEndorsementRows] = useState([]);\r\n const [newUniversitiesEndorsementRows, setNewUniversitiesEndorsementRows] = useState([]);\r\n const [newHAUniversitiesEndorsementRows, setNewHAUniversitiesEndorsementRows] = useState([]);\r\n\r\n useEffect(() => {\r\n if (!declareStudentRows.length && !newDeclareStudentRows.length) return;\r\n setNewDeclareStudentRows(mapRows(declareStudentRows));\r\n // eslint-disable-next-line\r\n }, [declareStudentRows]);\r\n useEffect(() => {\r\n if (!declareInvRows.length && !newDeclareInvRows.length) return;\r\n setNewDeclareInvRows(mapRows(declareInvRows));\r\n // eslint-disable-next-line\r\n }, [declareInvRows]);\r\n useEffect(() => {\r\n if (!HAEndorsementRows.length && !newHAEndorsementRows.length) return;\r\n setNewHAEndorsementRows(mapRows(HAEndorsementRows));\r\n // eslint-disable-next-line\r\n }, [HAEndorsementRows]);\r\n useEffect(() => {\r\n if (!universitiesEndorsementRows.length && !newUniversitiesEndorsementRows.length) return;\r\n setNewUniversitiesEndorsementRows(mapRows(universitiesEndorsementRows));\r\n // eslint-disable-next-line\r\n }, [universitiesEndorsementRows]);\r\n useEffect(() => {\r\n if (!HAUniversitiesEndorsementRows.length && !newHAUniversitiesEndorsementRows.length) return;\r\n setNewHAUniversitiesEndorsementRows(mapRows(HAUniversitiesEndorsementRows));\r\n // eslint-disable-next-line\r\n }, [HAUniversitiesEndorsementRows]);\r\n\r\n const declareStudentDefaultFormList = {\r\n role: {\r\n value: '',\r\n label: 'Role',\r\n name: 'role',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n title: {\r\n value: '',\r\n label: 'Title',\r\n name: 'title',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n name: {\r\n value: '',\r\n label: 'Name',\r\n name: 'name',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n position: {\r\n value: '',\r\n label: 'Position',\r\n name: 'position',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n responsibility: {\r\n value: '',\r\n label: 'Responsibility for Clinical oversight',\r\n name: 'responsibility',\r\n type: 'select',\r\n operators: [\r\n { key: 'Yes', label: 'Yes' },\r\n { key: 'No', label: 'No' },\r\n ],\r\n validators: ['isRequired'],\r\n },\r\n signDate: {\r\n value: null,\r\n label: 'Date',\r\n name: 'signDate',\r\n type: 'date',\r\n },\r\n };\r\n const declareStudentColumns = [\r\n { field: 'role', headerName: 'Role', width: 150 },\r\n { field: 'title', headerName: 'Title', width: 200 },\r\n { field: 'name', headerName: 'Name', width: 140 },\r\n { field: 'position', headerName: 'Position', width: 200 },\r\n { field: 'responsibility', headerName: 'Responsibility for Clinical oversight', width: 140 },\r\n {\r\n field: 'signature',\r\n headerName: 'Signature',\r\n width: 220,\r\n valueGetter: () => '',\r\n },\r\n {\r\n field: 'signDate',\r\n headerName: 'Date',\r\n width: 200,\r\n valueGetter: (params) => {\r\n let date = params.getValue('signDate');\r\n date = date ? getTimeWithTimeZone(date).format('YYYY-MM-DD') : '-';\r\n return date;\r\n },\r\n },\r\n ];\r\n\r\n const declareInvDefaultFormList = {\r\n role: {\r\n value: '',\r\n label: 'Role',\r\n name: 'role',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n disabled: true,\r\n },\r\n title: {\r\n value: '',\r\n label: 'Title',\r\n name: 'title',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n name: {\r\n value: '',\r\n label: 'Name',\r\n name: 'name',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 512 /** first name (255) + last name (255) + space */,\r\n isTrim: true,\r\n },\r\n position: {\r\n value: '',\r\n label: 'Position',\r\n name: 'position',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n responsibility: {\r\n value: '',\r\n label: 'Responsibility for Clinical oversight',\r\n name: 'responsibility',\r\n type: 'select',\r\n operators: [\r\n { key: 'Yes', label: 'Yes' },\r\n { key: 'No', label: 'No' },\r\n ],\r\n validators: ['isRequired'],\r\n },\r\n signDate: {\r\n value: null,\r\n label: 'Date',\r\n name: 'signDate',\r\n type: 'date',\r\n },\r\n };\r\n const declareInvColumns = [\r\n { field: 'role', headerName: 'Role', width: 150, disableItemSort: true },\r\n { field: 'title', headerName: 'Title', width: 200, disableItemSort: true },\r\n { field: 'name', headerName: 'Name', width: 140, disableItemSort: true },\r\n { field: 'position', headerName: 'Position', width: 200, disableItemSort: true },\r\n {\r\n field: 'responsibility',\r\n headerName: 'Responsibility for Clinical oversight',\r\n width: 140,\r\n disableItemSort: true,\r\n },\r\n {\r\n field: 'signature',\r\n headerName: 'Signature',\r\n width: 220,\r\n\r\n valueGetter: () => '',\r\n disableItemSort: true,\r\n },\r\n {\r\n field: 'signDate',\r\n headerName: 'Date',\r\n width: 200,\r\n disableItemSort: true,\r\n valueGetter: (params) => {\r\n let date = params.getValue('signDate');\r\n date = date ? getTimeWithTimeZone(date).format('YYYY-MM-DD') : '-';\r\n return date;\r\n },\r\n },\r\n ];\r\n\r\n const HAEndorsementDefaultFormList = {\r\n title: {\r\n value: '',\r\n label: 'Title',\r\n name: 'title',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n name: {\r\n value: '',\r\n label: 'Name',\r\n name: 'name',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n position: {\r\n value: '',\r\n label: 'Position',\r\n name: 'position',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n department: {\r\n value: '',\r\n label: 'Department',\r\n name: 'department',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n hospitalCode: {\r\n value: '',\r\n label: 'Hospital',\r\n name: 'hospitalCode',\r\n type: 'hospitalOrInstitution',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n freeSolo: true,\r\n },\r\n signDate: {\r\n value: null,\r\n label: 'Date',\r\n name: 'signDate',\r\n type: 'date',\r\n },\r\n };\r\n const HAEndorsementColumns = [\r\n { field: 'title', headerName: 'Title', width: 200 },\r\n { field: 'name', headerName: 'Name', width: 200 },\r\n { field: 'position', headerName: 'Position', width: 200 },\r\n { field: 'department', headerName: 'Department', width: 200 },\r\n {\r\n field: 'hospitalCode',\r\n headerName: 'Hospital',\r\n width: 200,\r\n valueGetter: (params) => {\r\n const value = params.getValue('hospitalCode');\r\n return getHospitalItem(value)?.hospitalName ?? value ?? '';\r\n },\r\n },\r\n { field: 'signature', headerName: 'Signature', width: 220 },\r\n {\r\n field: 'signDate',\r\n headerName: 'Date',\r\n width: 100,\r\n valueGetter: (params) => {\r\n let date = params.getValue('signDate');\r\n date = date ? getTimeWithTimeZone(date).format('YYYY-MM-DD') : '-';\r\n return date;\r\n },\r\n },\r\n ];\r\n\r\n const universitiesEndorsementDefaultFormList = {\r\n title: {\r\n value: '',\r\n label: 'Title',\r\n name: 'title',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n name: {\r\n value: '',\r\n label: 'Name',\r\n name: 'name',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n position: {\r\n value: '',\r\n label: 'Position',\r\n name: 'position',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n department: {\r\n value: '',\r\n label: 'Department',\r\n name: 'department',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n hospitalCode: {\r\n value: '',\r\n label: 'Institution',\r\n name: 'hospitalCode',\r\n type: 'hospitalOrInstitution',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n freeSolo: true,\r\n },\r\n signDate: {\r\n value: null,\r\n label: 'Date',\r\n name: 'signDate',\r\n type: 'date',\r\n },\r\n };\r\n const universitiesEndorsementColumns = [\r\n { field: 'title', headerName: 'Title', width: 200 },\r\n { field: 'name', headerName: 'Name', width: 200 },\r\n { field: 'position', headerName: 'Position', width: 200 },\r\n { field: 'department', headerName: 'Department', width: 200 },\r\n {\r\n field: 'hospitalCode',\r\n headerName: 'Institution',\r\n width: 200,\r\n valueGetter: (params) => {\r\n const value = params.getValue('hospitalCode');\r\n return getHospitalItem(value)?.hospitalName ?? value ?? '';\r\n },\r\n },\r\n { field: 'signature', headerName: 'Signature', width: 220 },\r\n {\r\n field: 'signDate',\r\n headerName: 'Date',\r\n width: 100,\r\n valueGetter: (params) => {\r\n let date = params.getValue('signDate');\r\n date = date ? getTimeWithTimeZone(date).format('YYYY-MM-DD') : '-';\r\n return date;\r\n },\r\n },\r\n ];\r\n\r\n const HAUniversitiesEndorsementDefaultFormList = {\r\n title: {\r\n value: '',\r\n label: 'Title',\r\n name: 'title',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n name: {\r\n value: '',\r\n label: 'Name',\r\n name: 'name',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n position: {\r\n value: '',\r\n label: 'Position',\r\n name: 'position',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n department: {\r\n value: '',\r\n label: 'Department',\r\n name: 'department',\r\n type: 'input',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n isTrim: true,\r\n },\r\n hospitalCode: {\r\n value: '',\r\n label: 'Hospital',\r\n name: 'hospitalCode',\r\n type: 'hospitalOrInstitution',\r\n validators: ['isRequired', 'disableChinese'],\r\n maxLength: 255,\r\n freeSolo: true,\r\n },\r\n signDate: {\r\n value: null,\r\n label: 'Date',\r\n name: 'signDate',\r\n type: 'date',\r\n },\r\n };\r\n const HAUniversitiesEndorsementColumns = [\r\n { field: 'title', headerName: 'Title', width: 200 },\r\n { field: 'name', headerName: 'Name', width: 200 },\r\n { field: 'position', headerName: 'Position', width: 200 },\r\n { field: 'department', headerName: 'Department', width: 200 },\r\n {\r\n field: 'hospitalCode',\r\n headerName: 'Hospital',\r\n width: 200,\r\n valueGetter: (params) => {\r\n const value = params.getValue('hospitalCode');\r\n return getHospitalItem(value)?.hospitalName ?? value ?? '';\r\n },\r\n },\r\n { field: 'signature', headerName: 'Signature', width: 220 },\r\n {\r\n field: 'signDate',\r\n headerName: 'Date',\r\n width: 100,\r\n valueGetter: (params) => {\r\n let date = params.getValue('signDate');\r\n date = date ? getTimeWithTimeZone(date).format('YYYY-MM-DD') : '-';\r\n return date;\r\n },\r\n },\r\n ];\r\n\r\n const setRows = (key, rows) => {\r\n let data = { id: siteInfoId };\r\n const newRows = rows.map((item) => {\r\n if (item.siteInfo === undefined) {\r\n item.siteInfo = data;\r\n }\r\n return item;\r\n });\r\n dispatch({\r\n type: SET_DECLARATION_AND_ENDORSEMENT,\r\n payload: {\r\n [key]: newRows,\r\n },\r\n });\r\n };\r\n\r\n const formData = {\r\n declareStudent: {\r\n popupTitle: 'Declaration by Principal Investigator and other Investigator(s)',\r\n defaultFormList: declareStudentDefaultFormList,\r\n columns: declareStudentColumns,\r\n rows: newDeclareStudentRows,\r\n setRows: (rows) => setRows('declareStudentRows', rows),\r\n },\r\n declareInv: {\r\n popupTitle: 'Declaration by Principal Investigator and other Investigator(s)',\r\n defaultFormList: declareInvDefaultFormList,\r\n columns: declareInvColumns,\r\n rows: newDeclareInvRows,\r\n setRows: (rows) => setRows('declareInvRows', rows),\r\n },\r\n H: {\r\n popupTitle: 'Endorsement by COS or Authorised Representative of HA',\r\n defaultFormList: HAEndorsementDefaultFormList,\r\n columns: HAEndorsementColumns,\r\n rows: newHAEndorsementRows,\r\n setRows: (rows) => setRows('HAEndorsementRows', rows),\r\n },\r\n U: {\r\n popupTitle: 'Endorsement by Head of Department of the Universities',\r\n defaultFormList: universitiesEndorsementDefaultFormList,\r\n columns: universitiesEndorsementColumns,\r\n rows: newUniversitiesEndorsementRows,\r\n setRows: (rows) => setRows('universitiesEndorsementRows', rows),\r\n },\r\n C: {\r\n popupTitle: 'Endorsement by COS(s) or Head(s) of the Collaborating Department(s) in HA or in Universities',\r\n defaultFormList: HAUniversitiesEndorsementDefaultFormList,\r\n columns: HAUniversitiesEndorsementColumns,\r\n rows: newHAUniversitiesEndorsementRows,\r\n setRows: (rows) => setRows('HAUniversitiesEndorsementRows', rows),\r\n },\r\n };\r\n const initFormData = useRef({\r\n declareStudent: {\r\n rows: [],\r\n setRows: (rows) => setRows('declareStudentRows', rows),\r\n },\r\n declareInv: {\r\n rows: [],\r\n setRows: (rows) => setRows('declareInvRows', rows),\r\n },\r\n H: {\r\n rows: [],\r\n setRows: (rows) => setRows('HAEndorsementRows', rows),\r\n },\r\n U: {\r\n rows: [],\r\n setRows: (rows) => setRows('universitiesEndorsementRows', rows),\r\n },\r\n C: {\r\n rows: [],\r\n setRows: (rows) => setRows('HAUniversitiesEndorsementRows', rows),\r\n },\r\n });\r\n\r\n const declareInvDefaultRow = {\r\n role: '',\r\n title: '',\r\n name: '',\r\n position: '',\r\n responsibility: '',\r\n signDate: null,\r\n };\r\n\r\n const declareStudentDefaultRow = {\r\n role: '',\r\n title: '',\r\n name: '',\r\n position: '',\r\n responsibility: '',\r\n signDate: null,\r\n };\r\n\r\n const loadData = () => {\r\n /** Endorsement */\r\n if (declareList.length) {\r\n /** clear old data */\r\n initFormData.current.H.rows = [];\r\n initFormData.current.U.rows = [];\r\n initFormData.current.C.rows = [];\r\n\r\n /** set new data */\r\n for (let i of declareList) {\r\n // if (i.siteInfo.id === siteInfoId) {\r\n initFormData.current[i.endorse].rows.push({\r\n ...i,\r\n existInDB: true,\r\n });\r\n // };\r\n }\r\n /** set rows */\r\n const list = JSON.parse(JSON.stringify(initFormData.current));\r\n for (let i in list) {\r\n const item = list[i];\r\n if (item.rows.length) {\r\n const rows = initFormData.current[i].rows;\r\n initFormData.current[i].setRows(rows);\r\n } else {\r\n initFormData.current[i].setRows([]);\r\n }\r\n }\r\n } else {\r\n initFormData.current.H.setRows([]);\r\n initFormData.current.U.setRows([]);\r\n initFormData.current.C.setRows([]);\r\n }\r\n\r\n /** Declaration investigator declare normal List */\r\n const copyDeclareInvList = [...declareInvList];\r\n if (removeRequestCoiIds.length) {\r\n /** delete declareInvList's row if coi table had deleted */\r\n for (let i = 0; i <= copyDeclareInvList.length; i++) {\r\n if (removeRequestCoiIds.includes(copyDeclareInvList[i]?.id)) {\r\n copyDeclareInvList.splice(i, 1);\r\n }\r\n }\r\n }\r\n\r\n if (copyDeclareInvList.length) {\r\n /** clear old data */\r\n initFormData.current.declareInv.rows = [];\r\n\r\n /** set new data */\r\n for (let i of copyDeclareInvList) {\r\n // if (i.siteInfo.id === siteInfoId) {\r\n initFormData.current.declareInv.rows.push({\r\n ...i,\r\n existInDB: true,\r\n });\r\n // };\r\n }\r\n\r\n /** set rows */\r\n let rows = initFormData.current.declareInv.rows;\r\n initFormData.current.declareInv.setRows(rows);\r\n } else {\r\n initFormData.current.declareInv.setRows([]);\r\n }\r\n\r\n /** Declaration investigator declare Student List */\r\n if (declareStudentList.length) {\r\n /** clear old data */\r\n initFormData.current.declareStudent.rows = [];\r\n\r\n /** set new data */\r\n for (let i of declareStudentList) {\r\n initFormData.current.declareStudent.rows.push({\r\n ...i,\r\n existInDB: true,\r\n });\r\n }\r\n\r\n /** set rows */\r\n let rows = initFormData.current.declareStudent.rows;\r\n initFormData.current.declareStudent.setRows(rows);\r\n } else {\r\n initFormData.current.declareStudent.setRows([]);\r\n }\r\n };\r\n\r\n // const remoteDataDeclare = useSelector((state) => state.applicationDetail?.[formId]?.declare);\r\n // const previousDataDeclare = usePrevious(remoteDataDeclare);\r\n // const remoteDataDeclareInv = useSelector((state) => state.applicationDetail?.[formId]?.declareInv);\r\n // const previousDataDeclareInv = usePrevious(remoteDataDeclareInv);\r\n // const remoteDataDeclareStudent = useSelector((state) => state.applicationDetail?.[formId]?.declareStudent);\r\n // const previousDataDeclareStudent = usePrevious(remoteDataDeclareStudent);\r\n // // update row when remote data update\r\n // useEffect(() => {\r\n // if (!isEqual(previousDataDeclare, remoteDataDeclare) ||\r\n // !isEqual(previousDataDeclareInv, remoteDataDeclareInv) ||\r\n // !isEqual(previousDataDeclareStudent, remoteDataDeclareStudent)\r\n // ) {\r\n // console.log(1111222)\r\n // loadData();\r\n // }\r\n // // eslint-disable-next-line react-hooks/exhaustive-deps\r\n // }, [remoteDataDeclare, remoteDataDeclareInv, remoteDataDeclareStudent]);\r\n\r\n useEffect(() => {\r\n if (declareStudentRows.length) {\r\n setNewDeclareStudentRows(mapRows(declareStudentRows));\r\n }\r\n if (declareInvRows.length) {\r\n setNewDeclareInvRows(mapRows(declareInvRows));\r\n }\r\n if (HAEndorsementRows) {\r\n setNewHAEndorsementRows(mapRows(HAEndorsementRows));\r\n }\r\n if (universitiesEndorsementRows) {\r\n setNewUniversitiesEndorsementRows(mapRows(universitiesEndorsementRows));\r\n }\r\n if (HAUniversitiesEndorsementRows) {\r\n setNewHAUniversitiesEndorsementRows(mapRows(HAUniversitiesEndorsementRows));\r\n }\r\n // eslint-disable-next-line\r\n }, [siteInfoId]);\r\n\r\n return {\r\n declareStudentDefaultFormList,\r\n declareStudentColumns,\r\n declareStudentRows: newDeclareStudentRows,\r\n setDeclareStudentRows: (rows) => setRows('declareStudentRows', rows),\r\n declareInvDefaultFormList,\r\n declareInvColumns,\r\n declareInvRows: newDeclareInvRows,\r\n setDeclareInvRows: (rows) => setRows('declareInvRows', rows),\r\n HAEndorsementDefaultFormList,\r\n HAEndorsementColumns,\r\n HAEndorsementRows: newHAEndorsementRows,\r\n setHAEndorsementRows: (rows) => setRows('HAEndorsementRows', rows),\r\n universitiesEndorsementDefaultFormList,\r\n universitiesEndorsementColumns,\r\n universitiesEndorsementRows: newUniversitiesEndorsementRows,\r\n setUniversitiesEndorsementRows: (rows) => setRows('universitiesEndorsementRows', rows),\r\n HAUniversitiesEndorsementDefaultFormList,\r\n HAUniversitiesEndorsementColumns,\r\n HAUniversitiesEndorsementRows: newHAUniversitiesEndorsementRows,\r\n setHAUniversitiesEndorsementRows: (rows) => setRows('HAUniversitiesEndorsementRows', rows),\r\n formData,\r\n declareInvDefaultRow,\r\n declareStudentDefaultRow,\r\n loadData,\r\n };\r\n};\r\n\r\nexport default useDeclarationAndEndorsementData;\r\n","import { makeStyles } from '@material-ui/core/styles';\r\nimport React, { useState, useEffect } from 'react';\r\nimport { Typography, Grid } from '@material-ui/core';\r\nimport CustomTable from 'components/CustomTable';\r\nimport { UPDATE_SITE_INFO_INSIDE_VALIDITY } from 'store/key';\r\nimport { getSystemMessage } from 'store/system/systemMessageReducer';\r\nimport { declareInvAutoFilledRoles, checkTableColumnCompleted } from 'utility/formValidate';\r\nimport { declareInvKey } from 'constants/globalEnum';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n item: {\r\n paddingBottom: theme.spacing(1),\r\n },\r\n}));\r\n\r\nexport default function DeclarationAndEndorsementFormLayout(props) {\r\n const classes = useStyles();\r\n const {\r\n siteInfoId,\r\n formId,\r\n disableOnPermission,\r\n dispatch,\r\n siteInfoInsideValid,\r\n declareInvColumns,\r\n declareInvRows,\r\n coiInvolved,\r\n handleEditClick,\r\n disableOldDataDelete,\r\n applicationCreateDtm,\r\n mapShowRow,\r\n } = props;\r\n\r\n /** check declaration's table rows of auto-filled for completeness when click \"Save\" button start */\r\n const [declareInvValid, setDeclareInvValid] = useState(true);\r\n useEffect(() => {\r\n const valid = checkTableColumnCompleted(declareInvRows);\r\n setDeclareInvValid(valid);\r\n // eslint-disable-next-line\r\n }, [declareInvRows]);\r\n\r\n useEffect(() => {\r\n dispatch({\r\n type: UPDATE_SITE_INFO_INSIDE_VALIDITY,\r\n payload: {\r\n applicationFormId: formId,\r\n siteInfoId: siteInfoId,\r\n formKey: 'declareInvValid',\r\n isValid: declareInvValid,\r\n },\r\n });\r\n // eslint-disable-next-line\r\n }, [declareInvValid]);\r\n /** check declaration's table rows of auto-filled for completeness when click \"Save\" button end */\r\n\r\n /** if coiInvolved=false and row existInDB, hide coi's row */\r\n const mapCurrentRows = (rows) => {\r\n let newRows = [];\r\n if (!coiInvolved) {\r\n rows.forEach((row) => {\r\n if (row.role !== declareInvAutoFilledRoles[1]) {\r\n newRows.push(row);\r\n }\r\n });\r\n } else {\r\n newRows = mapShowRow?.(rows, declareInvKey) ?? rows;\r\n }\r\n return newRows;\r\n };\r\n const newRows = mapCurrentRows?.(declareInvRows) ?? [];\r\n\r\n return (\r\n \r\n \r\n \r\n CLINICAL STUDY CATEGORIZATION FORM\r\n \r\n \r\n
\r\n \r\n {\r\n await dispatch({ type: RESET_DECLARATION_AND_ENDORSEMENT });\r\n loadData();\r\n }}\r\n />\r\n {openPopup ? (\r\n \r\n \r\n \r\n Note: Information will be used for risk management purpose and to assist HA's finance controller\r\n in sourcing insurance coverage for clinical trial activities\r\n \r\n \r\n \r\n \r\n \r\n A. Declaration by Principal Investigator and other Investigator(s)\r\n \r\n \r\n \r\n \r\n Scientific Title of Study:\r\n \r\n \r\n \r\n \r\n \r\n I / We declare that the information supplied is to the best of our knowledge and\r\n accurate.\r\n \r\n \r\n \r\n \r\n I / We declare that the protocol complies with Declaration of Helsinki.\r\n \r\n \r\n \r\n \r\n I / We agree to uphold the protection of research subjects' right and safety through\r\n adherence to local laws, Declaration of Helsinki, institutional policies² and whenever\r\n applicable, the ICH-GCP.\r\n \r\n \r\n \r\n \r\n I / We understand that approval by the CIRB/CREC/IRB is subject to regular renewal\r\n according to local policy.\r\n \r\n \r\n \r\n \r\n \r\n I / We agree to report to the\r\n {`< CIRB/CREC/IRB >`} \r\n \r\n \r\n \r\n \r\n - \r\n \r\n any planned change(s) to the study, and further agree not to implement any\r\n change(s) without receiving prior approval, except to eliminate immediate hazard\r\n to research subjects or when the change(s) involve only logistical or\r\n administrative issues.\r\n \r\n \r\n \r\n - \r\n \r\n any fatal events in applying site within the specific time according to the\r\n Standard Operating Procedures of the\r\n CIRB/CREC/IRB \r\n while pending investigation, and any serious adverse events in applying site\r\n (with an extended report) preferably within seven days but not later than 15\r\n days (from the day it was made known to me / us).\r\n \r\n \r\n \r\n - \r\n \r\n any new information on the project that adversely influences the risk/benefit\r\n ratio.\r\n \r\n \r\n \r\n - \r\n \r\n progress report(s) (as requested by the\r\n CIRB/CREC/IRB ) and a final report (after\r\n completion of study).\r\n \r\n \r\n \r\n \r\n \r\n \r\n I / We agree to keep all study documents for a period of at least five years after\r\n study closure as stated in question 10.5 of this application form.\r\n \r\n \r\n \r\n \r\n I / We agree to maintain adequate records and to make them available for audit /\r\n inspection.\r\n \r\n \r\n \r\n \r\n I / We agree to ensure that all associates, colleagues, and employees assisting in the\r\n conduct of the study are informed about their obligations in meeting the above\r\n commitments.\r\n \r\n \r\n \r\n {/* table A: normal table */}\r\n \r\n \r\n ² HA Guide on Research Ethics (for Study Site {'&'} Research Ethics Committee) and\r\n Investigator's Code of Practice; HA Clinical Data Policy Manual ; and other prevailing HA\r\n policies\r\n \r\n \r\n \r\n \r\n B. Endorsement by COS or Authorised Representative³ of HA\r\n \r\n \r\n \r\n Scientific Title of Study:\r\n \r\n \r\n \r\n \r\n \r\n \r\n I endorse the application and authorise the captioned study to be undertaken in my\r\n department upon approval by the\r\n CIRB/CREC/IRB .\r\n \r\n \r\n \r\n \r\n \r\n I am of the opinion that the investigator(s) within my department/unit are appropriately\r\n qualified within the disease / therapeutic area involved, and are capable of undertaking\r\n this study in terms of their workload and time available, and that the study site(s) under\r\n my supervision have access to adequate facilities and support for the research to be\r\n conducted in a safe manner.\r\n \r\n \r\n \r\n handleAddClick(HAEndorsementKey)}\r\n >\r\n Add\r\n \r\n handleEditClick(row, HAEndorsementKey)}\r\n isDeleteAllow={true}\r\n onDelete={(row) => deleteRow(row, HAEndorsementKey)}\r\n columns={HAEndorsementColumns}\r\n rows={mapShowRow?.(HAEndorsementRows)}\r\n allowResize\r\n fullWidthTable={false}\r\n disableOldDataDelete={isAmendmentForm}\r\n applicationCreateDtm={applicationCreateDtm}\r\n />\r\n \r\n \r\n \r\n ³ Should be signed by another suitable senior staff (e.g. HCE or his/ her designate) if the\r\n COS is the Applicant for the study\r\n \r\n \r\n \r\n \r\n C. Endorsement by Head of Department⁴ of the Universities\r\n \r\n \r\n \r\n Scientific Title of Study:\r\n \r\n \r\n \r\n \r\n \r\n \r\n I endorse the application and authorise the captioned study to be undertaken in my\r\n department upon approval by the\r\n CIRB/CREC/IRB .\r\n \r\n \r\n \r\n \r\n \r\n I am of the opinion that the investigator(s) within my department/unit are appropriately\r\n qualified within the disease / therapeutic area involved, and are capable of undertaking\r\n this study in terms of their workload and time available, and that the study site(s) under\r\n my supervision have access to adequate facilities and support for the research to be\r\n conducted in a safe manner.\r\n \r\n \r\n \r\n handleAddClick(universitiesEndorsementKey)}\r\n >\r\n Add\r\n \r\n handleEditClick(row, universitiesEndorsementKey)}\r\n isDeleteAllow={true}\r\n onDelete={(row) => deleteRow(row, universitiesEndorsementKey)}\r\n columns={universitiesEndorsementColumns}\r\n rows={mapShowRow?.(universitiesEndorsementRows)}\r\n allowResize\r\n fullWidthTable={false}\r\n disableOldDataDelete={isAmendmentForm}\r\n applicationCreateDtm={applicationCreateDtm}\r\n />\r\n \r\n \r\n \r\n ⁴ Should be signed by another suitable senior staff (e.g. Acting Head / Senior Member in the\r\n Department) if the Head of Department is the Applicant for the study\r\n \r\n \r\n \r\n \r\n D. Endorsement by COS(s) or Head(s) of the Collaborating Department(s) in HA or in\r\n Universities\r\n \r\n \r\n \r\n Scientific Title of Study:\r\n \r\n \r\n \r\n \r\n \r\n I support the captioned study and verify that the workload to be incurred will not interfere\r\n with the department's service priority.\r\n \r\n \r\n handleAddClick(HAUniversitiesEndorsementKey)}\r\n >\r\n Add\r\n \r\n handleEditClick(row, HAUniversitiesEndorsementKey)}\r\n isDeleteAllow={true}\r\n onDelete={(row) => deleteRow(row, HAUniversitiesEndorsementKey)}\r\n columns={HAUniversitiesEndorsementColumns}\r\n rows={mapShowRow?.(HAUniversitiesEndorsementRows)}\r\n allowResize\r\n fullWidthTable={false}\r\n disableOldDataDelete={isAmendmentForm}\r\n applicationCreateDtm={applicationCreateDtm}\r\n />\r\n \r\n \r\n \r\n \r\n ⁵ If the study involved other departments, it is the Applicant's obligation to inform and\r\n obtain agreement with the COS(s) or Head(s) of the Department(s) in HA or in Universities\r\n \r\n \r\n \r\n
\r\n );\r\n}\r\n","import CustomDialog from 'components/CustomDialog';\r\nimport React, { useEffect, useState } from 'react';\r\nimport styled from 'styled-components/macro';\r\nimport * as jsDiff from 'diff';\r\n\r\nconst SLayout = styled.div``;\r\n\r\nconst CompareModal = ({ isShow = true, originalText, changedText, onClose = () => null }) => {\r\n const [changes, setChanges] = useState([]);\r\n\r\n const cancel = () => {\r\n onClose();\r\n };\r\n\r\n useEffect(() => {\r\n const oValue = originalText === '-' ? '' : originalText ?? '';\r\n const nValue = changedText === '-' ? '' : changedText ?? '';\r\n\r\n const diff = jsDiff.diffWords(oValue, nValue);\r\n setChanges(diff);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n return (\r\n \r\n \r\n Declaration And Endorsement\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n {changes.map((item, index) => {\r\n return (\r\n \r\n {item.value}\r\n
\r\n );\r\n })}\r\n \r\n {item}\r\n
\r\n );\r\n })}\r\n \r\n {item}\r\n
\r\n );\r\n })}\r\n \r\n {\r\n setValidation(\r\n produce((draft) => {\r\n draft.proposedBy = isValid;\r\n }),\r\n );\r\n }}\r\n onChange={(e) => {\r\n setProposedBy(e.target.value);\r\n notifyParentState('proposedBy', e.target.value);\r\n }}\r\n />\r\n
\r\n )}\r\n \r\n {\r\n setValidation(\r\n produce((draft) => {\r\n draft.reason = isValid;\r\n }),\r\n );\r\n }}\r\n forceErrorDisplay={forceErrorDisplay}\r\n onChange={(e) => {\r\n setReason(e.target.value);\r\n notifyParentState('reasonForChanges', e.target.value);\r\n }}\r\n />\r\n
\r\n )}\r\n \r\n {fileUpload.fileName ? 'Signed Document:' : ''}\r\n
\r\n );\r\n };\r\n\r\n return (\r\n \r\n {\r\n if (!isLocalUpload) {\r\n downloadSignedAmendmentForm();\r\n }\r\n }}\r\n >\r\n {fileUpload.fileName}\r\n \r\n
\r\n \r\n
\r\n \r\n )}\r\n \r\n
\r\n \r\n {fileUpload.fileName ? 'Signed Document:' : ''}\r\n {\r\n setHasFileRemoved(true);\r\n setFileUpload({});\r\n }}\r\n />\r\n )} */}\r\n
\r\n \r\n {\r\n if (!isLocalUpload) {\r\n downloadSignedAmendmentForm();\r\n }\r\n }}\r\n >\r\n {fileUpload.fileName}\r\n \r\n
\r\n {/* {fileUpload?.key && (\r\n \r\n {\r\n validation.current[index + 1] = isValid;\r\n }}\r\n onDataUpdate={onDataUpdate}\r\n />\r\n
\r\n );\r\n })}\r\n {getAmendmentData()?.length === 0 && (\r\n No Change is applied to the application amendment yet.
\r\n )}\r\n \r\n {isLoadingHistory ? (\r\n \r\n \r\n ) : (\r\n
\r\n Loading Comments...
\r\n - \r\n {listOfSections.map((item, index) => {\r\n return (\r\n
\r\n {data.map((item, rowIndex) => {\r\n const isNewComment = !item.recipient;\r\n\r\n return (\r\n \r\n \r\n {\r\n setData(\r\n produce((draft) => {\r\n const dataIndex = draft.findIndex(\r\n (draftItem) => draftItem.key === item.key,\r\n );\r\n draft[dataIndex].uploads.splice(deleteIndex, 1);\r\n draft[dataIndex].uploadTempId.splice(deleteIndex, 1);\r\n }),\r\n );\r\n }}\r\n />\r\n\r\n setUploading(isUploading)}\r\n onUploadFailed={() => setUploading(false)}\r\n multiple\r\n onFileUploadFinish={(list) => {\r\n onFileUpload(list, item.key);\r\n }}\r\n />\r\n \r\n \r\n );\r\n })}\r\n
\r\n );\r\n };\r\n\r\n return (\r\n \r\n );\r\n};\r\n\r\nexport default ReturnCommentDialog;\r\n","import CustomDialog from 'components/CustomDialog';\r\nimport CustomOutlineSelect from 'components/Input/CustomOutlineSelect';\r\nimport CustomTextField from 'components/Input/CustomTextField';\r\nimport React, { useEffect, useState } from 'react';\r\nimport { useSelector } from 'react-redux';\r\nimport styled from 'styled-components/macro';\r\nimport { checkNull } from 'utility/formValidate';\r\nimport { produce } from 'utility/general';\r\nimport { CCO } from 'utility/lookup';\r\n\r\nconst SLayout = styled.div``;\r\n\r\nconst ConfirmModal = ({ onCancel = () => null, isShow = false, onSubmit = () => null, applicationDetail = {}, }) => {\r\n const [comment, setComment] = useState('');\r\n const [workflow, setWorkflow] = useState(applicationDetail.applicationForm.irbFlow);\r\n const [validations, setValidation] = useState({});\r\n const [forceErrorDisplay, setForceErrorDisplay] = useState(false);\r\n const user = useSelector((state) => state.user);\r\n\r\n const [irbNo, setIRBNo] = useState('');\r\n\r\n useEffect(() => {\r\n if (isShow) {\r\n setComment('');\r\n setWorkflow(applicationDetail.applicationForm.irbFlow);\r\n setIRBNo('');\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [isShow]);\r\n\r\n return (\r\n \r\n
\r\n\r\n \r\n {\r\n // get key of the object\r\n const { value } = e.target;\r\n\r\n const currentRecipient = recipients.find((item) => {\r\n return value === item.key;\r\n });\r\n\r\n setData(\r\n produce((draft) => {\r\n draft[rowIndex].recipient = value;\r\n draft[rowIndex].type = currentRecipient.type;\r\n draft[rowIndex].value = currentRecipient.value;\r\n }),\r\n );\r\n }}\r\n />\r\n
\r\n \r\n {\r\n const { value } = e.target;\r\n\r\n setData(\r\n produce((draft) => {\r\n draft[rowIndex].comment = value;\r\n }),\r\n );\r\n }}\r\n maxLength={255}\r\n isValidValue={(isValid) => {\r\n setMaxLengthValidation(\r\n produce((draft) => {\r\n draft[data[rowIndex].key] = isValid;\r\n }),\r\n );\r\n }}\r\n forceErrorDisplay={forceErrorDisplay}\r\n validators={['isRequired']}\r\n />\r\n
\r\n \r\n {\r\n if (data.length <= 1) {\r\n return;\r\n }\r\n\r\n const isConfirm = await showDialog({\r\n description: TABLE_ROW_REMOVE,\r\n });\r\n\r\n if (!isConfirm) {\r\n return;\r\n }\r\n\r\n setData(\r\n produce((draft) => {\r\n draft.splice(rowIndex, 1);\r\n }),\r\n );\r\n }}\r\n />\r\n
\r\n Select your flow:
\r\n \r\n {\r\n setValidation(\r\n produce((draft) => {\r\n draft.workflow = isValid;\r\n }),\r\n );\r\n }}\r\n onChange={(e) => {\r\n setWorkflow(e.target.value);\r\n }}\r\n value={workflow}\r\n choices={[\r\n {\r\n key: 0,\r\n display: 'Central IRB(Routine Panel)',\r\n },\r\n {\r\n key: 1,\r\n display: 'Central IRB(PAED Panel)',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n )}\r\n\r\n \r\n {\r\n setIRBNo(e.target.value);\r\n }}\r\n validators={user.role === CCO ? [] : ['isRequired']}\r\n forceErrorDisplay={forceErrorDisplay}\r\n isValidValue={(isValid) => {\r\n setValidation(\r\n produce((draft) => {\r\n draft.irbNo = isValid;\r\n }),\r\n );\r\n }}\r\n />\r\n
\r\n\r\n \r\n {\r\n setValidation(\r\n produce((draft) => {\r\n draft.comment = isValid;\r\n }),\r\n );\r\n }}\r\n maxLength={255}\r\n value={comment}\r\n onChange={(e) => {\r\n setComment(e.target.value);\r\n }}\r\n isTextArea\r\n placeholder=\"Leave your comments (if any)\"\r\n />\r\n
\r\n \r\n \r\n \r\n
\r\n {++count}.
{formLookup(key)}\r\n \r\n {getSortList(validationFailList)\r\n .map((item) => {\r\n return item.number ?? 'undefined';\r\n })\r\n .join(', ')}\r\n
\r\n ,\r\n );\r\n }\r\n });\r\n\r\n // skip this code for debugging\r\n if (messages.length > 0) {\r\n return showDialog({\r\n title: COMPLETE_BEFORE_NOTIFY,\r\n messages,\r\n disableCancelButton: true,\r\n });\r\n }\r\n\r\n const isConfirm = await showDialog({\r\n description: CONFIRM_TO_SEND_TO_CI,\r\n });\r\n\r\n if (!isConfirm) {\r\n return;\r\n }\r\n\r\n setGlobalLoading(true);\r\n\r\n dispatch({\r\n type: SEND_TO_COORDINATING_INVESTIGATOR,\r\n payload: {\r\n applicationFormId: formId,\r\n siteInfoId,\r\n tabType,\r\n callback: () => {\r\n showDialog({\r\n description: NOTIFY_CI_SUCCESS,\r\n disableCancelButton: true,\r\n });\r\n },\r\n final: () => {\r\n setGlobalLoading(false);\r\n },\r\n },\r\n });\r\n },\r\n showInRoles: [APPLICANT],\r\n },\r\n {\r\n text: 'Terminate',\r\n tag: 'terminate',\r\n status: APPROVED,\r\n condition: () => {\r\n return !isAmendment;\r\n },\r\n action: async () => {\r\n const { submit, comment, fileIds } = await showCommentDialog({\r\n title: GENERAL_TERMINATE_TIPS,\r\n placeholder: 'Please state the reason(s).',\r\n showUploadButton: true,\r\n });\r\n\r\n if (!submit) {\r\n return;\r\n }\r\n\r\n setGlobalLoading(true);\r\n\r\n dispatch({\r\n type: UPDATE_APPLICATION_STATUS_WITH_DETAIL,\r\n payload: {\r\n id: formId,\r\n status: TERMINATED,\r\n currentStatus: statusId,\r\n details: [\r\n {\r\n comment,\r\n uploadTempId: fileIds,\r\n },\r\n ],\r\n // updateApplicationDetail: true,\r\n callback: () => {\r\n showDialog({\r\n description: GENERAL_TERMINATE_SUCCESS,\r\n disableCancelButton: true,\r\n });\r\n history.push('/');\r\n },\r\n\r\n final: () => {\r\n setGlobalLoading(false);\r\n },\r\n },\r\n });\r\n },\r\n showInRoles: [SECRETARY, IRB],\r\n type: 'save',\r\n },\r\n {\r\n text: 'Confirm Review Result',\r\n tag: 'reviewer-confirm-review-result',\r\n status: [FOR_REVIEW],\r\n action: async () => {\r\n const rote = isAmendment ? '/post-approval-document' : '/applications';\r\n history.push(`${rote}/confirm-review-result?appId=${formId}&documentType=${documentType}`);\r\n },\r\n showInRoles: [REVIEWER],\r\n showInTab: [TAB_STUDY, TAB_SITE, TAB_AMENDMENT],\r\n },\r\n ];\r\n\r\n return { filter: actions.filter((item) => (item?.showInRoles ?? []).includes(userRole)), raw: actions };\r\n};\r\n\r\nexport default useApplicationBarAction;\r\n","import useDialog from 'components/ConfirmDialog/useDialog';\r\nimport CustomButton from 'components/CustomInput/Button';\r\nimport TextHeader from 'components/CustomText/TextHeader';\r\nimport useApplicationBarAction from 'hooks/useApplicationBarAction';\r\nimport React, { useState } from 'react';\r\nimport { useSelector, useDispatch } from 'react-redux';\r\nimport { useHistory } from 'react-router-dom';\r\nimport styled from 'styled-components/macro';\r\nimport { isFormChanged, permissionChecking } from 'utility/general';\r\nimport {\r\n APPLICANT,\r\n DRAFT,\r\n RETURNED,\r\n RETURN_FROM_IRB,\r\n KEY_PATHNAME,\r\n TAB_COMMENT,\r\n TAB_REVIEWER_COMMENT,\r\n TAB_CONSOLIDATION,\r\n TAB_MEETINGARRANGE,\r\n} from 'utility/lookup';\r\nimport { getFolderDisplayPath } from 'utility/general';\r\nimport { getItem } from 'storage';\r\nimport { APP_FORM_STATUS_NOT_MATCH, DISCARD_CONFIRM } from 'utility/frontendMessage';\r\nimport api from 'api/call';\r\nimport { setGlobal } from 'store/global/reducer';\r\nimport { isArray } from 'lodash';\r\nconst SLayout = styled.div`\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n /* padding: 10px 0; */\r\n width: 100%;\r\n`;\r\n\r\nconst SButtonLayout = styled.div`\r\n margin-right: 20px;\r\n`;\r\n\r\nconst ApplicationActionBar = ({\r\n currentTab,\r\n siteInfoId,\r\n applicationFormId,\r\n backToStudyInfo = () => null,\r\n documentType,\r\n}) => {\r\n const applicationDetail = useSelector((state) => state.applicationDetail[applicationFormId ?? 'undefined']);\r\n const applicationFolder = useSelector((state) => state.application.folder || 'all');\r\n const statusId = applicationDetail?.status?.statusId ?? -1;\r\n const userRole = useSelector((state) => state.user.role);\r\n const [isButtonLoading, setButtonLoading] = useState(false);\r\n const { filter: applicationButtons } = useApplicationBarAction({\r\n applicationDetail,\r\n siteInfoId,\r\n tabType: currentTab.type,\r\n fromId: applicationFormId,\r\n statusId,\r\n currentTabKey: currentTab.key,\r\n documentType,\r\n });\r\n const history = useHistory();\r\n const showConfirm = useDialog();\r\n\r\n const dispatch = useDispatch();\r\n\r\n const checkApplicationStatus = async () => {\r\n const res = await api.application.checkApplicationStatus(applicationFormId);\r\n return res.data.result;\r\n };\r\n\r\n return (\r\n \r\n {![TAB_COMMENT, TAB_REVIEWER_COMMENT, TAB_MEETINGARRANGE].includes(currentTab.type) &&\r\n applicationDetail &&\r\n applicationButtons\r\n .filter((item) => {\r\n // if status is array\r\n if (typeof item.status === 'object') {\r\n return item.status.includes(statusId);\r\n }\r\n\r\n return item.status === statusId;\r\n })\r\n .filter((item) => {\r\n if (item.condition !== undefined) {\r\n return item.condition({ currentTab: currentTab.type });\r\n }\r\n\r\n return true;\r\n })\r\n .filter((item) => {\r\n if (item.showInTab) {\r\n if (isArray(item.showInTab)) {\r\n return item.showInTab.includes(currentTab.type);\r\n }\r\n return currentTab.type === item.showInTab;\r\n }\r\n return true;\r\n })\r\n .map((button, index) => {\r\n const extraProps = {};\r\n\r\n if (button.icon) {\r\n extraProps.startIcon = button.icon;\r\n }\r\n\r\n return (\r\n \r\n {button && button.customDialog}\r\n {\r\n // check status is valid before execute the button action\r\n setButtonLoading(true);\r\n\r\n try {\r\n if (!button.disableStatusChecking) {\r\n if (button.status) {\r\n let buttonStatus =\r\n typeof button.status !== 'object'\r\n ? [button.status]\r\n : button.status;\r\n const remoteFormStatusId = await checkApplicationStatus();\r\n\r\n // if remote status updated and not match with the button's status requirement, block the button action.\r\n if (!buttonStatus.includes(remoteFormStatusId)) {\r\n setButtonLoading(false);\r\n return showConfirm({\r\n description: APP_FORM_STATUS_NOT_MATCH,\r\n isError: true,\r\n disableCancelButton: true,\r\n });\r\n }\r\n }\r\n }\r\n\r\n button.action({ currentTab: currentTab.type, status: button.status });\r\n } catch (error) {\r\n console.log('101331 ApplicationActionBar.jsx error', button, error);\r\n }\r\n\r\n setButtonLoading(false);\r\n }}\r\n disabled={button.isDisabled?.()}\r\n type={button.type}\r\n >\r\n {button.text}\r\n \r\n \r\n );\r\n })}\r\n \r\n {\r\n if (\r\n [TAB_COMMENT, TAB_REVIEWER_COMMENT, TAB_CONSOLIDATION, TAB_MEETINGARRANGE].includes(\r\n currentTab.type,\r\n )\r\n ) {\r\n backToStudyInfo();\r\n } else {\r\n if (statusId === DRAFT || statusId === RETURNED || statusId === RETURN_FROM_IRB) {\r\n if (userRole === APPLICANT) {\r\n const isFormUpdated = await isFormChanged();\r\n\r\n let isConfirm = true;\r\n\r\n if (isFormUpdated) {\r\n isConfirm = await showConfirm({\r\n description: DISCARD_CONFIRM,\r\n });\r\n }\r\n\r\n if (!isConfirm) {\r\n return;\r\n }\r\n }\r\n }\r\n\r\n dispatch(\r\n setGlobal({\r\n isDetailBack: true,\r\n }),\r\n );\r\n\r\n if (getItem(KEY_PATHNAME) === '/search') {\r\n history.push(getItem(KEY_PATHNAME));\r\n } else {\r\n const url = getFolderDisplayPath(userRole, statusId);\r\n\r\n let extraQuery = '';\r\n\r\n if (url !== `/${applicationFolder}`) {\r\n extraQuery = '?page=1';\r\n }\r\n\r\n history.push(`/applications${url}${extraQuery}`);\r\n }\r\n }\r\n }}\r\n >\r\n {[TAB_COMMENT, TAB_REVIEWER_COMMENT, TAB_CONSOLIDATION, TAB_MEETINGARRANGE].includes(\r\n currentTab.type,\r\n )\r\n ? 'Back to study info'\r\n : 'Close'}\r\n \r\n \r\n
\r\n View Only
}\r\n \r\n {amendmentButtons\r\n .filter((item) => {\r\n if (item.status === undefined) {\r\n return true;\r\n }\r\n\r\n // if status is array\r\n if (typeof item.status === 'object') {\r\n return item.status.includes(statusId);\r\n }\r\n\r\n return item.status === statusId;\r\n })\r\n .filter((item) => {\r\n if (item.condition !== undefined) {\r\n return item.condition({ currentTab: currentTab.key });\r\n }\r\n\r\n return true;\r\n })\r\n .filter((item) => {\r\n if (item.showInTab) {\r\n if (isArray(item.showInTab)) {\r\n return item.showInTab.includes(currentTab.type);\r\n }\r\n return currentTab.type === item.showInTab;\r\n }\r\n return true;\r\n })\r\n .map((button, index) => {\r\n const extraProps = {};\r\n\r\n if (button.icon) {\r\n extraProps.startIcon = button.icon;\r\n }\r\n\r\n return (\r\n \r\n {button && button.customDialog}\r\n button.action()}\r\n disabled={button.isDisabled?.()}\r\n type={button.type}\r\n >\r\n {button.text}\r\n \r\n \r\n );\r\n })}\r\n
\r\n View Only
}\r\n {isLoading ? (\r\n \r\n \r\n ) : (\r\n
\r\n Loading Comments...
\r\n \r\n
\r\n ) : (remoteDetail && <>\r\n Loading Consolidation...
\r\n \r\n {\r\n setData('uploadTempId', null, true);\r\n }}\r\n enableDownload={true}\r\n downloadType=\"temp\"\r\n apiUrl={API.consolidation.downloadApprovalLetter}\r\n newRequestData={{ docType: documentType, docId: formId, }}\r\n isLocalDownload={remoteDetail.uploadTempId !== uploadTempId}\r\n />\r\n
}\r\n {forceErrorDisplay && (!uploadTempName || !uploadTempId) && [INIT_APPLICATION, AMENDMENT_FORM].includes(documentType) && (\r\n Approval letter should be uploaded
\r\n )}\r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n Type of Review:
\r\n \r\n {typeOfReview.filter(item => item.key === reviewType)[0]?.display ?? '-'}\r\n
\r\n Review Due Date:
\r\n \r\n {remoteDetail?.meetingAttendance?.reviewDueDate ?? '-'}\r\n
\r\n Review Meeting Date:
\r\n \r\n {remoteDetail?.meetingAttendance?.reviewMeetingDate ?? '-'}\r\n
\r\n Review Circulation Date:
\r\n \r\n {remoteDetail?.meetingAttendance?.reviewCirculationDate ?? '-'}\r\n
\r\n \r\n Panel Member Table: \r\n
\r\n\r\n \r\n
\r\n \r\n {getHospitalBaseListOfSection(isShowInHospitalBase).map((item, index) => {\r\n const Section = item.component;\r\n return (\r\n
\r\n );\r\n }\r\n };\r\n\r\n const hasUnderAmendment = () => {\r\n if (isAmendmentCreate) {\r\n return false;\r\n }\r\n\r\n // if isAmendment is false in the form, the application must not an amendment form\r\n if (!applicationDetail?.applicationForm?.isAmendment) {\r\n return false;\r\n }\r\n\r\n const isStudyAmendment = applicationDetail?.applicationForm?.underAmendment;\r\n\r\n // disable amendment tab if user is new site pi in draft or returned status\r\n if (isStudyAmendment) {\r\n const appStatus = applicationDetail.status.statusId;\r\n\r\n if (appStatus === DRAFT) {\r\n const isCI = checkCIAmendment(applicationDetail, user.detail);\r\n\r\n if (!isCI) {\r\n return false;\r\n }\r\n } else if (appStatus === RETURNED) {\r\n return true;\r\n }\r\n }\r\n\r\n return true;\r\n };\r\n\r\n const getApplicationTabs = () => {\r\n const applicationTabs = [{ key: 'studyInfo', display: 'Study Info', type: TAB_STUDY }];\r\n\r\n if (applicationDetail?.siteInfo) {\r\n applicationDetail.pi.forEach((item) => {\r\n if (item.endEffectiveDate) {\r\n applicationTabs.push({\r\n key: generateRandomId(),\r\n display: `${item.institution}`,\r\n type: TAB_SITE,\r\n disabled: true,\r\n });\r\n } else {\r\n applicationTabs.push({\r\n key: item.siteInfoId,\r\n display: item.institution,\r\n type: TAB_SITE,\r\n disabled: false,\r\n });\r\n }\r\n });\r\n }\r\n\r\n // amendment tab show logic\r\n let isAmendmentShow = hasUnderAmendment();\r\n\r\n if (isAmendmentShow) {\r\n applicationTabs.push({\r\n key: TAB_AMENDMENT,\r\n display:\r\n amendInstitution !== '' ? `Amendment application (${amendInstitution})` : `Amendment application`,\r\n type: TAB_AMENDMENT,\r\n });\r\n }\r\n\r\n /** statusId > 0 to show comment sheet && not amendment form && user.role !== REVIEWER*/\r\n if (applicationDetail?.status?.statusId > 0 && !isAmendmentCreate && user.role !== REVIEWER) {\r\n applicationTabs.push({ key: TAB_COMMENT, display: 'Comment Sheet', type: TAB_COMMENT });\r\n }\r\n\r\n /** This tab will be shown in IRB / Secretary / Reviewer when CCO / Secretary confirms the document in confirmed, for review, reviewed, approved, acknowledged, disapproved, completed status. */\r\n if (\r\n [FOR_REVIEW, REVIEWED, APPROVED, ACKNOWLEDGED, DISAPPROVED, COMPLETED].includes(\r\n applicationDetail?.status?.statusId,\r\n ) &&\r\n [SECRETARY, IRB, REVIEWER].includes(user.role)\r\n ) {\r\n applicationTabs.push({\r\n key: TAB_REVIEWER_COMMENT,\r\n display: 'Reviewer Comment',\r\n type: TAB_REVIEWER_COMMENT,\r\n });\r\n }\r\n\r\n const showConsolidate = [\r\n FOR_REVIEW,\r\n TERMINATED,\r\n COMPLETED,\r\n REVIEWED,\r\n ACKNOWLEDGED,\r\n DISAPPROVED,\r\n APPROVED,\r\n ].includes(applicationDetail?.status?.statusId);\r\n if (showConsolidate && [SECRETARY, IRB].includes(user.role)) {\r\n applicationTabs.push({ key: TAB_CONSOLIDATION, display: 'Consolidation', type: TAB_CONSOLIDATION });\r\n }\r\n\r\n const showMeetingArrange = [\r\n FOR_REVIEW,\r\n TERMINATED,\r\n COMPLETED,\r\n REVIEWED,\r\n ACKNOWLEDGED,\r\n DISAPPROVED,\r\n APPROVED,\r\n ].includes(applicationDetail?.status?.statusId);\r\n const meetingCase = applicationDetail?.arrangementFormIdList;\r\n if (showMeetingArrange && [SECRETARY, IRB].includes(user.role) && meetingCase?.[0] !== undefined) {\r\n applicationTabs.push({ key: TAB_MEETINGARRANGE, display: 'Meeting Arrangement', type: TAB_MEETINGARRANGE });\r\n }\r\n\r\n return applicationTabs;\r\n };\r\n\r\n const isFormTypeMatch = () => {\r\n return applicationDetail?.applicationForm?.isAmendment === isAmendment;\r\n };\r\n\r\n const getApplicationButtonBar = () => {\r\n if (!applicationDetail) {\r\n return null;\r\n }\r\n\r\n if (!isFormTypeMatch()) {\r\n return null;\r\n }\r\n\r\n if (isAmendment) {\r\n // const status = applicationDetail.status.statusId;\r\n const isAmendmentTab = currentTab.type === TAB_AMENDMENT;\r\n\r\n if (user.role === APPLICANT && isAmendmentTab) {\r\n return null;\r\n }\r\n\r\n return (\r\n \r\n
\r\n );\r\n })}\r\n \r\n
\r\n \r\n {getContent()} \r\n \r\n \r\n
\r\n )\r\n )}\r\n \r\n ) : (\r\n \r\n Coordinating Investigator delegations \r\n {\r\n if (delegationData.length >= 3) {\r\n return showDialog({\r\n description: THREE_SITE_PI_ALLOWED,\r\n disableCancelButton: true,\r\n });\r\n }\r\n\r\n setCiDelegationEdit(false);\r\n setSelectedRow({});\r\n setCiDelegationAddShow(true);\r\n }}\r\n >\r\n Add\r\n \r\n
\r\n \r\n
\r\n \r\n Site ({siteDisplay}) delegations \r\n {\r\n if (delegationData.length >= 3) {\r\n return showDialog({\r\n description: THREE_SITE_PI_ALLOWED,\r\n disableCancelButton: true,\r\n });\r\n }\r\n\r\n setPiDelegationEdit(false);\r\n setSelectedRow({});\r\n setPiDelegationAddShow(true);\r\n }}\r\n >\r\n Add\r\n \r\n
\r\n \r\n
\r\n \r\n Submit \r\n {\r\n history.push(`/applications/${folder || 'all'}`);\r\n }}\r\n >\r\n Back\r\n \r\n
\r\n\r\n {data.study && (\r\n \r\n
\r\n )}\r\n\r\n {data.siteInfo &&\r\n Object.entries(data.siteInfo)?.map(([institutionKey, dataValue], index) => {\r\n // if data === null, it means the user has no permission for that site\r\n if (!dataValue) {\r\n return null;\r\n }\r\n\r\n return (\r\n \r\n
\r\n );\r\n })}\r\n {`${params.row.firstName ? params.row.firstName : ''} ${\r\n params.row.surname ? params.row.surname : ''\r\n }`}
\r\n );\r\n },\r\n },\r\n { field: 'gender', headerName: 'Gender', width: 80 },\r\n { field: 'institution', headerName: 'Institution', width: 120 },\r\n { field: 'department', headerName: 'Department', width: 140 },\r\n { field: 'post', headerName: 'Post', width: 100 },\r\n {\r\n field: 'chairman',\r\n headerName: 'Chairman',\r\n width: 100,\r\n // renderCell: (params) => {\r\n // return \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n Type of Review:
\r\n \r\n
\r\n Review Due Date:
\r\n \r\n {\r\n // setActualStartDate(date);\r\n }}\r\n />\r\n
\r\n Review Meeting Date:
\r\n \r\n {\r\n // setActualStartDate(date);\r\n }}\r\n />\r\n
\r\n Review Circulation Date:
\r\n \r\n {\r\n // setActualStartDate(date);\r\n }}\r\n />\r\n
\r\n \r\n Panel Member Table: \r\n Add \r\n
\r\n\r\n \r\n
\r\n\r\n \r\n Submit \r\n
\r\n Expire in ≥ 30 days
\r\n \r\n ({item.notExpired}) \r\n
\r\n {'Expire in < 30 days'}
\r\n \r\n ({item.willExpired}) \r\n
\r\n Fetch Data with error
}\r\n \r\n ) : (\r\n \r\n \r\n {landing?.application?.length && (\r\n \r\n \r\n Initial Applications \r\n \r\n \r\n \r\n \r\n )}\r\n {landing?.postApprovalDocument?.length && (\r\n \r\n \r\n Post Approval Documents \r\n \r\n \r\n \r\n \r\n )}\r\n\r\n {userRole === CCO && (\r\n \r\n \r\n Pending \r\n \r\n \r\n \r\n \r\n )}\r\n \r\n
\r\n )}\r\n \r\n {item.group && (\r\n \r\n {item.group}\r\n \r\n )}\r\n \r\n
\r\n );\r\n })}\r\n \r\n {actions.map((item, index) => {\r\n if (!item.customDialog) {\r\n return null;\r\n }\r\n\r\n const CustomDialog = item.customDialog;\r\n\r\n return (\r\n \r\n
\r\n );\r\n })}\r\n \r\n Please Select the site\r\n
\r\n \r\n \r\n {\r\n setSite(e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n {\r\n setEndEffectiveDate(date);\r\n }}\r\n />\r\n
\r\n {error && {error}
}\r\n \r\n {data?.map((item, index) => {\r\n const TooltipWrapper = item.suspend ? Tooltip : SDummy;\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n {item.completed ? (\r\n
\r\n \r\n {[IRB, SECRETARY].includes(userRole) && status === APPROVED && (\r\n \r\n {item.code}\r\n
\r\n\r\n -
;\r\n }\r\n\r\n return (\r\n \r\n
\r\n );\r\n },\r\n },\r\n { field: 'id', headerName: 'ID', width: 150 },\r\n {\r\n field: 'appNo',\r\n headerName: 'CRER Application No.',\r\n width: 150,\r\n mandatory: false,\r\n defaultValue: '-',\r\n onSort: (key, isDesc) => {\r\n fetchApplication(key, isDesc);\r\n },\r\n },\r\n {\r\n field: 'refNo',\r\n headerName: 'IRB/REC Reference No.',\r\n width: 150,\r\n mandatory: false,\r\n defaultValue: '-',\r\n onSort: (key, isDesc) => {\r\n fetchApplication(key, isDesc);\r\n },\r\n },\r\n {\r\n field: 'subNo',\r\n headerName: 'Submission No.',\r\n width: 150,\r\n mandatory: false,\r\n onSort: (key, isDesc) => {\r\n fetchApplication(key, isDesc);\r\n },\r\n },\r\n {\r\n field: 'p1scientificTitle',\r\n headerName: 'Scientific Title',\r\n width: 250,\r\n dotNotion: true,\r\n mandatory: true,\r\n textNotWrap: true,\r\n onSort: (key, isDesc) => {\r\n fetchApplication(key, isDesc);\r\n },\r\n goToPath: (params) => {\r\n setItem(KEYS.APP_PAGE, page);\r\n setItem(KEYS.APP_PAGE_SIZE, pageSize);\r\n history.push(`/applications/initial-application-form?id=${params.row.id}`);\r\n },\r\n hoverComponent: (params) => {\r\n return (\r\n \r\n {params.row.p1scientificTitle}\r\n
\r\n );\r\n },\r\n },\r\n {\r\n field: 'coordinator',\r\n headerName: 'Coordinating Investigator (CI)',\r\n width: 150,\r\n onSort: (key, isDesc) => {\r\n fetchApplication(key, isDesc);\r\n },\r\n },\r\n {\r\n field: 'coordinatorHospital',\r\n headerName: 'CI Hospital/Institution',\r\n width: 150,\r\n sortKey: 'institution',\r\n onSort: (key, isDesc) => {\r\n fetchApplication('institution', isDesc);\r\n },\r\n },\r\n {\r\n field: 'statusId',\r\n headerName: 'Status',\r\n mandatory: true,\r\n width: 100,\r\n disableItemSort: true,\r\n filterValue: (params) => {\r\n if (user.role === APPLICANT) {\r\n return getApplicantStatusDisplay(params.value);\r\n }\r\n return statusKeyToDisplay(params.row.statusId);\r\n },\r\n valueGetter: (params) => {\r\n if (user.role === APPLICANT) {\r\n return getApplicantStatusDisplay(params.value);\r\n }\r\n return statusKeyToDisplay(params.value);\r\n },\r\n onSort: (key, isDesc) => {\r\n fetchApplication(key, isDesc);\r\n },\r\n },\r\n {\r\n field: 'siteResponseList',\r\n headerName: 'Site Info',\r\n width: 120,\r\n mandatory: false,\r\n filterValue: (params) => {\r\n const { siteResponseList } = params.row;\r\n\r\n const isAllComplete = siteResponseList.every((item) => item.completed);\r\n\r\n if (isAllComplete) {\r\n return 'Ready to submit';\r\n } else {\r\n return 'Incomplete';\r\n }\r\n },\r\n renderCell: (params) => {\r\n const { complete, statusId, siteResponseList, id } = params.row;\r\n\r\n const editStatus = statusId === DRAFT || statusId === RETURNED;\r\n\r\n // if (!editStatus) {\r\n // return '-';\r\n // }\r\n\r\n return (\r\n \r\n {editStatus &&
\r\n );\r\n\r\n // if (statusId === DRAFT || statusId === RETURNED) {\r\n\r\n // } else {\r\n // return '-';\r\n // }\r\n },\r\n disableItemSort: true,\r\n },\r\n {\r\n field: 'updateDtm',\r\n headerName: 'Last Modified Date',\r\n width: 160,\r\n mandatory: false,\r\n filterValue: (params) => {\r\n return getTimeWithTimeZone(params.row.updateDtm).format('YYYY-MM-DD HH:mm:ss');\r\n },\r\n valueGetter: (params) => {\r\n return getTimeWithTimeZone(params.row.updateDtm).format('YYYY-MM-DD HH:mm:ss');\r\n },\r\n onSort: (key, isDesc) => {\r\n fetchApplication(key, isDesc);\r\n },\r\n },\r\n {\r\n field: 'expiryDtm',\r\n headerName: 'Expiry Date',\r\n width: 120,\r\n disableItemSort: user.role === REVIEWER, // disable sorting when the user role is reviewer to prevent error occur\r\n onSort: (key, isDesc) => {\r\n fetchApplication(key, isDesc);\r\n },\r\n valueGetter: (params) => {\r\n if (params.row.statusId !== RETURNED) {\r\n return '-';\r\n }\r\n\r\n const expiry = params.row.expiryDtm;\r\n\r\n if (!expiry) {\r\n return '-';\r\n }\r\n\r\n return getTimeWithTimeZone(expiry).format('YYYY-MM-DD');\r\n },\r\n },\r\n {\r\n field: 'lastHandledBy',\r\n headerName: 'Last Handled by',\r\n width: 120,\r\n sortKey: 'lastHandledBy',\r\n mandatory: false,\r\n hiddenInRoles: [APPLICANT],\r\n valueGetter: (params) => {\r\n if (!params.value) {\r\n return '-';\r\n }\r\n\r\n return roleDisplayLookup[params.value];\r\n },\r\n onSort: (key, isDesc) => {\r\n fetchApplication(key, isDesc);\r\n },\r\n },\r\n\r\n {\r\n field: 'versionNo',\r\n headerName: 'Version No.',\r\n width: 80,\r\n valueGetter: (params) => {\r\n return params.value;\r\n },\r\n onSort: (key, isDesc) => {\r\n fetchApplication(key, isDesc);\r\n },\r\n },\r\n {\r\n field: 'singleCluster',\r\n headerName: 'Single/Multi-Cluster',\r\n width: 120,\r\n onSort: (key, isDesc) => {\r\n fetchApplication(key, isDesc);\r\n },\r\n filterValue: (params) => {\r\n if (params.row.singleCluster === true) {\r\n return 'Single';\r\n } else if (params.row.singleCluster === false) {\r\n return 'Multiple';\r\n } else {\r\n return '-';\r\n }\r\n },\r\n disableItemSort: true,\r\n valueGetter: (params) => {\r\n if (params.row.singleCluster === true) {\r\n return 'Single';\r\n } else if (params.row.singleCluster === false) {\r\n return 'Multiple';\r\n } else {\r\n return '-';\r\n }\r\n },\r\n },\r\n {\r\n field: 'subTable',\r\n hiddenInTableColumn: true,\r\n getIsToggleEnable: (params) => {\r\n const { postApprovalDocumentResults } = params.row;\r\n if (postApprovalDocumentResults.length === 0) {\r\n return false;\r\n }\r\n\r\n return true;\r\n },\r\n subTable: (params) => {\r\n const { postApprovalDocumentResults } = params.row;\r\n\r\n return (\r\n {complete}
}\r\n \r\n
\r\n \r\n
\r\n );\r\n },\r\n },\r\n {\r\n field: 'action',\r\n headerName: 'Action',\r\n width: 80,\r\n disableItemSort: true,\r\n disableInColumnSelect: true,\r\n disableResize: true,\r\n mandatory: true,\r\n renderCell: (params) => {\r\n return (\r\n - \r\n {getColumnSelection().map((value) => {\r\n const labelId = `checkbox-list-label-${value.field}`;\r\n\r\n const isChecked = applicationColumn.some((item) => {\r\n return item.key === value.field;\r\n });\r\n\r\n return (\r\n
\r\n {\r\n fetchApplication({ pageSize: value });\r\n }}\r\n />\r\n
\r\n \r\n User Profile \r\n \r\n Change Password\r\n \r\n\r\n \r\n \r\n setPasswordValidity(\r\n produce((draft) => {\r\n draft.oldPassword = isValid;\r\n }),\r\n )\r\n }\r\n value={passwordPostData?.oldPassword ?? ''}\r\n handleChange={onPasswordUpdate}\r\n forceErrorDisplay={forcePasswordValidationShow}\r\n />\r\n \r\n \r\n \r\n setPasswordValidity(\r\n produce((draft) => {\r\n draft.newPassword = isValid;\r\n }),\r\n )\r\n }\r\n value={passwordPostData?.newPassword ?? ''}\r\n handleChange={onPasswordUpdate}\r\n forceErrorDisplay={forcePasswordValidationShow}\r\n />\r\n \r\n \r\n \r\n setPasswordValidity(\r\n produce((draft) => {\r\n draft.confirmNewPassword = isValid;\r\n }),\r\n )\r\n }\r\n value={passwordPostData?.confirmNewPassword ?? ''}\r\n handleChange={onPasswordUpdate}\r\n forceErrorDisplay={forcePasswordValidationShow}\r\n />\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default Profile;\r\n","import { useDispatch, useSelector } from 'react-redux';\r\nimport { useHistory } from 'react-router-dom';\r\nimport usePostApprovalTableAction from 'store/postApproval/usePostApprovalTableAction';\r\nimport MenuAction from 'components/MenuAction';\r\nimport { setGlobal } from 'store/global/reducer';\r\nimport { getTimeWithTimeZone, isPendingCheck } from 'utility/general';\r\nimport { POST_APPROVAL_LIST_FETCH, GET_SIGNED_DOCUMENT } from 'store/key';\r\nimport { KEYS, setItem } from 'storage';\r\nimport { SHyperLink } from 'style/CommonStyledComponent';\r\nimport { documentTypePaths } from 'utility/postApprovalLookUp';\r\nimport CustomLink from 'components/CustomLink';\r\nimport ErrorOutlineIcon from '@material-ui/icons/ErrorOutline';\r\nimport {\r\n APPLICANT,\r\n getApplicantStatusDisplay,\r\n REVIEWER,\r\n statusKeyToDisplay,\r\n CCO,\r\n CLUSTER_ADMIN,\r\n IRB,\r\n SECRETARY,\r\n HO_ADMIN,\r\n DRAFT,\r\n RETURNED,\r\n roleDisplayLookup,\r\n} from 'utility/lookup';\r\n\r\nconst MenuActionWithPostApprovalData = ({ row, fetchPostApproval }) => {\r\n const postApprovalActions = usePostApprovalTableAction({ row, fetchPostApproval });\r\n\r\n if (postApprovalActions.length <= 0) {\r\n return '-';\r\n }\r\n\r\n return \r\n \r\n \r\n \r\n {\r\n setFormValidity(\r\n produce((draft) => {\r\n draft.title = isValid;\r\n }),\r\n );\r\n }}\r\n value={userPostData.title ?? userDetail.title ?? ''}\r\n onChange={postDataOnChange}\r\n />\r\n \r\n \r\n {\r\n setFormValidity(\r\n produce((draft) => {\r\n draft.firstName = isValid;\r\n }),\r\n );\r\n }}\r\n value={userPostData.firstName ?? userDetail.firstName ?? ''}\r\n onChange={postDataOnChange}\r\n />\r\n \r\n \r\n {\r\n setFormValidity(\r\n produce((draft) => {\r\n draft.firstName = isValid;\r\n }),\r\n );\r\n }}\r\n value={userPostData.surname ?? userDetail.surname ?? ''}\r\n onChange={postDataOnChange}\r\n />\r\n \r\n \r\n \r\n setFormValidity(\r\n produce((draft) => {\r\n draft.institution = isValid;\r\n }),\r\n )\r\n }\r\n isAuthorizedEmail={isAuthorizedEmail(userDetail.email.toLowerCase())}\r\n hospitalOrInstitution={userPostData.institution ?? userDetail.institution}\r\n setHospitalOrInstitution={postDataOnChange}\r\n />\r\n \r\n \r\n \r\n setFormValidity(\r\n produce((draft) => {\r\n draft.contact = isValid;\r\n }),\r\n )\r\n }\r\n value={userPostData.contact ?? userDetail.contact ?? ''}\r\n onChange={postDataOnChange}\r\n />\r\n \r\n {isAuthorizedEmail(userDetail.email.toLowerCase()) && (\r\n \r\n \r\n )}\r\n\r\n
\r\n \r\n \r\n Reset\r\n \r\n \r\n Update\r\n \r\n
\r\n \r\n Password Policy: \r\n 1. Min Length Password is 8 \r\n 2. Contains at least one numeric character \r\n 3. Contains at least one upper case \r\n 4. Contains at least one lower case \r\n\r\n
\r\n \r\n \r\n Update\r\n \r\n
\r\n -
;\r\n }\r\n\r\n return (\r\n \r\n
\r\n );\r\n },\r\n },\r\n {\r\n field: 'subNo',\r\n headerName: 'Submission No.',\r\n width: 170,\r\n mandatory: false,\r\n onSort: (key, isDesc) => {\r\n fetchPostApproval(key, isDesc);\r\n },\r\n },\r\n {\r\n field: 'p1scientificTitle',\r\n headerName: 'Scientific Title',\r\n dotNotion: true,\r\n mandatory: true,\r\n textNotWrap: true,\r\n onSort: (key, isDesc) => {\r\n fetchPostApproval(key, isDesc);\r\n },\r\n goToPath: (params) => {\r\n setDisplayItem(params.row);\r\n // console.log('114026 usePostApprovalData.js',)\r\n\r\n dispatch(\r\n setGlobal({\r\n sideBarApplicationId: params.row.irbNo,\r\n sideBarPostApprovalId: params.row.id,\r\n }),\r\n );\r\n },\r\n hoverComponent: (params) => {\r\n return (\r\n \r\n {params.row.p1scientificTitle}\r\n
\r\n );\r\n },\r\n width: 250,\r\n },\r\n {\r\n field: 'documentType',\r\n headerName: 'Document Type',\r\n mandatory: true,\r\n width: 220,\r\n onSort: (key, isDesc) => {\r\n fetchPostApproval(key, isDesc);\r\n },\r\n renderCell: (params) => {\r\n const { documentType, id, docType } = params.row;\r\n\r\n if (documentTypePaths[docType]) {\r\n return (\r\n - \r\n {getColumnSelection().map((value) => {\r\n const labelId = `checkbox-list-label-${value}`;\r\n\r\n const isChecked = postApprovalColumn.some((item) => {\r\n return item.key === value.field;\r\n });\r\n\r\n return (\r\n
\r\n {\r\n isFullView ? onFullViewShow(false) : setDisplayItem(null);\r\n }}\r\n >\r\n
\r\n No Relevant Documents
\r\n )}\r\n No Document is Found
\r\n )}\r\n \r\n )}\r\n \r\n \r\n \r\n \r\n \r\n Basic Search\r\n \r\n \r\n {Object.keys(basicFormData).length &&\r\n Object.keys(basicFormData).map((i) => {\r\n const item = basicFormData[i];\r\n return item.hideInApplicant && isApplicant ? null : (\r\n \r\n \r\n handleFormData(e, item.groupType)}\r\n forceErrorDisplay={forceErrorDisplay}\r\n isValidValue={valid => changeDataValid(item, valid)}\r\n />\r\n \r\n \r\n );\r\n })}\r\n \r\n \r\n \r\n \r\n {searchType === ADVANCED ? \r\n \r\n {showAdvancedSearch &&\r\n Object.keys(advancedFormData).length &&\r\n Object.keys(advancedFormData).map((i) => {\r\n const item = advancedFormData[i];\r\n let dateObj = {};\r\n if (item.type === 'date') {\r\n item.maxDateField && advancedFormData[item.maxDateField]?.value && (dateObj.maxDate = advancedFormData[item.maxDateField]?.value)\r\n item.minDateField && advancedFormData[item.minDateField]?.value && (dateObj.minDate = advancedFormData[item.minDateField]?.value)\r\n }\r\n return item.hideInApplicant && isApplicant ? null : (\r\n \r\n \r\n handleFormData(e, item.groupType)}\r\n {...dateObj}\r\n />\r\n \r\n \r\n );\r\n })}\r\n \r\n \r\n
\r\n );\r\n};\r\n","import React from 'react';\r\nimport { Grid } from '@material-ui/core';\r\nimport CustomButton from 'components/CustomInput/Button/index';\r\nimport {\r\n EXPORT_APPLICATION_SEARCH,\r\n DOWNLOAD_APPLICATION,\r\n EXPORT_APPLICATION_SEARCH_NTEC,\r\n GET_POST_APPROVAL_ZIP,\r\n} from 'store/key';\r\nimport { useDispatch } from 'react-redux';\r\nimport { searchDocTypeEnum } from 'hooks/search/searchData';\r\nimport { setGlobalLoading } from 'store/global/reducer';\r\nimport { useSelector } from 'react-redux';\r\nimport { CCO, SECRETARY } from 'utility/lookup';\r\n\r\nexport default function Search({ loadList, selectedRows = [], resetData, searchData, isValid, resultRows }) {\r\n const dispatch = useDispatch();\r\n const user = useSelector((state) => state.user);\r\n\r\n const { isLoading, docType, conditionsRequests } = searchData;\r\n\r\n const handleReset = () => {\r\n resetData();\r\n };\r\n\r\n const handleExport = (e, flag) => {\r\n if (isValid()) {\r\n const data = {\r\n docType: docType,\r\n conditionsRequests: conditionsRequests,\r\n sort: 'updateDtm',\r\n isDesc: true,\r\n };\r\n\r\n console.log('data', data);\r\n\r\n setGlobalLoading(true);\r\n\r\n dispatch({\r\n type: flag === 'ntec' ? EXPORT_APPLICATION_SEARCH_NTEC : EXPORT_APPLICATION_SEARCH,\r\n payload: {\r\n data: data,\r\n callback: () => setGlobalLoading(false),\r\n },\r\n });\r\n }\r\n };\r\n\r\n const handleDownload = () => {\r\n if (isValid()) {\r\n setGlobalLoading(true);\r\n if (docType === searchDocTypeEnum.INIT_APPLICATION) {\r\n /** download initial application */\r\n const requestData = selectedRows.map((item) => {\r\n let data = {\r\n id: item.id,\r\n docType,\r\n };\r\n return data;\r\n });\r\n\r\n dispatch({\r\n type: DOWNLOAD_APPLICATION,\r\n payload: {\r\n data: requestData,\r\n callback: () => setGlobalLoading(false),\r\n },\r\n });\r\n } else {\r\n /** download post approval document */\r\n const type = selectedRows[0].docType;\r\n const reportId = selectedRows[0].id;\r\n dispatch({\r\n type: GET_POST_APPROVAL_ZIP,\r\n payload: {\r\n docType: type,\r\n docId: reportId,\r\n final: () => setGlobalLoading(false),\r\n },\r\n });\r\n }\r\n }\r\n };\r\n const getDownloadText = () => {\r\n let text = '';\r\n if (docType) {\r\n if (docType === searchDocTypeEnum.INIT_APPLICATION) {\r\n text = 'Application';\r\n } else {\r\n text = 'Post Approval Document';\r\n }\r\n }\r\n return text;\r\n };\r\n\r\n const exportToJsonPermission = () => {\r\n if (user.role === SECRETARY && user.detail.secretarySubType === 'NTEC') {\r\n return true;\r\n }\r\n\r\n if (user.role === SECRETARY && user.detail.secretarySubType === 'HKWC') {\r\n return true;\r\n }\r\n\r\n if (user.role === CCO) {\r\n return true;\r\n }\r\n\r\n return false;\r\n };\r\n\r\n return (\r\n \r\n setFullViewShow(isShow)}\r\n isShow={isFullViewShow}\r\n onClose={() => setFullViewShow(false)}\r\n />\r\n \r\n \r\n \r\n \r\n \r\n {showCriteria ? \r\n Search Criteria\r\n \r\n \r\n \r\n {showCriteria && (\r\n \r\n \r\n \r\n \r\n Search Results\r\n \r\n \r\n \r\n \r\n {displayItem && (\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default Search;\r\n","import CustomButton from 'components/CustomInput/Button';\r\nimport API from 'api/call';\r\nimport { setGlobalLoading } from 'store/global/reducer';\r\nimport React, { useState } from 'react';\r\nimport useCommentDialog from 'components/CommentDialog/useCommentDialog';\r\nimport { useSelector } from 'react-redux';\r\nimport { REJECT_CONFIRM } from 'utility/frontendMessage';\r\n\r\nconst useUserApprovalData = (props) => {\r\n const { setWarningMsg } = props;\r\n const showCommentDialog = useCommentDialog();\r\n const systemMessage = useSelector((state) => state.systemMessage.systemMessage);\r\n\r\n const [row, setRow] = useState([]);\r\n\r\n const rawColumn = [\r\n { field: 'email', headerName: 'Email', width: 150 },\r\n { field: 'title', headerName: 'Title', width: 150 },\r\n { field: 'firstName', headerName: 'First Name', width: 100 },\r\n { field: 'surname', headerName: 'Surname', width: 100 },\r\n { field: 'institution', headerName: 'Hospital / Institution', width: 150 },\r\n { field: 'justification', headerName: 'Justifications', width: 250 },\r\n { field: 'contact', headerName: 'Contact Number', width: 150 },\r\n {\r\n field: 'action',\r\n headerName: 'Action',\r\n width: 200,\r\n renderCell: (params) => {\r\n return (\r\n \r\n 0}\r\n isExpandRow={isApplication}\r\n columns={columns}\r\n rows={getFilterResultApplication()}\r\n allowResize\r\n onRowSelected={(row) => onSelectionModelChange(row)}\r\n loading={isLoading}\r\n isExpandAll={expandCount}\r\n />\r\n\r\n \r\n \r\n
\r\n \r\n \r\n {\r\n setFilterKeyword(value);\r\n }}\r\n value={filterKeyword}\r\n />\r\n \r\n
\r\n\r\n \r\n {isApplication ? setExpandCount(-1 - Math.random())}>\r\n Collapse All\r\n \r\n setExpandCount(1 + Math.random())}>\r\n Expand All\r\n \r\n }\r\n
\r\n\r\n \r\n
\r\n \r\n setFullViewShow(isShow)}\r\n />\r\n
\r\n )}\r\n\r\n {sideBarApplicationId && (\r\n \r\n setFullViewShow(isShow)} />\r\n
\r\n )}\r\n \r\n approvePendingApprovalUser(params.row)}>Approve \r\n handleReject(params.row)}>\r\n Reject\r\n \r\n
\r\n );\r\n },\r\n },\r\n ];\r\n\r\n const getPendingApprovalUser = () => {\r\n setGlobalLoading(true);\r\n API.user\r\n .getPendingApprovalUser()\r\n .then((res) => {\r\n setRow(res.data?.result);\r\n })\r\n .finally(() => {\r\n setGlobalLoading(false);\r\n });\r\n };\r\n\r\n const approvePendingApprovalUser = (row) => {\r\n setGlobalLoading(true);\r\n API.user\r\n .approveEmailAccount({\r\n id: row.id,\r\n decision: 1,\r\n email: row.email,\r\n workflowId: row.workflowId,\r\n })\r\n .then((res) => {\r\n getPendingApprovalUser();\r\n setWarningMsg({\r\n type: 'success',\r\n message: systemMessage.approvePendingApprovalUserSuccess,\r\n footerActions: [\r\n {\r\n label: 'Confirm',\r\n clicked: () => {\r\n setWarningMsg(null);\r\n },\r\n },\r\n ],\r\n });\r\n })\r\n .finally(() => {\r\n setGlobalLoading(false);\r\n });\r\n };\r\n\r\n const handleReject = async (row) => {\r\n const { submit, comment } = await showCommentDialog({\r\n title: REJECT_CONFIRM,\r\n description: '',\r\n placeholder: 'Please state the reason(s).',\r\n });\r\n if (submit) {\r\n rejectPendingApprovalUser(row, comment);\r\n }\r\n };\r\n\r\n const rejectPendingApprovalUser = (row, comment) => {\r\n setGlobalLoading(true);\r\n API.user\r\n .approveEmailAccount({\r\n id: row.id,\r\n decision: 2,\r\n email: row.email,\r\n reason: comment,\r\n workflowId: row.workflowId,\r\n })\r\n .then((res) => {\r\n getPendingApprovalUser();\r\n setWarningMsg({\r\n type: 'success',\r\n message: systemMessage.rejectPendingApprovalUserSuccess,\r\n footerActions: [\r\n {\r\n label: 'Confirm',\r\n clicked: () => {\r\n setWarningMsg(null);\r\n },\r\n },\r\n ],\r\n });\r\n })\r\n .finally(() => {\r\n setGlobalLoading(false);\r\n });\r\n };\r\n\r\n return {\r\n columns: rawColumn,\r\n rawColumn: rawColumn,\r\n rows: row,\r\n getPendingApprovalUser,\r\n approvePendingApprovalUser,\r\n rejectPendingApprovalUser,\r\n };\r\n};\r\n\r\nexport default useUserApprovalData;\r\n","import CustomTable from 'components/CustomTable';\r\nimport useUserApprovalData from 'hooks/tableData/useUserApprovalData';\r\nimport React, { useState, useEffect } from 'react';\r\nimport styled from 'styled-components/macro';\r\nimport MsgBox from 'components/MsgBox/MsgBox';\r\n\r\nconst SLayout = styled.div`\r\n padding: 15px;\r\n`;\r\n\r\nconst UserApproval = (props) => {\r\n const [warningMsg, setWarningMsg] = useState(null);\r\n \r\n const { rows, columns, getPendingApprovalUser } = useUserApprovalData({ ...props, setWarningMsg});\r\n\r\n useEffect(() => {\r\n getPendingApprovalUser();\r\n // eslint-disable-next-line\r\n }, []);\r\n\r\n return \r\n Meeting Arrangement List \r\n {\r\n history.push('/review/arrange-meeting');\r\n }}\r\n >\r\n Add\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n {}}\r\n choices={[\r\n {\r\n key: 'M',\r\n display: 'Male',\r\n },\r\n {\r\n key: 'F',\r\n display: 'Female',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {warningMsg && (\r\n {\r\n getUserAccounts({ page, pageSize });\r\n }}\r\n />\r\n )}\r\n {isView && \r\n \r\n \r\n {\r\n getUserAccounts({ page, pageSize });\r\n }}\r\n />\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default UserAccount;\r\n","import React, { useState, useRef, useEffect } from 'react';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport { Grid, FormControl, RadioGroup, FormControlLabel, Radio, Typography } from '@material-ui/core';\r\nimport Popup from 'components/popup/popup';\r\nimport CustomTextField from 'components/Input/CustomTextField';\r\nimport HospitalOrInstitutions from 'components/Global/HospitalOrInstitutions';\r\nimport CustomButton from 'components/CustomInput/Button';\r\nimport useDialog from 'components/ConfirmDialog/useDialog';\r\nimport { EDIT_EMAIL_CONFIRM, NO_INPUT_DATA_MODIFIED } from 'utility/frontendMessage';\r\nimport API from 'api/call';\r\nimport PasswordTextField from 'components/Input/PasswordTextField';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n container: {\r\n flex: 1,\r\n overflow: 'auto',\r\n },\r\n title: {\r\n fontWeight: 'bold',\r\n },\r\n item: {\r\n marginTop: theme.spacing(2),\r\n },\r\n radioGroup: {\r\n flexDirection: 'row',\r\n flexWrap: 'nowrap',\r\n },\r\n}));\r\n\r\nexport default function CreateEditReviewer({ rowData, editReviewer, createReviewer, setOpenPopup, openPopup }) {\r\n const classes = useStyles();\r\n const showDialog = useDialog();\r\n\r\n const [forceShowError, setForceShowError] = useState(false);\r\n const [forceShowEmialError, setForceShowEmialError] = useState(false);\r\n const isUserEdit = rowData ? true : false;\r\n\r\n const [email, setEmail] = useState(rowData ? rowData.email : '');\r\n const [firstName, setFirstName] = useState(rowData ? rowData.firstName : '');\r\n const [surname, setSurname] = useState(rowData ? rowData.surname : '');\r\n const [title, setTitle] = useState(rowData ? rowData.title : '');\r\n const [gender, setGender] = useState(rowData ? rowData.gender : '');\r\n const [department, setDepartment] = useState(rowData ? rowData.department : '');\r\n const [post, setPost] = useState(rowData ? rowData.post : '');\r\n const [institution, setInstitution] = useState(rowData ? rowData.institution : '');\r\n const [background, setBackground] = useState(rowData ? rowData.background : '');\r\n const [independent, setIndependent] = useState(rowData ? (rowData.independent ? 1 : 0) : null);\r\n const [password, setPassword] = useState('');\r\n const [confirmPassword, setConfirmPassword] = useState('');\r\n\r\n const [isProfileLoaded, setProfileLoaded] = useState(false);\r\n const [canEditEmail, setCanEditEmail] = useState(true);\r\n const [isLoading, setIsLoading] = useState(false);\r\n const [isExistingUser, setIsExistingUser] = useState(false);\r\n\r\n const [id, setId] = useState(rowData ? rowData.id : null);\r\n\r\n const disable = canEditEmail || isLoading || !isProfileLoaded;\r\n const isDisabled = isUserEdit ? false : disable;\r\n\r\n // pre-fill data: user can not edit the firstName,surname,title,institution\r\n const canEditPreFill = false;\r\n let isPreFillDisabled = true;\r\n if (isUserEdit) {\r\n // Edit reviewer\r\n if (canEditPreFill) {\r\n isPreFillDisabled = false;\r\n } else {\r\n isPreFillDisabled = true;\r\n }\r\n } else {\r\n // Create reviewer\r\n if (canEditPreFill) {\r\n isPreFillDisabled = disable || false;\r\n } else {\r\n isPreFillDisabled = isExistingUser || disable;\r\n }\r\n }\r\n\r\n const isDisabledEmail = isUserEdit || isLoading || !canEditEmail;\r\n\r\n const createFormValid = {\r\n email: true,\r\n firstName: true,\r\n surname: true,\r\n title: true,\r\n gender: false,\r\n department: true,\r\n post: true,\r\n institution: true,\r\n background: false,\r\n independent: false,\r\n password: true,\r\n confirmPassword: true,\r\n };\r\n\r\n const editFormValid = {\r\n email: true,\r\n firstName: true,\r\n surname: true,\r\n title: true,\r\n gender: true,\r\n department: true,\r\n post: true,\r\n institution: true,\r\n background: true,\r\n independent: true,\r\n };\r\n\r\n const formValid = useRef(isUserEdit ? editFormValid : createFormValid);\r\n\r\n const updateFormValid = (key, value) => {\r\n formValid.current[key] = value;\r\n };\r\n\r\n useEffect(() => {\r\n if (gender === null || gender === undefined) {\r\n updateFormValid('gender', false);\r\n }\r\n\r\n if (background === null || background === undefined) {\r\n updateFormValid('background', false);\r\n }\r\n\r\n if (independent === null || independent === undefined) {\r\n updateFormValid('independent', false);\r\n }\r\n }, [gender, background, independent]);\r\n\r\n const loadReviewerDetail = () => {\r\n API.reviewer\r\n .getReviewerDetail(email)\r\n .then((result) => {\r\n const res = result.data.result;\r\n if (res) {\r\n // Existing User\r\n setIsExistingUser(true);\r\n if (!isUserEdit) {\r\n delete formValid.current.password;\r\n delete formValid.current.confirmPassword;\r\n }\r\n\r\n // set default data\r\n setEmail(res.email);\r\n setFirstName(res.firstName);\r\n setSurname(res.surname);\r\n setTitle(res.title);\r\n setInstitution(res.institution);\r\n setGender(res.gender ?? '');\r\n setDepartment(res.department ?? '');\r\n setPost(res.post ?? '');\r\n setBackground(res.background ?? '');\r\n setIndependent(res.independent !== null ? (res.independent ? 1 : 0) : '');\r\n\r\n updateFormValid('gender', res.gender ? true : false);\r\n updateFormValid('background', res.background ? true : false);\r\n updateFormValid('independent', res.independent !== null ? true : false);\r\n\r\n setId(res.id);\r\n\r\n if (res.message) {\r\n showDialog({\r\n description: res.message,\r\n disableCancelButton: true,\r\n });\r\n }\r\n } else {\r\n // not Existing User\r\n setIsExistingUser(false);\r\n if (!isUserEdit) {\r\n formValid.current = {\r\n ...formValid.current,\r\n password: true,\r\n confirmPassword: true,\r\n };\r\n }\r\n }\r\n })\r\n .finally(() => {\r\n setIsLoading(false);\r\n setCanEditEmail(false);\r\n setProfileLoaded(true);\r\n });\r\n };\r\n\r\n const handleLoadProfile = async () => {\r\n if (canEditEmail) {\r\n if (!formValid.current.email) {\r\n setForceShowEmialError(true);\r\n return;\r\n }\r\n\r\n setIsLoading(true);\r\n loadReviewerDetail();\r\n } else {\r\n const isConfirm = await showDialog({\r\n description: EDIT_EMAIL_CONFIRM,\r\n });\r\n if (isConfirm) {\r\n // setCanEditEmail(true);\r\n reset();\r\n }\r\n }\r\n };\r\n\r\n const checkFormValid = () => {\r\n console.log('%c 115738 createEdit.js formValid', 'background: green', formValid);\r\n\r\n let valid = true;\r\n for (let key in formValid.current) {\r\n if (!formValid.current[key]) {\r\n valid = false;\r\n break;\r\n }\r\n }\r\n return valid;\r\n };\r\n\r\n const getEditData = () => {\r\n let data = { id: id };\r\n if (!isPreFillDisabled) {\r\n if (firstName !== rowData?.firstName) {\r\n data.firstName = firstName;\r\n }\r\n if (surname !== rowData?.surname) {\r\n data.surname = surname;\r\n }\r\n if (title !== rowData?.title) {\r\n data.title = title;\r\n }\r\n if (institution !== rowData?.institution) {\r\n data.institution = institution;\r\n }\r\n }\r\n\r\n if (gender !== rowData?.gender) {\r\n data.gender = gender;\r\n }\r\n if (department !== rowData?.department) {\r\n data.department = department;\r\n }\r\n if (post !== rowData?.post) {\r\n data.post = post;\r\n }\r\n if (background !== rowData?.background) {\r\n data.background = background;\r\n }\r\n const newIndependent = independent ? true : false;\r\n if (newIndependent !== rowData?.independent) {\r\n data.independent = newIndependent;\r\n }\r\n\r\n return data;\r\n };\r\n\r\n const submit = () => {\r\n if (!checkFormValid()) {\r\n setForceShowError(true);\r\n setForceShowEmialError(true);\r\n return;\r\n }\r\n\r\n if (isUserEdit || isExistingUser) {\r\n const data = getEditData();\r\n if (Object.keys(data).length === 1) {\r\n showDialog({\r\n description: NO_INPUT_DATA_MODIFIED,\r\n disableCancelButton: true,\r\n });\r\n return;\r\n }\r\n editReviewer(data, isUserEdit);\r\n } else {\r\n let data = {\r\n email,\r\n gender,\r\n department,\r\n post,\r\n background,\r\n independent: independent ? true : false,\r\n };\r\n\r\n if (!isExistingUser) {\r\n data = {\r\n ...data,\r\n firstName,\r\n surname,\r\n title,\r\n institution,\r\n password,\r\n confirmPassword,\r\n };\r\n }\r\n createReviewer(data);\r\n }\r\n };\r\n const cancel = () => {\r\n setOpenPopup(false);\r\n };\r\n const reset = () => {\r\n setCanEditEmail(true);\r\n setEmail(rowData ? rowData.email : '');\r\n setFirstName(rowData ? rowData.firstName : '');\r\n setSurname(rowData ? rowData.surname : '');\r\n setTitle(rowData ? rowData.title : '');\r\n setGender(rowData ? rowData.gender : '');\r\n setDepartment(rowData ? rowData.department : '');\r\n setPost(rowData ? rowData.post : '');\r\n setInstitution(rowData ? rowData.institution : '');\r\n setBackground(rowData ? rowData.background : '');\r\n setIndependent(rowData ? (rowData.independent ? 1 : 0) : '');\r\n };\r\n return (\r\n \r\n
\r\n\r\n \r\n Create \r\n \r\n \r\n
\r\n \r\n setFormDataValid(valid)}\r\n forceErrorDisplay={forceShowError}\r\n value={searchKeyword}\r\n onChange={(e) => setSearchKeyword(e.target.value)}\r\n maxLength={255}\r\n />\r\n
\r\n \r\n {\r\n getUserAccounts({ pageSize: value });\r\n }}\r\n />\r\n
\r\n \r\n \r\n \r\n Email:\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n First Name:\r\n \r\n \r\n setFirstName(e.target.value)}\r\n validators={['isRequired', 'disableChinese']}\r\n isValidValue={(valid) => updateFormValid('firstName', valid)}\r\n forceErrorDisplay={forceShowError}\r\n maxLength={255}\r\n />\r\n \r\n \r\n \r\n \r\n Surname:\r\n \r\n \r\n setSurname(e.target.value)}\r\n validators={['isRequired', 'disableChinese']}\r\n isValidValue={(valid) => updateFormValid('surname', valid)}\r\n forceErrorDisplay={forceShowError}\r\n maxLength={255}\r\n />\r\n \r\n \r\n \r\n\r\n \r\n \r\n Title:\r\n \r\n \r\n setTitle(e.target.value)}\r\n validators={['isRequired', 'disableChinese']}\r\n isValidValue={(valid) => updateFormValid('title', valid)}\r\n forceErrorDisplay={forceShowError}\r\n maxLength={255}\r\n />\r\n \r\n \r\n \r\n \r\n Gender:\r\n \r\n \r\n \r\n {\r\n updateFormValid('gender', true);\r\n setGender(e.target.value);\r\n }}\r\n >\r\n \r\n {forceShowError && !gender && (\r\n \r\n At least one of the option should be selected. \r\n \r\n )}\r\n \r\n \r\n \r\n \r\n Department:\r\n \r\n \r\n setDepartment(e.target.value)}\r\n validators={['isRequired', 'disableChinese']}\r\n isValidValue={(valid) => updateFormValid('department', valid)}\r\n forceErrorDisplay={forceShowError}\r\n maxLength={255}\r\n />\r\n \r\n \r\n \r\n \r\n Post:\r\n \r\n \r\n setPost(e.target.value)}\r\n validators={['isRequired', 'disableChinese']}\r\n isValidValue={(valid) => updateFormValid('post', valid)}\r\n forceErrorDisplay={forceShowError}\r\n maxLength={255}\r\n />\r\n \r\n \r\n \r\n \r\n Institution:\r\n \r\n \r\n setInstitution(e.target.value)}\r\n disabled={isPreFillDisabled}\r\n validators={['isRequired', 'disableChinese']}\r\n isValidValue={(valid) => updateFormValid('post', valid)}\r\n forceErrorDisplay={forceShowError}\r\n maxLength={255}\r\n />\r\n \r\n \r\n \r\n \r\n Background:\r\n \r\n \r\n \r\n {\r\n updateFormValid('background', true);\r\n setBackground(e.target.value);\r\n }}\r\n >\r\n \r\n {forceShowError && !background && (\r\n \r\n At least one of the option should be selected. \r\n \r\n )}\r\n \r\n \r\n \r\n \r\n Independent:\r\n \r\n \r\n \r\n {\r\n updateFormValid('independent', true);\r\n setIndependent(Number(e.target.value));\r\n }}\r\n >\r\n \r\n {forceShowError && (independent === null || independent === undefined) && (\r\n \r\n At least one of the option should be selected. \r\n \r\n )}\r\n \r\n \r\n {!isUserEdit && !isExistingUser && (\r\n <>\r\n \r\n \r\n Password:\r\n \r\n \r\n setPassword(e.target.value)}\r\n validators={['isRequired', 'disableChinese', 'checkPassword']}\r\n isValidValue={(valid) => updateFormValid('password', valid)}\r\n forceErrorDisplay={forceShowError}\r\n maxLength={255}\r\n />\r\n \r\n \r\n \r\n \r\n Confirm Password:\r\n \r\n \r\n setConfirmPassword(e.target.value)}\r\n validators={['isRequired', 'disableChinese', 'checkConfirmPassword']}\r\n isValidValue={(valid) => updateFormValid('confirmPassword', valid)}\r\n forceErrorDisplay={forceShowError}\r\n maxLength={255}\r\n confirmPasswordNotMatchPassword={confirmPassword !== password}\r\n />\r\n \r\n \r\n \r\n )}\r\n
\r\n \r\n );\r\n}\r\n","import MenuAction from 'components/MenuAction';\r\nimport { useSelector } from 'react-redux';\r\nimport React, { useState } from 'react';\r\n\r\nconst useReviewer = (props) => {\r\n const { setOpenPopup, setSelectedRow, getReviewerList } = props;\r\n const reviewer = useSelector((state) => state.reviewer);\r\n const [isResetPassword, setIsResetPassword] = useState(false);\r\n const [sort, setSort] = useState('updateDtm');\r\n const [isDesc, setIsDesc] = useState(true);\r\n\r\n const getMenuActions = (row) => {\r\n return [\r\n {\r\n text: 'Edit',\r\n action: () => {\r\n setOpenPopup(true);\r\n setSelectedRow(row);\r\n },\r\n disableConfirm: true,\r\n },\r\n {\r\n text: 'Reset Password',\r\n action: async () => {\r\n setIsResetPassword(true);\r\n setSelectedRow(row);\r\n },\r\n },\r\n ];\r\n };\r\n\r\n const columns = [\r\n {\r\n field: 'action',\r\n sortable: false,\r\n headerName: 'Action',\r\n width: 80,\r\n disableItemSort: true,\r\n renderCell: (params) => {\r\n return \r\n
\r\n \r\n setEmail(e.target.value)}\r\n isNoSpace\r\n showErrorWhenOnBlur\r\n validators={['isRequired', 'isEmail', 'disableChinese']}\r\n isValidValue={(valid) => updateFormValid('email', valid)}\r\n forceErrorDisplay={forceShowEmialError}\r\n maxLength={255}\r\n disabled={isDisabledEmail}\r\n />\r\n
\r\n {!isUserEdit && (\r\n \r\n \r\n {canEditEmail ? 'Load Profile' : 'Edit'}\r\n \r\n
\r\n )}\r\n \r\n {openPopup && (\r\n \r\n Create \r\n \r\n
\r\n );\r\n};\r\n\r\nexport default ReviewerMaintenance;\r\n","\r\nconst usePanelCurrentMember = () => {\r\n const gender = (type) =>{\r\n let gender = type||'-'\r\n switch (type) {\r\n case 'M':\r\n gender='Male'\r\n break;\r\n case 'F':\r\n gender='Female'\r\n break;\r\n default:\r\n break;\r\n }\r\n return gender\r\n }\r\n const columns = [\r\n { field: 'email', headerName: 'Email', width: 200 },\r\n { field: 'title', headerName: 'Title', width: 100 },\r\n { field: 'surname', headerName: 'Surname', width: 140 },\r\n {\r\n field: 'firstName',\r\n headerName: 'First Name',\r\n width: 140,\r\n },\r\n { field: 'gender', headerName: 'Gender', width: 100, valueGetter: (params) => gender(params.value) },\r\n { field: 'department', headerName: 'Department', width: 140 },\r\n { field: 'post', headerName: 'Post', width: 100 },\r\n ];\r\n\r\n return { columns };\r\n};\r\n\r\nexport default usePanelCurrentMember;\r\n","import CustomButton from 'components/CustomInput/Button';\r\nimport { useState,useEffect } from 'react';\r\nimport { useSelector } from 'react-redux';\r\nconst usePanelSearchMember = () => {\r\n const [selectedMember, setSelectedMember] = useState([]);\r\n const [isDisabledAll, setIsDisabledAll] = useState(false)\r\n const { reviewPanelMemberList } = useSelector((state) => state.reviewPanel);\r\n const checkedAll = () => {\r\n let newReviewPanelMemberList = reviewPanelMemberList?.data.reduce((group, curP) => {\r\n if(!selectedMember.find((item)=>item.id===curP.id)){\r\n return group.concat(curP)\r\n }\r\n return group\r\n }, [])\r\n setSelectedMember([...selectedMember,...newReviewPanelMemberList])\r\n }\r\n useEffect(()=>{\r\n if(!reviewPanelMemberList) return setIsDisabledAll(false)\r\n setIsDisabledAll(true)\r\n reviewPanelMemberList?.data.forEach((item)=>{\r\n if(!selectedMember.find(ele=>ele.id===item.id)){\r\n setIsDisabledAll(false)\r\n return\r\n }\r\n })\r\n },[selectedMember,reviewPanelMemberList])\r\n const gender = (type) =>{\r\n let gender = type||'-'\r\n switch (type) {\r\n case 'M':\r\n gender='Male'\r\n break;\r\n case 'F':\r\n gender='Female'\r\n break;\r\n default:\r\n break;\r\n }\r\n return gender\r\n }\r\n const columns = [\r\n {\r\n field: 'action',\r\n headerName: (\r\n \r\n
\r\n \r\n
\r\n \r\n Add All \r\n
\r\n ),\r\n disableItemSort: true,\r\n valueGetter: (params) => {\r\n const isExist = selectedMember.some((item) => {\r\n return item.email === params.row.email;\r\n });\r\n return (\r\n \r\n
\r\n \r\n\r\n \r\n \r\n Add Panel Member: \r\n
\r\n \r\n Panel Name: \r\n\r\n setPanelName(e.target.value)}\r\n forceErrorDisplay={forcePanelNameShow}\r\n maxLength={255}\r\n />\r\n
\r\n\r\n \r\n \r\n Search\r\n \r\n \r\n Reset\r\n \r\n
\r\n \r\n {\r\n setSearchCriteria({\r\n ...searchCriteria,\r\n paramKey: e.target.value,\r\n page: '1',\r\n });\r\n getReviewPanelMemberList({\r\n ...searchCriteria,\r\n page: '1',\r\n paramKey: e.target.value,\r\n });\r\n }}\r\n choices={listOfCriteria}\r\n />\r\n
\r\n \r\n {\r\n setSearchCriteria({ ...searchCriteria, paramValue: e.target.value });\r\n }}\r\n onPressEnter={handleSearch}\r\n maxLength={255}\r\n />\r\n
\r\n \r\n {\r\n setSearchCriteria({ ...searchCriteria, pageSize: value, page: 1 });\r\n getReviewPanelMemberList({ ...searchCriteria, pageSize: value, page: 1 });\r\n }}\r\n />\r\n
\r\n \r\n
\r\n\r\n \r\n {\r\n setSearchCriteria({ ...searchCriteria, page });\r\n getReviewPanelMemberList({ ...searchCriteria, page });\r\n }}\r\n />\r\n
\r\n \r\n
\r\n \r\n \r\n \r\n {openPopup && setOpenPopup(false)} data={selectedRow} refleshReviewPaneList={() => getReviewPanelList(page, pageSize)} />}\r\n
\r\n );\r\n};\r\n\r\nexport default ReviewPanel;\r\n","import React, { useState } from 'react';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\nimport { Grid, TextField } from '@material-ui/core';\r\nimport Popup from 'components/popup/popup';\r\nimport { UPDATE_EMAIL_TEMPLATE } from 'store/key';\r\nimport { useDispatch } from 'react-redux';\r\nimport useDialog from 'components/ConfirmDialog/useDialog';\r\nimport { emptyShow } from 'utility/general';\r\nimport { EMAIL_TEMPLATE_CREATED } from 'utility/frontendMessage';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n title: {\r\n fontWeight: 'bold',\r\n },\r\n item: {\r\n marginTop: theme.spacing(2),\r\n },\r\n}));\r\n\r\nexport default function AddEmailDomain(props) {\r\n const dispatch = useDispatch();\r\n const showDialog = useDialog();\r\n const classes = useStyles();\r\n const rowData = props.rowData ? props.rowData : null;\r\n const defaultFormData = {\r\n id: rowData ? rowData.id : 0,\r\n title: rowData ? rowData.title : '',\r\n to: rowData ? rowData.to : '',\r\n cc: rowData ? rowData.cc : '',\r\n content: rowData ? rowData.content : '',\r\n status: rowData ? rowData.status : 0,\r\n };\r\n const [formData, setFormData] = useState(defaultFormData);\r\n\r\n const handleFormData = (e) => {\r\n const { name, value } = e.target;\r\n setFormData({\r\n ...formData,\r\n [name]: value,\r\n });\r\n };\r\n const confirm = () => {\r\n const data = {\r\n title: formData.title,\r\n content: formData.content,\r\n status: formData.status,\r\n id: formData.id,\r\n };\r\n\r\n dispatch({\r\n type: UPDATE_EMAIL_TEMPLATE,\r\n payload: {\r\n row: data,\r\n callback: () => {\r\n showDialog({\r\n description: EMAIL_TEMPLATE_CREATED,\r\n disableCancelButton: true,\r\n });\r\n props.getList();\r\n props.setOpenPopup(false);\r\n },\r\n },\r\n });\r\n };\r\n const cancel = () => {\r\n props.setOpenPopup(false);\r\n };\r\n const reset = () => {\r\n setFormData(defaultFormData);\r\n };\r\n return (\r\n \r\n\r\n Create \r\n {\r\n setPageSize(value)\r\n getReviewPanelList(page, value);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n {\r\n history.push('/');\r\n }}\r\n >\r\n Back to Login\r\n \r\n
\r\n )}\r\n\r\n {!showManualOnly && (\r\n <>\r\n - \r\n
\r\n \r\n \r\n \r\n What are the differences between Coordinating Investigator(CI) and Site\r\n Principal Investigator (Site PI)?\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n I will be the only investigator of this single-site application. Do I need to\r\n have a Coordinating Investigator in order to submit the application?\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n I am planning to submit a multi-cluster application involving all HA clusters. I\r\n understand that HKWC and NTEC have a Joint HA-University IRB/REC. Can Central\r\n IRB grant ethics approval to all HA sites? Do I need to submit separate\r\n application to these 2 Joint HA-University IRB/REC?\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n I am planning to submit a single-cluster application. How can I select the\r\n Cluster REC for submission?\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n 3 sets of reference number are seen in the Application List. What are the\r\n differences?\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n Will my department head receive notification to proceed the endorsement of my\r\n application?\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n Which REC/IRB is reviewing my application?\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n )}\r\n \r\n \r\n \r\n
\r\n
\r\n | Coordinating Investigator: | \r\n\r\n
| \r\n
| Site Principal Investigator: | \r\n\r\n
| \r\n
\r\n Coordinating Investigator and Site PI are mandatory in every application. As\r\n you are the only investigator, you will be the CI and Site PI\r\n simultaneously. The Application Form is designed for both single- and\r\n multi-site applications. CI to complete “Study Info” (study-related\r\n question) while Site PI to complete “Site Info” (site-specific details).\r\n Hence, please fill in both tabs of application form in order to proceed the\r\n application.\r\n
\r\n \r\n The review decision of Central IRB will be applicable to all HA hospitals\r\n (i.e. including QMH and PWH, and HA sites under HKWC and NTEC). On the other\r\n hand, standalone application to HKU/HA HKW IRB and Joint CUHK-NTEC CREC is\r\n required as the Universities would like to maintain their own jurisdiction\r\n to oversee research ethics review related to their teaching hospitals.\r\n Please approach HKU/HA HKW IRB and Joint-CUHK CREC for submission details.\r\n
\r\n \r\n With effect from 16 May 2022, all new application must be submitted via the\r\n New Portal. Applications can only be submitted to 1) Central Institutional\r\n Review Board (Central IRB), 2) HKU/HA HKW IRB or 3) Joint CUHK-NTEC CREC\r\n (Sept/Oct 2022 onwards), depending on respective jurisdictions. For\r\n single-cluster non-commercial-sponsored studies submitted to Central IRB,\r\n applications will be distributed to Cluster REC for review and process in\r\n the New Portal. Cluster REC will communicate with the applicants directly\r\n where appropriate. Applicant should refer to and follow the submission\r\n deadline set by respective IRB/REC.\r\n
\r\n \r\n These 3 reference numbers are generated in different stage:\r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n | Submission No. | \r\n\r\n
| \r\n
| CRER Application No. | \r\n\r\n
| \r\n
| IRB/REC Reference No. | \r\n\r\n
| \r\n
\r\n Please ensure to provide the correct and corresponding reference number when\r\n communicating with the Secretariats.\r\n
\r\n \r\n This function is not available in this Portal and e-signature is currently\r\n not accepted. To seek your department head support, please print the form in\r\n hard copy for written signature. For subsequent actions, e.g. to scan the\r\n form to Portal or to submit true copy, please contact respective IRB/REC for\r\n details.\r\n
\r\n \r\n Jurisdiction of HKU/HA HKW IRB & Joint CUHK-NTEC CREC remain unchanged.\r\n
\r\n \r\n For applying site(s) in HKEC, KCC, KEC, KWC and NTWC:\r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n | \r\n Single/Multi-cluster \r\n | \r\n \r\n \r\n Commercial sponsored study?\r\n \r\n | \r\n \r\n To be reviewed by \r\n | \r\n
| \r\n Single-cluster \r\n | \r\n \r\n Yes \r\n No \r\n | \r\n \r\n Central IRB \r\n Cluster REC/IRB \r\n | \r\n
| \r\n Multi-cluster \r\n | \r\n \r\n Yes \r\n No \r\n | \r\n \r\n Central IRB \r\n | \r\n
\r\n {\r\n loadList({ pageSize: value });\r\n }}\r\n />\r\n
\r\n \r\n {\r\n loadList({ page, pageSize });\r\n // setSelectedRows([]);\r\n }}\r\n />\r\n
\r\n )}\r\n \r\n setFullViewShow(isShow)}\r\n />\r\n
\r\n )}\r\n Pending to implement
;\r\n\r\nconst iconLookup = {\r\n dashboard: HomeIcon,\r\n search: SearchIcon,\r\n home: AccountBoxIcon,\r\n login: LockOpenIcon,\r\n profile: AccountCircleIcon,\r\n application: NoteAddIcon,\r\n meeting: ScheduleIcon,\r\n review: ScheduleIcon,\r\n reviewer: PersonIcon,\r\n function: CardTravelIcon,\r\n setting: SettingsIcon,\r\n help: LiveHelpIcon,\r\n 'post-approval': BackupIcon,\r\n};\r\n\r\nexport const getPathComponent = (path) => {\r\n return pathLookup[path];\r\n};\r\n\r\nconst pathLookup = {\r\n '/': Landing,\r\n '/search': Search,\r\n '/home/profile': Profile,\r\n '/home/help': Help,\r\n '/profile': Profile,\r\n '/applications/draft': ApplicationLayout,\r\n '/applications/sent': ApplicationLayout,\r\n '/applications/confirmed': ApplicationLayout,\r\n '/applications/returned': ApplicationLayout,\r\n '/applications/returnedFromIRB': ApplicationLayout,\r\n '/applications/returnedToCCO': ApplicationLayout,\r\n '/applications/received': ApplicationLayout,\r\n '/applications/distributed': ApplicationLayout,\r\n '/applications/for-review': ApplicationLayout,\r\n '/applications/reviewed': ApplicationLayout,\r\n '/applications/approved': ApplicationLayout,\r\n '/applications/completed': ApplicationLayout,\r\n '/applications/verified': ApplicationLayout,\r\n '/applications/acknowledged': ApplicationLayout,\r\n '/applications/expired': ApplicationLayout,\r\n '/applications/archived': ApplicationLayout,\r\n '/applications/all': ApplicationLayout,\r\n '/applications/amendment-detail': AmendmentLayout,\r\n '/post-approval-document/draft': PostApprovalList,\r\n '/post-approval-document/sent': PostApprovalList,\r\n '/post-approval-document/received': PostApprovalList,\r\n '/post-approval-document/confirmed': PostApprovalList,\r\n '/post-approval-document/returned': PostApprovalList,\r\n '/post-approval-document/returnedFromIRB': PostApprovalList,\r\n '/post-approval-document/returnedToCCO': PostApprovalList,\r\n '/post-approval-document/for-review': PostApprovalList,\r\n '/post-approval-document/distributed': PostApprovalList,\r\n '/post-approval-document/reviewed': PostApprovalList,\r\n '/post-approval-document/approved': PostApprovalList,\r\n '/post-approval-document/completed': PostApprovalList,\r\n '/post-approval-document/verified': PostApprovalList,\r\n '/post-approval-document/acknowledged': PostApprovalList,\r\n '/post-approval-document/expired': PostApprovalList,\r\n '/post-approval-document/archived': PostApprovalList,\r\n '/post-approval-document/all': PostApprovalList,\r\n '/meeting-arrangement': Placeholder,\r\n '/review-arrangement/arrangeMeeting': ReviewArrangement,\r\n '/review-arrangement/updateMeetingAttendance': MeetingAttendance,\r\n '/reviewer-maintenance/reviewer': IRBSecretaryAdminReviewer,\r\n '/reviewer-maintenance/review-panel': IRBSecretaryAdminReviewPanel,\r\n '/function/report-statistic': Placeholder,\r\n '/function/user-approval': UserApproval,\r\n '/HOAdmin-system/email-domain': HOAdminEmailDomain,\r\n '/HOAdmin-system/user-account': HOAdminUserAccount,\r\n '/HOAdmin-system/edit-global-variables': EditGlobalVariables,\r\n '/HOAdmin-system/edit-broadcast-message': EditBroadcastMessage,\r\n '/HOAdmin-system/email-template': EmailTemplate,\r\n '/help': Help,\r\n '/user/account-activation': AccountActivation,\r\n '/user/reset-password': ResetPassword,\r\n};\r\n\r\nexport const getIconLookup = (key) => {\r\n const icon = iconLookup[key];\r\n\r\n if (!icon) {\r\n return null;\r\n }\r\n\r\n return icon;\r\n};\r\n\r\nexport const getMenuAction = (action) => {\r\n if (action === '/applications/create-new-application') {\r\n return createApplicationMenuAction;\r\n }\r\n\r\n return null;\r\n};\r\n\r\nconst createApplicationMenuAction = () => {\r\n const { dispatch } = getStore();\r\n\r\n dispatch(\r\n setGlobal({\r\n isShowAlertWindow: true,\r\n }),\r\n );\r\n};\r\n","import { Checkbox, Grid } from '@material-ui/core';\r\nimport CustomTextField from 'components/Input/CustomTextField';\r\nimport { useState } from 'react';\r\nimport CustomRadio from 'components/CustomRadio';\r\n\r\nconst useProgressReportData = ({\r\n isPermission,\r\n data,\r\n postData,\r\n onValueUpdate = (key, value) => {},\r\n onValidationUpdate = (key, isValid) => {},\r\n clearKeys,\r\n forceErrorDisplay,\r\n removeRequest,\r\n}) => {\r\n const getValue = (key) => {\r\n if ((postData[key] === null || postData[key] === undefined) && removeRequest.includes(key)) {\r\n return null;\r\n }\r\n return postData?.[key] ?? data?.[key];\r\n };\r\n\r\n const checkIsAmendmentMadeEnabled = (value) => {\r\n if (value === true || value === 0) {\r\n return true;\r\n }\r\n\r\n return false;\r\n };\r\n\r\n const defaultRows = [\r\n {\r\n id: 0,\r\n changeType: 'Study Extension',\r\n amendmentMade: null,\r\n reportedBefore: null,\r\n nature: null,\r\n version: null,\r\n amendmentMadeOperators: [\r\n { key: true, label: 'Yes' },\r\n { key: false, label: 'No' },\r\n ],\r\n reportedBeforeOperators: [\r\n { key: true, label: 'Yes' },\r\n { key: false, label: 'No' },\r\n ],\r\n },\r\n {\r\n id: 1,\r\n changeType: 'Investigator',\r\n amendmentMade: null,\r\n reportedBefore: null,\r\n nature: null,\r\n version: null,\r\n amendmentMadeOperators: [\r\n { key: true, label: 'Yes' },\r\n { key: false, label: 'No' },\r\n ],\r\n reportedBeforeOperators: [\r\n { key: true, label: 'Yes' },\r\n { key: false, label: 'No' },\r\n ],\r\n },\r\n {\r\n id: 2,\r\n changeType: 'Study Protocol',\r\n amendmentMade: null,\r\n reportedBefore: null,\r\n nature: null,\r\n version: null,\r\n amendmentMadeOperators: [\r\n { key: true, label: 'Yes' },\r\n { key: false, label: 'No' },\r\n ],\r\n reportedBeforeOperators: [\r\n { key: true, label: 'Yes' },\r\n { key: false, label: 'No' },\r\n ],\r\n },\r\n {\r\n id: 3,\r\n changeType: 'Informed Consent Form',\r\n amendmentMade: null,\r\n reportedBefore: null,\r\n nature: null,\r\n version: null,\r\n amendmentMadeOperators: [\r\n { key: 0, label: 'Yes' },\r\n { key: 1, label: 'No' },\r\n { key: 2, label: 'N/A' },\r\n ],\r\n reportedBeforeOperators: [\r\n { key: true, label: 'Yes' },\r\n { key: false, label: 'No' },\r\n ],\r\n },\r\n {\r\n id: 4,\r\n changeType: 'Others(Please specify)',\r\n amendmentMade: null,\r\n reportedBefore: null,\r\n nature: null,\r\n version: null,\r\n amendmentMadeOperators: [\r\n { key: 0, label: 'Yes' },\r\n { key: 1, label: 'No' },\r\n { key: 2, label: 'N/A' },\r\n ],\r\n reportedBeforeOperators: [\r\n { key: true, label: 'Yes' },\r\n { key: false, label: 'No' },\r\n ],\r\n },\r\n ];\r\n\r\n const [rows] = useState(defaultRows);\r\n\r\n const lookupTable = {\r\n 'Study Extension': {\r\n amendmentKey: 'studyExtensionAmendment',\r\n reportKey: 'studyExtensionReported',\r\n natureKey: 'studyExtensionNature',\r\n approveKey: 'studyExtensionApprovedVersion',\r\n },\r\n Investigator: {\r\n amendmentKey: 'investigatorAmendment',\r\n reportKey: 'investigatorReported',\r\n natureKey: 'investigatorNature',\r\n approveKey: 'investigatorApprovedVersion',\r\n },\r\n 'Study Protocol': {\r\n amendmentKey: 'studyProtocolAmendment',\r\n reportKey: 'studyProtocolReported',\r\n natureKey: 'studyProtocolNature',\r\n approveKey: 'studyProtocolApprovedVersion',\r\n },\r\n 'Informed Consent Form': {\r\n amendmentKey: 'informedConsentFormAmendment',\r\n reportKey: 'informedConsentFormReported',\r\n natureKey: 'informedConsentFormNature',\r\n approveKey: 'informedConsentFormApprovedVersion',\r\n },\r\n 'Others(Please specify)': {\r\n amendmentKey: 'othersAmendment',\r\n reportKey: 'othersReported',\r\n natureKey: 'othersNature',\r\n approveKey: 'othersApprovedVersion',\r\n },\r\n };\r\n\r\n const getAmendmentDisabled = (params) => {\r\n if (params.row.changeType === 'Others(Please specify)') {\r\n return !getValue('isOthers');\r\n }\r\n\r\n return !isPermission;\r\n };\r\n\r\n const columns = [\r\n {\r\n field: 'changeType',\r\n headerName: '',\r\n width: 200,\r\n renderCell: (params) => {\r\n if (params.row.id === 4) {\r\n return (\r\n \r\n {\r\n onValueUpdate('isOthers', e.target.checked);\r\n\r\n if (!e.target.checked) {\r\n clearKeys([\r\n 'otherDocumentType',\r\n 'othersAmendment',\r\n 'othersReported',\r\n 'othersNature',\r\n 'othersApprovedVersion',\r\n ]);\r\n }\r\n }}\r\n />{' '}\r\n {params.row.changeType}\r\n
\r\n );\r\n }\r\n return params.row.changeType;\r\n },\r\n },\r\n {\r\n field: 'amendmentMade',\r\n headerName: 'Amendment Made',\r\n width: 250,\r\n renderCell: (params) => {\r\n return (\r\n \r\n {\r\n onValidationUpdate('otherDocumentType', isValid);\r\n }}\r\n onChange={(e) => {\r\n onValueUpdate('otherDocumentType', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n {\r\n onValidationUpdate(lookupTable[params.row.changeType]['amendmentKey'], isValid);\r\n }}\r\n onChange={(e) => {\r\n onValueUpdate(\r\n lookupTable[params.row.changeType]['amendmentKey'],\r\n JSON.parse(e.target.value),\r\n );\r\n\r\n if (\r\n JSON.parse(e.target.value) === false ||\r\n JSON.parse(e.target.value) === 1 ||\r\n JSON.parse(e.target.value) === 2\r\n ) {\r\n clearKeys([\r\n lookupTable[params.row.changeType]['reportKey'],\r\n lookupTable[params.row.changeType]['natureKey'],\r\n lookupTable[params.row.changeType]['approveKey'],\r\n ]);\r\n }\r\n }}\r\n value={getValue(lookupTable[params.row.changeType]['amendmentKey'])}\r\n operators={params.row.amendmentMadeOperators}\r\n />\r\n
\r\n );\r\n },\r\n },\r\n {\r\n field: 'reportedBefore',\r\n headerName: 'Reported before?',\r\n tooltip: 'Please submit Protocol Amendment Application before the changes',\r\n width: 170,\r\n renderCell: (params) => {\r\n console.log('170958 useProgressReportData.js data', postData, params.row.changeType);\r\n console.log(\r\n '170958 useProgressReportData.js data 2',\r\n lookupTable[params.row.changeType]['reportKey'],\r\n getValue(),\r\n );\r\n return (\r\n \r\n {isLoadingHistory ? (\r\n
\r\n \r\n
\r\n ) : (\r\n Loading Comments...
\r\n {children}
\r\n \r\n {buttons\r\n .filter((item) => {\r\n if (item.showInFormCreate && isFormCreate) {\r\n return true;\r\n }\r\n\r\n if (item.status === undefined) {\r\n return true;\r\n }\r\n\r\n // if status is array\r\n if (typeof item.status === 'object') {\r\n return item.status.includes(status);\r\n }\r\n\r\n return item.status === status;\r\n })\r\n .filter((item) => {\r\n if (item.condition !== undefined) {\r\n return item.condition({ type });\r\n }\r\n\r\n return true;\r\n })\r\n .filter((item) => {\r\n if (item.showInTab) {\r\n if (isArray(item.showInTab)) {\r\n return item.showInTab.includes(currentTab);\r\n }\r\n return currentTab === item.showInTab;\r\n }\r\n return true;\r\n })\r\n .filter((item) => {\r\n if (item.disableInForm) {\r\n if (isArray(item.disableInForm)) {\r\n return !item.disableInForm.includes(type);\r\n }\r\n return type !== item.showInTab;\r\n }\r\n return true;\r\n })\r\n .map((button, index) => {\r\n const extraProps = {};\r\n\r\n if (button.icon) {\r\n extraProps.startIcon = button.icon;\r\n }\r\n\r\n if (button.text === 'Download signed document') {\r\n const isNewUpload = signedUpload.isNewUpload;\r\n\r\n // const Wrapper = isNewUpload ? SDummy : SHyperLink;\r\n const downloadSignedFile = () => {\r\n if (!isNewUpload) {\r\n dispatch({\r\n type: GET_SIGNED_DOCUMENT,\r\n payload: {\r\n docType: type,\r\n reportId,\r\n },\r\n });\r\n } else {\r\n downloadLocalFile(signedUpload.file);\r\n }\r\n };\r\n\r\n return (\r\n \r\n {user.role === APPLICANT ? (\r\n <>\r\n Signed Document:\r\n \r\n {button.fileName}\r\n \r\n {/* {button.key &&\r\n postApprovalPermissionChecking({\r\n currentTab,\r\n status,\r\n }) && (\r\n {\r\n onSignedDocumentUploaded({\r\n fileName: '',\r\n key: null,\r\n });\r\n }}\r\n />\r\n )} */}\r\n \r\n ) : (\r\n \r\n Download signed document\r\n \r\n )}\r\n
\r\n );\r\n } else if (button.text === 'Upload Signed Document') {\r\n return (\r\n \r\n button.action(result)}\r\n />\r\n
\r\n );\r\n } else {\r\n return (\r\n \r\n {button && button.customDialog}\r\n {\r\n // check status is valid before execute the button action\r\n setButtonLoading(true);\r\n\r\n try {\r\n if (!button.disableStatusChecking) {\r\n if (button.status) {\r\n let buttonStatus =\r\n typeof button.status !== 'object'\r\n ? [button.status]\r\n : button.status;\r\n if (reportId) {\r\n const remoteFormStatusId =\r\n await checkApplicationStatus();\r\n\r\n // if remote status updated and not match with the button's status requirement, block the button action.\r\n if (\r\n !buttonStatus.includes(\r\n remoteFormStatusId,\r\n )\r\n ) {\r\n setButtonLoading(false);\r\n return showDialog({\r\n description:\r\n APP_FORM_STATUS_NOT_MATCH,\r\n isError: true,\r\n disableCancelButton: true,\r\n });\r\n }\r\n }\r\n }\r\n }\r\n button.action();\r\n } catch (error) {\r\n console.log(\r\n '101331 ApplicationActionBar.jsx error',\r\n button,\r\n error,\r\n );\r\n }\r\n setButtonLoading(false);\r\n }}\r\n disabled={button.isDisabled?.()}\r\n type={button.type}\r\n >\r\n {button.text}\r\n \r\n
\r\n );\r\n }\r\n })}\r\n \r\n {getLayout()}
\r\n \r\n
\r\n Scientific Title:
\r\n {getValue('scientificTitle')}
\r\n \r\n
\r\n IRB/REC Ref. No.:
\r\n {getValue('refNo')}
\r\n \r\n
\r\n Coordinating Investigator:
\r\n {getValue('ci')}
\r\n \r\n
\r\n Protocol No.:
\r\n {getValue('protocolNo')}
\r\n \r\n
\r\n Study Site of this progress report:
\r\n \r\n {\r\n updateValidation('studySite', isValid);\r\n updateMaxLength('studySite', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('studySite', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n Anticipated Study End Date:
\r\n \r\n {getValue('anticipatedStudyEndDate')\r\n ? moment(getValue('anticipatedStudyEndDate')).format('YYYY-MM-DD')\r\n : getValue('anticipatedStudyEndDate')}\r\n
\r\n \r\n
\r\n Site Principal Investigator of the above study site(s):
\r\n {getValue('sitePI')}
\r\n \r\n
\r\n Report sequence no.:
\r\n {getValue('reportSeqNo') ?? '-'}
\r\n \r\n
\r\n Report Period (From) + (to):
\r\n \r\n
\r\n \r\n {\r\n updateValidation('reportPeriodFrom', isValid);\r\n }}\r\n onChange={(date) => {\r\n updateValue('reportPeriodFrom', date);\r\n }}\r\n />\r\n
\r\n to
\r\n \r\n {\r\n updateValue('reportPeriodTo', date);\r\n }}\r\n isValidValue={(isValid) => {\r\n updateValidation('reportPeriodTo', isValid);\r\n }}\r\n validators={['isRequired']}\r\n forceErrorDisplay={forceErrorDisplay}\r\n />\r\n
\r\n \r\n
\r\n Actual Study Start Date:
\r\n \r\n
\r\n \r\n {\r\n updateValidation('actualStudyStartDate', isValid);\r\n }}\r\n minDate={new Date(progressReport?.remoteDetail?.decisionDate).getTime()}\r\n maxDate={new Date().getTime()}\r\n onChange={(date) => {\r\n updateValue('actualStudyStartDate', date);\r\n }}\r\n />\r\n
\r\n \r\n {\r\n if (e.target.checked) {\r\n clearKey(['actualStudyStartDate']);\r\n }\r\n updateValue('isNotYetStarted', e.target.checked);\r\n }}\r\n size=\"small\"\r\n color=\"primary\"\r\n />\r\n Not yet started\r\n
\r\n \r\n
\r\n\r\n Planned Sample Size (site):
\r\n {getValue('plannedSampleSize')}
\r\n \r\n
\r\n No. of Completed:
\r\n \r\n {\r\n updateValidation('noOfCompleted', isValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('noOfCompleted', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n No. of Recruited^:
\r\n \r\n {\r\n updateValidation('noOfRecruited', isValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('noOfRecruited', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n\r\n Any withdrawal?:
\r\n \r\n {\r\n updateValue('anyWithdrawal', JSON.parse(e.target.value));\r\n\r\n if (!JSON.parse(e.target.value)) {\r\n clearKey(['noOfWithdrawnAfterRecruited', 'withdrawalReasons']);\r\n }\r\n }}\r\n isRequired\r\n isValidValue={(isValid) => {\r\n updateValidation('anyWithdrawal', isValid);\r\n }}\r\n forceErrorDisplay={forceErrorDisplay}\r\n operators={[\r\n { key: true, label: 'Yes' },\r\n { key: false, label: 'No' },\r\n ]}\r\n />\r\n
\r\n \r\n
\r\n No. of Withdrawn after recruited^:
\r\n \r\n {\r\n updateValidation('noOfWithdrawnAfterRecruited', isValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('noOfWithdrawnAfterRecruited', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n Withdrawal reasons:
\r\n \r\n {\r\n updateValidation('withdrawalReasons', isValid);\r\n updateMaxLength('withdrawalReasons', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('withdrawalReasons', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n \r\n ^Please submit Protocol Amendment Application if the no. of recruited will exceed the planned sample\r\n size.\r\n \r\n
\r\n \r\n 3. Changes \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n {/* \r\n {\r\n updateValidation('subjectsWillingnessToContinue', isValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('subjectsWillingnessToContinue', JSON.parse(e.target.value));\r\n }}\r\n value={getValue('subjectsWillingnessToContinue')}\r\n operators={[\r\n {\r\n key: true,\r\n label: 'Yes',\r\n },\r\n {\r\n key: false,\r\n label: 'No',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n Updated information that may affect a subject’s willingness to continue?\r\n
\r\n \r\n {\r\n updateValue('newEvidence', JSON.parse(e.target.value));\r\n }}\r\n value={getValue('newEvidence')}\r\n forceErrorDisplay={forceErrorDisplay}\r\n isRequired\r\n isValidValue={(isValid) => {\r\n updateValidation('newEvidence', isValid);\r\n }}\r\n operators={[\r\n {\r\n key: true,\r\n label: 'Yes',\r\n },\r\n {\r\n key: false,\r\n label: 'No',\r\n },\r\n ]}\r\n />\r\n
\r\n New evidence that addresses the research hypothesis?
\r\n \r\n
\r\n Describe new information and actions taken:
\r\n \r\n {\r\n updateValidation('describeNewInformation', isValid);\r\n updateMaxLength('describeNewInformation', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('describeNewInformation', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n 5. Summary of Local Serious Adverse Events \r\n {\r\n updateValidation('mandatorySeriousAdverseEvents', isValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('mandatorySeriousAdverseEvents', JSON.parse(e.target.value));\r\n }}\r\n value={getValue('mandatorySeriousAdverseEvents')}\r\n operators={[\r\n {\r\n key: true,\r\n label: 'Yes',\r\n },\r\n {\r\n key: false,\r\n label: 'No/Not Applicable',\r\n },\r\n ]}\r\n />\r\n
\r\n {isPermission && (\r\n \r\n {\r\n if (getValue('mandatorySeriousAdverseEvents') === true) {\r\n updateValidation(name, value);\r\n } else {\r\n updateValidation(name, true);\r\n }\r\n }}\r\n onDelete={handleAdverseEventsDelete}\r\n onEdit={handleAdverseEventsEditClick}\r\n />\r\n
\r\n\r\n \r\n Does the Local SAE affect the study?\r\n
\r\n \r\n 0}\r\n onChange={(e) => {\r\n updateValue('saeAffect', JSON.parse(e.target.value));\r\n\r\n if (!JSON.parse(e.target.value)) {\r\n clearKey(['saeDetails']);\r\n }\r\n }}\r\n forceErrorDisplay={forceErrorDisplay}\r\n isValidValue={(isValid) => {\r\n updateValidation('saeAffect', isValid);\r\n }}\r\n value={getValue('saeAffect')}\r\n operators={[\r\n {\r\n key: true,\r\n label: 'Yes',\r\n },\r\n {\r\n key: false,\r\n label: 'No',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n {\r\n updateValidation('saeDetails', isValid);\r\n updateMaxLength('saeDetails', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('saeDetails', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n \r\n 6. Complaints from Subjects \r\n
\r\n \r\n {\r\n updateValidation('complaintsFromSubjects', isValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('complaintsFromSubjects', JSON.parse(e.target.value));\r\n\r\n if (!JSON.parse(e.target.value)) {\r\n clearKey(['complaintsDetails']);\r\n }\r\n }}\r\n value={getValue('complaintsFromSubjects')}\r\n operators={[\r\n {\r\n key: true,\r\n label: 'Yes',\r\n },\r\n {\r\n key: false,\r\n label: 'No',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n {\r\n updateValidation('complaintsDetails', isValid);\r\n updateMaxLength('complaintsDetails', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('complaintsDetails', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n 7. Public Registration of Clinical Trial \r\n {/* \r\n \r\n\r\n \r\n \r\n
\r\n \r\n
\r\n\r\n \r\n This clinical trial is registered in a publicly available, free to access, searchable clinical\r\n trial registry?\r\n
\r\n\r\n \r\n {\r\n updateValue('registered', JSON.parse(e.target.value));\r\n\r\n if (!JSON.parse(e.target.value)) {\r\n clearKey(['registerName', 'registryIdentifier']);\r\n }\r\n }}\r\n value={getValue('registered')}\r\n isRequired\r\n isValidValue={(isValid) => {\r\n updateValidation('registered', isValid);\r\n }}\r\n forceErrorDisplay={forceErrorDisplay}\r\n operators={[\r\n {\r\n key: true,\r\n label: 'Yes',\r\n },\r\n {\r\n key: false,\r\n label: 'No / Not Applicable',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n
\r\n Name of the clinical trial registry:
\r\n \r\n {\r\n updateValidation('registerName', isValid);\r\n updateMaxLength('registerName', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('registerName', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n Registry identifier code / number for this clinical trial:
\r\n \r\n {\r\n updateValidation('registryIdentifier', isValid);\r\n updateMaxLength('registryIdentifier', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('registryIdentifier', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n \r\n 8. Current Progress of Study\r\n {!validation.checkEitherOne && forceErrorDisplay && (\r\n \r\n\r\n
\r\n (Either one should be checked below)
\r\n )}\r\n \r\n {\r\n // updateValue('continueAccordingToThePlan', JSON.parse(e.target.value));\r\n\r\n setPostData(\r\n produce((draft) => {\r\n draft.continueAccordingToThePlan = JSON.parse(e.target.value);\r\n }),\r\n );\r\n\r\n clearKey(['extend', 'extendReason', 'termination', 'terminationReason']);\r\n }}\r\n value={getValue('continueAccordingToThePlan')}\r\n operators={[\r\n {\r\n key: true,\r\n label: 'Continue according to the plan',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n {\r\n // updateValue('extend', JSON.parse(e.target.value));\r\n\r\n setPostData(\r\n produce((draft) => {\r\n draft.extend = JSON.parse(e.target.value);\r\n }),\r\n );\r\n\r\n clearKey(['continueAccordingToThePlan', 'termination', 'terminationReason']);\r\n }}\r\n value={getValue('extend')}\r\n operators={[\r\n {\r\n key: true,\r\n label: 'Extend study period (please state the proposed extension date and submit Protocol Amendment Application)',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n {\r\n updateValidation('extendReason', isValid);\r\n updateMaxLength('extendReason', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('extendReason', e.target.value);\r\n }}\r\n disabled={!isPermission || !getValue('extend')}\r\n />\r\n
\r\n \r\n {\r\n // updateValue('termination', JSON.parse(e.target.value));\r\n\r\n setPostData(\r\n produce((draft) => {\r\n draft.termination = JSON.parse(e.target.value);\r\n }),\r\n );\r\n\r\n clearKey(['continueAccordingToThePlan', 'extend', 'extendReason']);\r\n }}\r\n value={getValue('termination')}\r\n operators={[\r\n {\r\n key: true,\r\n label: 'Premature termination',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n {\r\n updateValidation('terminationReason', isValid);\r\n updateMaxLength('terminationReason', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('terminationReason', e.target.value);\r\n }}\r\n disabled={!isPermission || !getValue('termination')}\r\n />\r\n
\r\n \r\n Upload Supplementary Document \r\n {isPermission && (\r\n setShowUploadDocDialog(true)}\r\n >\r\n Add\r\n \r\n )}\r\n
\r\n \r\n );\r\n};\r\n\r\nexport default ProgressReport;\r\n","import { useEffect, useState } from 'react';\r\nimport { downloadLocalFile, getTimeWithTimeZone, produce } from 'utility/general';\r\nimport CustomLink from 'components/CustomLink';\r\nimport { GET_DOWNLOAD_DOCUMENT } from 'store/key';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport usePrevious from 'hooks/usePrevious';\r\nimport { isEqual } from 'lodash';\r\nimport API from 'api/call';\r\n\r\nconst useUploadDocData = ({ isPermission, data }) => {\r\n const dispatch = useDispatch();\r\n const user = useSelector((state) => state.user);\r\n const [rows, setRows] = useState([]);\r\n const [addSupplements, setAddSupplements] = useState([]);\r\n const previousData = usePrevious(data?.supplementDocuments);\r\n const [deleteSupplements, setDeleteSupplements] = useState([]);\r\n\r\n useEffect(() => {\r\n const currentData = data?.supplementDocuments ?? [];\r\n\r\n const check = isEqual(currentData, previousData);\r\n\r\n if (!check) {\r\n setRows(currentData);\r\n }\r\n\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [previousData, data]);\r\n\r\n const getDownloadDocument = (row, type) => {\r\n if (row.tempFile) {\r\n downloadLocalFile(row.tempFile);\r\n } else {\r\n dispatch({\r\n type: GET_DOWNLOAD_DOCUMENT,\r\n payload: {\r\n data: {\r\n id: row.id,\r\n },\r\n apiUrl: API.susarReport.downloadDocument,\r\n },\r\n });\r\n }\r\n };\r\n\r\n const getFileNameContent = (params, type) => {\r\n let fileName = params.getValue('fileName');\r\n\r\n return (\r\n \r\n
\r\n \r\n 1. Research Identification \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n Scientific Title:
\r\n {getValue('scientificTitle')}
\r\n \r\n
\r\n IRB/REC Ref. No.:
\r\n {getValue('refNo')}
\r\n \r\n
\r\n Coordinating Investigator:
\r\n {getValue('ci')}
\r\n \r\n
\r\n Protocol No.:
\r\n {getValue('protocolNo')}
\r\n \r\n
\r\n Anticipated Study End Date:
\r\n \r\n {getValue('anticipatedStudyEndDate')\r\n ? moment(getValue('anticipatedStudyEndDate')).format('YYYY-MM-DD')\r\n : getValue('anticipatedStudyEndDate')}\r\n
\r\n \r\n 2. Final Report \r\n\r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n
\r\n\r\n \r\n
\r\n Actual Study Start Date:
\r\n \r\n
\r\n \r\n {\r\n updateValidation('actualStudyStartDate', isValid);\r\n }}\r\n minDate={new Date(finalReport?.remoteDetail?.decisionDate).getTime()}\r\n maxDate={new Date().getTime()}\r\n onChange={(date) => {\r\n updateValue('actualStudyStartDate', date);\r\n }}\r\n />\r\n
\r\n \r\n {\r\n if (e.target.checked) {\r\n clearKey(['actualStudyStartDate', 'actualStudyEndDate']);\r\n }\r\n updateValue('isNotYetStarted', e.target.checked);\r\n }}\r\n size=\"small\"\r\n color=\"primary\"\r\n />\r\n
\r\n Not yet started
\r\n \r\n
\r\n Actual Study End Date:
\r\n \r\n {\r\n updateValidation('actualStudyEndDate', isValid);\r\n }}\r\n maxDate={new Date().getTime()}\r\n onChange={(date) => {\r\n updateValue('actualStudyEndDate', date);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n Planned Sample Size (Total):
\r\n {getValue('plannedSampleSize')}
\r\n \r\n
\r\n No. of Completed*:
\r\n \r\n {\r\n updateValidation('noOfCompleted', isValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('noOfCompleted', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n No. of Recruited*:
\r\n \r\n {\r\n updateValidation('noOfRecruited', isValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('noOfRecruited', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n Any Withdrawal?:
\r\n \r\n {\r\n updateValue('anyWithdrawal', JSON.parse(e.target.value));\r\n\r\n if (!JSON.parse(e.target.value)) {\r\n clearKey(['noOfWithdrawnAfterRecruited', 'withdrawalReasons']);\r\n }\r\n }}\r\n isRequired\r\n isValidValue={(isValid) => {\r\n updateValidation('anyWithdrawal', isValid);\r\n }}\r\n forceErrorDisplay={forceErrorDisplay}\r\n operators={[\r\n { key: true, label: 'Yes' },\r\n { key: false, label: 'No' },\r\n ]}\r\n />\r\n
\r\n \r\n
\r\n No. of Withdrawn after recruited*:
\r\n \r\n {\r\n updateValidation('noOfWithdrawnAfterRecruited', isValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('noOfWithdrawnAfterRecruited', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n Withdrawal reasons:
\r\n \r\n {\r\n updateValidation('withdrawalReasons', isValid);\r\n updateMaxLength('withdrawalReasons', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('withdrawalReasons', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n \r\n *For multi-sites trial, please specify the total no. of subjects as well as the no. of subjects\r\n in corresponding local site(s).\r\n \r\n
\r\n\r\n \r\n \r\n 3. Summary of Local Serious Adverse Events\r\n \r\n {\r\n updateValidation('mandatorySeriousAdverseEvents', isValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('mandatorySeriousAdverseEvents', JSON.parse(e.target.value));\r\n }}\r\n value={getValue('mandatorySeriousAdverseEvents')}\r\n operators={[\r\n {\r\n key: true,\r\n label: 'Yes',\r\n },\r\n {\r\n key: false,\r\n label: 'No/Not Applicable',\r\n },\r\n ]}\r\n />\r\n
\r\n {isPermission && (\r\n \r\n Does the Local SAE affect the study?\r\n
\r\n \r\n 0}\r\n onChange={(e) => {\r\n updateValue('saeAffect', JSON.parse(e.target.value));\r\n\r\n if (!JSON.parse(e.target.value)) {\r\n clearKey(['saeDetails']);\r\n }\r\n }}\r\n forceErrorDisplay={forceErrorDisplay}\r\n isValidValue={(isValid) => {\r\n updateValidation('saeAffect', isValid);\r\n }}\r\n value={getValue('saeAffect')}\r\n operators={[\r\n {\r\n key: true,\r\n label: 'Yes',\r\n },\r\n {\r\n key: false,\r\n label: 'No',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n {\r\n updateValidation('saeDetails', isValid);\r\n updateMaxLength('saeDetails', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('saeDetails', e.target.value);\r\n }}\r\n />\r\n
\r\n\r\n \r\n
\r\n \r\n 4. Complaints from Subjects \r\n
\r\n \r\n {\r\n updateValidation('complaintsFromSubjects', isValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('complaintsFromSubjects', JSON.parse(e.target.value));\r\n\r\n if (!JSON.parse(e.target.value)) {\r\n clearKey(['complaintsDetails']);\r\n }\r\n }}\r\n value={getValue('complaintsFromSubjects')}\r\n operators={[\r\n {\r\n key: true,\r\n label: 'Yes',\r\n },\r\n {\r\n key: false,\r\n label: 'No',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n {\r\n updateValidation('complaintsDetails', isValid);\r\n updateMaxLength('complaintsDetails', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('complaintsDetails', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n 5. Study Status \r\n\r\n
\r\n \r\n {\r\n updateValidation('studyDuration', isValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('studyDuration', e.target.value);\r\n }}\r\n value={getValue('studyDuration')}\r\n operators={[\r\n {\r\n customKey: 'completed',\r\n label: 'Completed',\r\n },\r\n {\r\n customKey: 'prematureTermination',\r\n label: 'Premature termination',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n {\r\n updateValidation('translationStudyOutcome', isValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('translationStudyOutcome', parseInt(e.target.value));\r\n\r\n if (parseInt(e.target.value) === 2) {\r\n clearKey(['describeWhichAspects']);\r\n }\r\n }}\r\n value={getValue('translationStudyOutcome')}\r\n operators={[\r\n {\r\n key: 0,\r\n label: 'Yes, translated',\r\n },\r\n {\r\n key: 1,\r\n label: 'Yes, in progress',\r\n },\r\n {\r\n key: 2,\r\n label: 'No / Not applicable',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n
\r\n Details:
\r\n \r\n {\r\n updateValidation('describeWhichAspects', isValid);\r\n updateMaxLength('describeWhichAspects', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('describeWhichAspects', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n {\r\n updateValidation('publication', isValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('publication', parseInt(e.target.value));\r\n\r\n if (parseInt(e.target.value) === 2) {\r\n clearKey([\r\n 'indicateDetailsTitle',\r\n 'indicateDetailsYear',\r\n 'indicateDetailsNameOfYear',\r\n ]);\r\n }\r\n }}\r\n test\r\n value={getValue('publication')}\r\n operators={[\r\n {\r\n key: 0,\r\n label: 'Yes, published',\r\n },\r\n {\r\n key: 1,\r\n label: 'Yes, in progress',\r\n },\r\n {\r\n key: 2,\r\n label: 'No',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n
\r\n Title of published paper or to-be-published paper:
\r\n \r\n {\r\n updateValidation('indicateDetailsTitle', isValid);\r\n updateMaxLength('indicateDetailsTitle', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('indicateDetailsTitle', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n Year of publication:
\r\n \r\n {\r\n updateValidation('indicateDetailsYear', isValid);\r\n updateMaxLength('indicateDetailsYear', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('indicateDetailsYear', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n Name of Journal:
\r\n \r\n {\r\n updateValidation('indicateDetailsNameOfYear', isValid);\r\n updateMaxLength('indicateDetailsNameOfYear', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('indicateDetailsNameOfYear', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n This clinical trial is registered in a publicly available, free to access, searchable clinical\r\n trial registry?\r\n
\r\n \r\n {\r\n updateValue('registered', JSON.parse(e.target.value));\r\n\r\n if (!JSON.parse(e.target.value)) {\r\n clearKey(['registerName', 'registryIdentifier']);\r\n }\r\n }}\r\n value={getValue('registered')}\r\n isRequired\r\n isValidValue={(isValid) => {\r\n updateValidation('registered', isValid);\r\n }}\r\n forceErrorDisplay={forceErrorDisplay}\r\n operators={[\r\n {\r\n key: true,\r\n label: 'Yes',\r\n },\r\n {\r\n key: false,\r\n label: 'No / Not Applicable',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n
\r\n Name of the clinical trial registry:
\r\n \r\n {\r\n updateValidation('registerName', isValid);\r\n updateMaxLength('registerName', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('registerName', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n Registry identifier code / number for this clinical trial:
\r\n \r\n {\r\n updateValidation('registryIdentifier', isValid);\r\n updateMaxLength('registryIdentifier', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n updateValue('registryIdentifier', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n SAE start date:
\r\n \r\n
\r\n \r\n {\r\n updateRemoteDetail('saeStartDate', date);\r\n }}\r\n forceErrorDisplay={forceErrorDisplay}\r\n validators={['isRequired']}\r\n isValidValue={(isValid) => setSaeStartDateValid(isValid)}\r\n />\r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n *Follow-up should be reported until SAE is resolved.\r\n
\r\n SAE stop date:\r\n \r\n
\r\n \r\n {\r\n updateRemoteDetail('saeStopDate', date);\r\n }}\r\n validators={remoteDetail.saeNotResolved ? [] : ['isRequired']}\r\n forceErrorDisplay={forceErrorDisplay}\r\n isValidValue={(isValid) => setSaeStopDateValid(isValid)}\r\n />\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n Type of SAE:\r\n
\r\n \r\n setTypeOfSaeValid(isValid)}\r\n onChange={(e) => {\r\n const value = e.target.value === 'true';\r\n updateRemoteDetail('typeOfSae', value);\r\n }}\r\n value={remoteDetail.typeOfSae !== null ? remoteDetail.typeOfSae : null}\r\n operators={[\r\n {\r\n key: false,\r\n label: 'Initial',\r\n },\r\n {\r\n key: true,\r\n label: 'Follow up',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n Frequency:\r\n
\r\n \r\n setFrequencyValid(isValid)}\r\n disabled={isViewOnly}\r\n onChange={(e) => {\r\n updateRemoteDetail('frequency', Number(e.target.value));\r\n }}\r\n value={remoteDetail.frequency !== null ? Number(remoteDetail.frequency) : null}\r\n operators={[\r\n {\r\n key: 0,\r\n label: 'One episode',\r\n },\r\n {\r\n key: 1,\r\n label: 'Intermittent',\r\n },\r\n {\r\n key: 2,\r\n label: 'Continuous',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n
\r\n \r\n Seriousness:\r\n {forceErrorDisplay && !checkSeriousnessValid() &&\r\n
\r\n {systemMsg.required}
}\r\n \r\n \r\n \r\n handleSeriousness('isDeath', checked)}\r\n value={[remoteDetail.isDeath]}\r\n defaultData={[\r\n {\r\n key: true,\r\n display: 'Death',\r\n },\r\n ]}\r\n />\r\n \r\n \r\n handleSeriousness('isLiftThreatening', checked)}\r\n value={[remoteDetail.isLiftThreatening]}\r\n defaultData={[\r\n {\r\n key: true,\r\n display: 'Life threatening',\r\n },\r\n ]}\r\n />\r\n \r\n \r\n handleSeriousness('isSignificantDisability', checked)}\r\n value={[remoteDetail.isSignificantDisability]}\r\n defaultData={[\r\n {\r\n key: true,\r\n display: 'Significant disability / incapacity',\r\n },\r\n ]}\r\n />\r\n \r\n \r\n \r\n \r\n handleSeriousness('isRequiredHospitalization', checked)}\r\n value={[remoteDetail.isRequiredHospitalization]}\r\n defaultData={[\r\n {\r\n key: true,\r\n display: 'Required hospitalization',\r\n },\r\n ]}\r\n />\r\n \r\n \r\n handleSeriousness('isPersisentDisability', checked)}\r\n value={[remoteDetail.isPersisentDisability]}\r\n defaultData={[\r\n {\r\n key: true,\r\n display: 'Persistent disability / incapacity',\r\n },\r\n ]}\r\n />\r\n \r\n \r\n handleSeriousness('isProlongedHospitalization', checked)}\r\n value={[remoteDetail.isProlongedHospitalization]}\r\n defaultData={[\r\n {\r\n key: true,\r\n display: 'Prolonged hospitalization',\r\n },\r\n ]}\r\n />\r\n \r\n \r\n \r\n \r\n handleSeriousness('isCongenitalAnomaly', checked)}\r\n value={[remoteDetail.isCongenitalAnomaly]}\r\n defaultData={[\r\n {\r\n key: true,\r\n display: 'Congenital anomaly / birth defect',\r\n },\r\n ]}\r\n />\r\n \r\n \r\n handleSeriousness('isNone', checked)}\r\n value={[remoteDetail.isNone]}\r\n defaultData={[\r\n {\r\n key: true,\r\n display: 'None of the above',\r\n },\r\n ]}\r\n />\r\n \r\n \r\n handleSeriousness('isOther', checked)}\r\n value={[remoteDetail.isOther]}\r\n defaultData={[\r\n {\r\n key: true,\r\n display: 'Other medically important condition',\r\n },\r\n ]}\r\n />\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n On the affected subject:\r\n
\r\n \r\n setAffectedSubjectValid(isValid)}\r\n disabled={isViewOnly}\r\n allowUnCheckAll\r\n onItemChange={changeAffected}\r\n value={getAffectedSubject()}\r\n defaultData={[\r\n {\r\n key: 'affectedSubjectNone',\r\n display: 'None',\r\n },\r\n {\r\n key: 'affectedSubjectAdjustedDosage',\r\n display: 'Adjusted dosage',\r\n },\r\n {\r\n key: 'affectedSubjectInterrupt',\r\n display: 'Interrupted temporarily',\r\n },\r\n {\r\n key: 'affectedSubjectDiscontinued',\r\n display: 'Discontinued / terminated study',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n
\r\n \r\n For all subjects / study design:\r\n
\r\n \r\n
\r\n \r\n Alteration of protocol required?\r\n
\r\n \r\n setAlterationRequiredValid(isValid)}\r\n disabled={isViewOnly}\r\n onChange={(e) => {\r\n updateRemoteDetail('alterationRequired', e.target.value === 'true');\r\n }}\r\n value={remoteDetail.alterationRequired}\r\n operators={[\r\n {\r\n key: true,\r\n label: 'Yes',\r\n },\r\n {\r\n key: false,\r\n label: 'No',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n Any recommendation from the Data Monitoring Committee?\r\n
\r\n \r\n setRecommendationValid(isValid)}\r\n disabled={isViewOnly}\r\n onChange={(e) => {\r\n updateRemoteDetail('recommendation', e.target.value === 'true');\r\n }}\r\n value={remoteDetail.recommendation}\r\n operators={[\r\n {\r\n key: true,\r\n label: 'Yes',\r\n },\r\n {\r\n key: false,\r\n label: 'No',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n
\r\n Scientific Title:
\r\n {remoteDetail.scientificTitle}
\r\n \r\n
\r\n IRB/REC Ref. No.:
\r\n {remoteDetail.refNo}
\r\n \r\n
\r\n Coordinating Investigator:
\r\n {remoteDetail.ci}
\r\n \r\n
\r\n Protocol No.:
\r\n {remoteDetail.protocolNo}
\r\n \r\n
\r\n Site Principal Investigator of this SAE site:
\r\n {remoteDetail.piSiteName}
\r\n \r\n
\r\n \r\n Actual Study Start Date:
\r\n \r\n \r\n
\r\n \r\n {\r\n updateRemoteDetail('actualStudyStartDate', date);\r\n }}\r\n value={remoteDetail?.actualStudyStartDate}\r\n disabled={isViewOnly || remoteDetail.isNotYetStarted}\r\n minDate={new Date(approvalDecisionDate).getTime()}\r\n maxDate={new Date().getTime()}\r\n validators={remoteDetail.isNotYetStarted ? [] : ['isRequired']}\r\n forceErrorDisplay={forceErrorDisplay}\r\n isValidValue={(isValid) => setActualStudyStartDateValid(isValid)}\r\n />\r\n
\r\n \r\n
\r\n Anticipated Study End Date:
\r\n \r\n {getTimeWithTimeZone(remoteDetail.antipicateStudyEndDate).format('YYYY-MM-DD')}\r\n
\r\n \r\n
\r\n Planned Sample Size (site):
\r\n {remoteDetail.plannedSampleSize}
\r\n \r\n
\r\n Actual no. of recruited subjects (site):
\r\n \r\n setRecruitedSubjectNoValid(isValid)}\r\n onChange={(e) => {\r\n updateRemoteDetail('recruitedSubjectNo', Number(e.target.value));\r\n }}\r\n />\r\n
\r\n \r\n
\r\n Name of study site:
\r\n \r\n setNameOfStudySiteValid(isValid)}\r\n onChange={(e) => {\r\n updateRemoteDetail('nameOfStudySite', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n {systemMsg.required}\r\n
\r\n )}\r\n \r\n 3.1 Any alteration of protocol required?\r\n
\r\n \r\n 3.2 Any recommendation from the Data Monitoring Committee?\r\n
\r\n \r\n
\r\n Scientific Title:
\r\n {remoteDetail?.scientificTitle}
\r\n \r\n
\r\n IRB/REC Ref. No.:
\r\n {remoteDetail?.refNo}
\r\n \r\n
\r\n Protocol No.:
\r\n {remoteDetail?.protocolNo}
\r\n \r\n
\r\n Coordinating Investigator:
\r\n {remoteDetail?.ci}
\r\n \r\n
\r\n Anticipated Study End Date:
\r\n \r\n {remoteDetail?.antipicateStudyEndDate\r\n ? getTimeWithTimeZone(remoteDetail.antipicateStudyEndDate).format('YYYY-MM-DD')\r\n : '-'}\r\n
\r\n \r\n
\r\n \r\n Actual Study Start Date:\r\n
\r\n \r\n
\r\n \r\n handleChange('actualStudyStartDate', new Date(date))}\r\n disabled={isViewOnly || isNotYetStarted}\r\n minDate={new Date(approvalDecisionDate).getTime()}\r\n maxDate={new Date().getTime()}\r\n validators={isNotYetStarted ? [] : ['isRequired']}\r\n forceErrorDisplay={forceErrorDisplay}\r\n isValidValue={(isValid) => setActualStudyStartDateValid(isValid)}\r\n />\r\n
\r\n \r\n
\r\n Planned Sample Size (total):
\r\n {remoteDetail?.plannedSampleSize}
\r\n \r\n
\r\n Scientific Title:
\r\n {remoteDetail?.scientificTitle}
\r\n \r\n
\r\n IRB/REC Ref. No.:
\r\n {remoteDetail?.refNo}
\r\n \r\n
\r\n Protocol No.:
\r\n {remoteDetail?.protocolNo}
\r\n \r\n
\r\n Coordinating Investigator:
\r\n {remoteDetail?.ci}
\r\n \r\n
\r\n Anticipated Study End Date:
\r\n \r\n {remoteDetail?.antipicateStudyEndDate\r\n ? getTimeWithTimeZone(remoteDetail.antipicateStudyEndDate).format('YYYY-MM-DD')\r\n : '-'}\r\n
\r\n \r\n
\r\n \r\n Actual Study Start Date:\r\n
\r\n \r\n
\r\n \r\n handleChange('actualStudyStartDate', new Date(date))}\r\n disabled={isViewOnly || isNotYetStarted}\r\n minDate={new Date(approvalDecisionDate).getTime()}\r\n maxDate={new Date().getTime()}\r\n validators={isNotYetStarted ? [] : ['isRequired']}\r\n forceErrorDisplay={forceErrorDisplay}\r\n isValidValue={(isValid) => setActualStudyStartDateValid(isValid)}\r\n />\r\n
\r\n \r\n {!isViewOnly && \r\n Submit\r\n }\r\n {\r\n history.goBack()\r\n }}>\r\n Back\r\n \r\n
\r\n {isViewOnly && \r\n View Only\r\n
}\r\n \r\n setDecision(e.target.value)}\r\n choices={choices}\r\n disabled={isViewOnly}\r\n isRequired\r\n forceErrorDisplay={forceErrorDisplay}\r\n isValidValue={(isValid) => setDecisionValid(isValid)}\r\n />\r\n
\r\n \r\n setComment(e.target.value)}\r\n maxLength={1000}\r\n disabled={isViewOnly}\r\n />\r\n
\r\n\r\n \r\n setShareCommentValid(isValid)}\r\n disabled={isViewOnly}\r\n onChange={(e) => {\r\n setShareComment(JSON.parse(e.target.value));\r\n }}\r\n value={shareComment}\r\n operators={[\r\n {\r\n key: true,\r\n label: 'Yes',\r\n },\r\n {\r\n key: false,\r\n label: 'No',\r\n },\r\n ]}\r\n />\r\n
\r\n \r\n \r\n {\r\n setDeclaration(JSON.parse(e.target.value));\r\n if (!JSON.parse(e.target.value)){\r\n setRelationships('')\r\n }\r\n }}\r\n >\r\n \r\n\r\n \r\n setRelationships(e.target.value)}\r\n value={relationships}\r\n isTextArea\r\n textAreaMinRow={6}\r\n label={'Relationships'}\r\n maxLength={1000}\r\n disabled={!declaration || isViewOnly}\r\n forceErrorDisplay={forceErrorDisplay}\r\n validators={!declaration ? [] : ['isRequired']}\r\n />\r\n \r\n
\r\n \r\n
\r\n \r\n {\r\n saveData('occurrenceDate', value, index);\r\n }}\r\n validators={['isRequired']}\r\n forceErrorDisplay={forceErrorDisplay}\r\n />\r\n
\r\n \r\n saveData('type', e.target.value, index)}\r\n validators={['isRequired']}\r\n forceErrorDisplay={forceErrorDisplay}\r\n />\r\n
\r\n {rowList.length > 1 && isPermission && (\r\n \r\n
\r\n Did the deviation / incident cause AE / SAE?
\r\n \r\n {\r\n saveData('causeAe', key * 1, index);\r\n }}\r\n validators={['isRequired']}\r\n forceErrorDisplay={forceErrorDisplay}\r\n isRequired\r\n />\r\n
\r\n \r\n
\r\n Increase the risks to subject?
\r\n \r\n {\r\n saveData('increaseRisks', key * 1, index);\r\n }}\r\n validators={['isRequired']}\r\n forceErrorDisplay={forceErrorDisplay}\r\n isRequired\r\n />\r\n
\r\n \r\n
\r\n Any action to avoid similar deviation / incident in the future?
\r\n \r\n {\r\n saveData('avoidDeviation', key * 1, index);\r\n }}\r\n validators={['isRequired']}\r\n forceErrorDisplay={forceErrorDisplay}\r\n isRequired\r\n />\r\n
\r\n \r\n
\r\n Deviation was caused by:
\r\n \r\n {\r\n saveData('deviationCaused', e.target.value, index);\r\n }}\r\n validators={['isRequired']}\r\n label={'Deviation Caused'}\r\n name=\"deviationCaused\"\r\n forceErrorDisplay={forceErrorDisplay}\r\n />\r\n
\r\n \r\n
\r\n Scientific Title:
\r\n {remoteDetail?.scientificTitle}
\r\n \r\n
\r\n IRB/REC Ref. No.:
\r\n {remoteDetail?.refNo}
\r\n \r\n
\r\n Coordinating Investigator:
\r\n {remoteDetail?.ci}
\r\n \r\n
\r\n Protocol No.:
\r\n {remoteDetail?.protocolNo}
\r\n \r\n
\r\n Planned Sample Size (site):
\r\n {remoteDetail?.plannedSampleSize}
\r\n \r\n
\r\n Actual Study Start Date:
\r\n \r\n
\r\n \r\n handleChange('actualStudyStartDate', new Date(date))}\r\n disabled={isViewOnly || isNotYetStarted}\r\n minDate={new Date(approvalDecisionDate).getTime()}\r\n maxDate={new Date().getTime()}\r\n validators={isNotYetStarted ? [] : ['isRequired']}\r\n forceErrorDisplay={forceErrorDisplay}\r\n isValidValue={(isValid) => setActualStudyStartDateValid(isValid)}\r\n />\r\n
\r\n \r\n
\r\n Anticipated Study End Date:
\r\n \r\n {remoteDetail?.antipicateStudyEndDate\r\n ? getTimeWithTimeZone(remoteDetail.antipicateStudyEndDate).format('YYYY-MM-DD')\r\n : '-'}\r\n
\r\n \r\n
\r\n Study Site of this deviation / incident:
\r\n \r\n {\r\n setStudySiteValid(isValid);\r\n updateMaxLength('studySite', isMaxLengthValid);\r\n }}\r\n onChange={(e) => {\r\n handleChange('studySite', e.target.value);\r\n }}\r\n />\r\n
\r\n \r\n
\r\n Site Principal Investigator of the above study site:
\r\n {remoteDetail?.piSiteName}
\r\n \r\n \r\n Add All\r\n \r\n
\r\n ),\r\n disableItemSort: true,\r\n valueGetter: (params) => {\r\n const isExist = selectedRows.some((item) => item.id === params.row.id);\r\n return (\r\n \r\n \r\n \r\n \r\n Search Application Document: \r\n
\r\n \r\n \r\n \r\n\r\n {\r\n setSearchCriteria({ ...searchCriteria, page: 1 });\r\n getApplicationDocByParams({ ...searchCriteria, page: 1 });\r\n }}\r\n disabled={searchCriteria.param === ''}\r\n style={{ height: 38 }}\r\n >\r\n Search\r\n \r\n \r\n Reset\r\n \r\n\r\n
\r\n \r\n {\r\n setSearchCriteria({ ...searchCriteria, criteria: e.target.value });\r\n getApplicationDocByParams({ ...searchCriteria, criteria: e.target.value });\r\n }}\r\n choices={listOfCriteria}\r\n />\r\n
\r\n \r\n \r\n setSearchCriteria({ ...searchCriteria, param: e.target.value })\r\n }\r\n onPressEnter={() => {\r\n setSearchCriteria({ ...searchCriteria, page: 1 });\r\n getApplicationDocByParams({ ...searchCriteria, page: 1 });\r\n }}\r\n />\r\n
\r\n \r\n {\r\n setSearchCriteria({ ...searchCriteria, page: 1, pageSize });\r\n getApplicationDocByParams({ ...searchCriteria, page: 1, pageSize });\r\n }}\r\n />\r\n
\r\n \r\n
\r\n \r\n {\r\n setSearchCriteria({ ...searchCriteria, page });\r\n getApplicationDocByParams({ ...searchCriteria, page });\r\n }}\r\n />\r\n
\r\n\r\n \r\n\r\n \r\n Selected Application Document: \r\n
\r\n \r\n \r\n \r\n deleteSelectedRow(item, false)}\r\n skipMaxHeight={false}\r\n maxHeight={280}\r\n />\r\n
\r\n \r\n Application Document: \r\n {isEditMode && (\r\n setOpenPopup(true)}>\r\n Add\r\n \r\n )}\r\n
\r\n \r\n deleteSelectedRow(item, true)}\r\n columns={selectedColumns}\r\n rows={selectedList}\r\n allowResize\r\n // fullWidthTable={false}\r\n // skipMaxHeight={false}\r\n />\r\n
\r\n \r\n );\r\n}\r\n","import React from 'react';\r\nimport CustomDatePicker from 'components/Input/CustomDatePicker';\r\nimport styled from 'styled-components';\r\nimport CustomOutlineSelect from 'components/Input/CustomOutlineSelect';\r\nimport { typeOfReview } from 'constants/globalEnum';\r\nimport moment from 'moment';\r\nconst SRow = styled.div`\r\n display: flex;\r\n align-items: center;\r\n margin-bottom: 20px;\r\n\r\n & > div:nth-child(1) {\r\n width: 200px;\r\n flex-shrink: 0;\r\n font-weight: bold;\r\n }\r\n\r\n & > div:nth-child(2) {\r\n width: 400px;\r\n }\r\n`;\r\n\r\nexport default function TextFieldContainer({ isEditMode, handleSave, saveData, forceErrorDisplay }) {\r\n const handleChangeValue = (name, value) => {\r\n handleSave({ ...saveData, [name]: value });\r\n };\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {/* \r\n */}\r\n
\r\n );\r\n}\r\n","import React, { useEffect, useState } from 'react';\r\nimport TextSubHeader from 'components/CustomText/TextSubHeader';\r\nimport styled from 'styled-components';\r\n\r\n// const useStyles = makeStyles((theme) => ({\r\n// root: {\r\n// marginTop: theme.spacing(4),\r\n// },\r\n// container: {\r\n// border: '1px solid #ddd',\r\n// paddingLeft: theme.spacing(2),\r\n// paddingRight: theme.spacing(2),\r\n// marginTop: theme.spacing(2),\r\n// },\r\n// title: {\r\n// marginRight: theme.spacing(4),\r\n// fontWeight: 'bold',\r\n// },\r\n// item: {\r\n// paddingTop: theme.spacing(1),\r\n// paddingBottom: theme.spacing(1),\r\n// },\r\n// content: {\r\n// paddingTop: theme.spacing(1),\r\n// paddingBottom: theme.spacing(1),\r\n// paddingRight: theme.spacing(8),\r\n// },\r\n// diver: {\r\n// width: '100%',\r\n// },\r\n// number: {\r\n// width: '50px',\r\n// height: '30px',\r\n// },\r\n// }));\r\n\r\nconst SContainer = styled.div`\r\n border-radius: 5px;\r\n border: 1px solid #dcdcdc;\r\n margin-top: 10px;\r\n`;\r\n\r\nconst SRow = styled.div`\r\n display: flex;\r\n padding: 8px;\r\n justify-content: space-between;\r\n`;\r\n\r\nconst SItem = styled.div`\r\n display: flex;\r\n width: 30%;\r\n justify-content: space-between;\r\n align-items: center;\r\n`;\r\n\r\nconst SCount = styled.div`\r\n border-radius: 15px;\r\n background: #3f51b5;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n color: #fff;\r\n width: 50px;\r\n padding: 5px 0px;\r\n`;\r\n\r\nconst SDivider = styled.div`\r\n height: 1px;\r\n background: #dcdcdc;\r\n width: 100%;\r\n`;\r\n\r\nconst PanelMemberComposition = ({ memberComposition = [] }) => {\r\n // const classes = useStyles();\r\n const [list, setList] = useState({\r\n member: 0,\r\n female: 0,\r\n male: 0,\r\n scientificMember: 0,\r\n nonScientificMember: 0,\r\n independentMember: 0,\r\n });\r\n\r\n useEffect(() => {\r\n let data = {\r\n member: memberComposition.length,\r\n female: 0,\r\n male: 0,\r\n scientificMember: 0,\r\n nonScientificMember: 0,\r\n independentMember: 0,\r\n };\r\n memberComposition.forEach((element) => {\r\n // data.female=element.gender==='F'?++data.female\r\n if (element.gender === 'F' || element.gender === 'Female') data.female += 1;\r\n if (element.gender === 'M') data.male += 1;\r\n if (element.background === 'Scientific') data.scientificMember += 1;\r\n if (element.background === 'Non-Scientific') data.nonScientificMember += 1;\r\n if (element.independent?.toString() === '1') data.independentMember += 1;\r\n });\r\n setList(data);\r\n }, [memberComposition]);\r\n\r\n return (\r\n Type of Review:
\r\n \r\n {isEditMode ? (\r\n handleChangeValue('typeOfReview', e.target.value)}\r\n choices={typeOfReview}\r\n label=\"Type of Review\"\r\n isRequired\r\n forceErrorDisplay={forceErrorDisplay}\r\n />\r\n ) : (\r\n typeOfReview.find((item) => item.key === saveData.typeOfReview)?.display || '-'\r\n )}\r\n
\r\n Review Due Date:
\r\n \r\n handleChangeValue('reviewDueDate', new Date(date))}\r\n />\r\n\r\n {/* {isEditMode ? (\r\n handleChangeValue('reviewDueDate', new Date(date))}\r\n />\r\n ) : saveData.reviewDueDate ? (\r\n moment(saveData.reviewDueDate).format('YYYY-MM-DD')\r\n ) : (\r\n '-'\r\n )} */}\r\n
\r\n Review Meeting Date:
\r\n \r\n handleChangeValue('reviewMeetingDate', new Date(date))}\r\n />\r\n {/* {isEditMode ? (\r\n handleChangeValue('reviewMeetingDate', new Date(date))}\r\n />\r\n ) : saveData.reviewMeetingDate ? (\r\n moment(saveData.reviewMeetingDate).format('YYYY-MM-DD')\r\n ) : (\r\n '-'\r\n )} */}\r\n
\r\n Review Circulation Date:
\r\n \r\n handleChangeValue('reviewCirculationDate', new Date(date))}\r\n />\r\n {/* {isEditMode ? (\r\n handleChangeValue('reviewCirculationDate', new Date(date))}\r\n />\r\n ) : saveData.reviewCirculationDate ? (\r\n moment(saveData.reviewCirculationDate).format('YYYY-MM-DD')\r\n ) : (\r\n '-'\r\n )} */}\r\n
\r\n Review Panel:
\r\n \r\n {}}\r\n choices={[\r\n { key: '0', display: 'Panel 1' },\r\n { key: '1', display: 'Panel 2' },\r\n ]}\r\n placeholder={'Please choose your decision'}\r\n />\r\n
\r\n \r\n Panel Member Composition \r\n\r\n \r\n \r\n \r\n Members: \r\n {list.member} \r\n \r\n \r\n \r\n \r\n Female: \r\n {list.female} \r\n \r\n \r\n Male: \r\n {list.male} \r\n \r\n \r\n \r\n \r\n Scientific Member: \r\n {list.scientificMember} \r\n \r\n \r\n Non-Scientific Member: \r\n {list.nonScientificMember} \r\n \r\n \r\n Independent Member: \r\n {list.independentMember} \r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nexport default PanelMemberComposition;\r\n","import CustomButton from 'components/CustomInput/Button';\r\nimport { Checkbox } from '@material-ui/core';\r\nimport { cloneDeep } from 'lodash';\r\nimport { useEffect, useState } from 'react';\r\n\r\nconst useSearchMember = ({ selectedRows, setSelectedRows, meetingArrangementMemberList, isEditMode, specialList }) => {\r\n const [isDisabledAll, setIsDisabledAll] = useState(false);\r\n\r\n const checkedAll = () => {\r\n let newSpecialList = cloneDeep(specialList);\r\n let newSelectedRows = cloneDeep(selectedRows);\r\n newSpecialList.forEach((item) => {\r\n let index = newSelectedRows.findIndex((ele) => ele.specialId === item.specialId);\r\n if (index >= 0) {\r\n if (!newSelectedRows[index].list.find((ele) => ele.id === item.panelNameId)) {\r\n newSelectedRows[index].list.push(...item.list);\r\n }\r\n } else {\r\n newSelectedRows.push(item);\r\n }\r\n });\r\n setSelectedRows(newSelectedRows);\r\n };\r\n\r\n const handleCheck = (value, id) => {\r\n // if (!isEditMode) return;\r\n let newSelectedRows = [...selectedRows];\r\n newSelectedRows.forEach((item) => {\r\n if (id === item.id) {\r\n item.chairman = value;\r\n }\r\n });\r\n setSelectedRows(newSelectedRows);\r\n };\r\n\r\n const handleChecked = (row) => {\r\n let newSelectedRows = cloneDeep(selectedRows);\r\n let index = selectedRows.findIndex((item) => item.specialId === row.specialId);\r\n if (index >= 0) {\r\n newSelectedRows[index].list.push(...row.list);\r\n newSelectedRows[index].id = row.specialId;\r\n } else {\r\n newSelectedRows = [...newSelectedRows, { ...row, id: row.specialId }];\r\n }\r\n setSelectedRows(newSelectedRows);\r\n };\r\n\r\n useEffect(() => {\r\n let isDisabled = true;\r\n let newSpecialList = cloneDeep(specialList);\r\n if (selectedRows.length === 0) {\r\n setIsDisabledAll(false);\r\n return;\r\n }\r\n newSpecialList.forEach((item) => {\r\n if (!selectedRows.find((ele) => ele.specialId === item.specialId)) {\r\n isDisabled = false;\r\n return;\r\n } else {\r\n selectedRows.forEach((el) => {\r\n if (\r\n el.specialId === item.specialId &&\r\n !el.list.find((ele) => ele.id === item.panelNameId) &&\r\n el.list.length > 0\r\n ) {\r\n isDisabled = false;\r\n return;\r\n }\r\n });\r\n }\r\n });\r\n setIsDisabledAll(isDisabled);\r\n }, [selectedRows, specialList]);\r\n\r\n const gender = (type) => {\r\n let gender = type || '-';\r\n switch (type) {\r\n case 'M':\r\n gender = 'Male';\r\n break;\r\n case 'F':\r\n gender = 'Female';\r\n break;\r\n default:\r\n break;\r\n }\r\n return gender;\r\n };\r\n\r\n // const fetchMember = (key, isDesc) => {\r\n // console.log('%c 154532 useSearchMember.js key, isDesc', 'background: green', key, isDesc);\r\n\r\n // dispatch({\r\n // type: GET_MEETING_ARRANGEMENT_MEMBER_LIST,\r\n // payload: {\r\n // params: {},\r\n // callback: () => {\r\n // // setIsMemberLoading(false);\r\n // // setIsSeach(params);\r\n // },\r\n // },\r\n // });\r\n // };\r\n const columns = [\r\n {\r\n field: 'action',\r\n headerName: (\r\n \r\n \r\n {' '}\r\n Add All\r\n \r\n
\r\n ),\r\n disableItemSort: true,\r\n valueGetter: (params) => {\r\n let isExist = true;\r\n if (params.row.list.length === 0) {\r\n if (!isEditMode) {\r\n isExist = selectedRows.some((item) => {\r\n return item.id === params.row.specialId;\r\n });\r\n } else {\r\n isExist = selectedRows.some((item) => {\r\n return item.specialId === params.row.specialId;\r\n });\r\n }\r\n } else {\r\n if (!isEditMode) {\r\n isExist = selectedRows.some((item) => {\r\n return (\r\n item.id === params.row.specialId &&\r\n (item?.reviewPanel?.find((ele) => ele.id === params.row.list[0]?.id) ||\r\n item?.list?.find((ele) => ele.id === params.row.list[0]?.id))\r\n );\r\n });\r\n } else {\r\n isExist = selectedRows.some((item) => {\r\n return (\r\n item.specialId === params.row.specialId &&\r\n item?.list?.find((ele) => ele.id === params.row.list[0]?.id)\r\n );\r\n });\r\n }\r\n }\r\n return (\r\n \r\n setOpenPopup(false)}\r\n >\r\n Added Member: \r\n
\r\n \r\n \r\n \r\n Search Panel Member: \r\n
\r\n \r\n \r\n \r\n \r\n {\r\n setSearchCriteria({ ...searchCriteria, page: 1, pageSize });\r\n getReviewPanelMemberList({ ...searchCriteria, page: 1, pageSize });\r\n }}\r\n />\r\n \r\n {\r\n setSearchCriteria({ ...searchCriteria, page: 1 });\r\n getReviewPanelMemberList({ ...searchCriteria, page: 1 });\r\n }}\r\n >\r\n Search\r\n \r\n \r\n Reset\r\n \r\n
\r\n \r\n {\r\n setSearchCriteria({ ...searchCriteria, paramKey: e.target.value, page: 1 });\r\n getReviewPanelMemberList({\r\n ...searchCriteria,\r\n paramKey: e.target.value,\r\n page: 1,\r\n });\r\n }}\r\n choices={listOfCriteria}\r\n />\r\n
\r\n \r\n \r\n setSearchCriteria({ ...searchCriteria, paramValue: e.target.value })\r\n }\r\n onPressEnter={() => {\r\n setSearchCriteria({ ...searchCriteria, page: 1 });\r\n getReviewPanelMemberList({ ...searchCriteria, page: 1 });\r\n }}\r\n />\r\n
\r\n \r\n
\r\n \r\n {\r\n setSearchCriteria({ ...searchCriteria, page });\r\n getReviewPanelMemberList({ ...searchCriteria, page });\r\n }}\r\n />\r\n
\r\n\r\n \r\n\r\n \r\n deleteSelectedRow(item)}\r\n skipMaxHeight={false}\r\n maxHeight={280}\r\n />\r\n
\r\n \r\n Panel Member: \r\n setOpenPopup(true)}>\r\n Add\r\n \r\n {/* {isEditMode && (\r\n setOpenPopup(true)}>\r\n Add\r\n \r\n )} */}\r\n
\r\n\r\n \r\n deleteSelectedRow(item, true)}\r\n columns={currentColumns}\r\n rows={selectedList}\r\n allowResize\r\n fullWidthTable={true}\r\n />\r\n
\r\n \r\n );\r\n};\r\n\r\nexport default AddPanelMemberDialog;\r\n","import React, { useEffect, useState } from 'react';\r\nimport ApplicationDoc from './components/applicationDoc';\r\nimport TextFieldContainer from './components/TextFieldContainer';\r\nimport PanelMemberComposition from './components/PanelMemberComposition';\r\nimport CustomButton from 'components/CustomInput/Button/index';\r\nimport AddPanelMemberDialog from './AddPanelMemberDialog';\r\nimport { Checkbox, Grid, Paper } from '@material-ui/core';\r\nimport {\r\n ADD_MEETING_ARRANGEMENT_FORM,\r\n EDIT_MEETING_ARRANGEMENT_FORM,\r\n GET_MEETING_ARRANGEMENT_FORM_DETAIL,\r\n} from 'store/key';\r\nimport { useHistory } from 'react-router';\r\nimport useQuery from 'hooks/useQuery';\r\nimport styled from 'styled-components';\r\nimport { useDispatch } from 'react-redux';\r\nimport useDialog from 'components/ConfirmDialog/useDialog';\r\nimport {\r\n NO_CHAIRMAN,\r\n CREATED_ARRANGE_MEETING,\r\n EDITED_ARRANGE_MEETING,\r\n NO_APPLICATION_DATA,\r\n EDITED_ARRANGE_MEETING_NOTIFICATION,\r\n} from 'utility/frontendMessage';\r\nconst SMainLayout = styled.div`\r\n height: 100%;\r\n position: relative;\r\n overflow: hidden;\r\n`;\r\n\r\nconst SHeaderLayout = styled.div`\r\n height: 55px;\r\n display: flex;\r\n padding: 0px 15px;\r\n align-items: center;\r\n background: #ecebf3;\r\n overflow: 'hidden';\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n right: 0;\r\n`;\r\n\r\nconst SLayout = styled.div`\r\n padding: 10px;\r\n position: absolute;\r\n left: 0px;\r\n right: 0px;\r\n top: ${(props) => props.positionTop}px;\r\n overflow: auto;\r\n bottom: 5px;\r\n`;\r\n\r\nexport default function ReviewArrangement(props) {\r\n const history = useHistory();\r\n const dispatch = useDispatch();\r\n const showDialog = useDialog();\r\n const [saveData, setSaveData] = useState({\r\n applicationList: [],\r\n panelMemberList: [],\r\n notSendNotification: false,\r\n typeOfReview: null,\r\n reviewDueDate: null,\r\n reviewMeetingDate: null,\r\n reviewCirculationDate: null,\r\n });\r\n\r\n const id = useQuery('id');\r\n const [forceErrorDisplay, setForceErrorDisplay] = useState(false);\r\n const [oldDataDemo, setOldDataDemo] = useState(null);\r\n const [eidted, setEidted] = useState(false);\r\n const [emailNotice, setEmailNotice] = useState(false);\r\n\r\n useEffect(() => {\r\n if (id) {\r\n dispatch({\r\n type: GET_MEETING_ARRANGEMENT_FORM_DETAIL,\r\n payload: {\r\n params: { id },\r\n callback: (res) => {\r\n res?.meetingArrangementFormMember.map((rowData) => {\r\n rowData['oldData'] = true;\r\n });\r\n setOldDataDemo({\r\n ...saveData,\r\n ...res,\r\n applicationList: res?.meetingArrangementFormDocument || [],\r\n panelMemberList: res?.meetingArrangementFormMember || [],\r\n });\r\n setSaveData({\r\n ...saveData,\r\n ...res,\r\n applicationList: res?.meetingArrangementFormDocument || [],\r\n panelMemberList: res?.meetingArrangementFormMember || [],\r\n });\r\n },\r\n },\r\n });\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n let saveDataCopy = JSON.stringify(saveData);\r\n let oldDataDemoCopy = JSON.stringify(oldDataDemo);\r\n if (oldDataDemo !== null) {\r\n let changed = !(oldDataDemoCopy === saveDataCopy);\r\n if (changed) {\r\n setEidted(true);\r\n if (saveData?.panelMemberList) {\r\n if (JSON.stringify(saveData?.panelMemberList) !== JSON.stringify(oldDataDemo.panelMemberList)) {\r\n setEmailNotice(true);\r\n } else {\r\n setEmailNotice(false);\r\n }\r\n }\r\n } else {\r\n setEidted(false);\r\n setEmailNotice(false);\r\n }\r\n console.log('changed: ', changed);\r\n }\r\n }, [saveData]);\r\n\r\n const isEditMode = id === undefined;\r\n const handleConfirm = () => {\r\n if (saveData.typeOfReview === null) {\r\n setForceErrorDisplay(true);\r\n return;\r\n }\r\n\r\n let data = { ...saveData, meetingArrangementDocument: [], meetingArrangementMember: [] };\r\n delete data.applicationList;\r\n delete data.panelMemberList;\r\n data.meetingArrangementDocument = saveData.applicationList.reduce(\r\n (group, curP) =>\r\n group.concat({\r\n documentType: curP.documentType,\r\n documentId: curP.documentId,\r\n refNo: curP.refNo,\r\n confirmedDate: curP.confirmDate,\r\n }),\r\n [],\r\n );\r\n saveData.panelMemberList.forEach((ele) => {\r\n data.meetingArrangementMember.push({\r\n userId: ele.id,\r\n isChairman: ele.chairman || false,\r\n panelId: ele?.list?.reduce((group, curP) => group.concat(curP.id), []) || [],\r\n });\r\n });\r\n if (data.meetingArrangementDocument.length === 0) {\r\n showDialog({\r\n description: NO_APPLICATION_DATA,\r\n disableCancelButton: true,\r\n });\r\n return;\r\n }\r\n // if (\r\n // data.meetingArrangementMember.length > 0 &&\r\n // !data.meetingArrangementMember.find((item) => item.isChairman)\r\n // ) {\r\n // showDialog({\r\n // description: NO_CHAIRMAN,\r\n // disableCancelButton: true,\r\n // });\r\n // return;\r\n // }\r\n // console.log(data)\r\n\r\n dispatch({\r\n type: ADD_MEETING_ARRANGEMENT_FORM,\r\n payload: {\r\n data,\r\n callback: () => {\r\n showDialog({\r\n description: CREATED_ARRANGE_MEETING,\r\n disableCancelButton: true,\r\n });\r\n history.goBack();\r\n },\r\n },\r\n });\r\n };\r\n const NoticeDialog = () => {\r\n if (emailNotice) {\r\n showDialog({\r\n description: EDITED_ARRANGE_MEETING_NOTIFICATION,\r\n confirmButtonText: 'YES',\r\n cancelButtonText: 'NO',\r\n }).then((result) => {\r\n handleEditConfirm(!result);\r\n });\r\n } else {\r\n handleEditConfirm(false);\r\n }\r\n };\r\n\r\n const handleEditConfirm = async (notSendNotification) => {\r\n if (saveData.typeOfReview === null) {\r\n setForceErrorDisplay(true);\r\n return;\r\n }\r\n let data = {\r\n ...saveData,\r\n notSendNotification: notSendNotification,\r\n meetingArrangementMember: [],\r\n };\r\n delete data.meetingArrangementFormDocument;\r\n delete data.meetingArrangementFormMember;\r\n delete data.applicationList;\r\n delete data.panelMemberList;\r\n data.meetingArrangementFormId = data.id;\r\n saveData.panelMemberList.forEach((ele) => {\r\n if (ele.oldData === undefined) {\r\n return data.meetingArrangementMember.push({\r\n userId: ele.id,\r\n isChairman: ele.chairman || false,\r\n panelId: ele?.reviewPanel?.reduce((group, curP) => group.concat(curP.id), []) || [],\r\n });\r\n }\r\n });\r\n dispatch({\r\n type: EDIT_MEETING_ARRANGEMENT_FORM,\r\n payload: {\r\n data,\r\n callback: () => {\r\n showDialog({\r\n description: EDITED_ARRANGE_MEETING,\r\n disableCancelButton: true,\r\n });\r\n history.goBack();\r\n },\r\n },\r\n });\r\n };\r\n const reset = () => {\r\n setSaveData({\r\n applicationList: [],\r\n panelMemberList: [],\r\n notSendNotification: false,\r\n typeOfReview: null,\r\n reviewDueDate: null,\r\n reviewMeetingDate: null,\r\n reviewCirculationDate: null,\r\n });\r\n };\r\n const handleSave = (data) => {\r\n setSaveData({ ...saveData, ...data });\r\n };\r\n\r\n return (\r\n \r\n Confirm \r\n
\r\n \r\n Reset \r\n
\r\n \r\n history.goBack()}>\r\n Cancel\r\n \r\n
\r\n \r\n )}\r\n {!isEditMode && (\r\n <>\r\n \r\n \r\n Confirm\r\n \r\n
\r\n \r\n history.goBack()}>\r\n Back\r\n \r\n
\r\n \r\n )}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n {(saveData.typeOfReview === 0 || saveData.typeOfReview === 1) && (\r\n \r\n
\r\n )}\r\n \r\n \r\n setSaveData({\r\n ...saveData,\r\n notSendNotification: e.target.checked,\r\n })\r\n }\r\n disabled={!isEditMode}\r\n />\r\n
\r\n \r\n Do not send notification and email to all reviewers\r\n
\r\n \r\n
\r\n )}\r\n \r\n
\r\n\r\n \r\n history.push('/review-arrangement/updateMeetingAttendance')}>\r\n Consolidate\r\n \r\n
\r\n \r\n Submit \r\n
\r\n \r\n \r\n Close\r\n \r\n
\r\n \r\n \r\n \r\n Certificate for Clinical Trial / Medicinal Test (CTC)/ Clinical Trial Insurance\r\n (CTI) Report Form\r\n \r\n \r\n \r\n setCTCFormData(data)}\r\n setWarningMsg={setWarningMsg}\r\n defaultFormData={CTCDefaultFromData}\r\n title=\"Certificate for Clinical Trial / Medicinal Test (CTC)\"\r\n onRemove={onRemoveCtc}\r\n />\r\n setCTIFormData(data)}\r\n setWarningMsg={setWarningMsg}\r\n defaultFormData={CTIDefaultFromData}\r\n title=\"Clinical Trial Insurance (CTI)\"\r\n onRemove={onRemoveCti}\r\n />\r\n \r\n
\r\n \r\n
\r\n {forceErrorDisplay && (\r\n Pending to implement
;\r\n\r\nconst NotFound = () => {\r\n const location = useLocation();\r\n const history = useHistory();\r\n\r\n useEffect(() => {\r\n history.push(`/?redirect=${location.pathname}`);\r\n\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n return test
;\r\n};\r\n\r\nexport const getDefaultRoute = (role) => {\r\n return [\r\n {\r\n component: AddApplication,\r\n path: '/applications/new',\r\n showInRoles: [APPLICANT],\r\n hiddenInDrawer: true,\r\n },\r\n {\r\n component: ChangeDelegation,\r\n path: '/applications/change-delegation',\r\n hiddenInDrawer: true,\r\n // showInRoles: []\r\n },\r\n {\r\n component: AddApplication,\r\n path: '/applications/clone',\r\n // name: 'Clone Application',\r\n showInRoles: [APPLICANT],\r\n hiddenInDrawer: true,\r\n },\r\n {\r\n component: ApplicationDetail,\r\n path: '/applications/initial-application-form',\r\n name: 'Initial Application',\r\n showInRoles: ['all'],\r\n hiddenInDrawer: true,\r\n },\r\n // {\r\n // component: ApplicationLayout,\r\n // path: '/applications/institution-list',\r\n // // name: 'Institution list',\r\n // showInRoles: [REVIEWER],\r\n // hiddenInDrawer: true,\r\n // },\r\n {\r\n component: ApplicationHistory,\r\n path: '/applications/application-history',\r\n showId: true,\r\n showInRoles: [],\r\n // name: 'Application History',\r\n hiddenInDrawer: true,\r\n },\r\n {\r\n component: ApplicationDetail,\r\n path: '/applications/create-application-amendment',\r\n showId: true,\r\n showInRoles: [APPLICANT],\r\n name: 'Application Amendment',\r\n hiddenInDrawer: true,\r\n },\r\n {\r\n component: ApplicationDetail,\r\n path: '/post-approval-document/application-amendment-detail',\r\n showId: true,\r\n showInRoles: [APPLICANT],\r\n name: 'Application Amendment',\r\n hiddenInDrawer: true,\r\n },\r\n {\r\n component: ReviewFeedback,\r\n path: '/applications/review-feedback',\r\n showId: true,\r\n showInRoles: [SECRETARY, IRB],\r\n name: 'Application Review Feedback',\r\n hiddenInDrawer: true,\r\n },\r\n {\r\n component: AccountActivation,\r\n path: '/user/account-activation',\r\n name: 'Account Activation',\r\n showInRoles: ['all'],\r\n hiddenInDrawer: true,\r\n },\r\n {\r\n component: ResetPassword,\r\n path: '/user/reset-password',\r\n name: 'Reset Password',\r\n showInRoles: ['all'],\r\n hiddenInDrawer: true,\r\n },\r\n {\r\n component: ProgressReport,\r\n path: '/progress-report',\r\n hiddenInDrawer: true,\r\n name: 'Progress Report',\r\n },\r\n {\r\n component: FinalReport,\r\n path: '/final-report',\r\n hiddenInDrawer: true,\r\n name: 'Final Report',\r\n },\r\n {\r\n component: SAEReport,\r\n path: '/SAE-report',\r\n hiddenInDrawer: true,\r\n name: 'SAE Report',\r\n },\r\n {\r\n component: SUSARReport,\r\n path: '/SUSAR-report',\r\n hiddenInDrawer: true,\r\n name: 'SUSAR Report',\r\n },\r\n {\r\n component: MiscellaneousReport,\r\n path: '/miscellaneous-report',\r\n hiddenInDrawer: true,\r\n name: 'Miscellaneous Report',\r\n },\r\n {\r\n component: ConfirmResult,\r\n path: '/applications/confirm-review-result',\r\n hiddenInDrawer: true,\r\n name: 'Confirm Review Result',\r\n },\r\n {\r\n component: ConfirmResult,\r\n path: '/post-approval-document/confirm-review-result',\r\n hiddenInDrawer: true,\r\n name: 'Confirm Review Result',\r\n },\r\n {\r\n component: ProtocolDeviation,\r\n path: '/protocol-deviation',\r\n hiddenInDrawer: true,\r\n name: 'Protocol Deviation',\r\n },\r\n {\r\n component: CTCCTISubmissionForm,\r\n path: '/ctc-cti',\r\n hiddenInDrawer: true,\r\n name: 'CTC/CTI Submission',\r\n },\r\n {\r\n component: ViewCTCCTISubmissionDetail,\r\n path: '/view-ctc',\r\n hiddenInDrawer: true,\r\n name: 'View CTC/CTI Submission Detail',\r\n },\r\n {\r\n component: ViewCTCCTISubmissionDetail,\r\n path: '/view-cti',\r\n hiddenInDrawer: true,\r\n name: 'View CTC/CTI Submission Detail',\r\n },\r\n {\r\n component: ArrangeMeeting,\r\n path: '/review/arrange-meeting',\r\n hiddenInDrawer: true,\r\n name: 'Arrange Meeting',\r\n },\r\n {\r\n component: ReviewerFeedback,\r\n path: '/view-reviewer-feedback',\r\n hiddenInDrawer: true,\r\n name: 'Reviewer Feedback',\r\n },\r\n\r\n {\r\n component: NotFound,\r\n path: '*',\r\n hiddenInDrawer: true,\r\n },\r\n ];\r\n};\r\n\r\nexport const getCombineRoute = (menu, role) => {\r\n // role is mandatory for the routing;\r\n if (!role) {\r\n return [];\r\n }\r\n\r\n const formattedRoute = [];\r\n\r\n menu?.data?.forEach((item) => {\r\n const route = {\r\n // component: Landing,\r\n path: item.url,\r\n name: item.desc,\r\n icon: getIconLookup(item.iconClass),\r\n isLoginRequired: true,\r\n exact: true,\r\n hiddenInDrawer: false,\r\n subRoute: [],\r\n showInRoles: [role],\r\n };\r\n\r\n item.subRoute.forEach((subRouteItem) => {\r\n const path = item.url + subRouteItem.url;\r\n let component = getPathComponent(path) ?? Placeholder;\r\n\r\n route.subRoute.push({\r\n component,\r\n path: subRouteItem.url,\r\n name: subRouteItem.desc,\r\n showInRoles: [role],\r\n });\r\n });\r\n\r\n if (route.subRoute.length === 0) {\r\n let component = getPathComponent(item.url) ?? Placeholder;\r\n route.component = component;\r\n }\r\n\r\n formattedRoute.push(route);\r\n });\r\n\r\n formattedRoute.push(...getDefaultRoute());\r\n\r\n return formattedRoute;\r\n};\r\n","import React, { useEffect, useState } from 'react';\r\nimport { useHistory, useLocation } from 'react-router';\r\nimport styled from 'styled-components/macro';\r\nimport useQuery from 'hooks/useQuery';\r\nimport CustomLink from 'components/CustomLink';\r\nimport { useSelector } from 'react-redux';\r\nimport { APPLICANT, getApplicantStatusDisplay, statusKeyToDisplay, statusLookup } from 'utility/lookup';\r\nimport { getCombineRoute } from 'utility/route';\r\nimport { SHyperLink } from 'style/CommonStyledComponent';\r\n\r\nconst SLayout = styled.div`\r\n padding: 10px;\r\n display: flex;\r\n border-bottom: 1px solid #dcdcdc;\r\n background: #f8f8fd;\r\n box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;\r\n`;\r\n\r\nconst SSeparator = styled.div`\r\n margin: 0 15px;\r\n`;\r\n\r\nconst NavigationBar = () => {\r\n const location = useLocation();\r\n const [pathArray, setPathArray] = useState([]);\r\n const applicationDetail = useSelector((state) => state.applicationDetail);\r\n const id = useQuery('id');\r\n const applicationSubmissionNo = applicationDetail?.[id]?.applicationForm?.subNo;\r\n const applicationStatusId = applicationDetail?.[id]?.status?.statusId;\r\n const history = useHistory();\r\n const applicationFolder = useSelector((state) => state.application.folder || 'all');\r\n const postApprovalFolder = useSelector((state) => state.postApproval.folder || 'all');\r\n const userMenu = useSelector((state) => state.menu);\r\n const user = useSelector((state) => state.user);\r\n const progressReport = useSelector((state) => state.progressReport);\r\n const finalReport = useSelector((state) => state.finalReport);\r\n\r\n const reportId = useQuery('reportId');\r\n const global = useSelector((state) => state.global);\r\n const showNavigationSubNo = global.postApprovalReportData?.[reportId]?.showNavigationSubNo;\r\n const showNavigationStatus = global.postApprovalReportData?.[reportId]?.showNavigationStatus;\r\n\r\n useEffect(() => {\r\n const currentPath = location.pathname;\r\n\r\n if (currentPath === '/') {\r\n setPathArray([]);\r\n return;\r\n }\r\n\r\n const data = currentPath.split('/').filter((item) => item !== '');\r\n const isSubRoute = data.length > 1;\r\n\r\n const result = [];\r\n\r\n const combineRoute = getCombineRoute(userMenu, user.role);\r\n\r\n const route = combineRoute.find((item) => {\r\n return item.path === `/${data[0]}`;\r\n });\r\n\r\n const isApplicationDetail = currentPath === '/applications/initial-application-form';\r\n const isApplicationHistory = currentPath.startsWith('/applications/application-history');\r\n const isApplicationNew = currentPath.startsWith('/applications/new');\r\n const isApplicationClone = currentPath.startsWith('/applications/clone');\r\n const isApplicationAmendmentCreate = currentPath.startsWith('/applications/create-application-amendment');\r\n const isApplicationAmendmentDetail = currentPath.startsWith(\r\n '/post-approval-document/application-amendment-detail',\r\n );\r\n const isChangeDelegation = currentPath.startsWith('/applications/change-delegation');\r\n const isAppConfirmReviewResult = currentPath.startsWith('/applications/confirm-review-result');\r\n const isPostAppConfirmReviewResult = currentPath.startsWith('/post-approval-document/confirm-review-result');\r\n // /post-approval-document/confirm-review-result\r\n\r\n if (isPostAppConfirmReviewResult) {\r\n result.push({ name: `Post Approval Document`, url: `/post-approval-document/${postApprovalFolder}` });\r\n result.push({ name: 'Confirm Review Result' });\r\n } else if (isAppConfirmReviewResult) {\r\n result.push({ name: `Initial Application`, url: `/applications/${applicationFolder}` });\r\n result.push({ name: 'Confirm Review Result' });\r\n } else if (isChangeDelegation) {\r\n result.push({ name: `Initial Application`, url: `/applications/${applicationFolder}` });\r\n result.push({ name: `Change Delegation` });\r\n } else if (isApplicationAmendmentDetail) {\r\n const status = getApplicationStatusDisplay() ? ` (${getApplicationStatusDisplay()})` : '';\r\n result.push({ name: `Post Approval Document`, url: `/post-approval-document/${postApprovalFolder}` });\r\n result.push({\r\n name: `Application amendment${applicationSubmissionNo ? ` (${applicationSubmissionNo})` : ''}${status}`,\r\n });\r\n } else if (isApplicationAmendmentCreate) {\r\n result.push({ name: `Initial Application`, url: `/applications/${applicationFolder}` });\r\n result.push({ name: `Application amendment` });\r\n } else if (isApplicationClone) {\r\n result.push({ name: `Initial Application`, url: `/applications/${applicationFolder}` });\r\n result.push({ name: `Clone` });\r\n } else if (isApplicationNew) {\r\n result.push({ name: `Initial Application`, url: `/applications/${applicationFolder}` });\r\n result.push({ name: `Create` });\r\n } else if (isApplicationHistory) {\r\n result.push({ name: `Initial Application`, url: `/applications/${applicationFolder}` });\r\n result.push({ name: `Initial application overview` });\r\n } else if (isApplicationDetail) {\r\n result.push({ name: 'Initial Application', url: `/applications/${applicationFolder}` });\r\n result.push({ name: 'Initial Application', isApplicationDetail: true });\r\n } else if (!route) {\r\n const temp = combineRoute.find((item) => {\r\n return item.path?.toLowerCase() === currentPath.toLowerCase();\r\n });\r\n\r\n result.push({ name: temp?.name ?? 'undefined' });\r\n } else {\r\n if (showNavigationSubNo || showNavigationStatus) {\r\n result.push({\r\n name: `\r\n ${route.name}\r\n ${showNavigationSubNo ? ` (${showNavigationSubNo})` : ''}\r\n ${showNavigationStatus ? ` (${showNavigationStatus})` : ''}\r\n `,\r\n });\r\n } else {\r\n result.push({ name: route.name });\r\n }\r\n\r\n if (isSubRoute) {\r\n result[0].url = route.url ?? '#';\r\n\r\n const subRoute = route.subRoute.find((item) => {\r\n return item.path?.toLowerCase() === `/${data[1]?.toLowerCase()}`;\r\n });\r\n\r\n result.push({ name: subRoute?.name });\r\n }\r\n }\r\n\r\n setPathArray(result);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [location, userMenu, applicationDetail, global]);\r\n\r\n const getApplicationStatusDisplay = () => {\r\n return user.role === APPLICANT\r\n ? getApplicantStatusDisplay(applicationStatusId)\r\n : statusLookup.find((item) => item.key === applicationStatusId)?.statusDisplay;\r\n };\r\n\r\n const getDocumentStatus = (item) => {\r\n const url = location.pathname;\r\n // other form should specified here\r\n\r\n if (url.startsWith('/progress-report')) {\r\n if (progressReport?.remoteDetail?.subNo && !progressReport.isLoading) {\r\n return `(${progressReport.remoteDetail.subNo}) (${statusKeyToDisplay(\r\n progressReport.remoteDetail.lastStatus,\r\n )})`;\r\n }\r\n } else if (url.startsWith('/final-report')) {\r\n if (finalReport?.remoteDetail?.subNo && !finalReport.isLoading) {\r\n return `(${finalReport.remoteDetail.subNo}) (${statusKeyToDisplay(\r\n finalReport.remoteDetail.lastStatus,\r\n )})`;\r\n }\r\n } else {\r\n // case besides progress report and final report\r\n if (item.isApplicationDetail && applicationSubmissionNo) {\r\n return (\r\n \r\n ({applicationSubmissionNo}) ({getApplicationStatusDisplay()})\r\n
\r\n );\r\n }\r\n }\r\n\r\n return null;\r\n };\r\n\r\n return (\r\n \r\n > \r\n {url ? (\r\n {\r\n history.push(item.url);\r\n }}\r\n >\r\n {item.name}\r\n \r\n ) : (\r\n
\r\n );\r\n })}\r\n {item.name}
\r\n )}\r\n\r\n {getDocumentStatus(item)}
\r\n - \r\n {combineRoutes\r\n .filter((item) => {\r\n return item?.showInRoles?.includes(role) || item?.showInRoles?.includes('all');\r\n })\r\n .filter((item) => item.isLoginRequired === isLogin)\r\n .map((route, index) => {\r\n if (route.hiddenInDrawer) {\r\n return null;\r\n }\r\n\r\n return (\r\n
- \r\n {route.subRoute\r\n .filter(\r\n (item) =>\r\n item?.showInRoles?.includes(role) ||\r\n item?.showInRoles?.includes('all'),\r\n )\r\n .filter((item) => {\r\n return !item.hiddenInDrawer;\r\n })\r\n .map((subRoute, index) => {\r\n return (\r\n
\r\n
\r\n )}\r\n FN Version: v{version}
\r\n BN Version: {backendVersion}
\r\n {/*
\r\n \r\n Mark All As Read\r\n
\r\n \r\n {moment(item.createDtm).format('YYYY-MM-DD HH:mm:ss')}\r\n
\r\n \r\n {!item.read && (\r\n {\r\n handleMarkRead(item, index);\r\n }}\r\n style={{ fontSize: 14, cursor: 'pointer', color: 'blue' }}\r\n >\r\n Mark As Read\r\n \r\n )}\r\n
\r\n \r\n End\r\n
\r\n )}\r\n \r\n {!userDetail?.lastLoginDtm\r\n ? '-'\r\n : getTimeWithTimeZone(userDetail.lastLoginDtm).format('YYYY-MM-DD HH:mm')}\r\n
\r\n \r\n Click\r\n \r\n here\r\n \r\n to download Approval letter\r\n
\r\n\r\n {showReUpload && \r\n {\r\n setApprovalUpload({});\r\n }}\r\n />\r\n
\r\n \r\n
\r\n );\r\n } else {\r\n if (userMenu.data.length === 0 || userMenu.isLoading) {\r\n return (\r\n