|
| 1 | +import { getWarningAndErrorProps } from '~/lib/validation/log-validation' |
| 2 | +import { log } from '~/lib/metrics-api' |
| 3 | + |
| 4 | +/** Ensure a name is provided for the study */ |
| 5 | +function validateName(input) { |
| 6 | + const issues = [] |
| 7 | + |
| 8 | + const name = input.value |
| 9 | + if (name === '') { |
| 10 | + const msg = 'Enter a name for your study.' |
| 11 | + issues.push(['error', 'missing-name', msg]) |
| 12 | + } |
| 13 | + |
| 14 | + return issues |
| 15 | +} |
| 16 | + |
| 17 | +/** Convert Date string to string format in "Data release date" UI */ |
| 18 | +function dateToMMDDYYYY(dateString) { |
| 19 | + const date = new Date(dateString) |
| 20 | + const rawMonth = date.getMonth() + 1; // Months are zero-indexed, so add 1 |
| 21 | + const rawDay = date.getDate(); |
| 22 | + const year = date.getFullYear(); |
| 23 | + |
| 24 | + const month = rawMonth.toString().padStart(2, '0'); |
| 25 | + const day = rawDay.toString().padStart(2, '0'); |
| 26 | + |
| 27 | + const MMDDYYYY = `${month}/${day}/${year}`; |
| 28 | + |
| 29 | + return MMDDYYYY |
| 30 | +} |
| 31 | + |
| 32 | +/** Ensure any embargo date is between tomorrow and max embargo date */ |
| 33 | +export function validateEmbargo(embargoInput) { |
| 34 | + const issues = [] |
| 35 | + |
| 36 | + const rawEmbargoDate = embargoInput.value |
| 37 | + const embargoDate = new Date(embargoInput.value) |
| 38 | + const maxDate = new Date(embargoInput.max) |
| 39 | + |
| 40 | + const tomorrow = new Date(); |
| 41 | + tomorrow.setDate(tomorrow.getDate() + 1); |
| 42 | + |
| 43 | + if ( |
| 44 | + rawEmbargoDate !== '' && |
| 45 | + (embargoDate > maxDate || embargoDate < tomorrow) |
| 46 | + ) { |
| 47 | + const tomorrowFormatted = dateToMMDDYYYY(tomorrow) |
| 48 | + const maxDateFormatted = dateToMMDDYYYY(maxDate) |
| 49 | + |
| 50 | + const msg = |
| 51 | + `If embargoed, date must be between ` + |
| 52 | + `tomorrow (${tomorrowFormatted}) and ${maxDateFormatted}.` |
| 53 | + |
| 54 | + issues.push(['error', 'invalid-embargo', msg]) |
| 55 | + } |
| 56 | + |
| 57 | + return issues |
| 58 | +} |
| 59 | + |
| 60 | +/** Ensure a billing project is selected */ |
| 61 | +function validateBillingProject(input) { |
| 62 | + const issues = [] |
| 63 | + |
| 64 | + const billingProject = input.value |
| 65 | + if (billingProject === '') { |
| 66 | + const msg = 'Pick a billing project from above menu.' |
| 67 | + issues.push(['error', 'missing-billing-project', msg]) |
| 68 | + } |
| 69 | + |
| 70 | + return issues |
| 71 | +} |
| 72 | + |
| 73 | +/** Ensure a workspace is selected, if using existing workspace */ |
| 74 | +function validateWorkspace(input, studyForm) { |
| 75 | + const issues = [] |
| 76 | + |
| 77 | + const workspace = input.value |
| 78 | + const useExistingWorkspace = |
| 79 | + studyForm.querySelector('#study_use_existing_workspace').value === '1' |
| 80 | + |
| 81 | + if (useExistingWorkspace && workspace === '') { |
| 82 | + const msg = 'Enter a workspace name, or set "Use existing workspace?" to "No".' |
| 83 | + issues.push(['error', 'missing-workspace', msg]) |
| 84 | + } |
| 85 | + |
| 86 | + return issues |
| 87 | +} |
| 88 | + |
| 89 | +/** Add or remove error classes from field elements around given element */ |
| 90 | +function updateErrorState(element, addOrRemove) { |
| 91 | + const fieldDiv = element.closest('[class^="col-md"]') |
| 92 | + |
| 93 | + if (addOrRemove === 'add') { |
| 94 | + fieldDiv.querySelector('label').classList.add('text-danger') |
| 95 | + fieldDiv.classList.add('has-error', 'has-feedback') |
| 96 | + } else { |
| 97 | + fieldDiv.querySelector('label').classList.remove('text-danger') |
| 98 | + fieldDiv.classList.remove('has-error', 'has-feedback') |
| 99 | + } |
| 100 | +} |
| 101 | + |
| 102 | +/** Render messages for any validation issue for given input element */ |
| 103 | +function writeValidationMessage(input, issues) { |
| 104 | + if (issues.length === 0) {return} |
| 105 | + |
| 106 | + // Consider below if we need to deal with multiple errors per field |
| 107 | + // See ValidationMessage.jsx for model to follow |
| 108 | + // const messageList = '<ul>' + issues.map(issue => { |
| 109 | + // const msg = issue[2] |
| 110 | + // return `<li className="validation-error">${msg}</li>` |
| 111 | + // }).join('') + '</ul> |
| 112 | + |
| 113 | + const message = issues[0][2] |
| 114 | + |
| 115 | + const messageHtml = `<div class="validation-error">${message}</div>` |
| 116 | + |
| 117 | + updateErrorState(input, 'add') |
| 118 | + input.insertAdjacentHTML('afterend', messageHtml) |
| 119 | +} |
| 120 | + |
| 121 | +/** Validate given field, get issues, write any messages */ |
| 122 | +function checkField(studyForm, field, validateFns, issues) { |
| 123 | + const input = studyForm.querySelector(`#study_${field}`) |
| 124 | + let fieldIssues |
| 125 | + if (field === 'firecloud_workspace') { |
| 126 | + fieldIssues = validateFns[field](input, studyForm) |
| 127 | + } else { |
| 128 | + fieldIssues = validateFns[field](input) |
| 129 | + } |
| 130 | + issues = issues.concat(fieldIssues) |
| 131 | + writeValidationMessage(input, fieldIssues) |
| 132 | + |
| 133 | + return issues |
| 134 | +} |
| 135 | + |
| 136 | +/** Get event data to log to Bard / Mixpanel */ |
| 137 | +function getLogProps(issues) { |
| 138 | + const warnings = issues.filter(issue => issue[0] === 'warn') |
| 139 | + const errors = issues.filter(issue => issue[0] === 'error') |
| 140 | + |
| 141 | + const issueProps = getWarningAndErrorProps(errors, warnings) |
| 142 | + const status = errors.length === 0 ? 'success' : 'failure' |
| 143 | + |
| 144 | + const logProps = Object.assign(issueProps, { |
| 145 | + status |
| 146 | + }) |
| 147 | + |
| 148 | + return logProps |
| 149 | +} |
| 150 | + |
| 151 | +/** Validation form in "Create study" page */ |
| 152 | +export function validateStudy(studyForm) { |
| 153 | + let issues = [] |
| 154 | + |
| 155 | + // Clear any prior error messages |
| 156 | + document.querySelectorAll('.validation-error').forEach(error => { |
| 157 | + updateErrorState(error, 'remove') |
| 158 | + error.remove() |
| 159 | + }) |
| 160 | + |
| 161 | + const validateFns = { |
| 162 | + 'name': validateName, |
| 163 | + 'firecloud_project': validateBillingProject, // "Terra billing project" |
| 164 | + 'embargo': validateEmbargo, // "Data release date" |
| 165 | + 'firecloud_workspace': validateWorkspace // "Existing Terra workspace" |
| 166 | + } |
| 167 | + |
| 168 | + const fields = Object.keys(validateFns) |
| 169 | + fields.forEach(field => { |
| 170 | + issues = checkField(studyForm, field, validateFns, issues) |
| 171 | + }) |
| 172 | + |
| 173 | + const logProps = getLogProps(issues) |
| 174 | + |
| 175 | + log('study-validation', logProps) |
| 176 | + |
| 177 | + return issues |
| 178 | +} |
0 commit comments