\n {children} \n \n )\n }\n}\n\nButton.propTypes = {\n classes: PropTypes.array,\n modifiers: PropTypes.array,\n type: PropTypes.string,\n disabled: PropTypes.bool,\n onClick: PropTypes.oneOfType([PropTypes.string, PropTypes.func])\n}\n\nButton.defaultProps = {\n classes: [],\n disabled: false,\n modifiers: [],\n onClick: '',\n type: 'button'\n}\n\nexport default Button\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport { generateModifierClasses, omit } from '../../modules/utils'\n\nexport default function ButtonGroupItem(props) {\n const { buttonModifiers, children, className, element, modifiers } = props\n const buttonGroupClasses = generateModifierClasses('button-group__item', modifiers)\n const buttonClasses = generateModifierClasses('button', buttonModifiers)\n\n let classes = `${buttonGroupClasses} ${buttonClasses}`\n if (className) {\n classes += ` ${className}`\n }\n\n const childProps = {\n ...omit(props, ['buttonModifiers', 'children', 'className', 'element', 'modifiers']),\n className: classes\n }\n\n return element === 'button' ? {children} : {children} \n}\n\nButtonGroupItem.propTypes = {\n disabled: PropTypes.bool,\n element: PropTypes.oneOf(['anchor', 'button']),\n modifiers: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),\n buttonModifiers: PropTypes.oneOfType([PropTypes.string, PropTypes.array])\n}\n\nButtonGroupItem.defaultProps = {\n element: 'button'\n}\n","import React, { Fragment } from 'react'\nimport PropTypes from 'prop-types'\n\nimport ErrorSpan from './ErrorSpan'\nimport Helper from '../display/Helper'\nimport HelperTrigger from '../display/HelperTrigger'\nimport OptionsItemLabel from './OptionsItemLabel'\nimport OptionsItemInput from './OptionsItemInput'\nimport OptionsItemText from './OptionsItemText'\n\nimport { Options, OptionsItem, OptionsItemIndicator } from '../layout/Wrapper'\n\nclass CheckBoxGroupInput extends React.Component {\n constructor(props) {\n super(props)\n\n this.handleChange = this.handleChange.bind(this)\n }\n\n handleChange(e) {\n const { onChange } = this.props\n const { value, checked } = e.target\n onChange(value, checked)\n }\n\n renderCheckBoxes() {\n const { disabled, options } = this.props\n\n const optionsItemModifiers = disabled ? 'disabled' : null\n\n return options.map(option => {\n const id = `checkbox-${option.value}`\n const helperId = `helper-${option.value}`\n\n return (\n \n {option.helperText && \n \n \n \n \n )\n })\n }\n\n render() {\n const { error, modifiers } = this.props\n return (\n \n {this.renderCheckBoxes()} \n \n )\n }\n}\n\nCheckBoxGroupInput.propTypes = {\n disabled: PropTypes.bool,\n error: PropTypes.string,\n modifiers: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),\n onChange: PropTypes.func.isRequired,\n options: PropTypes.arrayOf(\n PropTypes.shape({\n checked: PropTypes.bool,\n helperText: PropTypes.string,\n label: PropTypes.string,\n microcopy: PropTypes.string,\n value: PropTypes.string\n })\n ).isRequired\n}\n\nCheckBoxGroupInput.defaultProps = {\n disabled: false\n}\n\nexport default CheckBoxGroupInput\n","import React from 'react'\nimport ButtonGroupItem from './ButtonGroupItem'\nimport EmojiImage from '../images/EmojiImage'\n\nimport { ButtonGroup, Emoji } from '../layout/Wrapper'\n\nimport { handleBreakpoint, omit, setStateFromPath } from '../../modules/utils'\n\nconst BREAKPOINT = 864\n\n// TODO: Move this data to state passed down from the\n// server so we're not hard-coding step values in this\n// component.\nconst REFUND_METHOD_STEPS = ['refund_method']\nconst YES_NO_STEPS = ['check_bank_details']\n\nclass ClaimWizard extends React.Component {\n constructor(props) {\n super(props)\n this.state = {\n blank: false,\n fetchingState: false,\n currentData: false,\n notCurrent: false,\n pickerDirection: window.innerWidth <= BREAKPOINT ? 'right' : 'left'\n }\n\n this.deferQueueableStep = this.deferQueueableStep.bind(this)\n this.setNotCurrent = this.setNotCurrent.bind(this)\n this.setEndDate = this.setEndDate.bind(this)\n this.handlePropagation = this.handlePropagation.bind(this)\n this.setRefundMethod = this.setRefundMethod.bind(this)\n }\n\n componentDidMount() {\n setStateFromPath.apply(this, ['GET', '/claim_wizard/fetch_state', { blank: true }])\n handleBreakpoint.apply(this, [BREAKPOINT, this.setDirectionRight, this.setDirectionLeft])\n }\n\n setDirectionRight() {\n this.setState({ pickerDirection: 'right' })\n }\n\n setDirectionLeft() {\n this.setState({ pickerDirection: 'left' })\n }\n\n skipStep() {\n this.setState({ fetchingState: true })\n setStateFromPath.apply(this, ['PUT', '/claim_wizard/skip_step', { blank: true }])\n }\n\n deferQueueableStep() {\n this.setState({ fetchingState: true })\n setStateFromPath.apply(this, ['PUT', '/claim_wizard/defer_queueable_step', { blank: true }])\n }\n\n setNotCurrent() {\n this.setState({\n text: this.state.secondaryText,\n notCurrent: true,\n date: new Date()\n })\n }\n\n setEndDate() {\n const { date } = this.state\n setStateFromPath.apply(this, ['PUT', `/claim_wizard/set_end_date?date=${date}`, { blank: true }])\n }\n\n setRefundMethod(refundMethod) {\n setStateFromPath.apply(this, [\n 'PUT',\n `/claim_wizard/set_refund_method?refund_method=${refundMethod}`,\n { blank: true }\n ])\n }\n\n setStageComplete(complete) {\n const previousStep = this.state.step\n setStateFromPath\n .apply(this, ['PUT', `/claim_wizard/set_stage_complete?complete=${complete}`, { blank: true }])\n .then(() => {\n const { step, secondaryText } = this.state\n if (previousStep === step && secondaryText) {\n this.setNotCurrent()\n }\n })\n }\n\n handlePropagation(name, date) {\n this.setState({ date: date })\n }\n\n createButtonGroupItem(options, key) {\n const { fetchingState } = this.state\n let onClick\n const buttonType = options.buttonType || 'primary'\n const props = omit(options, ['skipStep', 'buttonType', 'buttonModifiers'])\n\n if (options.skipStep) {\n onClick = () => {\n this.setStageComplete(true)\n }\n }\n\n return (\n \n {this.renderButtonGroupItems()}\n \n )\n }\n\n render() {\n const loaded = this.state?.blank || this.state.iconName\n\n const { heading, text, iconName } = this.state\n\n return (\n \n {loaded && (\n
\n
\n \n
\n {this.renderButtonGroup()}\n
\n )}\n
\n {media && (\n
\n
\n
\n )}\n
\n
{heading} \n {text &&
{text}
}\n
\n
{children} \n \n )\n }\n\n return (\n \n {children} \n \n )\n}\n\nexport default ContentFooterLink\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport { monthNames } from '../../modules/dates'\n\n// 'new_application/date_group.js' is used to ensure that the `day` options are correctly set\n// depending on the month and year.\n\nclass DateGroup extends React.Component {\n constructor(props) {\n super(props)\n this.state = {\n day: '01',\n month: '01',\n year: '',\n initialised: false\n }\n this.handleChange = this.handleChange.bind(this)\n }\n\n initialise(nextProps) {\n // if we have initialised\n if (this.state.initialised) {\n return null\n }\n\n const { resource, name } = nextProps\n let dateValue = ''\n\n if (resource[name]) {\n dateValue = new Date(resource[name])\n } else {\n return null\n }\n\n let newDate = {\n day: dateValue.getDate().toString().padStart(2, '0'),\n month: (dateValue.getMonth() + 1).toString().padStart(2, '0'),\n year: dateValue.getFullYear()\n }\n\n this.setState({\n day: newDate.day,\n month: newDate.month,\n year: newDate.year,\n initialised: true\n })\n }\n\n UNSAFE_componentWillReceiveProps(nextProps) {\n this.initialise(nextProps)\n }\n\n componentDidMount() {\n this.initialise(this.props)\n }\n\n handleChange({ target }) {\n let stateAttribute\n if (target.classList.contains('day_input')) {\n stateAttribute = 'day'\n }\n if (target.classList.contains('month_input')) {\n stateAttribute = 'month'\n }\n if (target.classList.contains('year_input')) {\n stateAttribute = 'year'\n }\n this.setState({ [stateAttribute]: target.value }, this.propagateDate)\n }\n\n propagateDate() {\n const { dateChanged } = this.props\n let { year, month, day } = this.state\n if (dateChanged) {\n dateChanged(`${year}-${month}-${day}`)\n }\n }\n\n inputName(postfix) {\n const { name, resourceName } = this.props\n return `${resourceName}[${name}_${postfix}]`\n }\n\n inputId(postfix) {\n const { name, resourceName } = this.props\n const prefix = resourceName.replace('[', '_').replace(']', '')\n return `${prefix}_${name}_${postfix}`\n }\n\n dayInput() {\n let dayClasses = [\n 'input-group__item',\n 'select',\n 'optional',\n 'showable',\n 'hideable',\n 'day_select',\n this.inputId('day')\n ]\n // If the forms all get converted to React this can be done using props.\n // Until then we have to do this to allow other parts to change the visibility.\n if (!this.props.showDay) dayClasses.push('hidden')\n return (\n \n \n {this.dayOptions()}\n \n
\n )\n }\n\n dayOptions() {\n let options = []\n let i = 1\n\n for (i = 1; i <= 31; i++) {\n options.push(\n \n {i}\n \n )\n }\n return options\n }\n\n monthInput() {\n let monthClasses = ['input-group__item', 'select', 'optional', 'month_select', this.inputId('month')]\n if (this.props.showDay) monthClasses.push('input-group__item--lg')\n return (\n \n \n {this.monthOptions()}\n \n
\n )\n }\n\n monthOptions() {\n return monthNames().map((month, index) => (\n \n {month}\n \n ))\n }\n\n yearInput() {\n const { minYear, maxYear } = this.props\n return (\n \n
\n )\n }\n\n render() {\n return (\n \n {this.dayInput()}\n {this.monthInput()}\n {this.yearInput()}\n
\n )\n }\n}\n\nDateGroup.propTypes = {\n className: PropTypes.string,\n name: PropTypes.string.isRequired,\n resource: PropTypes.object.isRequired,\n resourceName: PropTypes.string.isRequired,\n showDay: PropTypes.bool,\n minYear: PropTypes.number.isRequired,\n maxYear: PropTypes.number.isRequired,\n dateChanged: PropTypes.func\n}\n\nexport default DateGroup\n","import React, { Fragment } from 'react'\nimport PropTypes from 'prop-types'\n\nimport FloatingDatePicker from './date/FloatingDatePicker'\nimport ErrorSpan from './ErrorSpan'\n\nimport { InputGroup } from '../layout/Wrapper'\n\nclass DateRangeInput extends React.Component {\n constructor(props) {\n super(props)\n\n this.toggleChange = this.toggleChange.bind(this)\n this.dateChanged = this.dateChanged.bind(this)\n }\n\n toggleChange() {\n const { toName } = this.props\n const currentChecked = !this.props.currentChecked\n this.dateChanged(toName, null, currentChecked)\n }\n\n dateChanged(name, value, currentChecked) {\n currentChecked = currentChecked === undefined ? this.props.currentChecked : currentChecked\n this.props.handlePropagation(name, value, currentChecked)\n }\n\n renderToggle() {\n const { currentChecked, resourceName, currentText, toDisabled } = this.props\n const prefix = resourceName.replace('[', '_').replace(']', '')\n\n if (toDisabled) {\n return null\n }\n\n return (\n \n \n {currentText} \n \n
\n )\n }\n\n render() {\n const {\n currentChecked,\n resource,\n resourceName,\n fromError,\n fromName,\n toError,\n toName,\n fromMinYear,\n fromMaxYear,\n toMinYear,\n toMaxYear,\n includeDay,\n fromDisabled,\n toDisabled,\n helperText\n } = this.props\n\n const errors = [...(toError || []), ...(fromError || [])]\n\n return (\n \n \n \n \n )\n }\n}\n\nDateRangeInput.propTypes = {\n resource: PropTypes.object,\n resourceName: PropTypes.string,\n fromError: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),\n toError: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),\n includeDay: PropTypes.bool,\n fromMinYear: PropTypes.number,\n fromMaxYear: PropTypes.number,\n toMinYear: PropTypes.number,\n toMaxYear: PropTypes.number,\n handlePropagation: PropTypes.func,\n currentChecked: PropTypes.bool,\n currentText: PropTypes.string,\n helperText: PropTypes.string,\n fromDisabled: PropTypes.bool,\n toDisabled: PropTypes.bool\n}\n\nDateRangeInput.defaultProps = {\n fromName: 'started_at',\n toName: 'ended_at',\n fromMinYear: new Date().getFullYear() - 44,\n fromMaxYear: new Date().getFullYear(),\n toMinYear: new Date().getFullYear() - 44,\n toMaxYear: new Date().getFullYear(),\n fromDisabled: false,\n toDisabled: false\n}\n\nexport default DateRangeInput\n","import React, { Fragment } from 'react'\nimport PropTypes from 'prop-types'\n\nimport FormGroupHeader from './FormGroupHeader'\nimport Stepper from './Stepper'\n\nimport { FormGroup, FormGroupErrorMessage, InputGroup, InputGroupItem } from '../layout/Wrapper'\n\nclass DurationInput extends React.Component {\n constructor(props) {\n super(props)\n\n this.state = {\n years: props.years,\n months: props.months,\n weeks: props.weeks\n }\n }\n\n handleChange(timePeriod, value) {\n const { onChange } = this.props\n\n const nextState = {\n ...this.state,\n ...{\n [timePeriod]: value\n }\n }\n const { years, months, weeks } = nextState\n\n this.setState(nextState, () => onChange(years, months, weeks))\n }\n\n valueErroneous(max, value) {\n const maxExceeded = max && value > max\n const minExceeded = value < 0\n\n return maxExceeded || minExceeded\n }\n\n render() {\n const MAX_MONTHS = 11\n const MAX_WEEKS = 3\n\n const { years, months, weeks } = this.state\n const { disabled } = this.props\n\n const yearsError = this.valueErroneous(false, years)\n const monthsError = this.valueErroneous(MAX_MONTHS, months)\n const weeksError = this.valueErroneous(MAX_WEEKS, weeks)\n\n return (\n \n \n \n \n this.handleChange('years', val)}\n />\n \n \n \n \n this.handleChange('months', val)}\n max={MAX_MONTHS}\n />\n \n \n \n \n this.handleChange('weeks', val)}\n max={MAX_WEEKS}\n />\n \n \n \n {yearsError && Years must be a number greater than or equal to 0 }\n {monthsError && Months must be a number between 0 and 11 }\n {weeksError && Weeks must be a number between 0 and 3 }\n \n )\n }\n}\n\nDurationInput.propTypes = {\n years: PropTypes.number,\n months: PropTypes.number,\n weeks: PropTypes.number,\n disabled: PropTypes.bool,\n onChange: PropTypes.oneOfType([PropTypes.string, PropTypes.func])\n}\n\nDurationInput.defaultProps = {\n disabled: false,\n years: 0,\n months: 0,\n weeks: 0\n}\n\nexport default DurationInput\n","import React, { Fragment } from 'react'\nimport PropTypes from 'prop-types'\n\nimport ButtonGroupItem from './ButtonGroupItem'\nimport DateRangeQuestion from './date/DateRangeQuestion'\nimport OptionsList from './OptionsList'\nimport TextQuestion from './TextQuestion'\nimport TypeAhead from './TypeAhead'\nimport FlashMessage from '../display/FlashMessage'\nimport Helper from '../display/Helper'\nimport HelperTrigger from '../display/HelperTrigger'\nimport FormLink from './FormLink'\nimport Question from './Question'\nimport CheckBoxGroupInput from './CheckBoxGroupInput'\nimport YesNoQuestion from './YesNoQuestion'\nimport IdleHelpPanel from './IdleHelpPanel'\n\nimport { ButtonGroup, ContentFooter, ContentWrapper, ContentWrapperInner, FormGroup } from '../layout/Wrapper'\nimport { companyLookup } from '../../modules/api'\nimport { fetch, omit, redirectTo, highlightFirstError, isIterable } from '../../modules/utils'\nimport { onInteractionWithForm, showIdleHelpPanel } from '../../modules/idleHelpPanel'\nimport helperTextData from '../../data/helperTextData.json'\n\nconst BENEFITS_OPTIONS = [\n { label: 'Medical benefit', value: 'medical_benefit', checked: false },\n { label: 'Car benefit', value: 'car_benefit', checked: false },\n { label: 'Fuel benefit', value: 'fuel_benefit', checked: false },\n {\n label: 'Employer loan',\n microcopy: '(Including Forces Help to Buy)',\n value: 'employer_loan',\n checked: false\n },\n { label: 'Other', value: 'other', checked: false }\n]\n\nclass EmploymentForm extends React.Component {\n constructor(props) {\n super(props)\n let flash = false\n if (props.locked) {\n flash = props.endedAtLocked\n ? 'You cannot update this employment'\n : \"You can only update the 'Until date' on this employment\"\n flash =\n flash +\n ' because it has been used in one of your previous claim submissions. Please contact us if you need anything else corrected.'\n }\n this.state = {\n errors: {},\n disabled: props.endedAtLocked,\n flash: flash\n }\n this.handlePropagation = this.handlePropagation.bind(this)\n this.handleSubmit = this.handleSubmit.bind(this)\n this.handleCancel = this.handleCancel.bind(this)\n this.companySelected = this.companySelected.bind(this)\n this.toggleManualName = this.toggleManualName.bind(this)\n this.handleBenefitsChange = this.handleBenefitsChange.bind(this)\n this.benefitsOptions = this.benefitsOptions.bind(this)\n }\n\n static getDerivedStateFromProps(props, state) {\n const { resource, modEmployee } = props\n const { unchangedEmployment } = state\n\n if (resource && resource != unchangedEmployment) {\n const addedValues = {\n benefits: resource.benefits || {},\n current: !Boolean(resource.ended_at),\n self_employed: resource.self_employed || false,\n ministry_of_defence: resource.id ? Boolean(resource.mod_branch) : modEmployee\n }\n return {\n employment: Object.assign(resource, addedValues),\n unchangedEmployment: resource,\n action: resource.id ? 'edit' : 'new',\n manualName: Boolean(resource.name)\n }\n }\n return null\n }\n\n handlePropagation(name, value, current) {\n const { constructionEmployee } = this.props\n const { employment, errors } = this.state\n let employmentUpdate = { [name]: value }\n\n if (current !== undefined) {\n employmentUpdate['current'] = current\n }\n\n let newState = {\n disabled: false,\n errors: omit(errors, name)\n }\n\n if (name === 'self_employed' && value) {\n employmentUpdate.benefits = {\n medical_benefit: false,\n car_benefit: false,\n fuel_benefit: false,\n employer_loan: false,\n other: false\n }\n }\n\n if (name === 'received_travel_reimbursements' && (!value || !constructionEmployee)) {\n employmentUpdate.paid_under_cis = null\n }\n\n if (name === 'ministry_of_defence') {\n let updatedParams\n newState.manualName = false\n\n if (value) {\n updatedParams = {\n self_employed: undefined,\n name: undefined,\n mod_branch: '',\n received_travel_reimbursements: null,\n paid_under_cis: null\n }\n } else {\n updatedParams = {\n mod_branch: undefined,\n self_employed: false,\n name: ''\n }\n }\n\n employmentUpdate = Object.assign(employmentUpdate, updatedParams)\n }\n\n newState.employment = Object.assign(employment, employmentUpdate)\n this.setState(newState)\n onInteractionWithForm()\n }\n\n companySelected(company) {\n const { employment } = this.state\n this.setState({\n employment: Object.assign(employment, { name: company.name }),\n manualName: true\n })\n onInteractionWithForm()\n }\n\n toggleManualName(e) {\n e.preventDefault()\n const { employment } = this.state\n this.setState({\n employment: Object.assign(employment, { name: '' }),\n manualName: !this.state.manualName\n })\n onInteractionWithForm()\n }\n\n isMOD() {\n const { employment } = this.state\n return Boolean(employment && employment.ministry_of_defence)\n }\n\n handleSubmit(e) {\n e.preventDefault()\n this.setState({ disabled: true })\n const { action, employment } = this.state\n const { afterSubmitPath, onAfterSubmit, authenticityToken } = this.props\n\n let method = 'POST'\n let path = '/employments'\n const formData = {\n api_person_employment: employment,\n utf8: '✓',\n authenticity_token: authenticityToken\n }\n if (action == 'edit') {\n path = path + '/' + employment.id\n method = 'PATCH'\n }\n\n fetch(method, path, 'application/json', 'application/json', formData)\n .then(data => {\n if (afterSubmitPath) {\n redirectTo(afterSubmitPath)\n } else if (onAfterSubmit) {\n onAfterSubmit(data)\n } else {\n this.setState({ employment: null })\n }\n })\n .catch(e => {\n if (isIterable(e)) {\n const [, data] = e\n console.error(JSON.stringify(data.errors))\n this.setState(data, function () {\n highlightFirstError()\n })\n }\n })\n }\n\n industry() {\n const { resourceName, locked } = this.props\n const { employment } = this.state\n return (\n \n {manualName ? (\n \n \n ) : (\n \n {helperText && \n {helperText && \n \n {!locked && \n )}\n {!hideSelfEmployed && (\n \n \n )}\n \n )\n }\n\n dates() {\n const { resourceName, locked, endedAtLocked } = this.props\n const { employment, errors } = this.state\n return (\n \n \n {flash && \n {this.industry()}\n \n )}\n {this.isMOD() ? this.modQuestions() : this.NonModQuestions()}\n \n \n \n \n \n )}\n {showReimbursementsQuestion && (\n \n \n \n )}\n \n )}\n \n \n \n \n Cancel\n \n \n Save employer\n \n \n \n \n {showIdleHelpPanel(this.props.afterSubmitPath) && 'Until date' on this employment gap\"\n flash =\n flash +\n ' because it has been used in one of your previous claim submissions. Please contact us if you need anything else corrected.'\n }\n this.state = {\n errors: {},\n disabled: props.endedAtLocked,\n flash: flash,\n flashType: 'info'\n }\n this.handlePropagation = this.handlePropagation.bind(this)\n this.handleSubmit = this.handleSubmit.bind(this)\n }\n\n static getDerivedStateFromProps(props, state) {\n const { resource } = props\n const { unchangedEmploymentGap } = state\n\n if (resource && resource != unchangedEmploymentGap) {\n const addedValues = {\n current: !Boolean(resource.ended_at)\n }\n return {\n employmentGap: Object.assign(resource, addedValues),\n unchangedEmploymentGap: resource,\n action: resource.id ? 'edit' : 'new'\n }\n }\n return null\n }\n\n handlePropagation(name, value, current) {\n const { employmentGap, errors } = this.state\n let employmentGapUpdate = { [name]: value }\n\n if (current !== undefined) {\n employmentGapUpdate['current'] = current\n }\n\n this.setState({\n disabled: false,\n errors: omit(errors, name),\n employmentGap: Object.assign(employmentGap, employmentGapUpdate)\n })\n }\n\n handleSubmit(e) {\n e.preventDefault()\n this.setState({ disabled: true })\n const { action, employmentGap } = this.state\n const { referrer, onAfterSubmit, authenticityToken } = this.props\n\n let method = 'POST'\n let path = '/employment_gaps'\n const formData = {\n api_person_employment_gap: employmentGap,\n utf8: '✓',\n authenticity_token: authenticityToken\n }\n if (action == 'edit') {\n path = path + '/' + employmentGap.id\n method = 'PATCH'\n }\n\n fetch(method, path, 'application/json', 'application/json', formData)\n .then(data => {\n if (referrer) {\n redirectTo(referrer)\n } else {\n onAfterSubmit ? onAfterSubmit(data) : this.setState({ employmentGap: null })\n }\n })\n .catch(e => {\n if (isIterable(e)) {\n const [, data] = e\n console.error(JSON.stringify(data.errors))\n this.setState(data, function () {\n highlightFirstError()\n })\n }\n })\n }\n\n dates() {\n const { resourceName, locked, endedAtLocked } = this.props\n const { employmentGap, errors } = this.state\n return (\n \n \n {flash && \n \n \n \n Cancel\n \n \n Save\n \n \n \n \n )\n }\n}\nEmploymentGapForm.propTypes = {\n resourceName: PropTypes.string,\n resource: PropTypes.object.isRequired,\n authenticityToken: PropTypes.string.isRequired,\n referrer: PropTypes.string.isRequired,\n locked: PropTypes.bool,\n endedAtLocked: PropTypes.bool\n}\nEmploymentGapForm.defaultProps = {\n resourceName: 'api_person_employment_gap',\n locked: false,\n endedAtLocked: false\n}\nexport default EmploymentGapForm\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport { ContentWrapper, ContentWrapperInner, ContentFooter, ButtonGroup } from '../layout/Wrapper'\nimport Modal from '../display/Modal'\nimport ButtonGroupItem from './ButtonGroupItem'\nimport DateQuestion from './date/DateQuestion'\n\nexport default function EndedAtModal({\n date,\n error,\n displayed,\n minDate,\n maxDate,\n onClose,\n onChange,\n onConfirm,\n resourceName,\n questionHeading,\n questionText\n}) {\n return (\n \n \n \n \n \n \n \n Cancel\n \n \n Confirm\n \n \n \n \n \n )\n}\n\nEndedAtModal.propTypes = {\n displayed: PropTypes.bool.isRequired,\n error: PropTypes.string,\n minDate: PropTypes.instanceOf(Date),\n maxDate: PropTypes.instanceOf(Date),\n onClose: PropTypes.func.isRequired,\n onChange: PropTypes.func.isRequired,\n onConfirm: PropTypes.func.isRequired,\n resourceName: PropTypes.string.isRequired,\n questionHeading: PropTypes.string.isRequired,\n questionText: PropTypes.string.isRequired,\n date: PropTypes.instanceOf(Date)\n}\n\nEndedAtModal.defaultProps = {\n maxYear: new Date().getFullYear()\n}\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nfunction ErrorSpan({ error }) {\n if (!error || error.length == 0) return null\n let spanProps = {\n className: 'form-group__error-message'\n }\n let errorChildren\n if (Array.isArray(error)) {\n errorChildren = error.map((error, index) => {\n return (\n \n {error}\n \n )\n })\n } else {\n spanProps.dangerouslySetInnerHTML = { __html: error }\n }\n return {errorChildren} \n}\n\nErrorSpan.propTypes = {\n error: PropTypes.oneOfType([PropTypes.string, PropTypes.array, PropTypes.bool])\n}\n\nexport default ErrorSpan\n","import React, { Fragment } from 'react'\nimport PropTypes from 'prop-types'\n\nimport Button from './Button'\nimport { FormGroup, FormGroupErrorMessage, InputGroup, InputGroupItem } from '../layout/Wrapper'\n\nimport FrequencyDurationInput from './FrequencyDurationInput'\nimport FormGroupInput from './FormGroupInput'\n\nimport { isUuidv4 } from '../../modules/utils'\nimport { defaultExpenseData } from '../../modules/expense'\nimport { cleanInputPrice, formatPrice } from '../../modules/formatter'\nimport { iconFromString } from '../../helpers/images'\n\nfunction ExpenseInputContainer({ children, sub = false, expanded = false, first = false, last = false }) {\n const classes = ['expense-input']\n\n if (sub) {\n classes.push('expense-input--sub')\n }\n\n if (expanded) {\n classes.push('expense-input--expanded')\n }\n\n if (first) {\n classes.push('expense-input--first')\n }\n\n if (last) {\n classes.push('expense-input--last')\n }\n\n return {children}
\n}\n\nfunction ExpenseInputTitle({ disabled, title, subtitle }) {\n return (\n \n
{title} \n {subtitle && {subtitle} }\n \n )\n}\n\nfunction ExpenseInputForm({ disabled = false, expense, frequencies = [], onChange, showDescription = false }) {\n const { id, cost, description, errors } = expense\n\n const handleChange = e => {\n const expenseData = { id, description, cost }\n const { name, value } = e.target\n\n expenseData[name] = name === 'cost' ? cleanInputPrice(value) : value\n\n if (expense.errors && expense.errors[name]) {\n expenseData.errors = Object.assign({}, expense.errors, { [name]: null })\n }\n\n onChange(Object.assign({}, expense, expenseData))\n }\n\n const handleCostChange = e => {\n handleChange(e)\n e.target.value = formatPrice(e.target.value)\n }\n\n const handleFrequencyDurationChange = expenseData => {\n onChange(Object.assign({}, expense, expenseData))\n }\n\n return (\n \n
\n {showDescription && (\n \n \n \n \n )}\n \n \n \n
\n \n \n \n \n \n {errors?.cost &&
{errors.cost[0]} }\n {errors?.description &&
{errors.description[0]} }\n
\n
\n \n
\n \n updateExpense(0, expenseFields)}\n frequencies={frequencies}\n />\n )}\n {subExpenses && \n {subExpensesVisible &&\n expenses.map((ex, i) => {\n return (\n \n updateExpense(i, expenseFields)}\n showDescription={true}\n />\n removeExpense(i)} icon=\"trashGrey\" />\n \n )\n })}\n \n )\n}\n\nExpenseInput.propTypes = {\n dailyFoodCharge: PropTypes.bool,\n expenseKindId: PropTypes.number.isRequired,\n expenses: PropTypes.arrayOf(PropTypes.object).isRequired,\n first: PropTypes.bool,\n frequencies: PropTypes.arrayOf(PropTypes.object).isRequired,\n last: PropTypes.bool,\n onAdd: PropTypes.func.isRequired,\n onRemove: PropTypes.func.isRequired,\n onUpdate: PropTypes.func.isRequired,\n personLocationId: PropTypes.number,\n subExpenses: PropTypes.bool,\n subtitle: PropTypes.string,\n title: PropTypes.string.isRequired\n}\n\nExpenseInput.defaultProps = {\n dailyFoodCharge: false,\n first: false,\n last: false,\n subExpenses: true,\n subtitle: ''\n}\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport AnchorButton from './AnchorButton'\n\nimport { fetch, redirectTo, isIterable } from '../../modules/utils'\n\nclass FetchAndRedirectButton extends React.Component {\n constructor(props) {\n super(props)\n this.handleClick = this.handleClick.bind(this)\n }\n\n handleClick() {\n const { path, method, redirect_path } = this.props\n fetch(method, path)\n .then(() => redirectTo(redirect_path))\n .catch(e => {\n if (isIterable(e)) {\n const [message] = e\n console.error('Fetch failed: ' + message)\n }\n })\n }\n\n render() {\n return (\n \n \n {leadText && (\n \n \n )}\n \n \n \n \n \n {showCancelButton && (\n \n Cancel\n \n )}\n \n {submitButtonLabel}\n \n \n \n \n )\n }\n}\n\nFinanceForm.propTypes = {\n disabled: PropTypes.bool,\n finance: PropTypes.object,\n leadText: PropTypes.string,\n showCancelButton: PropTypes.bool,\n onCancel: PropTypes.func,\n onChange: PropTypes.func.isRequired,\n onSubmit: PropTypes.func.isRequired,\n options: PropTypes.arrayOf(\n PropTypes.shape({\n helperText: PropTypes.string,\n label: PropTypes.string,\n microcopy: PropTypes.string,\n value: PropTypes.string\n })\n ).isRequired,\n submitButtonLabel: PropTypes.string,\n referrer: PropTypes.string\n}\n\nFinanceForm.defaultProps = {\n disabled: false,\n showCancelButton: true,\n submitButtonLabel: 'Save changes'\n}\n\nexport default FinanceForm\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport FloatingContainer from '../display/FloatingContainer'\nimport FormGroupHeader from './FormGroupHeader'\nimport ErrorSpan from './ErrorSpan'\nimport Picker from './Picker'\n\nimport { inputName, inputId } from '../../modules/utils'\n\nclass FloatingPicker extends React.Component {\n constructor(props) {\n super(props)\n\n this.state = { showPicker: false }\n\n this.inputRef = React.createRef()\n this.showPicker = this.showPicker.bind(this)\n this.hidePicker = this.hidePicker.bind(this)\n }\n\n showPicker() {\n this.inputRef.current.blur()\n this.setState({ showPicker: true })\n }\n\n hidePicker() {\n this.setState({ showPicker: false })\n }\n\n input() {\n const { disabled, disabledText, value } = this.props\n const displayValue = disabled && disabledText && !value ? disabledText : value\n let classes = ['form-group__input', 'picker__input']\n if (this.state.showPicker) classes.push('focused')\n return (\n \n
\n
\n {this.input()}\n
\n \n {error && typeof error != 'boolean' && !disabled &&
}\n
\n
\n {label} \n {children}\n
\n )\n}\n\nexport default FormGroupHeader\n","import React from 'react'\n\nimport { generateModifierClasses } from '../../modules/utils'\n\nconst FormGroupInput = function (props) {\n let classes = generateModifierClasses('form-group__input', props.modifiers)\n\n if (props.className) {\n classes = `${classes} ${props.className}`\n }\n\n return \n {text}\n \n )\n }\n}\n\nFormLink.propTypes = {\n additionalClasses: PropTypes.array,\n text: PropTypes.string.isRequired,\n onClick: PropTypes.func.isRequired\n}\nexport default FormLink\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport { methodCallFromString } from '../../modules/utils'\n\nclass FormWrapper extends React.Component {\n render() {\n const { onSubmit, children, id } = this.props\n return (\n \n )\n }\n}\n\nFormWrapper.propTypes = {\n id: PropTypes.string,\n onSubmit: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n children: PropTypes.oneOfType([PropTypes.node, PropTypes.arrayOf(PropTypes.node)])\n}\nexport default FormWrapper\n","import React, { Fragment, useState } from 'react'\nimport PropTypes from 'prop-types'\nimport dayjs from 'dayjs'\n\nimport Button from './Button'\nimport FloatingContainer from '../display/FloatingContainer'\nimport { FloatingContainerInner, InputGroup, InputGroupItem, FormGroup, Options } from '../layout/Wrapper'\nimport FormGroupInput from './FormGroupInput'\nimport OptionsItem from './legacy/OptionsItem'\nimport DatePicker from './date/DatePicker'\n\nimport { timelineDateRange } from '../../modules/timelines'\nimport { areSameDates } from '../../modules/dates'\n\nconst DATE_FORMAT = 'MMM YYYY'\n\nconst CLOSED_STATE = 'closed'\nconst OPEN_STATE = 'open'\nconst OPEN_DATE_STATE = 'open-dates'\n\nconst chosenFrequency = (frequencyId, frequencies) => {\n if (!frequencyId) {\n return frequencies[0]\n }\n return frequencies.find(f => f.id.toString() === frequencyId.toString())\n}\n\nconst frequencyLabel = (expense, frequency) => {\n const { unit } = frequency\n if (unit === 'one-off') {\n return unit\n }\n return `per ${frequency.unit}`\n}\n\nconst durationLabel = (expense, frequency, longLabel) => {\n const { unit } = frequency\n const { started_at, ended_at } = expense\n\n if (unit === 'one-off') {\n if (!started_at || !ended_at || started_at !== ended_at) {\n if (longLabel) {\n return \"I don't know the date\"\n } else {\n return 'on an unspecified date'\n }\n }\n return `${longLabel ? 'O' : 'o'}n ${dayjs(started_at).format(DATE_FORMAT)}`\n }\n\n if (started_at) {\n return `${longLabel ? 'From ' : ''}${dayjs(started_at).format(DATE_FORMAT)} to ${dayjs(ended_at).format(\n DATE_FORMAT\n )}`\n }\n\n if (longLabel) {\n return 'True for the entire claim period'\n } else {\n return 'for the claim period'\n }\n}\n\nfunction FrequencySection({ expense, frequency, frequencies, onChange, setVisualState }) {\n const handleFrequencyChange = id => {\n onChange({ expense_duration_id: id })\n }\n\n return (\n \n \n \n {frequencies.map(freq => {\n const { name, unit, id, disabled } = freq\n\n return (\n !disabled && handleFrequencyChange(id)}\n />\n )\n })}\n \n \n \n setVisualState(OPEN_DATE_STATE)}\n modifiers=\"clickable\"\n value=\"\"\n readOnly\n />\n \n setVisualState(CLOSED_STATE)}>\n Done\n \n \n )\n}\n\nfunction DurationSection({ expense, frequency, onChange, setVisualState }) {\n const [focusedField, setFocusedField] = useState('started_at')\n const { started_at, ended_at } = expense\n const [startOfClaimDate, endOfClaimDate] = timelineDateRange().map(d => d.toDate())\n\n const oneOff = frequency.name === 'One-off'\n const currentYear = new Date().getFullYear()\n const startedAtVal = started_at ? dayjs(started_at).format(DATE_FORMAT) : null\n const endedAtVal = ended_at ? dayjs(ended_at).format(DATE_FORMAT) : null\n\n const startFocused = focusedField === 'started_at'\n const endFocused = focusedField === 'ended_at'\n\n const handleChange = expenseData => {\n if (oneOff) {\n return onChange(Object.assign({ ended_at: expenseData.started_at }, expenseData))\n }\n\n return onChange(expenseData)\n }\n\n const handleDateCompletion = () => {\n if (oneOff || focusedField === 'ended_at') {\n setVisualState(CLOSED_STATE)\n } else {\n setFocusedField('ended_at')\n }\n }\n\n const handleStartEndClaimPeriodClick = () => {\n if (oneOff) {\n onChange({ started_at: null, ended_at: null })\n setVisualState(CLOSED_STATE)\n }\n\n if (startFocused) {\n if (areSameDates(new Date(expense.ended_at), endOfClaimDate)) {\n onChange({ started_at: null, ended_at: null })\n } else {\n onChange({ started_at: startOfClaimDate })\n }\n setFocusedField('ended_at')\n return\n }\n\n if (areSameDates(new Date(expense.started_at), startOfClaimDate)) {\n onChange({ started_at: null, ended_at: null })\n } else {\n onChange({ ended_at: endOfClaimDate })\n }\n setVisualState(CLOSED_STATE)\n }\n\n const startEndClaimPeriodLabel = () => {\n if (oneOff) {\n return \"I don't know the date\"\n }\n\n return `${startFocused ? 'From the start' : 'Until the end'} of the claim\n period`\n }\n\n return (\n \n \n \n \n \n {}}\n onFocus={() => setFocusedField('started_at')}\n value={startedAtVal || ''}\n modifiers=\"clickable\"\n readOnly\n />\n \n \n {!oneOff && (\n \n \n {}}\n onFocus={() => setFocusedField('ended_at')}\n value={endedAtVal || ''}\n modifiers=\"clickable\"\n readOnly\n />\n \n \n )}\n \n \n \n \n {startEndClaimPeriodLabel()}\n \n \n \n )\n}\n\nexport default function FrequencyDurationInput({ disabled = false, expense, frequencies, onChange }) {\n const [visualState, setVisualState] = useState(CLOSED_STATE)\n const { expense_duration_id } = expense\n const frequency = chosenFrequency(expense_duration_id, frequencies)\n const open = [OPEN_STATE, OPEN_DATE_STATE].indexOf(visualState) !== -1\n\n return (\n \n
{\n if (!disabled) {\n setVisualState(OPEN_STATE)\n }\n }}\n >\n {frequencyLabel(expense, frequency)} \n {durationLabel(expense, frequency)} \n setVisualState(CLOSED_STATE)}>\n {visualState === OPEN_STATE && (\n \n \n )\n}\n\nFrequencyDurationInput.propTypes = {\n disabled: PropTypes.bool,\n expense: PropTypes.object.isRequired,\n frequencies: PropTypes.arrayOf(PropTypes.object).isRequired,\n onChange: PropTypes.func.isRequired\n}\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport Select from './Select'\n\nimport { FormGroup, InputGroup, InputGroupItem } from '../layout/Wrapper'\n\nclass FrequencyInput extends React.Component {\n constructor(props) {\n super(props)\n this.handleChange = this.handleChange.bind(this)\n }\n\n handleChange(key, value) {\n const { qualitativeFrequency, quantitativeFrequency, onChange } = this.props\n if (key === 'qualitativeFrequency') {\n onChange(quantitativeFrequency, value)\n } else {\n onChange(value, qualitativeFrequency)\n }\n }\n\n render() {\n const { disabled, quantitativeFrequency, qualitativeFrequency, showDeprecatedOptions } = this.props\n\n const options = ['Per week', 'Every 2 weeks', 'Every 3 weeks', 'Per month']\n if (showDeprecatedOptions) {\n options.unshift(['Every day', 'Every day', true])\n options.push(['Other', 'Other', true])\n }\n\n return (\n \n \n \n this.handleChange('quantitativeFrequency', parseInt(e.target.value, 10))}\n />\n \n \n \n \n this.handleChange('qualitativeFrequency', e.target.value)}\n />\n \n \n \n )\n }\n}\n\nFrequencyInput.propTypes = {\n disabled: PropTypes.bool,\n onChange: PropTypes.func.isRequired,\n quantitativeFrequency: PropTypes.number,\n qualitativeFrequency: PropTypes.string,\n showDeprecatedOptions: PropTypes.bool\n}\n\nFrequencyInput.defaultProps = {\n disabled: false,\n quantitativeFrequency: 5,\n qualitativeFrequency: 'Per week',\n showDeprecatedOptions: false\n}\n\nexport default FrequencyInput\n","import React, { Fragment } from 'react'\nimport PropTypes from 'prop-types'\n\nimport ExpenseInput from './ExpenseInput'\nimport Question from './Question'\nimport ButtonGroupItem from './ButtonGroupItem'\n\nimport { frequenciesForExpenseKind } from '../../modules/expense'\nimport { updatePageTitle } from '../../modules/legacyUtils'\nimport { snakeCase } from '../../modules/utils'\nimport { ButtonGroup, ContentFooter, ContentWrapper, ContentWrapperInner, FormGroup } from '../layout/Wrapper'\n\nimport Helper from '../display/Helper'\nimport HelperTrigger from '../display/HelperTrigger'\nimport helperTextData from '../../data/helperTextData.json'\n\nexport default function GeneralExpenseForm({\n employments,\n expenses,\n expenseKinds,\n expenseGroups,\n expenseFrequencies,\n onAdd,\n onUpdate,\n onRemove,\n onSubmit,\n onCancel\n}) {\n updatePageTitle('General expenses')\n\n const visibleExpenseGroups = expenseGroups.filter(expenseGroup => {\n if (!employments.length) {\n return true\n }\n\n if (expenseGroup.code === 'MOD') {\n return !!employments.find(e => e.mod_branch)\n } else if (expenseGroup.code === 'SELF-EMPLOYED') {\n return !!employments.find(e => e.self_employed)\n } else if (expenseGroup.code === 'GENERAL') {\n return !employments.find(e => e.mod_branch)\n }\n return true\n })\n\n const expenseGroupKinds = expenseGroup => {\n return expenseKinds.filter(k => k.expense_group_id === expenseGroup.id && k.active && !k.workplace)\n }\n\n const expensesForKind = expenseKindId => {\n return expenses.filter(ex => ex.expense_kind_id === expenseKindId)\n }\n\n return (\n \n \n {visibleExpenseGroups.map((expenseGroup, expenseGroupIndex) => {\n const kindsForExpenseGroup = expenseGroupKinds(expenseGroup)\n const helperText =\n helperTextData.expenses[snakeCase(expenseGroup.code)]?.general[snakeCase(expenseGroup.heading)]\n\n return (\n \n \n {helperText && \n {expenseGroupIndex !== visibleExpenseGroups.length - 1 && \n )\n })}\n \n \n \n \n Cancel\n \n \n Save expenses\n \n \n \n \n )\n}\n\nGeneralExpenseForm.propTypes = {\n expenses: PropTypes.arrayOf(PropTypes.object).isRequired,\n employments: PropTypes.arrayOf(PropTypes.object).isRequired,\n expenseKinds: PropTypes.arrayOf(PropTypes.object).isRequired,\n expenseGroups: PropTypes.arrayOf(PropTypes.object).isRequired,\n expenseFrequencies: PropTypes.arrayOf(PropTypes.object).isRequired,\n onAdd: PropTypes.func.isRequired,\n onUpdate: PropTypes.func.isRequired,\n onRemove: PropTypes.func.isRequired,\n onSubmit: PropTypes.func.isRequired,\n onCancel: PropTypes.func.isRequired\n}\n","import React, { useEffect, useState, useRef } from 'react'\nimport PropTypes from 'prop-types'\n\nimport { ButtonGroup, Emoji } from '../layout/Wrapper'\nimport ButtonGroupItem from './ButtonGroupItem'\nimport Question from './Question'\nimport EmojiImage from '../images/Icon'\nimport idleTimeoutData from '../../data/idleTimeoutData.json'\n\nimport { fetch, isIterable } from '../../modules/utils'\nimport { trackEvent } from '../../modules/tracking'\n\nexport default function IdleHelpPanel({ page, location }) {\n const STUCK_TIMEOUT = idleTimeoutData[page].stuck\n const IDLE_TIMEOUT = idleTimeoutData[page].idle\n const AUTO_HIDE_TIMEOUT = idleTimeoutData.settings.autoHide\n const MAX_NUMBER_OF_DISMISSALS = 2\n const THROTTLE_SPEED = 100\n\n const panelIsDisabled = useRef(true)\n const [panelIsVisible, setPanelIsVisible] = useState(false)\n const [triggeredIdleTimeout, setTriggeredIdleTimeout] = useState(null)\n const [triggeredStuckTimeout, setTriggeredStuckTimeout] = useState(null)\n const userInputThrottle = useRef(new Date().getTime())\n\n const testMode = false\n\n useEffect(() => {\n fetch('GET', '/idle_help_panel', 'application/json').then(response => {\n disablePanel(response.count >= MAX_NUMBER_OF_DISMISSALS)\n\n if (testMode) {\n testLog(`This user has dismissed the idle panel ${response.count} times.`)\n }\n })\n\n return () => {\n removeEventListeners()\n }\n }, [])\n\n useEffect(() => {\n triggerIdleTimeout()\n triggerStuckTimeout()\n }, [location])\n\n useEffect(() => {\n let timer = {}\n\n if (triggeredIdleTimeout) {\n testLog('Started the idle timeout')\n timer = setTimeout(\n () => {\n testLog('User was idle')\n showPanel()\n },\n testMode ? IDLE_TIMEOUT / 2 : IDLE_TIMEOUT\n )\n }\n\n return () => {\n clearTimeout(timer)\n }\n }, [triggeredIdleTimeout])\n\n useEffect(() => {\n let timer = {}\n\n if (triggeredStuckTimeout) {\n testLog('Started the stuck timeout')\n timer = setTimeout(\n () => {\n testLog('User did not interact with a form')\n showPanel()\n },\n testMode ? STUCK_TIMEOUT / 3 : STUCK_TIMEOUT\n )\n }\n\n return () => {\n clearTimeout(timer)\n }\n }, [triggeredStuckTimeout])\n\n useEffect(() => {\n let timer = {}\n\n if (panelIsVisible && !panelIsDisabled.current) {\n timer = setTimeout(\n () => {\n testLog('User did not interact with the panel after 15 seconds, disabling it')\n disablePanel(true)\n },\n testMode ? AUTO_HIDE_TIMEOUT / 3 : AUTO_HIDE_TIMEOUT\n )\n }\n\n return () => {\n clearTimeout(timer)\n }\n }, [panelIsVisible])\n\n const onUserDismissed = dismissForever => {\n testLog('User dismissed the panel, updating the dismissed count')\n fetch('PUT', '/idle_help_panel', 'application/json', null, { dismiss_forever: dismissForever })\n .then(() => {\n disablePanel(true)\n })\n .catch(e => {\n if (isIterable(e)) {\n const [message] = e\n console.error('Fetch failed: ' + message)\n }\n })\n }\n\n const showPanel = () => {\n testLog(`The panel is ${panelIsDisabled.current ? '' : 'not'} disabled`)\n if (document.querySelector('.live-chat-panel--panel-minimized') && !panelIsDisabled.current) {\n trackEvent('Idle help panel displayed')\n testLog(`Showing the panel`)\n setPanelIsVisible(true)\n }\n }\n\n const addEventListeners = () => {\n ;['click', 'touchstart', 'mousemove', 'keydown', 'scroll'].forEach(evt =>\n document.addEventListener(evt, triggerIdleTimeout)\n )\n\n document.getElementById('onInteractionWithForm').addEventListener('change', () => triggerStuckTimeout())\n }\n\n const removeEventListeners = () => {\n ;['click', 'touchstart', 'mousemove', 'keydown', 'scroll'].forEach(evt =>\n document.removeEventListener(evt, triggerIdleTimeout)\n )\n\n document.getElementById('onInteractionWithForm').removeEventListener('change', () => triggerStuckTimeout())\n }\n\n const triggerIdleTimeout = () => {\n if (!panelIsDisabled.current) {\n throttle().then(() => {\n setTriggeredIdleTimeout(new Date())\n })\n }\n }\n\n const triggerStuckTimeout = () => {\n if (!panelIsDisabled.current) {\n setTriggeredStuckTimeout(new Date())\n }\n }\n\n const disablePanel = disabled => {\n testLog(disabled ? 'Disabling the panel' : 'Enabling the panel')\n panelIsDisabled.current = disabled\n\n if (disabled) {\n setPanelIsVisible(false)\n removeEventListeners()\n return\n }\n\n addEventListeners()\n triggerIdleTimeout()\n triggerStuckTimeout()\n }\n\n const testLog = message => {\n if (testMode) {\n console.log('IDLE PANEL LOG: ' + message)\n }\n }\n\n const throttle = () => {\n const now = new Date().getTime()\n return new Promise(resolve => {\n if (now >= userInputThrottle.current) {\n userInputThrottle.current = now + THROTTLE_SPEED\n resolve()\n }\n })\n }\n\n const onPrimaryButtonClick = e => {\n e.preventDefault()\n trackEvent('Clicked on Idle Panel Chat button')\n window.myRIFT.openLiveChatPanel()\n onUserDismissed(true)\n }\n\n const onCancelButtonClick = e => {\n e.preventDefault()\n trackEvent('Clicked on Idle Panel Not Now button')\n onUserDismissed(false)\n }\n\n return (\n \n
\n
\n
\n
\n \n \n
\n
\n
\n \n Chat now\n \n\n \n Not now\n \n \n
\n {this.props.children}\n \n )\n }\n}\n\nLink.propTypes = {\n href: PropTypes.string,\n modifiers: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),\n target: PropTypes.string,\n children: PropTypes.string\n}\nLink.defaultProps = {\n href: '#'\n}\nexport default Link\n","import React, { useState, useEffect } from 'react'\nimport PropTypes from 'prop-types'\n\nimport ScheduledCallback from './scheduledCallback/ScheduledCallback'\nimport Icon from '../images/Icon'\n\nimport { trackEvent } from '../../modules/tracking'\n\nconst LiveChatPanel = props => {\n const [minimized, setMinimized] = useState(true)\n\n useEffect(() => {\n // Assign the open() method to openLiveChatPanel\n if (!window.myRIFT) {\n window.myRIFT = {}\n }\n window.myRIFT.openLiveChatPanel = open\n }, [])\n\n const toggle = () => {\n if (minimized) {\n trackEvent('Livechat pop event')\n }\n\n minimized ? setMinimized(false) : setMinimized(true)\n }\n\n const open = () => {\n setMinimized(false)\n // if there is a liveChatPanel, show it and close the contact-modal\n document.getElementById('contact-modal').classList.remove('modal--visible')\n }\n\n const renderChat = () => {\n const { callCentreIsOpen, openingData, callCentreWillOpenToday, todaysDay, stepsContent } = props\n if (callCentreIsOpen) {\n return (\n \n {!minimized && }\n
\n )\n } else {\n return (\n \n \n Live Chat
\n \n toggle()}>\n \n
\n \n \n \n )\n}\n\nLiveChatPanel.propTypes = {\n openingData: PropTypes.array,\n callCentreWillOpenToday: PropTypes.bool,\n callCentreIsOpen: PropTypes.bool,\n todaysDay: PropTypes.string,\n stepsContent: PropTypes.array\n}\n\nexport default LiveChatPanel\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport ModLocationInput from './ModLocationInput'\nimport NonModLocationInput from './NonModLocationInput'\n\nclass LocationInput extends React.Component {\n render() {\n const { ministryOfDefence } = this.props\n if (ministryOfDefence) {\n return
\n }\n}\n\nMap.propTypes = {\n latitude: PropTypes.number.isRequired,\n longitude: PropTypes.number.isRequired,\n onChange: PropTypes.func.isRequired,\n query: PropTypes.string.isRequired\n}\n\nexport default Map\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport FormGroupHeader from './FormGroupHeader'\n\nimport { FormGroup } from '../layout/Wrapper'\n\nimport { capitalize, setStateFromPath } from '../../modules/utils'\n\nclass MilitaryDataQuestions extends React.Component {\n constructor(props) {\n super(props)\n this.handleSelectChange = this.handleSelectChange.bind(this)\n }\n\n componentDidMount() {\n setStateFromPath.apply(this, ['GET', '/mod_data/fetch_state'])\n }\n\n handleSelectChange({ target }) {\n const { onChange } = this.props\n setStateFromPath.apply(this, ['GET', `/mod_data/select_${target.name}?value=${target.value}`]).then(() => {\n if (onChange) onChange(this.state.ids)\n })\n }\n\n select(name, margin = true) {\n const { user } = this.props\n const selectData = this.state ? this.state[`${name}_data`] : null\n if (!selectData || !selectData[0] || selectData[0].name == 'N/A') return null\n return (\n \n \n \n \n {this.defaultSelectText(name)}\n \n {selectData.map((select_option, index) => (\n \n {select_option.name}\n \n ))}\n \n
\n \n )\n }\n\n title(name) {\n return (this.state && this.state[`${name}_title`]) || capitalize(name)\n }\n\n defaultSelectText(name) {\n const basicText = this.title(name).toLowerCase()\n const prefix = /^[aeiou]$/i.test(basicText[0]) ? 'an' : 'a'\n return `Select ${prefix} ${basicText}`\n }\n\n render() {\n return (\n \n {this.select('force', false)}\n {this.select('base')}\n {this.select('unit')}\n {this.select('rank')}\n \n )\n }\n}\nMilitaryDataQuestions.propTypes = {\n onChange: PropTypes.func,\n user: PropTypes.object\n}\nexport default MilitaryDataQuestions\n","import React, { Fragment } from 'react'\nimport PropTypes from 'prop-types'\n\nimport TypeAhead from './TypeAhead'\nimport FormLink from './FormLink'\nimport FormGroupHeader from './FormGroupHeader'\nimport FormGroupInput from './FormGroupInput'\nimport OptionsItemLabel from './OptionsItemLabel'\nimport OptionsItemText from './OptionsItemText'\n\nimport { FormGroupErrorMessage, Options, OptionsItem } from '../layout/Wrapper'\n\nimport { commonLocationLookup } from '../../modules/api'\nimport { mapSrc, methodFromString, hasValues } from '../../modules/utils'\n\nconst ADDRESS_INPUTS = [\n { name: 'name', label: 'Base name' },\n { name: 'first_line', label: 'Address line 1' },\n { name: 'second_line', label: 'Address line 2' },\n { name: 'town', label: 'Town' },\n { name: 'county', label: 'County' },\n { name: 'postcode', label: 'Postcode' }\n]\n\nconst DEFAULT_STATE = {\n manual: false,\n selectionMade: false,\n address: {\n country: null,\n county: null,\n first_line: null,\n latitude: null,\n longitude: null,\n postcode: null,\n second_line: null,\n town: null\n }\n}\n\nclass ModLocationInput extends React.Component {\n constructor(props) {\n super(props)\n\n this.state = this.getInitialState()\n\n this.toggleManualEntry = this.toggleManualEntry.bind(this)\n this.setAddressField = this.setAddressField.bind(this)\n this.setAddressState = this.setAddressState.bind(this)\n this.handleAddressChange = this.handleAddressChange.bind(this)\n this.reset = this.reset.bind(this)\n }\n\n getInitialState() {\n const { address } = this.props\n const hasErrors = this.hasErrors()\n const hasAddressValues = this.hasAddressValues()\n const addressMissingCoordinates = hasAddressValues && (!address.latitude || !address.longitude)\n const selectionMade = !hasErrors && !addressMissingCoordinates && hasAddressValues\n\n return {\n ...DEFAULT_STATE,\n manual: (hasErrors && hasAddressValues) || addressMissingCoordinates,\n selectionMade,\n ...{ address }\n }\n }\n\n hasErrors() {\n const { errors } = this.props\n return !!Object.keys(errors).length\n }\n\n hasAddressValues() {\n const { address } = this.props\n return hasValues(address)\n }\n\n toggleManualEntry(e) {\n e.preventDefault()\n const { manual } = this.state\n this.setState({ manual: !manual })\n }\n\n reset(e) {\n e.preventDefault()\n this.setState(DEFAULT_STATE, this.handleAddressChange)\n }\n\n setAddressField(e) {\n const { name, value } = e.target\n const { address } = this.state\n\n this.setState(\n {\n address: {\n ...address,\n [name]: value\n }\n },\n this.handleAddressChange\n )\n }\n\n setAddressState(address) {\n this.setState(\n {\n address,\n selectionMade: true\n },\n this.handleAddressChange\n )\n }\n\n handleAddressChange() {\n const { onChange } = this.props\n const { address } = this.state\n return methodFromString(onChange)(address)\n }\n\n renderManualEntry() {\n const { address } = this.state\n const { errors } = this.props\n\n return ADDRESS_INPUTS.map((input, index) => {\n const last = index === ADDRESS_INPUTS.length - 1\n const error = errors[input.name]\n\n return (\n \n {error} }\n {last && \n )\n })\n }\n\n renderTypeahead() {\n const typeaheadError = this.hasErrors()\n ? 'We need to know where you were based to work out travel distances.'\n : false\n\n return (\n \n \n \n \n \n \n \n \n {!disabled && \n )\n }\n\n render() {\n const { manual, selectionMade } = this.state\n if (manual) {\n return this.renderManualEntry()\n } else if (selectionMade) {\n return this.renderSelectedAddress()\n } else {\n return this.renderTypeahead()\n }\n }\n}\n\nModLocationInput.propTypes = {\n onChange: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n address: PropTypes.object,\n errors: PropTypes.object,\n disabled: PropTypes.bool\n}\n\nexport default ModLocationInput\n","import React, { Fragment } from 'react'\nimport PropTypes from 'prop-types'\n\nimport TypeAhead from './TypeAhead'\nimport FormLink from './FormLink'\nimport FormGroupHeader from './FormGroupHeader'\nimport FormGroupInput from './FormGroupInput'\nimport OptionsItemLabel from './OptionsItemLabel'\nimport OptionsItemText from './OptionsItemText'\nimport Drawer from '../layout/Drawer'\nimport DrawerHeader from '../layout/DrawerHeader'\nimport DrawerFooter from '../layout/DrawerFooter'\nimport Map from './Map'\n\nimport { DrawerBody, FormGroupErrorMessage, Options, OptionsItem } from '../layout/Wrapper'\n\nimport { locationLookup } from '../../modules/api'\nimport { mapSrc, methodFromString, hasValues } from '../../modules/utils'\n\nconst ADDRESS_INPUTS = [\n { name: 'name', label: 'Building or company name' },\n { name: 'first_line', label: 'Address line 1' },\n { name: 'second_line', label: 'Address line 2' },\n { name: 'town', label: 'Town' },\n { name: 'county', label: 'County' },\n { name: 'postcode', label: 'Postcode' }\n]\n\nconst DEFAULT_STATE = {\n manual: false,\n selectionMade: false,\n selectionConfirmed: false,\n drawerClosed: false,\n address: {\n name: null,\n country: null,\n county: null,\n first_line: null,\n latitude: null,\n longitude: null,\n postcode: null,\n second_line: null,\n town: null\n }\n}\n\nclass NonModLocationInput extends React.Component {\n constructor(props) {\n super(props)\n\n this.state = this.getInitialState()\n\n this.toggleManualEntry = this.toggleManualEntry.bind(this)\n this.setAddressField = this.setAddressField.bind(this)\n this.setAddressState = this.setAddressState.bind(this)\n this.setPartialAddressState = this.setPartialAddressState.bind(this)\n this.handleAddressChange = this.handleAddressChange.bind(this)\n this.cancelConfirmation = this.cancelConfirmation.bind(this)\n this.confirmSelection = this.confirmSelection.bind(this)\n this.reset = this.reset.bind(this)\n }\n\n getInitialState() {\n const { address } = this.props\n const hasErrors = this.hasErrors()\n const hasAddressValues = this.hasAddressValues()\n const addressMissingCoordinates = hasAddressValues && (!address.latitude || !address.longitude)\n const lookupSelectionConfirmed = !hasErrors && !addressMissingCoordinates && hasAddressValues\n\n return {\n ...DEFAULT_STATE,\n manual: (hasErrors && hasAddressValues) || addressMissingCoordinates,\n selectionMade: lookupSelectionConfirmed,\n selectionConfirmed: lookupSelectionConfirmed,\n ...{ address }\n }\n }\n\n hasErrors() {\n const { errors } = this.props\n return !!Object.keys(errors).length\n }\n\n hasAddressValues() {\n const { address } = this.props\n return hasValues(address)\n }\n\n toggleManualEntry(e) {\n e.preventDefault()\n const { manual } = this.state\n this.setState({ manual: !manual })\n }\n\n reset(e) {\n if (e) {\n e.preventDefault()\n }\n this.setState(DEFAULT_STATE, this.handleAddressChange)\n }\n\n setAddressField(e) {\n const { name, value } = e.target\n const { address } = this.state\n\n this.setState(\n {\n address: {\n ...address,\n [name]: value\n }\n },\n this.handleAddressChange\n )\n }\n\n setPartialAddressState(partialAddressState) {\n const { address } = this.state\n\n this.setState(\n {\n address: {\n ...address,\n ...partialAddressState\n }\n },\n this.handleAddressChange\n )\n }\n\n setAddressState(address) {\n this.setState(\n {\n address,\n selectionMade: true,\n selectionConfirmed: false,\n drawerClosed: false\n },\n this.handleAddressChange\n )\n }\n\n handleAddressChange() {\n const { onChange } = this.props\n const { address } = this.state\n return methodFromString(onChange)(address)\n }\n\n closeDrawer(afterAction) {\n this.setState({ drawerClosed: true })\n if (afterAction) {\n setTimeout(afterAction, 400) // The drawer takes 500ms to animate closed\n }\n }\n\n cancelConfirmation() {\n this.closeDrawer(this.reset)\n }\n\n confirmSelection() {\n this.closeDrawer(() => {\n this.setState({ selectionConfirmed: true })\n })\n }\n\n renderManualEntry() {\n const { address } = this.state\n const { errors } = this.props\n\n return ADDRESS_INPUTS.map((input, index) => {\n const last = index === ADDRESS_INPUTS.length - 1\n const error = errors[input.name]\n\n return (\n \n {error} }\n {last && \n )\n })\n }\n\n renderTypeahead() {\n const typeaheadError =\n this.hasErrors() && !this.hasAddressValues()\n ? 'We need to know where you were based to work out travel distances.'\n : false\n\n return (\n \n \n \n \n \n \n \n \n {!disabled && \n )\n }\n\n renderConfirmationDrawer() {\n const { drawerClosed, address } = this.state\n\n return (\n \n Workplace location \n \n \n \n )\n }\n\n render() {\n const { manual, selectionMade, selectionConfirmed } = this.state\n const showConfirmationDrawer = selectionMade && !selectionConfirmed\n\n return (\n \n {manual ? this.renderManualEntry() : selectionMade ? this.renderSelectedAddress() : this.renderTypeahead()}\n {showConfirmationDrawer && this.renderConfirmationDrawer()}\n \n )\n }\n}\n\nNonModLocationInput.propTypes = {\n onChange: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n address: PropTypes.object,\n errors: PropTypes.object,\n disabled: PropTypes.bool\n}\n\nexport default NonModLocationInput\n","import React, { useState, useEffect } from 'react'\nimport PropTypes from 'prop-types'\n\nimport Question from './Question'\nimport RadioOption from './RadioOption'\nimport Stepper from './Stepper'\n\nexport default function OptionalStepper({ minValue, name, onChange, questionText, resourceName, value }) {\n const [disableStepper, setDisableStepper] = useState(false)\n\n useEffect(() => {\n setDisableStepper(!value)\n }, [value])\n\n const onStepperClick = () => {\n if (disableStepper) {\n setDisableStepper(false)\n onChange(minValue)\n }\n }\n\n return (\n <>\n \n
\n \n \n \n onChange(null)}\n name={name}\n resourceName={resourceName}\n />\n \n \n
\n {children}\n \n )\n}\n\nexport default OptionsItemButton\n","import React from 'react'\n\nimport { generateModifierClasses } from '../../modules/utils'\n\nconst OptionsItemImage = function (props) {\n const classes = generateModifierClasses('options__item__image', props.modifiers)\n\n return \n {label} \n {microcopy && {microcopy} }\n \n )\n}\n\nOptionsItemText.propTypes = {\n label: PropTypes.string.isRequired,\n microcopy: PropTypes.string,\n modifiers: PropTypes.oneOfType([PropTypes.string, PropTypes.array])\n}\n\nexport default OptionsItemText\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport OptionsItem from './legacy/OptionsItem'\nimport Question from './Question'\nimport ErrorSpan from './ErrorSpan'\nimport Helper from '../display/Helper'\nimport HelperTrigger from '../display/HelperTrigger'\nimport FormGroupHeader from './FormGroupHeader'\n\nimport { FormGroup, Options } from '../layout/Wrapper'\n\nimport { inputName, inputId, propagateValue, helperId } from '../../modules/utils'\n\nclass OptionsList extends React.Component {\n constructor(props) {\n super(props)\n this.state = { value: this.value() }\n this.updateValue = this.updateValue.bind(this)\n this.handleSelectChange = this.handleSelectChange.bind(this)\n this.hiddenInputRef = React.createRef()\n }\n\n static getDerivedStateFromProps(props, state) {\n if (props.value && props.value !== state.prevPropsValue) {\n return {\n prevPropsValue: props.value,\n value: state.prevPropsValue ? props.value : state.value\n }\n }\n return null\n }\n\n value() {\n const { resource, value, name } = this.props\n const resourceValue = resource && resource[name]\n const val = (this.state && this.state.value) || value || resourceValue || ''\n return parseInt(val) || val\n }\n\n updateValue(value) {\n this.setState({ value: value }, propagateValue.apply(this, [this.props.name, value]))\n\n // Hidden inputs don't trigger a 'change' event by default, so\n // we manually trigger one here.\n setTimeout(() => {\n const event = new CustomEvent('change')\n const hiddenInput = this.hiddenInputRef.current\n hiddenInput && hiddenInput.dispatchEvent(event)\n }, 0)\n }\n\n handleSelectChange({ target }) {\n this.updateValue(target.value)\n }\n\n optionItems() {\n const { options, resourceName, name, modifiers, editAction, disabled } = this.props\n\n return (\n \n {options.map((option, index) => (\n {} : this.updateValue}\n data={option.data}\n locked={option.locked && option.endedAtLocked}\n editAction={editAction}\n disabled={disabled}\n />\n ))}\n \n )\n }\n\n optionChecked(option) {\n if ([option.name, option.value].indexOf('Other') != -1 && this.showSelect()) {\n return true\n }\n return this.value() == (parseInt(option.value) || option.value)\n }\n\n showSelect() {\n const ids = this.selectionIds()\n if (!ids) return false\n return this.value() == 'Other' || this.selectionIds().indexOf(this.value()) >= 0\n }\n\n selectionIds() {\n const { selections } = this.props\n return selections && selections.map(selection => selection.value)\n }\n\n hiddenInput() {\n return (\n \n \n {selections.map((select_option, index) => (\n \n {select_option.label}\n \n ))}\n \n
\n )\n }\n\n renderHelperTrigger(questionHeading) {\n const { helperText, onHelpClick } = this.props\n\n if (helperText || onHelpClick) {\n return (\n \n {helperText && \n {(questionHeading || questionText) && (\n \n {this.renderHelperTrigger(questionHeading)}\n \n )}\n \n
\n )\n }\n}\nOptionsList.propTypes = {\n options: PropTypes.array,\n selections: PropTypes.array,\n name: PropTypes.string,\n error: PropTypes.oneOfType([PropTypes.string, PropTypes.array, PropTypes.bool]),\n helperText: PropTypes.string,\n classes: PropTypes.array,\n resource: PropTypes.object,\n resourceName: PropTypes.string,\n label: PropTypes.string,\n questionHeading: PropTypes.string,\n questionText: PropTypes.string,\n modifiers: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),\n editAction: PropTypes.oneOfType([PropTypes.func, PropTypes.bool]),\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n handlePropagation: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n disabled: PropTypes.bool,\n onHelpClick: PropTypes.func\n}\n\nOptionsList.defaultProps = {\n disabled: false\n}\nexport default OptionsList\n","import React, { useEffect, useState } from 'react'\nimport PropTypes from 'prop-types'\n\nimport ActionBar from '../interactive/ActionBar'\n\nimport { generateModifierClasses } from '../../modules/utils'\nimport { animate } from '../../modules/carousel'\n\nexport default function Picker({ options, onChange, name, onComplete, showNav }) {\n const [activeTab, setActiveTab] = useState(0)\n const [activeTabIndex, setActiveTabIndex] = useState(0)\n const [animating, setAnimating] = useState(false)\n const [fadeOut, setFadeOut] = useState(null)\n const [fadeIn, setFadeIn] = useState(null)\n\n const { disabledOptionTitle, miniButtons, optionName, nextText, optionList, previousText, skipOptionText } =\n options[activeTab] || {}\n\n const noOfTabs = options.length\n\n useEffect(() => {\n switchTabs(0)\n }, [name])\n\n const switchTabs = (nextActiveTab, callback) => {\n if (nextActiveTab === activeTab) {\n return\n }\n\n animate(\n () => {\n setAnimating()\n setFadeOut(nextActiveTab < activeTab ? 'right' : 'left')\n },\n () => {\n setFadeOut(null)\n setActiveTab(nextActiveTab)\n setFadeIn(nextActiveTab < activeTab ? 'left' : 'right')\n },\n () => {\n setFadeIn(null)\n setAnimating(null)\n setActiveTabIndex(0)\n if (callback) {\n callback()\n }\n },\n 400\n )\n }\n\n const handleButtonClick = e => {\n e.preventDefault()\n\n const { target } = e\n\n if (target.classList.contains('disabled') || animating) {\n return false\n }\n\n const option = target.closest('a').getAttribute('option')\n const value = target.closest('a').getAttribute('value')\n\n if (activeTab === noOfTabs - 1) {\n onChange({ [option]: value })\n setActiveTab(0)\n setActiveTabIndex(0)\n return onComplete()\n }\n\n switchTabs(activeTab + 1, () => {\n onChange({ [option]: value })\n })\n }\n\n const handleTabClick = ({ target }) => {\n const nextTabIndex = parseInt(target.closest('li').getAttribute('value'))\n\n if (activeTab <= nextTabIndex) {\n return false\n }\n\n switchTabs(nextTabIndex)\n }\n\n const underlineStyles = () => {\n const width = 100 / noOfTabs / 3\n return {\n width: `${width}%`,\n left: `${(100 / noOfTabs) * activeTab + width}%`\n }\n }\n\n const buttonLists = () => {\n const maxNoOptionsWithoutButtons = miniButtons ? 42 : 12\n const maxNoOptionsWithButtons = miniButtons ? 35 : 9\n let actionBar = []\n let actions = []\n let optionClasses = ['picker__button-list__button']\n if (miniButtons) {\n optionClasses.push('picker__button-list__button--mini')\n }\n\n const actionButtonBase = {\n componentName: 'AnchorButton',\n classes: ['button-group__item', 'button--block'],\n modifiers: ['default']\n }\n\n let allOptions = optionList || []\n if (allOptions.length > maxNoOptionsWithoutButtons) {\n let sliceTo = allOptions.length - maxNoOptionsWithButtons * activeTabIndex\n let sliceFrom = Math.max(sliceTo - maxNoOptionsWithButtons, 0)\n\n allOptions = allOptions.slice(sliceFrom, sliceTo)\n\n if (sliceFrom !== 0) {\n actions.push(\n Object.assign(\n {\n children: previousText || 'Previous',\n onClick: e => {\n e.preventDefault()\n setActiveTabIndex(activeTabIndex + 1)\n }\n },\n actionButtonBase\n )\n )\n }\n if (activeTabIndex !== 0) {\n actions.push(\n Object.assign(\n {\n children: nextText || 'Next',\n onClick: e => {\n e.preventDefault()\n setActiveTabIndex(activeTabIndex - 1)\n }\n },\n actionButtonBase\n )\n )\n }\n }\n if (skipOptionText) {\n actions.push(\n Object.assign(\n {\n children: skipOptionText,\n option: optionName,\n value: '',\n onClick: handleButtonClick\n },\n actionButtonBase\n )\n )\n }\n actions.length > 0 && actionBar.push(\n {optionData.text}\n \n ))\n .concat(actionBar)\n }\n\n const renderNavItem = ({ optionName }, index) => {\n let modifiers = []\n if (activeTab < index) {\n modifiers.push('disabled')\n } else if (activeTab == index) {\n modifiers.push('active')\n }\n\n return (\n \n {optionName} \n \n )\n }\n\n return (\n \n {showNav && (\n
\n \n {options.map((optionData, index) => renderNavItem(optionData, index))}\n \n \n )}\n
\n
\n
\n {buttonLists()}\n
\n
\n
\n
\n Unless you tell us otherwise, any refunds will be sent by cheque to{' '}\n {current_address_strings[0]} . If you'd like it sent somewhere else, please call us on{' '}\n 01233 628648 .\n \n )\n }\n\n if (current_address_strings.length === 0) {\n return (\n \n You have no current address set . Please add your current address {' '}\n so we know where to send the cheque. Alternatively, you can call us on{' '}\n 01233 628648 to discuss.\n \n )\n }\n\n return (\n \n As you have more than one current address , please call us on{' '}\n 01233 628648 to discuss where you'd like us to send the cheque.\n \n )\n }\n\n renderForm() {\n const { preferences } = this.props\n const showBankForm = preferences.gm_refund_method === 'Direct'\n const hasBankAccount = !!preferences.bank_account_id\n\n const BankForm = () => {\n if (showBankForm) {\n return (\n \n \n )\n } else {\n return (\n \n Delivery address \n {this.renderCheckDeliveryMessage()}\n \n )\n }\n }\n\n return (\n <>\n \n \n \n \n \n )\n }\n\n render() {\n const { onCancel, onSubmit, submitting, fetching } = this.props\n const buttonModifiers = submitting ? ['primary', 'loading'] : 'primary'\n\n return (\n \n \n {fetching ? (\n \n
\n
\n
\n \n ) : (\n this.renderForm()\n )}\n \n \n \n \n Cancel\n \n \n Save changes\n \n \n \n \n )\n }\n}\n\nPreferencesForm.propTypes = {\n onEditBankAccountClick: PropTypes.func.isRequired,\n onCancel: PropTypes.func.isRequired,\n onChange: PropTypes.func.isRequired,\n onSubmit: PropTypes.func.isRequired,\n bank: PropTypes.object,\n bankAccount: PropTypes.object,\n preferences: PropTypes.object.isRequired,\n submitting: PropTypes.bool,\n fetching: PropTypes.bool\n}\n\nPreferencesForm.defaultProps = {\n submitting: false,\n fetching: false\n}\n\nexport default PreferencesForm\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nclass Question extends React.Component {\n heading() {\n const { heading, headingContent, small } = this.props\n if (!heading) return null\n if (small) {\n return (\n \n {heading}\n {headingContent}\n \n )\n } else {\n return (\n \n {heading}\n {headingContent}\n \n )\n }\n }\n\n render() {\n const { text, children, small } = this.props\n const classes = `question${small ? ' mt-5' : ''}`\n return (\n \n {this.heading()}\n {text || children ? (\n
\n {text &&
{text}
}\n {children && children}\n
\n ) : null}\n
\n
\n
\n Takes under a minute \n
\n
\n
\n
\n
Why use Rift Refunds? \n
\n \n \n \n Highly recommended \n We're rated excellent on Trustpilot
\n \n \n \n \n No hidden costs \n It costs nothing to find out if you have a claim
\n \n \n \n \n Expert Tax Specialists \n Our experts are here to help
\n \n \n
\n
\n
{subheading} \n
\n
\n {helperText &&
}\n
\n \n )\n }\n\n answers() {\n const { answers } = this.props\n if (!answers || !answers.length) return null\n\n let classes = 'questionnaire__answers'\n if (answers.length == 2) classes += ' questionnaire__answers--2-col'\n return (\n \n )\n }\n\n answerImage(answer) {\n if (!answer || !answer.image) return null\n return \n
\n
\n
\n \n {label} \n \n \n {this.input()}\n {this.label()}\n \n )\n }\n}\n\nRadioOption.propTypes = {\n value: PropTypes.string,\n name: PropTypes.string,\n resourceName: PropTypes.string,\n onChange: PropTypes.func,\n additionalAttributes: PropTypes.object,\n label: PropTypes.string,\n checked: PropTypes.bool,\n disabled: PropTypes.bool\n}\n\nRadioOption.defaultProps = {\n disabled: false\n}\n\nexport default RadioOption\n","import React, { Fragment, useState, useEffect } from 'react'\n\nimport { memoisedGroupedGeneralExpenses, memoisedGroupedWorkplaceExpenses } from '../../modules/expense'\n\nimport { timelineDateRange } from '../../modules/timelines'\n\nimport ButtonGroupItem from '../interactive/ButtonGroupItem'\nimport FactsItem from '../display/FactsItem'\nimport FlashMessage from '../display/FlashMessage'\nimport HeadingDivider from '../display/HeadingDivider'\nimport Helper from '../display/Helper'\nimport Lead from '../display/Lead'\nimport Block from '../display/Block'\nimport BlockHeader from '../display/BlockHeader'\nimport BlockBody from '../display/BlockBody'\nimport TitledDescriptionList from '../display/TitledDescriptionList'\nimport DescriptionList from '../display/DescriptionList'\nimport { List } from 'react-content-loader'\n\nimport {\n ButtonGroup,\n ContentFooter,\n ContentWrapper,\n ContentWrapperInner,\n Facts,\n Grid,\n GridInner\n} from '../layout/Wrapper'\n\nimport { fetchReviewPageState, createSubmission } from '../../modules/api'\nimport { useViewport } from '../../modules/hooks'\n\nimport { BREAKPOINTS, flatten, redirectTo } from '../../modules/utils'\n\nconst DEFAULT_RESOURCES = {\n bankDetails: [],\n userDetails: [],\n reviewData: {\n employers: [],\n finance: {\n yesValues: [],\n noValues: []\n },\n workplaces: [],\n expenses: [],\n addresses: [],\n vehicles: []\n }\n}\n\nfunction DashboardBlock({ editPath, title, children }) {\n return (\n \n \n {title}\n \n {children} \n \n )\n}\n\nfunction DashboardFinanceFacts({ finance }) {\n return (\n \n {finance.yesValues.length > 0 && (\n \n {finance.yesValues.map((value, index) => (\n
\n )}\n {finance.noValues.length > 0 && finance.yesValues.length > 0 && \n {finance.noValues.map((value, index) => (\n
\n )}\n \n )\n}\n\nfunction DashboardMissingInfoMessage({ title, body, linkText, linkHref }) {\n return (\n \n \n )}\n\n {employers.length ? (\n \n e.display_data)} titleEl=\"h4\" />\n \n ) : (\n \n \n {invalidWorkplaces && (\n \n \n ) : (\n \n e.display_data)} titleEl=\"h4\" />\n \n )}\n\n {!!expenses.length && (\n \n {!!Object.keys(groupedWorkplaceExpenses).length && (\n \n Workplace expenses \n {Object.keys(groupedWorkplaceExpenses).map((title, index) => (\n \n )}\n {!!Object.keys(groupedGeneralExpenses).length && (\n \n General expenses \n {Object.keys(groupedGeneralExpenses).map((title, index) => (\n \n )}\n \n )}\n\n {addresses.length ? (\n \n e.display_data)} titleEl=\"h4\" />\n \n ) : (\n \n \n\n \n \n \n )\n }\n\n return (\n \n {error && \n {twoCol && (\n \n \n Finances \n \n \n \n \n \n Update my answers\n \n \n \n \n \n )}\n\n \n \n \n \n Nearly done! Check that everything you've added is correct, update your financial questions, and then{' '}\n submit your claim for review. \n \n
\n \n )}\n \n \n \n \n Cancel\n \n \n {submitText}\n \n \n \n \n \n \n \n )\n}\n","import React from 'react'\n\nconst Select = function ({ disabled, name, options, value, onChange }) {\n return (\n \n {options.map(option => {\n const isArray = typeof option === 'object'\n const value = isArray ? option[0] : option\n const label = isArray ? option[1] : option\n const disabled = isArray ? option[2] : false\n\n return (\n \n {label}\n \n )\n })}\n \n )\n}\n\nexport default Select\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport { iconFromString } from '../../helpers/images'\n\nexport default function Stepper({ className, disabled, onChange, value, max }) {\n const stepUp = e => {\n e.preventDefault()\n\n if (disabled) {\n return\n }\n\n const nextValue = maxReached() ? max : value + 1\n\n return onChange(nextValue)\n }\n\n const stepDown = e => {\n e.preventDefault()\n\n if (disabled) {\n return\n }\n\n const nextValue = minReached() ? 0 : value - 1\n return onChange(nextValue)\n }\n\n const stepToValue = e => {\n const valueString = e.target.value\n\n if (!valueString) {\n return onChange(0, false)\n }\n\n const value = parseInt(valueString, 10)\n\n if (isNaN(value)) {\n return\n }\n\n return onChange(value)\n }\n\n const minReached = () => {\n return value <= 0\n }\n\n const maxReached = () => {\n return max && value >= max\n }\n\n return (\n \n
\n
\n \n
\n
\n
\n \n
\n {children}\n \n )\n}\n\nTabsLink.propTypes = {\n className: PropTypes.string,\n href: PropTypes.string,\n modifiers: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),\n onClick: PropTypes.func,\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number])\n}\nTabsLink.defaultProps = {\n href: '#'\n}\n\nexport default TabsLink\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport Question from './Question'\nimport ErrorSpan from './ErrorSpan'\nimport Helper from '../display/Helper'\nimport HelperTrigger from '../display/HelperTrigger'\nimport FormGroupHeader from './FormGroupHeader'\n\nimport { FormGroup } from '../layout/Wrapper'\n\nimport { inputName, inputId, propagateValue, helperId } from '../../modules/utils'\n\nclass TextQuestion extends React.Component {\n constructor(props) {\n super(props)\n this.state = { value: this.value() }\n this.handleChange = this.handleChange.bind(this)\n }\n\n value() {\n const { resource, name, value } = this.props\n const resourceValue = resource && resource[name]\n return value || (this.state && this.state.value) || resourceValue || ''\n }\n\n handleChange({ target }) {\n this.setState({ value: target.value }, propagateValue.apply(this, [this.props.name, target.value]))\n }\n\n render() {\n const { className, label, questionHeading, questionText, helperText, disabled, error, placeHolder, autoComplete } =\n this.props\n return (\n \n {helperText && \n {helperText && (\n \n )}\n \n )\n }\n}\nTextQuestion.propTypes = {\n autoComplete: PropTypes.string,\n className: PropTypes.string,\n helperText: PropTypes.string,\n resource: PropTypes.object,\n resourceName: PropTypes.string,\n label: PropTypes.string,\n error: PropTypes.oneOfType([PropTypes.string, PropTypes.array, PropTypes.bool]),\n name: PropTypes.string,\n questionHeading: PropTypes.string,\n questionText: PropTypes.string,\n disabled: PropTypes.bool,\n placeHolder: PropTypes.string\n}\n\nTextQuestion.defaultProps = {\n disabled: false\n}\nexport default TextQuestion\n","import React, { useState } from 'react'\nimport PropTypes from 'prop-types'\n\nimport ActionBar from './ActionBar'\nimport EndedAtModal from './EndedAtModal'\n\nimport { capitalize } from '../../modules/utils'\nimport { inDateRange, shortDateString } from '../../modules/dates'\nimport {\n updateAddress,\n updateEmployment,\n updateEmploymentGap,\n updateLocation,\n updateLocationGap,\n confirmAddress,\n confirmEmployment,\n confirmEmploymentGap,\n confirmLocation,\n confirmLocationGap\n} from '../../modules/api'\n\nconst updaters = {\n updateAddress,\n updateEmployment,\n updateEmploymentGap,\n updateLocation,\n updateLocationGap,\n updateEmploymentGap,\n confirmAddress,\n confirmEmployment,\n confirmEmploymentGap,\n confirmLocation,\n confirmLocationGap\n}\n\nexport default function TimelineEndedAtPrompt({\n minDate,\n maxDate,\n timelineString,\n resourceType,\n resourceId,\n relatedResourceHeading,\n questionHeading,\n questionText\n}) {\n const [modalDisplayed, setModalDisplayed] = useState(false)\n const [date, setDate] = useState(null)\n const [error, setError] = useState(null)\n\n // TODO: It'd be nicer to merge the updated data with what we already have in state\n // in pages/my_rift/index.js for the next two functions, but at the time of writing\n // the priority is to get this live ASAP, so we're just refreshing the page instead\n // for now.\n const confirmResourceAndRefreshPage = () => {\n const confirmFunction = updaters[`confirm${capitalize(resourceType)}`]\n confirmFunction(resourceId).then(() => window.location.reload())\n }\n\n const updateDateAndRefreshPage = () => {\n const updateFunction = updaters[`update${capitalize(resourceType)}`]\n updateFunction({ id: resourceId, ended_at: date }).then(() => window.location.reload())\n }\n\n const handleUpdate = obj => {\n if (obj.ended_at && minDate && maxDate && !inDateRange(obj.ended_at, minDate, maxDate)) {\n const dateRange = `${shortDateString(minDate)} - ${shortDateString(maxDate)}`\n setError(`This date should be during your ${relatedResourceHeading} employment (${dateRange}).`)\n } else {\n setError(null)\n }\n\n setDate(obj.ended_at)\n }\n\n return (\n \n
\n
\n
setModalDisplayed(true),\n children: 'No'\n }\n ]}\n />\n \n
setModalDisplayed(false)}\n onChange={handleUpdate}\n onConfirm={updateDateAndRefreshPage}\n error={error}\n minDate={minDate}\n maxDate={maxDate}\n resourceName={`api_person_${resourceType}`}\n questionHeading={questionHeading}\n questionText={questionText}\n />\n {name.substring(index, index + typedValue.length)} \n )\n }\n\n return (\n \n {beforeMatch}\n {matchedSpan}\n {afterMatch}\n \n )\n }\n\n const inputClasses = loading ? 'string search__input search__input--loading' : 'string search__input'\n\n return (\n \n \n
\n {!disabled && typedValue && (\n
\n
\n \n
\n )}\n {(results && results.length && (\n
\n {results.map((result, index) => {\n const detail = [result.first_line, result.town, result.postcode, result.country, result.trading_name]\n .filter(Boolean)\n .join(', ')\n\n return (\n
\n {resultHeading(result.name || result.first_line)}\n {detail} \n \n )\n })}\n
\n )\n}\n\nTypeAhead.defaultProps = {\n throttleMs: 500\n}\n\nTypeAhead.propTypes = {\n error: PropTypes.oneOfType([PropTypes.string, PropTypes.array, PropTypes.bool]),\n label: PropTypes.string,\n placeholder: PropTypes.string,\n lookupFunction: PropTypes.func.isRequired,\n onSelection: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n disabled: PropTypes.bool,\n throttleMs: PropTypes.number\n}\n","import React, { Fragment } from 'react'\nimport PropTypes from 'prop-types'\n\nimport FormGroupInput from './FormGroupInput'\nimport DurationInput from './DurationInput'\nimport { FormGroupErrorMessage } from '../layout/Wrapper'\n\nimport { methodFromString } from '../../modules/utils'\n\nclass UnstructuredDurationInput extends React.Component {\n constructor(props) {\n super(props)\n\n this.state = {\n forceStructuredInput: false\n }\n\n this.handleChange = this.handleChange.bind(this)\n this.forceStructuredInput = this.forceStructuredInput.bind(this)\n }\n\n handleChange(years, months, weeks) {\n const { onChange } = this.props\n methodFromString(onChange)(years, months, weeks)\n }\n\n forceStructuredInput() {\n const { years, months, weeks } = this.props\n this.setState({ forceStructuredInput: true })\n this.handleChange(years, months, weeks)\n }\n\n render() {\n const { forceStructuredInput } = this.state\n const { disabled, error, textValue, years, months, weeks } = this.props\n const showTextInput = !!textValue && !forceStructuredInput\n\n if (showTextInput) {\n return (\n \n \n This is incorrect\n \n )}\n {error && {error} }\n \n )\n } else {\n return (\n \n {error} }\n \n )\n }\n }\n}\n\nUnstructuredDurationInput.propTypes = {\n disabled: PropTypes.bool,\n textValue: PropTypes.string,\n years: PropTypes.number.isRequired,\n months: PropTypes.number.isRequired,\n weeks: PropTypes.number.isRequired,\n onChange: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),\n error: PropTypes.string\n}\n\nUnstructuredDurationInput.defaultProps = {\n disabled: false\n}\n\nexport default UnstructuredDurationInput\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport FormGroupInput from './FormGroupInput'\nimport FrequencyInput from './FrequencyInput'\n\nimport { FormGroupErrorMessage } from '../layout/Wrapper'\n\nconst DEFAULT_QUANTITATIVE_FREQUENCY = 5\nconst DEFAULT_QUALITATIVE_FREQUENCY = 'Per week'\n\nclass UnstructuredFrequencyInput extends React.Component {\n constructor(props) {\n super(props)\n\n const { textValue, error } = props\n this.state = { showTextInput: !!textValue || !!error }\n\n this.toggleStructuredInput = this.toggleStructuredInput.bind(this)\n this.handleUnstructuredValueChange = this.handleUnstructuredValueChange.bind(this)\n this.handleStructuredValueChange = this.handleStructuredValueChange.bind(this)\n }\n\n toggleStructuredInput(e) {\n e.preventDefault()\n\n const showTextInput = !this.showTextInput()\n\n const {\n textValue,\n qualitativeFrequency,\n quantitativeFrequency,\n onUnstructuredValueChange,\n onStructuredValueChange\n } = this.props\n\n this.setState({ showTextInput })\n\n if (showTextInput) {\n onStructuredValueChange(null, null)\n onUnstructuredValueChange(textValue)\n } else {\n onUnstructuredValueChange(null)\n onStructuredValueChange(\n quantitativeFrequency || DEFAULT_QUANTITATIVE_FREQUENCY,\n qualitativeFrequency || DEFAULT_QUALITATIVE_FREQUENCY\n )\n }\n }\n\n handleUnstructuredValueChange(e) {\n const textValue = e.target.value\n const { onUnstructuredValueChange } = this.props\n onUnstructuredValueChange(textValue)\n }\n\n handleStructuredValueChange(quantitativeFrequency, qualitativeFrequency) {\n const { onStructuredValueChange } = this.props\n onStructuredValueChange(quantitativeFrequency, qualitativeFrequency)\n }\n\n showTextInput() {\n const { quantitativeFrequency, qualitativeFrequency } = this.props\n return this.state.showTextInput && !quantitativeFrequency && !qualitativeFrequency\n }\n\n render() {\n const { disabled, error, textValue, quantitativeFrequency, qualitativeFrequency, showDeprecatedOptions } =\n this.props\n\n const showTextInput = this.showTextInput()\n const toggleLabel = showTextInput ? \"It's not as complicated as I thought\" : \"It's complicated; I'll explain\"\n\n return (\n \n {showTextInput ? (\n \n {error} }\n \n ) : (\n \n {toggleLabel}\n \n )}\n \n )\n }\n}\n\nUnstructuredFrequencyInput.propTypes = {\n disabled: PropTypes.bool,\n onUnstructuredValueChange: PropTypes.func.isRequired,\n onStructuredValueChange: PropTypes.func.isRequired,\n error: PropTypes.string,\n textValue: PropTypes.string,\n quantitativeFrequency: PropTypes.number,\n qualitativeFrequency: PropTypes.string,\n showDeprecatedOptions: PropTypes.bool\n}\n\nUnstructuredFrequencyInput.defaultProps = {\n error: false,\n disabled: false,\n quantitativeFrequency: DEFAULT_QUANTITATIVE_FREQUENCY,\n qualitativeFrequency: DEFAULT_QUALITATIVE_FREQUENCY\n}\n\nexport default UnstructuredFrequencyInput\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport ButtonGroupItem from './ButtonGroupItem'\nimport DateRangeQuestion from './date/DateRangeQuestion'\nimport VehicleLookup from './VehicleLookup'\nimport YesNoQuestion from './YesNoQuestion'\nimport FlashMessage from '../display/FlashMessage'\n\nimport { ButtonGroup, ContentFooter, ContentWrapper, ContentWrapperInner } from '../layout/Wrapper'\n\nimport { fetch, omit, redirectTo, pick, highlightFirstError } from '../../modules/utils'\n\nimport helperTextData from '../../data/helperTextData.json'\n\nclass VehicleForm extends React.Component {\n constructor(props) {\n super(props)\n let flash = false\n if (props.locked) {\n flash = props.endedAtLocked\n ? 'You cannot update this vehicle'\n : \"You can only update the 'Until date' on this vehicle\"\n flash =\n flash +\n ' because it has been used in one of your previous claim submissions. Please contact us if you need anything else corrected.'\n }\n this.state = {\n errors: {},\n disabled: props.endedAtLocked,\n flash: flash,\n flashType: 'info'\n }\n this.lookupRef = React.createRef()\n this.handlePropagation = this.handlePropagation.bind(this)\n this.handleSubmit = this.handleSubmit.bind(this)\n this.updateVehicleData = this.updateVehicleData.bind(this)\n }\n\n static getDerivedStateFromProps(props, state) {\n const { resource } = props\n const { unchangedVehicle } = state\n\n if (resource && resource != unchangedVehicle) {\n const addedValues = {\n owned: !Boolean(resource.ended_at),\n company_car: resource.company_car || false,\n registration: resource.registration || '',\n kind: resource.kind || '',\n make: resource.make || '',\n model: resource.model || ''\n }\n return {\n vehicle: Object.assign(resource, addedValues),\n unchangedVehicle: resource,\n action: resource.id ? 'edit' : 'new'\n }\n }\n return null\n }\n\n handlePropagation(name, value, owned) {\n const { vehicle, errors } = this.state\n let newState = {\n disabled: false,\n errors: omit(errors, name)\n }\n\n if (name != 'registration') {\n const stateUpdates = { [name]: value }\n\n if (owned !== undefined) {\n stateUpdates['owned'] = owned\n }\n\n newState.vehicle = Object.assign(vehicle, stateUpdates)\n }\n this.setState(newState)\n\n this.props.onChange()\n }\n\n updateVehicleData(selectedVehicle) {\n const { vehicle, errors } = this.state\n this.setState({\n disabled: false,\n vehicle: Object.assign(vehicle, selectedVehicle),\n errors: omit(errors, Object.keys(selectedVehicle))\n })\n this.props.onChange()\n }\n\n handleSubmit(e) {\n e.preventDefault()\n this.setState({ disabled: true })\n const { action, vehicle } = this.state\n const { referrer, onAfterSubmit, authenticityToken } = this.props\n\n let method = 'POST'\n let path = '/vehicles'\n const formData = {\n api_person_vehicle: vehicle,\n utf8: '✓',\n authenticity_token: authenticityToken\n }\n if (action == 'edit') {\n path = path + '/' + vehicle.id\n method = 'PATCH'\n }\n\n if (!formData.api_person_vehicle.registration) {\n const regInput = this.lookupRef.current.regInputRef.current\n if (regInput) {\n const regValue = regInput.state.value\n formData.api_person_vehicle.registration = regValue\n }\n }\n\n fetch(method, path, 'application/json', 'application/json', formData)\n .then(data => {\n if (referrer) {\n redirectTo(referrer)\n } else {\n onAfterSubmit ? onAfterSubmit(data) : this.setState({ vehicle: null })\n }\n })\n .catch(errResponse => {\n const data = errResponse[1]\n console.error(JSON.stringify(data.errors))\n this.setState(data, function () {\n highlightFirstError()\n })\n })\n }\n\n companyCar() {\n const { resourceName, locked } = this.props\n const { vehicle } = this.state\n return (\n \n \n {flash && \n \n \n \n Cancel\n \n \n Save vehicle\n \n \n \n \n )\n }\n}\nVehicleForm.propTypes = {\n resourceName: PropTypes.string,\n resource: PropTypes.object,\n authenticityToken: PropTypes.string,\n referrer: PropTypes.string,\n onAfterSubmit: PropTypes.func,\n onCancel: PropTypes.func,\n onChange: PropTypes.func,\n locked: PropTypes.bool,\n endedAtLocked: PropTypes.bool\n}\n\nVehicleForm.defaultProps = {\n resourceName: 'api_person_vehicle',\n locked: false,\n endedAtLocked: false,\n onChange: () => {}\n}\n\nexport default VehicleForm\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport FormLink from './FormLink'\nimport FormGroupHeader from './FormGroupHeader'\nimport Question from './Question'\nimport Collection from './Collection'\nimport TextQuestion from './TextQuestion'\nimport ErrorSpan from './ErrorSpan'\nimport FilteredSelect from './FilteredSelect'\nimport AnchorButton from './AnchorButton'\nimport Helper from '../display/Helper'\n\nimport { FormGroup, FormGroupCombo, FormGroupComboItem } from '../layout/Wrapper'\n\nimport { fetch, propagateValue } from '../../modules/utils'\n\nclass VehicleLookup extends React.Component {\n constructor(props) {\n super(props)\n this.state = { manualEntry: false, lookupError: false }\n this.regInputRef = React.createRef()\n this.lookupInputRef = React.createRef()\n this.runLookup = this.runLookup.bind(this)\n this.manualEntry = this.manualEntry.bind(this)\n this.retryLookup = this.retryLookup.bind(this)\n this.inputChanged = this.inputChanged.bind(this)\n this.handlePropagation = this.handlePropagation.bind(this)\n }\n\n popularMakes(kind) {\n if (kind === 'Motorcycle') {\n return ['YAMAHA', 'HONDA', 'SUZUKI', 'TRIUMPH', 'LEXMOTO', 'BMW', 'PIAGGIO', 'Other']\n }\n return ['VAUXHALL', 'FORD', 'VOLKSWAGEN', 'BMW', 'AUDI', 'RENAULT', 'PEUGEOT', 'Other']\n }\n\n showCollection() {\n const { vehicle } = this.props\n return vehicle && vehicle.kind && vehicle.make && vehicle.model\n }\n\n showRegInput() {\n const { vehicle } = this.props\n return this.showCollection() && !vehicle.registration\n }\n\n runLookup() {\n const vrm = this.lookupInputRef.current.value\n fetch('GET', `/vehicle/lookup?vrm=${vrm}`)\n .then(data => {\n this.props.propagateData(data)\n })\n .catch(errResponse => {\n const data = errResponse[1]\n console.error(data)\n this.setState({\n lookupError: true\n })\n })\n }\n\n inputChanged() {\n this.setState({\n lookupError: false\n })\n }\n\n manualEntry(e) {\n e.preventDefault()\n this.setState({\n manualEntry: true\n })\n }\n\n retryLookup(e) {\n const { propagateData } = this.props\n e.preventDefault()\n this.setState({\n manualEntry: false\n })\n propagateData({ kind: null, make: null, model: null, registration: null })\n }\n\n handlePropagation(name, value) {\n this.setState({ [name]: value }, function () {\n propagateValue.apply(this, [name, value])\n })\n }\n\n renderVehicleLookup() {\n const { lookupError } = this.state\n const { errors, modifiers } = this.props\n const buttonMods = ['primary']\n if (lookupError) buttonMods.push('disabled')\n return (\n \n \n \n \n \n {lookupError ? (\n \n )\n }\n\n renderManualEntrySection() {\n const { vehicle, errors } = this.props\n return (\n {manualEntry ? this.renderManualEntrySection() : this.renderVehicleLookup()} \n }\n\n renderVehicle() {\n const { vehicle, errors, handlePropagation } = this.props\n return (\n \n \n \n )}\n \n )\n }\n\n renderRetryLookupLink() {\n return onChange(ex, 'add')}\n onRemove={ex => onChange(ex, 'remove')}\n onUpdate={ex => onChange(ex, 'update')}\n personLocationId={personLocationId}\n subExpenses={false}\n title={expenseKind.name}\n />\n )\n })\n}\n\nexport default function WorkLocationForm({\n employments,\n errors,\n expenseFrequencies,\n expenseKinds,\n onCancel,\n onChange,\n onSubmit,\n onShowEmploymentForm,\n onShowVehicleForm,\n resource,\n vehicles\n}) {\n const [editableEmployments, setEditableEmployments] = useState(false)\n const [editableVehicles, setEditableVehicles] = useState(false)\n const [receivedReimbursements, setReceivedReimbursements] = useState(resource.received_reimbursements)\n const [reimbursementsQuantity, setReimbursementsQuantity] = useState(\n resource.reimbursements_quantity || INITIAL_REIMBURSEMENTS_QUANTITY\n )\n const lastTrackingEventRef = useRef(null)\n const {\n current,\n person_employment_id,\n address,\n person_vehicle_id,\n public_transport_expenses,\n public_transport_options,\n transport,\n ministry_of_defence,\n expected_time_at_post,\n expected_time_at_post_years,\n expected_time_at_post_months,\n expected_time_at_post_weeks,\n complex_routine,\n quantitative_frequency,\n qualitative_frequency,\n travel_home_frequency,\n travel_home_quantitative_frequency,\n travel_home_qualitative_frequency,\n locked,\n ended_at_locked,\n name,\n started_at,\n ended_at\n } = resource\n const { own_vehicle, company_vehicle, public_transport } = transport\n\n useEffect(() => {\n if (!receivedReimbursements) {\n setReimbursementsQuantity(null)\n handleChange({ reimbursements_quantity: null })\n }\n }, [receivedReimbursements])\n\n // Only track each event type once per interaction\n const trackEventOnce = type => {\n if (lastTrackingEventRef.current === type) {\n return\n }\n\n lastTrackingEventRef.current = type\n trackEvent(`Work location ${type} filled in`)\n }\n\n const durationString = (years, months) => {\n if (!started_at) {\n return null\n }\n\n const yearBit = years ? (years > 1 ? `${years} years` : '1 year') : ''\n const includeAnd = years && months\n let monthBit = ''\n if (months || !years) {\n monthBit = months > 1 || months === 0 ? `${months} months` : '1 month'\n }\n return `You worked here for ${yearBit}${includeAnd ? ' and ' : ''}${monthBit} `\n }\n\n const publicTransportOptions = () => {\n return PUBLIC_TRANSPORT_OPTIONS.map(option => {\n option.checked = public_transport_options[option.value]\n return option\n })\n }\n\n const selectedEmployment = findId => {\n return findBy(employments, 'id', findId || person_employment_id)\n }\n\n const transportOptions = () => {\n return TRANSPORT_OPTIONS.map(option => {\n option.checked = transport[option.value]\n return option\n })\n }\n\n const addressErrors = () => {\n const result = errors['address'] || {}\n\n if (errors['address_id']) {\n result['address_id'] = errors['address_id']\n }\n\n return result\n }\n\n const routineError = () => {\n return (errors['travel_home_frequency'] || errors['complex_routine'] || [])[0] || null\n }\n\n const showExpectationChangeQuestion = locationAttributes => {\n const { started_at, ended_at, expected_time_at_post_years, expected_time_at_post_months, ministry_of_defence } =\n locationAttributes\n\n const rangeDuration = getRangeDuration(parseDate(started_at), parseDate(ended_at, new Date()))\n\n return (\n (ministry_of_defence && rangeDuration.years !== expected_time_at_post_years) ||\n rangeDuration.months !== expected_time_at_post_months\n )\n }\n\n const expectedStayError = () => {\n return (\n (errors['expected_time_at_post'] ||\n (errors['expected_time_at_post_years'] ? [`Years ${errors['expected_time_at_post_years']}`] : null) ||\n (errors['expected_time_at_post_months'] ? [`Months ${errors['expected_time_at_post_months']}`] : null) ||\n (errors['expected_time_at_post_weeks'] ? [`Weeks ${errors['expected_time_at_post_weeks']}`] : null) ||\n [])[0] || null\n )\n }\n\n const attachLocalErrors = (newAttributes, nextLocationData, nextLocationErrors) => {\n const updatedAttributeNames = Object.keys(newAttributes)\n const employmentUpdated = includes(updatedAttributeNames, 'person_employment_id')\n const startedAtUpdated = includes(updatedAttributeNames, 'started_at')\n const endedAtUpdated = includes(updatedAttributeNames, 'ended_at')\n const expectedTimeAtPostChangedAtUpdated = includes(updatedAttributeNames, 'expected_time_at_post_changed_at')\n const { person_employment_id, started_at, ended_at, current, expected_time_at_post_changed_at } = nextLocationData\n\n const employment = selectedEmployment(person_employment_id)\n const startedAt = parseDate(started_at)\n const endedAt = parseDate(ended_at, new Date())\n const expectedTimeAtPostChangedAt = parseDate(expected_time_at_post_changed_at)\n\n if (employment?.option_data) {\n const { label, microcopy } = employment.option_data\n const employmentStartedAt = parseDate(employment.started_at)\n const employmentEndedAt = parseDate(employment.ended_at, new Date())\n\n // Notify user about issues with start date:\n if (startedAt && (employmentUpdated || startedAtUpdated)) {\n if (!inDateRange(startedAt, employmentStartedAt, employmentEndedAt)) {\n nextLocationErrors['started_at'] = [\n `The \"from\" date should be during your ${label} employment (${microcopy}).`\n ]\n } else {\n nextLocationErrors['started_at'] = null\n }\n }\n\n // Notify user about issues with end date:\n if (endedAt && !current && (employmentUpdated || endedAtUpdated)) {\n if (!inDateRange(endedAt, employmentStartedAt, employmentEndedAt)) {\n nextLocationErrors['ended_at'] = [\n `The \"until\" date should be during your ${label} employment (${microcopy}).`\n ]\n } else {\n nextLocationErrors['ended_at'] = null\n }\n }\n }\n\n // Notify user about any issues with the expected time at post changed date:\n if (expectedTimeAtPostChangedAt && expectedTimeAtPostChangedAtUpdated) {\n if (!inDateRange(expectedTimeAtPostChangedAt, startedAt, endedAt)) {\n nextLocationErrors['expected_time_at_post_changed_at'] = [\n `This date should be during your time at this location (${dateRangeString(startedAt, endedAt)}).`\n ]\n } else {\n nextLocationErrors['expected_time_at_post_changed_at'] = null\n }\n }\n\n // Clear any errors on the vehicle if the user de-selects the vehicle as\n // a transport option.\n if (!nextLocationData.transport.own_vehicle) {\n nextLocationErrors['person_vehicle_id'] = null\n }\n\n if (!nextLocationData.transport.public_transport) {\n nextLocationErrors['public_transport_options'] = null\n }\n }\n\n const updateLinkedAttributes = nextLocationData => {\n if (!showExpectationChangeQuestion(nextLocationData)) {\n nextLocationData['expected_time_at_post_changed_at'] = null\n }\n }\n\n const handleChange = newAttributes => {\n const nextLocationData = { ...resource, ...newAttributes }\n const nextLocationErrors = { ...errors }\n Object.keys(newAttributes).forEach(key => (nextLocationErrors[key] = null))\n attachLocalErrors(newAttributes, nextLocationData, nextLocationErrors)\n updateLinkedAttributes(nextLocationData)\n onChange(nextLocationData, nextLocationErrors)\n }\n\n const handlePublicTransportChange = (publicTransportMethod, checked) => {\n trackEventOnce('public transport')\n\n let newExpenses = [...public_transport_expenses]\n const expenseKind = expenseKinds.find(kind => kind.name.toUpperCase() === publicTransportMethod.toUpperCase())\n const expense = public_transport_expenses.find(e => e.expense_kind_id === expenseKind.id)\n\n if (checked && expense) {\n // A persisted expense that has been unchecked will need to reset\n newExpenses = public_transport_expenses.map(e => {\n if (e.id === expense.id) {\n e['_destroy'] = false\n }\n\n return e\n })\n } else {\n if (!!expense?.id) {\n // A persisted expense that has been unchecked will need to be marked for deletion\n newExpenses = public_transport_expenses.map(e => {\n if (e.expense_kind_id === expenseKind.id) {\n e['_destroy'] = true\n }\n\n return e\n })\n } else if (expenseKind) {\n // A non-persisted expense\n newExpenses = public_transport_expenses.filter(e => e.expense_kind_id !== expenseKind.id)\n }\n }\n\n handleChange({\n public_transport_options: {\n ...resource.public_transport_options,\n [publicTransportMethod]: checked\n },\n public_transport_expenses: newExpenses\n })\n }\n\n const handlePublicTransportExpenseChange = (expense, action) => {\n if (!expense) {\n return\n }\n\n let newExpenses = [...public_transport_expenses]\n\n if (action === 'add') {\n newExpenses.push({ ...expense, id: null })\n } else if (action === 'remove') {\n newExpenses = newExpenses.filter(e => e.id !== expense.id)\n } else if (action === 'update') {\n expense.modified = true\n newExpenses = newExpenses.map(e => (e.id === expense.id ? expense : e))\n }\n\n handleChange({ public_transport_expenses: newExpenses })\n }\n\n const handleTransportChange = (transportMethod, checked) => {\n trackEventOnce('transport')\n handleChange({\n transport: {\n ...resource.transport,\n [transportMethod]: checked\n }\n })\n }\n\n const handleAddressChange = address => {\n trackEventOnce('address')\n handleChange({\n address,\n address_id: null\n })\n }\n\n const handleDateChange = (attribute, date, current) => {\n trackEventOnce('dates')\n handleChange({\n [attribute]: date,\n current\n })\n }\n\n const handleExpectedTimeAtPostChange = (years, months, weeks) => {\n trackEventOnce('expected stay')\n handleChange({\n expected_time_at_post: null,\n expected_time_at_post_years: years,\n expected_time_at_post_months: months,\n expected_time_at_post_weeks: weeks\n })\n }\n\n const handleExpectedTimeAtPostChangedAtChange = newAttributes => {\n trackEventOnce('expected stay changed at')\n handleChange(newAttributes)\n }\n\n const handleUnstructuredFrequencyChange = value => {\n trackEventOnce(ministry_of_defence ? 'home visits' : 'routine')\n handleChange({\n travel_home_qualitative_frequency: null,\n travel_home_quantitative_frequency: null,\n qualitative_frequency: null,\n quantitative_frequency: null,\n travel_home_frequency: ministry_of_defence ? value : null,\n complex_routine: ministry_of_defence ? null : value\n })\n }\n\n const handleStructuredFrequencyChange = (quantitativeFrequency, qualitativeFrequency) => {\n trackEventOnce(ministry_of_defence ? 'home visits' : 'routine')\n handleChange({\n travel_home_frequency: null,\n complex_routine: null,\n travel_home_quantitative_frequency: ministry_of_defence ? quantitativeFrequency : null,\n travel_home_qualitative_frequency: ministry_of_defence ? qualitativeFrequency : null,\n quantitative_frequency: ministry_of_defence ? null : quantitativeFrequency,\n qualitative_frequency: ministry_of_defence ? null : qualitativeFrequency\n })\n }\n\n const handleEmploymentChange = (key, id) => {\n trackEventOnce('employment')\n const employmentId = parseInt(id, 10)\n handleChange(defaultStateForEmployment(employmentId, selectedEmployment(employmentId)?.option_data?.isMOD))\n }\n\n const handleVehicleChange = (key, id) => {\n trackEventOnce('vehicle')\n handleChange({ person_vehicle_id: parseInt(id, 10) })\n }\n\n const handleNameChange = (key, name) => {\n trackEventOnce('memorable name')\n handleChange({ name: name })\n }\n\n const handleReceivedReimbursementsChange = value => {\n trackEventOnce('received reimbursements')\n setReceivedReimbursements(value.received_reimbursements)\n handleChange({ received_reimbursements: value.received_reimbursements })\n }\n\n const handleReimbursementsQuantityChange = value => {\n if (value === null || value > 0) {\n setReimbursementsQuantity(value)\n handleChange({ reimbursements_quantity: value })\n }\n }\n\n const rangeDuration = getRangeDuration(parseDate(started_at), parseDate(ended_at, new Date()))\n\n const routineHeading = ministry_of_defence ? 'Home visits' : 'Routine'\n const routineText = ministry_of_defence\n ? 'How often did you make the journey home?'\n : 'How often did you work at this location?'\n const modExpectedStayText = 'How long did you initially expect to stay at this location?'\n const datesText = 'When did you work at this location?'\n const employmentText = 'Who were you working for at this location?'\n const locationText = 'Where were you working?'\n const travelText = 'How did you get to and from this workplace?'\n const unstructuredRoutine = ministry_of_defence ? travel_home_frequency : complex_routine\n const quantitativeFrequency = ministry_of_defence ? travel_home_quantitative_frequency : quantitative_frequency\n const qualitativeFrequency = ministry_of_defence ? travel_home_qualitative_frequency : qualitative_frequency\n\n const deprecatedOptions = ['Every day', 'Other']\n const showDeprecatedOptions =\n includes(deprecatedOptions, travel_home_qualitative_frequency) || includes(deprecatedOptions, qualitative_frequency)\n\n const routineHelper = ministry_of_defence\n ? helperTextData.workplaces.mod.home_visits\n : helperTextData.workplaces.non_mod.routine\n\n return (\n \n \n \n \n \n setEditableEmployments(!editableEmployments)}\n editAction={editableEmployments ? onShowEmploymentForm : false}\n addText=\"Add new employer\"\n addClick={() => onShowEmploymentForm()}\n disabled={locked}\n options={employments.map(emp => emp.option_data).filter(emp => emp)}\n handlePropagation={handleEmploymentChange}\n error={errors['person_employment_id']}\n />\n \n \n \n \n \n \n \n \n \n \n \n You'll be able to find your original posting dates on your assignment order. `}\n />\n \n \n \n {showExpectationChangeQuestion(resource) && (\n \n )}\n \n \n \n \n \n \n \n \n {(own_vehicle || company_vehicle) && (\n \n setEditableVehicles(!editableVehicles)}\n editAction={editableVehicles ? onShowVehicleForm : false}\n addText=\"Add new vehicle\"\n addClick={() => onShowVehicleForm()}\n disabled={locked}\n options={vehicles}\n handlePropagation={handleVehicleChange}\n error={errors['person_vehicle_id']}\n />\n \n )}\n {public_transport && (\n \n \n )}\n \n \n ) : (\n \n \n \n \n Cancel\n \n \n Save workplace\n \n \n \n \n )\n}\n\nWorkLocationForm.propTypes = {\n employments: PropTypes.arrayOf(PropTypes.object),\n errors: PropTypes.object.isRequired,\n expenseFrequencies: PropTypes.arrayOf(PropTypes.object).isRequired,\n expenseKinds: PropTypes.arrayOf(PropTypes.object).isRequired,\n onCancel: PropTypes.func.isRequired,\n onChange: PropTypes.func.isRequired,\n onShowEmploymentForm: PropTypes.func.isRequired,\n onShowVehicleForm: PropTypes.func.isRequired,\n onSubmit: PropTypes.func.isRequired,\n vehicles: PropTypes.arrayOf(PropTypes.object)\n}\n\nWorkLocationForm.defaultProps = {\n errors: {}\n}\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport ButtonGroupItem from './ButtonGroupItem'\nimport DateRangeQuestion from './date/DateRangeQuestion'\nimport FlashMessage from '../display/FlashMessage'\n\nimport { ButtonGroup, ContentFooter, ContentWrapper, ContentWrapperInner } from '../layout/Wrapper'\n\nimport { fetch, omit, redirectTo, highlightFirstError } from '../../modules/utils'\n\nclass WorkLocationGapForm extends React.Component {\n constructor(props) {\n super(props)\n let flash = false\n if (props.locked) {\n flash = props.endedAtLocked\n ? 'You cannot update this work location gap'\n : \"You can only update the 'Until date' on this work location gap\"\n flash =\n flash +\n ' because it has been used in one of your previous claim submissions. Please contact us if you need anything else corrected.'\n }\n this.state = {\n errors: {},\n disabled: props.endedAtLocked,\n flash: flash,\n flashType: 'info'\n }\n this.handlePropagation = this.handlePropagation.bind(this)\n this.handleSubmit = this.handleSubmit.bind(this)\n }\n\n static getDerivedStateFromProps(props, state) {\n const { resource } = props\n const { unchangedLocationGap } = state\n\n if (resource && resource != unchangedLocationGap) {\n const addedValues = {\n current: !Boolean(resource.ended_at)\n }\n return {\n locationGap: Object.assign(resource, addedValues),\n unchangedLocationGap: resource,\n action: resource.id ? 'edit' : 'new'\n }\n }\n return null\n }\n\n handlePropagation(name, value, current) {\n const { locationGap, errors } = this.state\n let locationGapUpdate = { [name]: value }\n\n if (current !== undefined) {\n locationGapUpdate['current'] = current\n }\n\n this.setState({\n disabled: false,\n errors: omit(errors, name),\n locationGap: Object.assign(locationGap, locationGapUpdate)\n })\n }\n\n handleSubmit(e) {\n e.preventDefault()\n this.setState({ disabled: true })\n const { action, locationGap } = this.state\n const { referrer, onAfterSubmit, authenticityToken } = this.props\n\n let method = 'POST'\n let path = '/work_location_gaps'\n const formData = {\n work_location_gap: locationGap,\n utf8: '✓',\n authenticity_token: authenticityToken\n }\n if (action == 'edit') {\n path = path + '/' + locationGap.id\n method = 'PATCH'\n }\n\n fetch(method, path, 'application/json', 'application/json', formData)\n .then(data => {\n if (referrer) {\n redirectTo(referrer)\n } else {\n onAfterSubmit ? onAfterSubmit(data) : this.setState({ locationGap: null })\n }\n })\n .catch(errResponse => {\n const data = errResponse[1]\n console.error(JSON.stringify(data.errors))\n this.setState(data, function () {\n highlightFirstError()\n })\n })\n }\n\n dates() {\n const { resourceName, locked, endedAtLocked } = this.props\n const { locationGap, errors } = this.state\n return (\n \n \n {flash && \n \n \n \n Cancel\n \n \n Save\n \n \n \n \n )\n }\n}\nWorkLocationGapForm.propTypes = {\n resourceName: PropTypes.string,\n resource: PropTypes.object.isRequired,\n authenticityToken: PropTypes.string.isRequired,\n referrer: PropTypes.string,\n locked: PropTypes.bool,\n endedAtLocked: PropTypes.bool\n}\nWorkLocationGapForm.defaultProps = {\n resourceName: 'work_location_gap',\n locked: false,\n endedAtLocked: false\n}\nexport default WorkLocationGapForm\n","import React, { Fragment, useState, useEffect } from 'react'\nimport PropTypes from 'prop-types'\n\nimport ExpenseInput from './ExpenseInput'\nimport Question from './Question'\nimport CheckBoxGroupInput from './CheckBoxGroupInput'\nimport ButtonGroupItem from './ButtonGroupItem'\n\nimport { flatten, includes, pluck, toggleInclusion, snakeCase } from '../../modules/utils'\nimport { updatePageTitle } from '../../modules/legacyUtils'\nimport {\n foodChargeEligibleExpenses,\n locationIdsWithFoodChargeExpenses,\n frequenciesForExpenseKind,\n uniqueExpenseKindNames,\n expenseGroupsForExpenseKindName,\n locationsForExpenseGroup,\n expenseKindNamesWithExpenses,\n expenseKindForExpenseGroupAndKindName,\n expensesForKindAndLocation\n} from '../../modules/expense'\nimport { ButtonGroup, ContentFooter, ContentWrapper, ContentWrapperInner, FormGroup } from '../layout/Wrapper'\nimport Helper from '../display/Helper'\nimport HelperTrigger from '../display/HelperTrigger'\n\nimport helperTextData from '../../data/helperTextData.json'\n\nfunction ExpenseKindWorkplaceExpenseInputs({\n dailyFoodChargeLocationIds,\n locations,\n expenseGroups,\n expenseKindName,\n expenses,\n expenseKinds,\n expenseFrequencies,\n onAdd,\n onUpdate,\n onRemove\n}) {\n return (\n \n {expenseGroups.map((expenseGroup, expenseGroupIndex) => {\n const expenseGroupLocations = locations[expenseGroupIndex]\n const visible = !!expenseGroupLocations.length\n const expenseKind = expenseKindForExpenseGroupAndKindName(expenseKinds, expenseGroup, expenseKindName)\n const helperText = helperTextData.expenses[snakeCase(expenseGroup.code)]?.workplace[snakeCase(expenseKindName)]\n\n return (\n visible && (\n \n {helperText && {expenseGroup.heading} \n {expenseGroupLocations.map((location, locationIndex) => {\n const locationExpenses = expensesForKindAndLocation(expenses, expenseKind, location)\n const frequencies = frequenciesForExpenseKind(expenseKind, expenseFrequencies)\n const previousExpanded = !!(\n locationIndex &&\n expensesForKindAndLocation(expenses, expenseKind, expenseGroupLocations[locationIndex - 1]).length > 1\n )\n\n // Daily food charges can only be applied to MOD meals:\n const dailyFoodCharge =\n includes(dailyFoodChargeLocationIds, location.id) &&\n expenseKind.name === 'Meals' &&\n expenseGroup.code === 'MOD'\n\n return (\n \n )\n )\n })}\n \n )\n}\n\nexport default function WorkplaceExpenseForm({\n employments,\n expenses,\n locations,\n expenseKinds,\n expenseGroups,\n expenseFrequencies,\n onAdd,\n onUpdate,\n onRemove,\n onSubmit,\n onCancel,\n onToggleKind\n}) {\n updatePageTitle('Workplace expenses')\n\n const [visibleKindNames, setVisibleKindNames] = useState([])\n const [dailyFoodChargeLocationIds, setDailyFoodChargeLocationIds] = useState([])\n\n const allExpenseKindNames = uniqueExpenseKindNames(expenseKinds)\n const renderableData = []\n allExpenseKindNames.forEach(expenseKindName => {\n const renderableExpenseGroups = expenseGroupsForExpenseKindName(expenseKinds, expenseGroups, expenseKindName)\n\n const renderableLocations = renderableExpenseGroups.map(expenseGroup =>\n locationsForExpenseGroup(locations, employments, expenseGroup)\n )\n\n const visible = includes(visibleKindNames, expenseKindName)\n const hasLocations = !!renderableLocations.find(cl => cl.length)\n\n if (hasLocations) {\n renderableData.push({\n expenseKindName,\n visible,\n renderableExpenseGroups,\n renderableLocations: hasLocations ? renderableLocations : null\n })\n }\n })\n\n const expenseKindOptions = renderableData.map(({ expenseKindName }) => ({\n label: expenseKindName,\n value: expenseKindName,\n checked: includes(visibleKindNames, expenseKindName)\n }))\n\n const dailyFoodChargeOptions = flatten(pluck(locations, 'data'))\n .filter(l => l.ministry_of_defence)\n .map(l => ({\n label: l.display_data.heading,\n value: l.id.toString(),\n checked: includes(dailyFoodChargeLocationIds, l.id)\n }))\n\n const toggleVisibleKindName = kindName => {\n setVisibleKindNames(toggleInclusion(visibleKindNames, kindName))\n }\n\n const modExpenseGroupId = expenseGroups.find(eg => eg.code === 'MOD')?.id\n const modMealsExpenseKindId = expenseKinds.find(\n k => k.expense_group_id === modExpenseGroupId && k.name === 'Meals'\n )?.id\n const handleDailyFoodChargeToggle = (locationId, adding) => {\n locationId = parseInt(locationId, 10)\n\n const expensesToUpdate = foodChargeEligibleExpenses(expenses, modMealsExpenseKindId, locationId)\n\n const updatedExpenses = expensesToUpdate.map(e => Object.assign({}, e, { daily_food_charge: adding }))\n\n onUpdate(updatedExpenses)\n setDailyFoodChargeLocationIds(toggleInclusion(dailyFoodChargeLocationIds, locationId))\n }\n\n useEffect(() => {\n onToggleKind()\n }, [visibleKindNames])\n\n useEffect(() => {\n const nextVisibleExpenseKindNames = expenseKindNamesWithExpenses(expenses, expenseKinds)\n if (nextVisibleExpenseKindNames.length) {\n setVisibleKindNames(nextVisibleExpenseKindNames)\n }\n }, [expenses, expenseKinds])\n\n useEffect(() => {\n if (!dailyFoodChargeLocationIds.length) {\n setDailyFoodChargeLocationIds(locationIdsWithFoodChargeExpenses(expenses))\n }\n }, [expenses])\n\n const visibleRenderableData = renderableData.filter(d => d.visible)\n\n return (\n \n \n \n \n \n \n )\n })}\n {!!dailyFoodChargeOptions.length && (\n \n \n \n \n )}\n \n \n \n \n Cancel\n \n \n Save expenses\n \n \n \n \n )\n}\n\nWorkplaceExpenseForm.propTypes = {\n expenses: PropTypes.arrayOf(PropTypes.object).isRequired,\n locations: PropTypes.arrayOf(PropTypes.object).isRequired,\n employments: PropTypes.arrayOf(PropTypes.object).isRequired,\n expenseKinds: PropTypes.arrayOf(PropTypes.object).isRequired,\n expenseGroups: PropTypes.arrayOf(PropTypes.object).isRequired,\n expenseFrequencies: PropTypes.arrayOf(PropTypes.object).isRequired,\n onAdd: PropTypes.func.isRequired,\n onUpdate: PropTypes.func.isRequired,\n onRemove: PropTypes.func.isRequired,\n onSubmit: PropTypes.func.isRequired,\n onCancel: PropTypes.func.isRequired,\n onToggleKind: PropTypes.func\n}\n\nWorkplaceExpenseForm.defaultProps = {\n onToggleKind: () => {}\n}\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport RadioOption from './RadioOption'\nimport Question from './Question'\nimport FormGroupHeader from './FormGroupHeader'\nimport Helper from '../display/Helper'\nimport HelperTrigger from '../display/HelperTrigger'\n\nimport { FormGroup } from '../layout/Wrapper'\n\nimport { propagateValue, helperId } from '../../modules/utils'\n\nclass YesNoQuestion extends React.Component {\n constructor(props) {\n super(props)\n this.state = { value: this.valueOnLoad() }\n this.handleChange = this.handleChange.bind(this)\n }\n\n valueOnLoad() {\n const { resource, name, checked, allowNil, includeDontKnow } = this.props\n if (checked) return true\n if (allowNil || includeDontKnow) return resource[name]\n const nameValue = resource[name] || 'false'\n return nameValue == 'true'\n }\n\n handleChange(inputValue) {\n const { name } = this.props\n const value = inputValue ? inputValue === 'true' : null\n this.setState({ value }, propagateValue.apply(this, [name, value]))\n }\n\n renderHeading() {\n const { questionHeading, questionText, helperText, label } = this.props\n\n const helper = helperText && (\n \n {helper}\n \n )\n } else if (label) {\n return {helper} \n }\n }\n\n render() {\n const { className, modifiers, attributes, name, resourceName, disabled, helperText, includeDontKnow } = this.props\n const { value } = this.state\n const baseParams = {\n onChange: this.handleChange,\n name,\n resourceName,\n disabled\n }\n\n return (\n \n {helperText && \n \n \n \n \n {includeDontKnow && (\n \n \n )}\n \n \n )\n }\n}\n\nYesNoQuestion.propTypes = {\n className: PropTypes.string,\n modifiers: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),\n attributes: PropTypes.object,\n checked: PropTypes.bool,\n allowNil: PropTypes.bool,\n helperText: PropTypes.string,\n handlePropagation: PropTypes.func,\n label: PropTypes.string,\n questionHeading: PropTypes.string,\n questionText: PropTypes.string,\n name: PropTypes.string,\n resource: PropTypes.object,\n resourceName: PropTypes.string,\n includeDontKnow: PropTypes.bool,\n disabled: PropTypes.bool\n}\n\nYesNoQuestion.defaultProps = {\n disabled: false,\n includeDontKnow: false\n}\n\nexport default YesNoQuestion\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport Collection from '../Collection'\nimport FormLink from '../FormLink'\n\nimport { mapSrc } from '../../../modules/utils'\n\nclass AddressLookupAddressDisplay extends React.Component {\n render() {\n const { address, onTryLookupClick, tryLookupLabelText } = this.props\n\n const collectionText = [address.town, address.county].filter(Boolean).join(', ')\n\n const media = {\n src: mapSrc(`${address.first_line},${address.postcode}`, 324, 180),\n id: `address-${address.id || address.postcode}`\n }\n\n return (\n \n \n )\n }\n}\n\nAddressLookupAddressDisplay.defaultProps = {\n tryLookupLabelText: \"This isn't the correct location\"\n}\n\nAddressLookupAddressDisplay.propTypes = {\n address: PropTypes.object.isRequired,\n tryLookupLabelText: PropTypes.string,\n onTryLookupClick: PropTypes.func.isRequired\n}\n\nexport default AddressLookupAddressDisplay\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport { FormGroup } from '../../layout/Wrapper'\n\nimport Select from '../Select'\n\nclass AddressLookupAddressSelect extends React.Component {\n selectOptions() {\n const { deliveryPoints } = this.props\n\n return [['default', 'Select an address', true]].concat(\n deliveryPoints\n .map((option, index) => [\n index,\n [option.organisation_name, option.line_1, option.line_2, option.department_name].filter(Boolean).join(', ')\n ])\n .sort((a, b) => a[1].toUpperCase().localeCompare(b[1].toUpperCase()))\n )\n }\n\n render() {\n const { className, modifiers, onChange } = this.props\n\n return (\n \n \n
\n \n )\n }\n}\n\nAddressLookupAddressSelect.propTypes = {\n className: PropTypes.string,\n modifiers: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),\n onChange: PropTypes.func.isRequired,\n deliveryPoints: PropTypes.array.isRequired\n}\n\nexport default AddressLookupAddressSelect\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport FormLink from '../FormLink'\nimport FormGroupHeader from '../FormGroupHeader'\nimport ErrorSpan from '../ErrorSpan'\nimport AnchorButton from '../AnchorButton'\nimport Helper from '../../display/Helper'\n\nimport AddressLookupAddressSelect from './AddressLookupAddressSelect'\n\nimport { FormGroup, FormGroupCombo, FormGroupComboItem } from '../../layout/Wrapper'\n\nconst ENTER_KEY = 13\n\nclass AddressLookupAutomatedLookupFields extends React.Component {\n constructor(props) {\n super(props)\n\n this.lookupNumberRef = React.createRef()\n this.lookupPostcodeRef = React.createRef()\n\n this.lookupInputKeyDown = this.lookupInputKeyDown.bind(this)\n this.handleLookupClick = this.handleLookupClick.bind(this)\n }\n\n lookupInputKeyDown(e) {\n if (e.keyCode === ENTER_KEY) {\n this.handleLookupClick(e)\n }\n }\n\n buttonModifiers() {\n const { lookupError } = this.props\n return lookupError ? ['primary', 'disabled'] : ['primary']\n }\n\n handleLookupClick(e) {\n e.preventDefault()\n\n const { onLookup } = this.props\n\n const postcode = this.lookupPostcodeRef.current.value\n const houseNumber = this.lookupNumberRef.current.value\n\n onLookup(postcode, houseNumber)\n }\n\n render() {\n const { deliveryPoints, lookupError, errors, disabled, onAddressSelect, onInputChange, onTryManualEntryClick } =\n this.props\n\n const showAddressSelect = deliveryPoints && deliveryPoints.length > 1\n const showPostcodeError = errors && errors.postcode\n\n return (\n \n \n \n \n \n \n \n\n {showAddressSelect && (\n \n )\n }\n}\n\nAddressLookupAutomatedLookupFields.propTypes = {\n deliveryPoints: PropTypes.array,\n lookupError: PropTypes.bool.isRequired,\n errors: PropTypes.object,\n disabled: PropTypes.bool.isRequired,\n onAddressSelect: PropTypes.func.isRequired,\n onInputChange: PropTypes.func.isRequired,\n onLookup: PropTypes.func.isRequired,\n onTryManualEntryClick: PropTypes.func.isRequired\n}\n\nexport default AddressLookupAutomatedLookupFields\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport TextQuestion from '../TextQuestion'\nimport FormLink from '../FormLink'\n\nclass AddressLookupManualEntryFields extends React.Component {\n constructor(props) {\n super(props)\n\n this.handleChange = this.handleChange.bind(this)\n }\n\n handleChange(name, value) {\n const { onChange } = this.props\n\n onChange({\n [name]: value\n })\n }\n\n render() {\n const { address, errors, disabled, onTryLookupClick } = this.props\n\n const defaultProps = {\n className: 'mt-3',\n resourceName: 'api_person_address',\n resource: address,\n handlePropagation: this.handleChange,\n disabled: disabled\n }\n\n return (\n \n \n )\n }\n}\n\nAddressLookupManualEntryFields.propTypes = {\n address: PropTypes.object.isRequired,\n disabled: PropTypes.bool,\n errors: PropTypes.object,\n onChange: PropTypes.func.isRequired,\n onTryLookupClick: PropTypes.func.isRequired\n}\n\nexport default AddressLookupManualEntryFields\n","import { fetch } from './utils'\n\nfunction processResults(lookupResults, houseNumber) {\n const knownData = {\n town: lookupResults.town,\n county: lookupResults.traditional_county || lookupResults.postal_county,\n postcode: lookupResults.postcode\n }\n\n const deliveryPoints = lookupResults.delivery_points\n\n if (lookupResults.delivery_point_count !== 1 && houseNumber) {\n for (let i = 0; i < deliveryPoints.length; i++) {\n const deliveryPoint = deliveryPoints[i]\n const firstLine = deliveryPoint.line_1.toLocaleLowerCase()\n const matcher = houseNumber.toLocaleLowerCase()\n\n if (firstLine.startsWith(matcher)) {\n return [knownData, [deliveryPoint]]\n }\n }\n }\n\n return [knownData, deliveryPoints]\n}\n\nexport function buildFirstAndSecondLines(deliveryPoint) {\n const firstLine = [deliveryPoint.organisation_name, deliveryPoint.line_1, deliveryPoint.department_name]\n .filter(Boolean)\n .join(', ')\n\n return {\n first_line: firstLine,\n second_line: deliveryPoint.line_2\n }\n}\n\nexport function postcodeLookup(postcode, houseNumber) {\n return new Promise((success, failure) => {\n return fetch(\n 'POST',\n 'https://pcls1.craftyclicks.co.uk/json/rapidaddress',\n 'application/json',\n 'application/json',\n {\n key: window.crafty_postcode_api_key,\n postcode: postcode,\n response: 'data_formatted'\n },\n true\n ).then(data => {\n if (data.error_code) {\n return failure(data.error_msg)\n } else {\n return success(processResults(data, houseNumber))\n }\n })\n })\n}\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport Question from '../Question'\n\nimport AddressLookupAddressDisplay from './AddressLookupAddressDisplay'\nimport AddressLookupAutomatedLookupFields from './AddressLookupAutomatedLookupFields'\nimport AddressLookupManualEntryFields from './AddressLookupManualEntryFields'\n\nimport { FormGroup } from '../../layout/Wrapper'\n\nimport { buildFirstAndSecondLines, postcodeLookup } from '../../../modules/addressLookup'\n\nclass AddressLookupWithManualFallback extends React.Component {\n constructor(props) {\n super(props)\n\n this.state = {\n loading: false,\n manualEntry: false,\n lookupError: false\n }\n\n this.lookupNumberRef = React.createRef()\n this.lookupPostcodeRef = React.createRef()\n\n this.handleAddressSelect = this.handleAddressSelect.bind(this)\n this.handleLookup = this.handleLookup.bind(this)\n this.handleLookupSuccess = this.handleLookupSuccess.bind(this)\n this.handleLookupError = this.handleLookupError.bind(this)\n this.showManualEntry = this.showManualEntry.bind(this)\n this.showLookupEntry = this.showLookupEntry.bind(this)\n this.clearLookupError = this.clearLookupError.bind(this)\n }\n\n handleAddressSelect({ target }) {\n const { deliveryPoints } = this.state\n const { onChange } = this.props\n\n onChange(buildFirstAndSecondLines(deliveryPoints[target.value]))\n }\n\n handleLookup(postcode, houseNumber) {\n if (this.state.loading) return\n\n const { onChange } = this.props\n\n if (!postcode) {\n return onChange(undefined, {\n postcode: 'We need postcode to find your address.'\n })\n }\n\n this.setState({\n loading: true,\n deliveryPoints: null\n })\n\n return postcodeLookup(postcode, houseNumber).then(this.handleLookupSuccess).catch(this.handleLookupError)\n }\n\n handleLookupSuccess([streetData, deliveryPoints]) {\n const { onChange } = this.props\n\n // If we have a definitive result, build the full address\n // object and pass it up for setting in state:\n if (deliveryPoints.length === 1) {\n this.setState({\n loading: false\n })\n\n onChange({\n ...streetData,\n ...buildFirstAndSecondLines(deliveryPoints[0])\n })\n\n // If we don't have a definitive results, show the available\n // delivery points and pass up the street data we're certain\n // about for setting in state:\n } else {\n this.setState({\n loading: false,\n deliveryPoints\n })\n\n onChange(streetData)\n }\n }\n\n handleLookupError(err) {\n console.error(err)\n\n this.setState({\n loading: false,\n lookupError: true\n })\n }\n\n showManualEntry(e) {\n e.preventDefault()\n\n this.setState({\n manualEntry: true,\n deliveryPoints: null\n })\n\n this.resetData()\n }\n\n showLookupEntry(e) {\n e.preventDefault()\n\n this.setState({\n manualEntry: false,\n deliveryPoints: null\n })\n\n this.resetData()\n }\n\n clearLookupError(e) {\n e.preventDefault()\n\n this.setState({\n lookupError: false\n })\n }\n\n resetData(data = {}) {\n const { onChange } = this.props\n\n onChange({\n first_line: null,\n second_line: null,\n town: null,\n county: null,\n postcode: null,\n ...data\n })\n }\n\n render() {\n const { deliveryPoints, loading, lookupError, manualEntry } = this.state\n const { address, disabled, errors, onChange, questionText, tryLookupLabelText } = this.props\n\n const showAddress = !manualEntry && address && address.first_line && address.postcode\n const showLookup = !showAddress && !manualEntry\n const showManualEntry = !showAddress && manualEntry\n\n return (\n \n \n )\n }\n}\n\nAddressLookupWithManualFallback.defaultProps = {\n questionText: 'What was the address of the property?'\n}\n\nAddressLookupWithManualFallback.propTypes = {\n errors: PropTypes.object,\n onChange: PropTypes.func,\n address: PropTypes.object,\n locked: PropTypes.bool,\n tryLookupLabelText: PropTypes.string,\n questionText: PropTypes.string\n}\n\nexport default AddressLookupWithManualFallback\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport Picker from '../Picker'\n\nimport { buildDate, datePickerDateOptions } from '../../../modules/dates'\n\nclass DatePicker extends React.Component {\n constructor(props) {\n super(props)\n this.state = this.stateFromProps()\n\n this.handleChange = this.handleChange.bind(this)\n this.handleComplete = this.handleComplete.bind(this)\n }\n\n componentDidUpdate(prevProps, prevState) {\n const dateValue = this.getDateValue()\n const { year } = prevState\n const valueNeedsClearing = (!dateValue && year) || prevProps.name !== this.props.name\n\n if (valueNeedsClearing) {\n this.setState(this.stateFromProps())\n }\n }\n\n getDateValue() {\n const { resource, name, defaultDate } = this.props\n let date = defaultDate\n\n if (resource && resource[name]) {\n date = resource[name]\n }\n\n if (typeof date !== 'string') {\n return date\n }\n\n if (date.indexOf('-') >= 0) {\n return new Date(date)\n }\n\n // Sometimes we'll receive a date as a string we can't just pass to the Date constructor:\n const parts = date.split(' ').reverse()\n const year = parts[0]\n const month = parseInt(parts[1], 10) - 1 // Months are counted from 0\n const day = parts[2]\n return new Date(year, month, day, 0, 0, 0, 0)\n }\n\n stateFromProps() {\n const { includeDay } = this.props\n const dateValue = this.getDateValue()\n\n const state = {\n day: null,\n month: 0,\n year: null\n }\n\n if (dateValue) {\n if (includeDay) {\n state.day = dateValue.getDate()\n }\n state.month = dateValue.getMonth()\n state.year = dateValue.getFullYear()\n }\n\n return state\n }\n\n clearValues() {\n this.setState({ day: null, month: null, year: null })\n }\n\n handleChange(partialState) {\n const { day, month, year } = this.state\n const nextDateState = Object.assign({ day, month, year }, partialState)\n this.setState(partialState, () => {\n const { day, month, year } = nextDateState\n const { defaultDay, name, onChange } = this.props\n onChange({ [name]: buildDate(day, month, year, defaultDay) })\n })\n }\n\n handleComplete() {\n const { onComplete } = this.props\n this.setState(this.stateFromProps(), onComplete)\n }\n\n render() {\n const { day, month, year } = this.state\n const { minDate, minYear, maxYear, name, includeDay, showNav } = this.props\n\n return (\n \n {helperText && \n {helperText && (\n \n )}\n \n )\n}\n\nDateQuestion.propTypes = {\n questionHeading: PropTypes.string,\n questionHeadingSmall: PropTypes.bool,\n questionText: PropTypes.string,\n resource: PropTypes.object,\n resourceName: PropTypes.string,\n name: PropTypes.string,\n error: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),\n includeDay: PropTypes.bool,\n minDate: PropTypes.instanceOf(Date),\n minYear: PropTypes.number,\n maxYear: PropTypes.number,\n helperText: PropTypes.string,\n onChange: PropTypes.func,\n disabled: PropTypes.bool\n}\n\nDateQuestion.defaultProps = {\n questionHeading: 'Date',\n name: 'started_at',\n minYear: new Date().getFullYear() - 44,\n maxYear: new Date().getFullYear(),\n disabled: false\n}\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport Question from '../Question'\nimport DateRangeInput from '../DateRangeInput'\nimport Helper from '../../display/Helper'\nimport HelperTrigger from '../../display/HelperTrigger'\n\nimport { FormGroup } from '../../layout/Wrapper'\n\nclass DateRangeQuestion extends React.Component {\n constructor(props) {\n super(props)\n this.state = {\n currentChecked: this.props.currentChecked,\n fromError: this.props.fromError,\n toError: this.props.toError\n }\n this.toDatePickerRef = React.createRef()\n this.fromDatePickerRef = React.createRef()\n }\n\n static getDerivedStateFromProps(props, state) {\n let updatedErrors = {}\n if (props.fromError != state.prevFromError) {\n updatedErrors.fromError = props.fromError\n updatedErrors.prevFromError = props.fromError\n }\n if (props.toError != state.prevToError) {\n updatedErrors.toError = props.toError\n updatedErrors.prevToError = props.toError\n }\n return Object.keys(updatedErrors).length != 0 ? updatedErrors : null\n }\n\n helperId() {\n const { resourceName, fromName, toName } = this.props\n return `helper-${resourceName}-${fromName}-${toName}`\n }\n\n render() {\n const { fromError, toError } = this.state\n const {\n resource,\n resourceName,\n includeDay,\n fromMinYear,\n fromMaxYear,\n toMinYear,\n toMaxYear,\n handlePropagation,\n currentChecked,\n currentText,\n fromDisabled,\n toDisabled,\n questionHeading,\n questionText,\n helperText\n } = this.props\n\n return (\n \n {helperText && \n {helperText && (\n \n )}\n \n )\n }\n}\nDateRangeQuestion.propTypes = {\n defaultDate: PropTypes.instanceOf(Date),\n questionHeading: PropTypes.string,\n questionText: PropTypes.string,\n resource: PropTypes.object,\n resourceName: PropTypes.string,\n fromName: PropTypes.string,\n toName: PropTypes.string,\n fromError: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),\n toError: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),\n includeDay: PropTypes.bool,\n fromMinYear: PropTypes.number,\n fromMaxYear: PropTypes.number,\n toMinYear: PropTypes.number,\n toMaxYear: PropTypes.number,\n helperText: PropTypes.string,\n handlePropagation: PropTypes.func,\n currentName: PropTypes.string,\n currentChecked: PropTypes.bool,\n currentText: PropTypes.string,\n fromDisabled: PropTypes.bool,\n toDisabled: PropTypes.bool\n}\n\nDateRangeQuestion.defaultProps = {\n questionHeading: 'Dates',\n fromName: 'started_at',\n toName: 'ended_at',\n currentName: 'current',\n fromMinYear: new Date().getFullYear() - 44,\n fromMaxYear: new Date().getFullYear(),\n toMinYear: new Date().getFullYear() - 44,\n toMaxYear: new Date().getFullYear(),\n fromDisabled: false,\n toDisabled: false\n}\n\nexport default DateRangeQuestion\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport FloatingPicker from '../FloatingPicker'\n\nimport { pick, propagateValue } from '../../../modules/utils'\nimport { buildDate, datePickerDateOptions, dateInputValue } from '../../../modules/dates'\n\nclass FloatingDatePicker extends React.Component {\n constructor(props) {\n super(props)\n this.state = this.stateFromProps()\n this.pickerRef = React.createRef()\n\n this.handlePropagation = this.handlePropagation.bind(this)\n }\n\n componentDidUpdate(prevProps, prevState) {\n const dateValue = this.getDateValue()\n const { year } = prevState\n const valueNeedsClearing = !dateValue && year\n\n if (valueNeedsClearing) {\n this.setState(this.stateFromProps())\n }\n }\n\n getDateValue() {\n const { resource, name, defaultDate } = this.props\n let date = defaultDate\n\n if (resource && resource[name]) {\n date = resource[name]\n }\n\n if (typeof date !== 'string') {\n return date\n }\n\n if (date.indexOf('-') >= 0) {\n return new Date(date)\n }\n\n // Sometimes we'll receive a date as a string we can't just pass to the Date constructor:\n const parts = date.split(' ').reverse()\n const year = parts[0]\n const month = parseInt(parts[1], 10) - 1 // Months are counted from 0\n const day = parts[2]\n return new Date(year, month, day, 0, 0, 0, 0)\n }\n\n stateFromProps() {\n const { includeDay } = this.props\n const dateValue = this.getDateValue()\n\n const state = {\n day: null,\n month: 0,\n year: null\n }\n\n if (dateValue) {\n if (includeDay) {\n state.day = dateValue.getDate()\n }\n state.month = dateValue.getMonth()\n state.year = dateValue.getFullYear()\n }\n\n return state\n }\n\n clearValues() {\n this.setState({ day: null, month: null, year: null })\n }\n\n propagateDate() {\n const { day, month, year } = this.state\n const { defaultDay, name } = this.props\n const currentDate = buildDate(day, month, year, defaultDay)\n if (currentDate) {\n const pickerInput = this.pickerRef.current.inputRef.current\n window.myRIFT.helpers.triggerElementChange(pickerInput)\n }\n\n propagateValue.apply(this, [name, currentDate])\n }\n\n handlePropagation(partialState) {\n this.setState(partialState, this.propagateDate)\n }\n\n render() {\n const { day, month, year } = this.state\n const { minDate, minYear, maxYear, includeDay } = this.props\n\n return (\n \n \n )\n }\n\n render() {\n const { options, error } = this.props\n\n if (options.length) {\n return (\n \n \n )\n } else {\n return (\n \n \n )\n }\n }\n}\nSelection.propTypes = {\n options: PropTypes.array,\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n error: PropTypes.oneOfType([PropTypes.string, PropTypes.array, PropTypes.bool]),\n resourceName: PropTypes.string,\n editAction: PropTypes.oneOfType([PropTypes.func, PropTypes.bool]),\n editText: PropTypes.string,\n editClick: PropTypes.func,\n addText: PropTypes.string,\n addClick: PropTypes.func,\n disabled: PropTypes.bool\n}\nexport default Selection\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport EmojiImage from '../../images/EmojiImage'\nimport OptionsItemButton from '../OptionsItemButton'\nimport OptionsItemLabel from '../OptionsItemLabel'\nimport OptionsItemText from '../OptionsItemText'\n\nimport { inputName, inputId, pick } from '../../../modules/utils'\n\nclass OptionsItem extends React.Component {\n constructor(props) {\n super(props)\n this.handleLabelClick = this.handleLabelClick.bind(this)\n this.handleEditClick = this.handleEditClick.bind(this)\n }\n\n input() {\n return (\n Edit \n }\n return (\n \n {!editAction && this.input()}\n {this.label()}
\n }\n}\nOptionsItem.propTypes = {\n value: PropTypes.string,\n name: PropTypes.string,\n resourceName: PropTypes.string,\n onChange: PropTypes.func,\n label: PropTypes.string,\n microcopy: PropTypes.string,\n checked: PropTypes.bool,\n editAction: PropTypes.oneOfType([PropTypes.func, PropTypes.bool]),\n locked: PropTypes.bool,\n disabled: PropTypes.bool\n}\n\nOptionsItem.defaultProps = {\n disabled: false\n}\nexport default OptionsItem\n","import React from 'react'\n\nimport { usePolledLocation } from '../../../modules/hooks'\nimport { pageConfigForPathname } from '../../../modules/pages'\n\nimport MastheadTimelineStages from './MastheadTimelineStages'\nimport MastheadNavList from './MastheadNavList'\n\nconst NAV_LINKS = [\n { label: 'Workplaces', href: '/my_rift/work_locations', active: false },\n { label: 'Expenses', href: '/my_rift/expenses', active: false },\n { label: 'Documents', href: '/documents', active: false }\n]\n\nexport default function MastheadNav() {\n const { pathname } = usePolledLocation()\n const pageConfig = pageConfigForPathname(pathname)\n\n const links = NAV_LINKS.map(link => {\n if (location.pathname === link.href) {\n link.active = true\n }\n return link\n })\n\n return (\n \n {pageConfig && pageConfig.timelineStage ? (\n \n )\n}\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nexport default function MastheadNavList({ links }) {\n return (\n \n )\n}\n\nMastheadNavList.propTypes = {\n links: PropTypes.arrayOf(\n PropTypes.shape({\n href: PropTypes.string.isRequired,\n label: PropTypes.string.isRequired,\n active: PropTypes.bool\n })\n ).isRequired\n}\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport { TIMELINE_PAGE_CONFIGS } from '../../../modules/pages'\n\nconst stageClasses = (index, activeIndex) => {\n const result = ['timeline-stages__stage']\n\n if (index === activeIndex) {\n result.push('timeline-stages__stage--active')\n } else if (index < activeIndex) {\n result.push('timeline-stages__stage--complete')\n }\n\n return result.join(' ')\n}\n\nexport default function MastheadTimelineStages({ activeStage }) {\n const activeIndex = Object.keys(TIMELINE_PAGE_CONFIGS).indexOf(activeStage)\n\n return (\n \n {Object.keys(TIMELINE_PAGE_CONFIGS).map((pageName, index) => {\n const { href, label, timelineStage } = TIMELINE_PAGE_CONFIGS[pageName]\n if (!timelineStage) {\n return null\n }\n\n return (\n \n {label} \n \n )\n })}\n \n )\n}\n\nMastheadTimelineStages.propTypes = {\n activeStage: PropTypes.oneOf(Object.keys(TIMELINE_PAGE_CONFIGS)).isRequired\n}\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport dayjs from 'dayjs'\nimport utc from 'dayjs/plugin/utc'\ndayjs.extend(utc)\n\nimport ScheduledCallbackBody from './ScheduledCallbackBody'\nimport { Emoji } from '../../layout/Wrapper'\nimport EmojiImage from '../../images/EmojiImage'\nimport { fetch, getOrdinalIndicator } from '../../../modules/utils'\nimport { trackEvent } from '../../../modules/tracking'\n\nconst steps = {\n intro: 0,\n form: 1,\n confirmation: 2\n}\n\nconst initialState = {\n currentStep: steps.intro,\n callbackPreference: 'Today',\n otherDaySelectedValue: '',\n timeSelectedValue: '',\n nextOpenDayString: '',\n nextOpenTimeString: '',\n callbackTimeOptions: [],\n otherDayOptions: [],\n callbackScheduled: false,\n selectedDayIndex: 0,\n submissionErrorText: ''\n}\n\nclass ScheduledCallback extends React.Component {\n constructor(props) {\n super(props)\n this.state = initialState\n\n this.init = this.init.bind(this)\n this.nextStep = this.nextStep.bind(this)\n this.onClickNext = this.onClickNext.bind(this)\n this.handleDateChange = this.handleDateChange.bind(this)\n }\n\n componentDidMount() {\n this.init()\n }\n\n init() {\n this.setState(initialState)\n this.initCallbackPreference()\n this.initOtherDayOptions()\n }\n\n initCallbackPreference() {\n const { callCentreWillOpenToday, todaysDay } = this.props\n let newCallbackPreference = ''\n let newNextOpenDayString = ''\n let newSelectedDayIndex = 0\n\n // If open today, preference is today\n if (callCentreWillOpenToday) {\n newCallbackPreference = 'Today'\n newNextOpenDayString = 'today'\n } else if (todaysDay === 'Saturday') {\n newCallbackPreference = 'Other'\n newSelectedDayIndex = 1\n newNextOpenDayString = 'Monday'\n } else if (todaysDay === 'Sunday') {\n newCallbackPreference = 'Tomorrow'\n newSelectedDayIndex = 0\n newNextOpenDayString = 'Monday'\n } else {\n newCallbackPreference = 'Tomorrow'\n newNextOpenDayString = 'tomorrow'\n newSelectedDayIndex = 1\n }\n\n this.setSelectedDayAsString(newSelectedDayIndex)\n this.setCallbackTimeOptions(newSelectedDayIndex)\n\n this.setState({\n callbackPreference: newCallbackPreference,\n nextOpenDayString: newNextOpenDayString,\n selectedDayIndex: newSelectedDayIndex\n })\n }\n\n initOtherDayOptions() {\n const { openingData, todaysDay } = this.props\n let sliceIndex = 2\n\n if (todaysDay === 'Saturday' || todaysDay === 'Sunday') {\n sliceIndex = 1\n }\n\n // Map 7 days after 'tomorrow' by slicing since this is for 'other'\n const days = openingData.slice(sliceIndex, openingData.length).map((day, index) => {\n return [\n `${this.createDayString(day.date)}#${index + sliceIndex}`, // Key/Value\n this.createDayWithOridinalString(day.date) // Label\n ]\n })\n\n this.setState({\n otherDayOptions: days\n })\n }\n\n setCallbackTimeOptions(newSelectedDayIndex) {\n const { openingData } = this.props\n const openingTimesToday = openingData[newSelectedDayIndex].openingTimes\n const newNextOpenTimeString = this.createTimeString(openingTimesToday[0].from)\n\n // Filter to skip the first opening slot (to enable the ops team to prepare each morning)\n const newCallbackTimeOptions = openingTimesToday\n .filter((times, index) => {\n if (index === 0) {\n return false\n }\n return true\n })\n .map(times => {\n return this.createTimeRangeString(times.from, times.to)\n })\n const newTimeSelectedValue = newCallbackTimeOptions[0]\n\n this.setState({\n callbackTimeOptions: newCallbackTimeOptions,\n timeSelectedValue: newTimeSelectedValue,\n nextOpenTimeString: newNextOpenTimeString\n })\n }\n\n onClose() {\n this.init()\n }\n\n nextStep() {\n this.setState(prevstate => ({\n currentStep: prevstate.currentStep + 1\n }))\n }\n\n handleDateChange(e) {\n this.hideError()\n if (e.currentTarget) {\n this.onCallbackDayChange(e)\n } else {\n this.onCallbackPreferenceChange(e)\n }\n }\n\n handleSubmit() {\n const { openingData } = this.props\n const { selectedDayIndex, timeSelectedValue } = this.state\n const date = openingData[selectedDayIndex].date\n const time = timeSelectedValue.split('-')[0].trim()\n\n const payload = {\n scheduled_at: `${date}T${time}Z`\n }\n\n this.hideError()\n this.scheduleCallback('POST', payload)\n }\n\n scheduleCallback(method, payload) {\n this.callAPI(method, payload)\n .then(data => {\n data.created_at ? this.nextStep() : this.showError()\n })\n .catch(() => {\n this.showError()\n })\n }\n\n callAPI(method, data) {\n return new Promise((resolve, reject) => {\n fetch(method, `/scheduled_callbacks.json`, 'application/json', null, data)\n .then(data => resolve(data))\n .catch((message, data) => reject([message, data]))\n })\n }\n\n showError() {\n this.setState({\n submissionErrorText: 'There was an error, please try again.'\n })\n }\n\n hideError() {\n this.setState({\n submissionErrorText: ''\n })\n }\n\n onCallbackDayChange(e) {\n switch (e.currentTarget.name) {\n case 'callbackDay':\n const { openingData } = this.props\n const newSelectedDayIndex = parseInt(e.currentTarget.value.split('#')[1])\n const newOtherDaySelectedValue = `${this.createDayString(\n openingData[newSelectedDayIndex].date\n )}#${newSelectedDayIndex}`\n\n this.setSelectedDayAsString(newSelectedDayIndex)\n this.setCallbackTimeOptions(newSelectedDayIndex)\n\n this.setState({\n otherDaySelectedValue: newOtherDaySelectedValue,\n selectedDayIndex: newSelectedDayIndex\n })\n break\n case 'callbackTime':\n this.setState({\n timeSelectedValue: e.currentTarget.value\n })\n break\n }\n }\n\n onCallbackPreferenceChange(e) {\n const { openingData, todaysDay } = this.props\n let newSelectedDayIndex = 0\n\n switch (e.callbackPreference.toLowerCase()) {\n case 'today':\n break\n case 'tomorrow':\n if (todaysDay === 'Sunday') {\n newSelectedDayIndex = 0\n } else {\n newSelectedDayIndex = 1\n }\n break\n case 'other':\n if (todaysDay === 'Saturday' || todaysDay === 'Sunday') {\n newSelectedDayIndex = 1\n } else {\n newSelectedDayIndex = 2\n }\n }\n\n const newOtherDaySelectedValue = `${this.createDayString(\n openingData[newSelectedDayIndex].date\n )}#${newSelectedDayIndex}`\n\n this.setSelectedDayAsString(newSelectedDayIndex)\n this.setCallbackTimeOptions(newSelectedDayIndex)\n this.setState({\n callbackPreference: e.callbackPreference,\n selectedDayIndex: newSelectedDayIndex,\n otherDaySelectedValue: newOtherDaySelectedValue\n })\n }\n\n onClickNext(e) {\n const { currentStep, selectedDayIndex } = this.state\n e.preventDefault()\n\n if (currentStep < steps.form) {\n this.nextStep()\n trackEvent('Chose callback contact')\n } else {\n this.setSelectedDayAsString(selectedDayIndex)\n this.handleSubmit()\n }\n }\n\n setSelectedDayAsString(selectedDayIndex) {\n const { openingData } = this.props\n const newSelectedDayString = this.createDayWithOridinalString(openingData[selectedDayIndex].date)\n this.setState({\n selectedDayAsString: newSelectedDayString\n })\n }\n\n formattableDateUTC(date) {\n return dayjs.utc(date)\n }\n\n createTimeRangeString(from, to) {\n const fromTime = this.formattableDateUTC(from).format('HH:mm')\n const toTime = this.formattableDateUTC(to).format('HH:mm')\n return `${fromTime} - ${toTime}`\n }\n\n createTimeString(time) {\n return this.formattableDateUTC(time).format('HH:mm')\n }\n createDayString(date) {\n return this.formattableDateUTC(date).format('dddd')\n }\n\n createDayWithOridinalString(date) {\n const dateStr = this.createDayString(date)\n const dayStr = this.formattableDateUTC(date).format('D')\n const ordinalStr = getOrdinalIndicator(this.formattableDateUTC(date).format('dd'))\n return `${dateStr} ${dayStr}${ordinalStr}`\n }\n\n renderHeader() {\n const { icon, title } = this.props.stepsContent[this.state.currentStep]\n\n return (\n \n )\n }\n\n renderFooter() {\n const { submissionErrorText } = this.state\n let { linkTarget, linkText, linkHref, buttonText, trackingEvent } = this.props.stepsContent[this.state.currentStep]\n let target = linkTarget ? (linkTarget = linkTarget) : ''\n\n const onLinkClick = e => {\n e.preventDefault()\n\n // If there's an event to track, track it and then follow any links:\n if (trackingEvent) {\n trackEvent(trackingEvent).then(() => {\n // If there's a target, follow it\n if (target) {\n window.open(linkHref, target)\n return\n }\n window.location = linkHref\n })\n }\n }\n\n return (\n \n {submissionErrorText !== '' && {submissionErrorText}
}\n {buttonText !== '' && (\n \n {buttonText}\n \n )}\n \n {linkText}\n \n \n )\n }\n\n render() {\n const { callCentreWillOpenToday, todaysDay } = this.props\n const {\n callbackPreference,\n otherDaySelectedValue,\n selectedDayAsString,\n timeSelectedValue,\n callbackTimeOptions,\n otherDayOptions,\n currentStep,\n nextOpenDayString,\n nextOpenTimeString\n } = this.state\n\n return (\n \n \n {this.renderHeader()}\n
\n
\n {this.renderFooter()}\n
\n )\n }\n}\n\nScheduledCallback.propTypes = {\n openingData: PropTypes.array,\n callCentreWillOpenToday: PropTypes.bool,\n todaysDay: PropTypes.string,\n stepsContent: PropTypes.array\n}\n\nexport default ScheduledCallback\n","import React from 'react'\n\nimport OptionsList from '../OptionsList'\nimport { FormGroup } from '../../layout/Wrapper'\nimport Select from '../Select'\n\nconst ContentForm = props => {\n const {\n callCentreWillOpenToday,\n todaysDay,\n otherDaySelectedValue,\n callbackPreference,\n timeSelectedValue,\n callbackTimeOptions,\n otherDayOptions,\n handleDateChange\n } = props.data\n const callbackPreferences = []\n const modifiers = ['columns']\n\n if (callCentreWillOpenToday) {\n callbackPreferences.splice(0, 0, { label: 'Today', value: 'Today' })\n }\n\n if (todaysDay !== 'Saturday') {\n callbackPreferences.splice(1, 0, { label: 'Tomorrow', value: 'Tomorrow' })\n }\n\n if ((callCentreWillOpenToday && todaysDay === 'Saturday') || todaysDay !== 'Saturday') {\n callbackPreferences.push({ label: 'Other', value: 'Other' })\n }\n\n switch (callbackPreferences.length) {\n case 2:\n modifiers.push('columns-2')\n break\n case 3:\n modifiers.push('columns-3')\n }\n\n return (\n \n )\n}\n\nconst ContentBasic = props => {\n const {\n selectedDayAsString,\n timeSelectedValue,\n callbackPreference,\n nextOpenDayString,\n nextOpenTimeString,\n currentStep,\n steps\n } = props.data\n const timeSelectedValueSplit = timeSelectedValue.split(' - ')\n return (\n \n {currentStep === steps.intro && (\n \n We'll be back in the office {nextOpenDayString} at {nextOpenTimeString} GMT, however you can\n request that we call you back at a time and day that's convenient to you.\n
\n )}\n {currentStep === steps.confirmation && (\n \n Sit back and relax. We'll give you a ring{' '}\n {callbackPreference === 'Other' ? selectedDayAsString : callbackPreference.toLowerCase()} {' '}\n between{' '}\n \n {timeSelectedValueSplit[0]} and {timeSelectedValueSplit[1]}\n {' '}\n GMT\n
\n )}\n \n )\n}\n\nconst ScheduledCallbackBody = props => {\n const { currentStep, steps } = props\n if (currentStep === steps.intro || currentStep == steps.confirmation) {\n return \n \n )\n}\n\nScheduledCallback.propTypes = {\n modalId: PropTypes.string,\n openingData: PropTypes.array.isRequired,\n callCentreWillOpenToday: PropTypes.bool.isRequired,\n todaysDay: PropTypes.string.isRequired,\n stepsContent: PropTypes.array.isRequired\n}\n\nexport default ScheduledCallbackModal\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nclass Drawer extends React.Component {\n constructor(props) {\n super(props)\n\n this.handleClose = this.handleClose.bind(this)\n }\n\n handleClose(e) {\n const { onClose } = this.props\n const classList = e.target.classList\n\n e.preventDefault()\n\n if (classList.contains('drawer__overlay') || classList.contains('drawer__overlay__container')) {\n onClose(e)\n }\n }\n\n render() {\n const { children, visible } = this.props\n const classes = visible ? 'drawer drawer--visible' : 'drawer'\n\n return (\n \n )\n }\n}\nDrawer.propTypes = {\n onClose: PropTypes.func.isRequired,\n visible: PropTypes.bool.isRequired\n}\nexport default Drawer\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport ButtonGroupItem from '../interactive/ButtonGroupItem'\n\nimport { ButtonGroup } from './Wrapper'\n\nfunction DrawerFooter({ onCancel, onConfirm, cancelLabel, confirmLabel }) {\n return (\n \n \n \n {cancelLabel}\n \n \n {confirmLabel}\n \n \n \n )\n}\n\nDrawerFooter.propTypes = {\n onCancel: PropTypes.func.isRequired,\n onConfirm: PropTypes.func.isRequired,\n cancelLabel: PropTypes.string.isRequired,\n confirmLabel: PropTypes.string.isRequired\n}\n\nexport default DrawerFooter\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nfunction DrawerHeader({ onClose, children }) {\n return (\n \n )\n}\n\nDrawerHeader.propTypes = {\n onClose: PropTypes.func.isRequired\n}\n\nexport default DrawerHeader\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nfunction OverlayWrapper({ onClick }) {\n return
\n}\n\nOverlayWrapper.propTypes = {\n onClick: PropTypes.func\n}\n\nexport default OverlayWrapper\n","import React, { createElement } from 'react'\nimport PropTypes from 'prop-types'\n\nimport { generateModifierClasses } from '../../modules/utils'\n\nfunction Wrapper({ baseClass, children, className, element, modifiers }) {\n let classes = generateModifierClasses(baseClass, modifiers)\n\n if (className) {\n classes += ` ${className}`\n }\n return createElement(element, { className: classes }, children)\n}\n\nWrapper.propTypes = {\n baseClass: PropTypes.string.isRequired,\n className: PropTypes.string,\n element: PropTypes.string,\n modifiers: PropTypes.oneOfType([PropTypes.string, PropTypes.array])\n}\nWrapper.defaultProps = {\n element: 'div'\n}\nexport const ActionList = props => 'Until date' on this address\"\n flash =\n flash +\n ' because it has been used in one of your previous claim submissions. Please contact us if you need anything else corrected.'\n }\n this.state = {\n errors: {},\n disabled: !props.resource.first_line || props.endedAtLocked,\n flash: flash,\n flashType: 'info'\n }\n this.onChange = this.onChange.bind(this)\n this.handleSubmit = this.handleSubmit.bind(this)\n this.handleCancel = this.handleCancel.bind(this)\n }\n\n static getDerivedStateFromProps(props, state) {\n return deriveStateFromProps(props, state)\n }\n\n onChange(attributeObject = {}) {\n const { endedAtLocked } = this.props\n const { address, errors } = this.state\n\n const nextAddress = Object.assign({}, address, attributeObject)\n\n this.setState({\n disabled: !nextAddress.first_line || endedAtLocked,\n address: nextAddress,\n errors: omit(errors, Object.keys(attributeObject))\n })\n\n onInteractionWithForm()\n }\n\n handleSubmit(e) {\n e.preventDefault()\n\n this.setState({ disabled: true })\n\n const { address } = this.state\n const { referrer, authenticityToken } = this.props\n\n createOrUpdate(address, authenticityToken)\n .then(() => {\n if (referrer) {\n redirectTo(referrer)\n }\n })\n .catch(errResponse => {\n const data = errResponse[1]\n console.error(JSON.stringify(data.errors))\n this.setState(data, function () {\n highlightFirstError()\n })\n })\n }\n\n handleCancel(e) {\n e.preventDefault()\n window.history.back()\n }\n\n render() {\n return (\n <>\n this.addDocument('income', selectedIncomeType)}\n modifiers={['primary', 'small']}\n >\n Add new\n ,\n document.getElementById('page-header').appendChild(wrapper)\n )\n } else {\n const reactButton = document.getElementById('react-page-header-button')\n reactButton && reactButton.remove()\n }\n }\n\n componentDidMount() {\n window.addEventListener('beforeunload', this.handleLeavePage)\n this.fetchDocuments()\n }\n\n componentWillUnmount() {\n window.removeEventListener('beforeunload', this.handleLeavePage)\n }\n\n handleLeavePage(e) {\n const { pendingFiles } = this.state\n if (pendingFiles && pendingFiles.length > 0) {\n e.preventDefault()\n }\n }\n\n fetchDocuments() {\n return new Promise(resolve => {\n fetch('GET', '/documents.json').then(data => {\n if (!data.personId || !data.bucketName) {\n // We're probably logged out without knowing it...\n window.location.reload()\n } else {\n this.setState(\n {\n bucketName: data.bucketName,\n dataFetched: true,\n documents: data.documents,\n kindIds: data.kindIds,\n personId: data.personId,\n statusData: data.statusData,\n subKindIds: data.subKindIds,\n uploadStatuses: data.uploadStatuses\n },\n () => {\n resolve()\n }\n )\n }\n })\n })\n }\n\n deleteDocument() {\n const { currentId, deleting, documents } = this.state\n if (deleting == currentId) return false\n this.setState({\n deleting: currentId\n })\n\n deletePersonUpload(currentId)\n .then(() => {\n const foundIndex = documents.findIndex(item => item.id == currentId)\n documents.splice(foundIndex, 1)\n\n this.setState({\n deleting: null,\n documents: documents,\n currentId: null\n })\n })\n .catch(e => {\n this.setState({ deleting: null })\n if (isIterable(e)) {\n const [message] = e\n console.error('Delete failed: ' + message)\n }\n })\n }\n\n editDocument() {\n const { currentId, editing, documents } = this.state\n if (editing == currentId) return false\n const name = this.fileDisplayRef.current.state.nameValue\n this.setState({\n editing: currentId\n })\n\n editPersonUpload(currentId, name)\n .then(doc => {\n const foundIndex = documents.findIndex(item => item.id == currentId)\n documents.splice(foundIndex, 1, doc)\n\n this.setState({\n currentId: null,\n documents: documents,\n editing: null\n })\n })\n .catch(e => {\n this.setState({ editing: null })\n\n if (isIterable(e)) {\n const [message] = e\n console.error('Edit failed: ' + message)\n }\n })\n }\n\n showDocument(id) {\n this.setState({\n currentId: id\n })\n }\n\n showIncomes(e, incomeType) {\n e && e.preventDefault()\n this.setState(\n {\n displayIncome: true,\n selectedIncomeType: incomeType\n },\n this.updateDomToIncomes\n )\n }\n\n showAllDocuments(e) {\n e && e.preventDefault()\n this.setState(\n {\n displayIncome: false,\n selectedIncomeType: null\n },\n () => this.updateDomToIncomes(false)\n )\n }\n\n addDocument(kind, subKind = null) {\n const { kindIds, showingUploadWindow, subKindIds } = this.state\n if (showingUploadWindow) return false\n this.setState(\n {\n showingUploadWindow: true,\n uploadKindId: kindIds[kind],\n uploadSubKindId: subKind ? subKindIds[subKind] : null\n },\n function () {\n this.fileUploadRef.current.click()\n }\n )\n }\n\n uploadsInputClicked() {\n this.setState({\n showingUploadWindow: false\n })\n }\n\n fileExtension(file) {\n return file.name.split('.').pop()\n }\n\n generateFilePreviews(files, uids) {\n const _this = this\n\n uids.forEach((uid, index) => {\n const file = files[index]\n\n if (!/(jpe?g|png|gif)$/i.test(file.name)) {\n return\n }\n\n const reader = new FileReader()\n\n reader.addEventListener(\n 'load',\n function () {\n _this.updatePendingFile(uid, {\n preview: {\n imgSrc: this.result,\n modifiers: ['image', 'uploading'],\n svg: null\n }\n })\n },\n false\n )\n reader.readAsDataURL(file)\n })\n }\n\n addPendingFiles(files, uids, uploadKindId, uploadSubKindId = null) {\n const { pendingFiles } = this.state\n\n const nextPendingFiles = uids.map((uid, index) => {\n const file = files[index]\n return {\n id: uid,\n progress: {\n max: file.size,\n value: 0\n },\n kindId: uploadKindId,\n subKindId: uploadSubKindId,\n modifiers: ['disabled'],\n heading: file.name,\n microcopy: 'Uploading',\n preview: {\n svg: {\n name: 'file',\n text: this.fileExtension(file),\n modifiers: 'preview-svg'\n }\n }\n }\n })\n\n this.setState({ pendingFiles: pendingFiles.concat(nextPendingFiles) })\n }\n\n uploadFiles(files, uids, uploadKindId, uploadSubKindId = null) {\n const { bucketName, personId } = this.state\n\n if (!bucketName || !personId) {\n // We're probably logged out without knowing it...\n window.location.reload()\n }\n\n // Using reduce here allows us to execute these uploads in sequence\n // rather than in parallel (as with Promise.all). This is desireable,\n // because if the user abandons the uploads at 50%, we'll still have\n // captured 50% of their documents. It also avoids us posting parallel\n // requests to the Data API, which may cause issues with re-caching\n // documents properly:\n const docs = []\n const promisedUploads = uids.reduce((previousPromise, uid) => {\n return previousPromise\n .then(() => {\n const fileIndex = uids.indexOf(uid)\n const file = files[fileIndex]\n return this.uploadFile(file, uid, uploadKindId, uploadSubKindId)\n })\n .then(doc => docs.push(doc))\n }, Promise.resolve())\n\n return promisedUploads.then(() => docs)\n }\n\n async uploadFile(file, uid, uploadKindId, uploadSubKindId = null) {\n const { bucketName, personId } = this.state\n const fileExtension = this.fileExtension(file)\n const presignedUploadUrl = await createPresignedUploadUrl(uid, fileExtension)\n\n const onProgress = e => {\n return this.updatePendingFile(uid, { progress: { max: file.size, value: e.loaded } })\n }\n\n await uploadFileToS3(file, presignedUploadUrl, onProgress)\n\n return createPersonUpload({\n url: getUploadUrl(bucketName, personId, uid, fileExtension),\n original_file_name: file.name,\n upload_kind_id: uploadKindId,\n upload_sub_kind_id: uploadSubKindId\n })\n }\n\n addDocumentsAndClearPendingFiles(newDocuments = []) {\n const { pendingFiles } = this.state\n\n const filteredNewDocuments = newDocuments.filter(d => !!d)\n\n let nextPendingFiles = [...pendingFiles]\n filteredNewDocuments.forEach(doc => {\n if (!doc.url) {\n return rg4js('recordBreadcrumb', 'Document missing url', {\n document: doc\n })\n }\n\n const uid = doc.url.replace(/^.*[\\\\\\/]/, '').split('.')[0]\n const foundIndex = nextPendingFiles.findIndex(item => item.id === uid)\n\n if (foundIndex === 0 && nextPendingFiles.length === 1) {\n nextPendingFiles = []\n } else {\n nextPendingFiles.splice(foundIndex, 1)\n }\n })\n\n this.fetchDocuments().then(() => {\n this.setState({\n pendingFiles: nextPendingFiles\n })\n })\n }\n\n uploadsAdded({ target: { files } }, multiple) {\n const filesArray = Array.from(files)\n let maxFileSizeReached = false\n\n filesArray.forEach(file => {\n if (file.size > MAX_FILE_SIZE_MB * 1024 * 1024) {\n maxFileSizeReached = true\n }\n })\n\n if (maxFileSizeReached) {\n const message = `${\n multiple ? 'One of your documents' : 'Your document'\n } is too large! The limit is ${MAX_FILE_SIZE_MB}mb per file.`\n return alert(message)\n }\n\n const { uploadKindId, uploadSubKindId } = this.state\n const uids = Array.from(files).map(() => uuidv4())\n\n this.addPendingFiles(files, uids, uploadKindId, uploadSubKindId)\n this.generateFilePreviews(files, uids)\n\n this.uploadFiles(files, uids, uploadKindId, uploadSubKindId).then(docs => {\n this.addDocumentsAndClearPendingFiles(docs)\n })\n }\n\n documentsByKind(kind, subKind = null) {\n const { documents, kindIds, subKindIds } = this.state\n let documentsByKind = documents\n ? documents.filter(doc => doc.upload_kind_id === kindIds[kind] && doc.archived_at === null)\n : []\n\n if (subKind && documentsByKind.length > 0) {\n documentsByKind = documentsByKind.filter(doc => doc.upload_sub_kind_id === subKindIds[subKind])\n }\n\n return kind !== 'income' ? documentsByKind[0] : documentsByKind\n }\n\n documentById(id) {\n const { documents } = this.state\n return documents ? documents.find(doc => doc.id === id && doc.archived_at === null) : null\n }\n\n pendingFilesByKind(kind, subKind = null) {\n const { pendingFiles, kindIds, subKindIds } = this.state\n if (!pendingFiles) return []\n\n if (subKind === null) {\n return pendingFiles.filter(file => file.kindId === kindIds[kind])\n } else {\n return pendingFiles.filter(file => file.kindId === kindIds[kind] && file.subKindId === subKindIds[subKind])\n }\n }\n\n updatePendingFile(uid, obj) {\n const { pendingFiles } = this.state\n const file = pendingFiles.find(item => item.id === uid)\n Object.assign(file, obj)\n this.setState({\n pendingFiles: pendingFiles\n })\n }\n\n renderIncomes() {\n const { dataFetched, selectedIncomeType } = this.state\n if (!dataFetched) return null\n\n const incomes = this.documentsByKind('income', selectedIncomeType)\n const pendingIncomes = this.pendingFilesByKind('income', selectedIncomeType)\n\n return (\n \n Object.assign(obj.display_data, {\n onClick: e => {\n obj.editable ? this.showDocument(obj.id) : e.preventDefault()\n }\n })\n )\n .concat(pendingIncomes)}\n placeholderName=\"documents\"\n />\n )\n }\n\n renderFile() {\n const { dataFetched, currentId } = this.state\n if (!dataFetched || !currentId) return null\n\n const currentDocument = this.documentById(currentId)\n\n return (\n this.showDocument(null)}\n onDelete={this.deleteDocument}\n onEdit={this.editDocument}\n ref={this.fileDisplayRef}\n />\n )\n }\n\n calculateProgress(kind, subKind = null) {\n const files = this.pendingFilesByKind(kind, subKind)\n const max = files.map(f => f.progress.max).reduce((total, current) => total + current)\n const value = files.map(f => f.progress.value).reduce((total, current) => total + current)\n return { value, max }\n }\n\n uploadingLabel(count) {\n return `Uploading ${count} ${count > 1 ? 'files' : 'file'}...`\n }\n\n getIncomeStatus(incomes, pendingIncomes) {\n return {\n label: pendingIncomes.length > 0 ? this.uploadingLabel(pendingIncomes.length) : `${incomes.length} uploaded`,\n message: null,\n modifier: pendingIncomes.length > 0 ? 'info' : incomes.length > 0 ? 'positive' : 'negative'\n }\n }\n\n getStatusName(document) {\n if (!document) {\n return null\n }\n const status = this.state.uploadStatuses.find(s => s.id === document?.upload_status_id)\n return status['name']\n }\n\n getDocumentStatus(document, hasPendingDocument, pendingDocuments) {\n const statusName = this.getStatusName(document)\n\n if (hasPendingDocument) {\n return {\n label: this.uploadingLabel(pendingDocuments.length),\n message: null,\n modifier: 'info'\n }\n }\n\n if (!document) {\n return {\n label: 'Not uploaded',\n message: null,\n modifier: 'negative'\n }\n }\n\n const setData = (label, message, modifier) => {\n return {\n key: document.id,\n label: label,\n message: message,\n modifier: modifier\n }\n }\n\n const getStatusData = () => {\n const { statusData } = this.state\n\n switch (statusName) {\n case 'not checked':\n return setData(\n 'In Review',\n 'Your document has been received, ready to be reviewed by your Tax Specialist.',\n 'positive'\n )\n case 'approved':\n return setData('Approved', 'Your document has been received and approved.', 'positive')\n case 'failed':\n return setData('Expired', 'Your document is no longer valid. Please upload a new version.', 'negative')\n case 'review':\n return setData('Required', statusData.proof_of_address.text, 'warning')\n }\n }\n return getStatusData()\n }\n\n renderTileAction(document, hasPendingDocument, selector, alt) {\n if (hasPendingDocument) {\n return null\n } else if (!document || document?.creatable) {\n return {\n onClick: () => this.addDocument(selector),\n imgAlt: alt,\n imgName: 'plusWhite'\n }\n }\n }\n\n generateModifiers(document, hasPendingDocument) {\n const failed = this.getStatusName(document) === 'failed'\n\n if (!document || failed || (!document?.editable && document?.creatable)) {\n return ''\n }\n\n if (!document?.editable || hasPendingDocument) {\n return 'disabled'\n }\n }\n\n handleOnClick(document, selector) {\n document && document?.editable ? this.showDocument(document?.id) : this.addDocument(selector)\n }\n\n renderTiles() {\n const { dataFetched } = this.state\n if (!dataFetched) return null\n\n const photoId = this.documentsByKind('photoId')\n const proofOfAddress = this.documentsByKind('proofOfAddress')\n const incomes = this.documentsByKind('income', 'incomeDocument')\n const payslips = this.documentsByKind('income', 'payslip')\n\n const pendingPhotoIds = this.pendingFilesByKind('photoId')\n const pendingProofOfAddresses = this.pendingFilesByKind('proofOfAddress')\n const pendingIncomes = this.pendingFilesByKind('income', 'incomeDocument')\n const pendingPayslips = this.pendingFilesByKind('income', 'payslip')\n\n const hasPendingPhotoId = pendingPhotoIds.length == 1\n const hasPendingProofOfAddress = pendingProofOfAddresses.length == 1\n\n return (\n \n this.handleOnClick(photoId, 'photoId')}\n modifiers={this.generateModifiers(photoId, hasPendingPhotoId)}\n status={this.getDocumentStatus(photoId, hasPendingPhotoId, pendingPhotoIds)}\n progress={hasPendingPhotoId ? this.calculateProgress('photoId') : null}\n icon={{\n alt: 'Photo ID',\n name: 'man'\n }}\n tileAction={this.renderTileAction(photoId, hasPendingPhotoId, 'photoId', 'Add Photo ID')}\n />\n this.handleOnClick(proofOfAddress, 'proofOfAddress')}\n modifiers={this.generateModifiers(proofOfAddress, hasPendingProofOfAddress)}\n status={this.getDocumentStatus(proofOfAddress, hasPendingProofOfAddress, pendingProofOfAddresses)}\n progress={hasPendingProofOfAddress ? this.calculateProgress('proofOfAddress') : null}\n icon={{\n alt: 'Proof of address',\n name: 'home'\n }}\n tileAction={this.renderTileAction(\n proofOfAddress,\n hasPendingProofOfAddress,\n 'proofOfAddress',\n 'Add Proof of address'\n )}\n />\n (incomes.length + pendingIncomes.length > 0 ? this.showIncomes(e, 'incomeDocument') : null)}\n modifiers={incomes.length + pendingIncomes.length == 0 ? 'inactive-link' : null}\n icon={{\n alt: 'Income & tax paid',\n name: 'letter'\n }}\n status={this.getIncomeStatus(incomes, pendingIncomes)}\n progress={pendingIncomes.length > 0 ? this.calculateProgress('income', 'incomeDocument') : null}\n tileAction={{\n onClick: () => this.addDocument('income', 'incomeDocument'),\n imgAlt: 'Add income & tax paid',\n imgName: 'plusWhite'\n }}\n />\n (payslips.length + pendingPayslips.length > 0 ? this.showIncomes(e, 'payslip') : null)}\n modifiers={payslips.length + pendingPayslips.length == 0 ? 'inactive-link' : null}\n icon={{\n alt: 'Payslips',\n name: 'letter'\n }}\n status={this.getIncomeStatus(payslips, pendingPayslips)}\n progress={pendingPayslips.length > 0 ? this.calculateProgress('income', 'payslip') : null}\n tileAction={{\n onClick: () => this.addDocument('income', 'payslip'),\n imgAlt: 'Add payslips',\n imgName: 'plusWhite'\n }}\n />\n \n )\n }\n\n render() {\n const { currentId, kindIds, uploadKindId } = this.state\n const multiple = uploadKindId && kindIds && uploadKindId === kindIds['income']\n return (\n \n \n this.uploadsAdded(e, multiple)}\n onClick={this.uploadsInputClicked}\n accept=\"\n image/png,\n image/jpeg,\n image/webp,\n image/heic,\n image/heif,\n application/pdf,\n text/html,\n application/vnd.ms-excel,\n application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,\n application/rtf,\n application/msword,\n application/vnd.openxmlformats-officedocument.wordprocessingml.document\"\n />\n {this.shouldDisplayIncome() ? this.renderIncomes() : this.renderTiles()}\n {currentId && this.renderFile()}\n \n \n redirectTo('/')}>\n {`Back to ${this.shouldDisplayIncome() ? 'Documents' : 'Home'}`}\n \n \n \n )\n }\n}\n\nexport default Index\n","const SUN = 0\nconst SAT = 6\nconst FRI = 5\n\nfunction nextOpenTomorrow(date) {\n const day = date.getDay()\n\n if (day === SUN) {\n return true\n }\n\n if (day === SAT) {\n return false\n }\n\n if (day === FRI) {\n return after(date, [17, 30])\n }\n\n return after(date, [19, 30])\n}\n\nfunction openToday(date) {\n const day = date.getDay()\n\n if (day === SUN) {\n return false\n }\n\n if (day === SAT) {\n return before(date, [12, 30])\n }\n\n if (day === FRI) {\n return before(date, [17, 30])\n }\n\n return before(date, [19, 30])\n}\n\nexport function before(date, referenceHourMinute) {\n const hour = date.getHours()\n const minute = date.getMinutes()\n let [refHour, refMinute] = referenceHourMinute\n\n if (refMinute) {\n return hour < refHour || (hour === refHour && minute < refMinute)\n } else {\n return hour < refHour\n }\n}\n\nexport function after(date, referenceHourMinute) {\n return !before(date, referenceHourMinute)\n}\n\nexport function nextOpeningTime(date) {\n if (openToday(date)) {\n return 'shortly'\n } else if (nextOpenTomorrow(date)) {\n return 'tomorrow'\n }\n return 'monday'\n}\n","import React, { Fragment } from 'react'\nimport PropTypes from 'prop-types'\n\nimport Alert from '../../display/alert/Alert'\nimport AlertHeader from '../../display/alert/AlertHeader'\nimport ButtonGroupItem from '../../interactive/ButtonGroupItem'\nimport Lead from '../../display/Lead'\n\nimport { AlertText, ButtonGroup, ContentFooter, ContentWrapper, ContentWrapperInner, Grid } from '../../layout/Wrapper'\n\nimport { nextOpeningTime } from '../../../modules/time'\n\nclass ErrorPage extends React.Component {\n constructor(props) {\n super(props)\n this.date = new Date()\n }\n\n callCentreCopy() {\n const nextOpen = nextOpeningTime(this.date)\n let whenOpen = 'now'\n\n if (nextOpen === 'tomorrow') {\n whenOpen = 'tomorrow at 8am'\n } else if (nextOpen === 'monday') {\n whenOpen = 'on Monday at 8am'\n }\n\n return (\n \n The call centre is open {whenOpen} \n \n )\n }\n\n render() {\n const { showSignOut, showGoHome, leadText, messageText } = this.props\n\n return (\n \n \n \n {leadText} \n What happens now? \n {messageText}
\n \n Want to chat? \n \n If you need to get hold of us, can always give us a call on{' '}\n \n 01233 628648 \n \n . {this.callCentreCopy()}.\n \n \n \n \n \n {showGoHome && (\n \n Go home\n \n )}\n {showSignOut && (\n \n Sign out\n \n )}\n \n \n \n \n )\n }\n}\n\nErrorPage.defaultProps = {\n showGoHome: true,\n showSignOut: true\n}\n\nErrorPage.propTypes = {\n leadText: PropTypes.string.isRequired,\n messageText: PropTypes.string.isRequired,\n showGoHome: PropTypes.bool.isRequired,\n showSignOut: PropTypes.bool.isRequired\n}\n\nexport default ErrorPage\n","import React, { useEffect, useState, Fragment } from 'react'\nimport PropTypes from 'prop-types'\n\nimport GeneralExpenseForm from '../../interactive/GeneralExpenseForm'\nimport WorkplaceExpenseForm from '../../interactive/WorkplaceExpenseForm'\nimport IdleHelpPanel from '../../interactive/IdleHelpPanel'\n\nimport { findIndexBy, removeIndex, isUuidv4, updateIndex, redirectTo } from '../../../modules/utils'\nimport { showIdleHelpPanel, onInteractionWithForm } from '../../../modules/idleHelpPanel'\n\nimport {\n fetchEmployments,\n fetchExpenses,\n fetchLocations,\n fetchExpenseFrequencies,\n fetchExpenseKinds,\n fetchExpenseGroups,\n createExpense,\n updateExpense,\n deleteExpense\n} from '../../../modules/api'\n\nconst attachErrors = (expense, errors) => {\n return Object.assign({}, expense, errors)\n}\n\nconst combineExpenses = (originalExpenses, newExpenses, updatedExpenses, removedExpenses) => {\n const result = [].concat(originalExpenses, newExpenses)\n\n updatedExpenses.forEach(updatedExpense => {\n const expenseIndex = result.findIndex(ex => ex.id === updatedExpense.id)\n result[expenseIndex] = updatedExpense\n })\n\n removedExpenses.forEach(removedExpense => {\n const expenseIndex = result.findIndex(ex => ex.id === removedExpense.id)\n result.splice(expenseIndex, 1)\n })\n\n return result\n}\n\nexport default function ExpensesNew({ afterSubmitPath }) {\n const workplace = window.location.search.match(/workplace=t/)\n const [newExpenses, setNewExpenses] = useState([])\n const [updatedExpenses, setUpdatedExpenses] = useState([])\n const [removedExpenses, setRemovedExpenses] = useState([])\n\n const [{ expenseKinds, expenseGroups, expenseFrequencies, expenses, employments, locations }, setResources] =\n useState({\n expenseKinds: [],\n expenseGroups: [],\n expenseFrequencies: [],\n expenses: [],\n employments: [],\n locations: []\n })\n\n const combinedExpenses = combineExpenses(expenses, newExpenses, updatedExpenses, removedExpenses)\n\n useEffect(() => {\n Promise.all([\n fetchExpenseKinds(),\n fetchExpenseGroups(),\n fetchExpenseFrequencies(),\n fetchExpenses(),\n fetchEmployments(),\n fetchLocations()\n ]).then(([expenseKinds, expenseGroups, expenseFrequencies, expenses, employments, locations]) => {\n setResources({\n expenseKinds,\n expenseGroups,\n expenseFrequencies,\n expenses,\n employments,\n locations\n })\n })\n }, [])\n\n const handleAddExpenses = added => {\n setNewExpenses(newExpenses.concat(added))\n onInteractionWithForm()\n }\n\n const handleUpdateExpenses = updates => {\n updates = [].concat(updates)\n let nextNewExpenses = newExpenses\n let nextUpdatedExpenses = updatedExpenses\n\n updates.forEach(updatedExpense => {\n // If we're updating a new (unsaved) expense...\n if (isUuidv4(updatedExpense.id)) {\n const index = findIndexBy(nextNewExpenses, 'id', updatedExpense.id)\n nextNewExpenses = updateIndex(nextNewExpenses, index, updatedExpense)\n return\n }\n\n // If we're updating a saved expense...\n const index = findIndexBy(nextUpdatedExpenses, 'id', updatedExpense.id)\n if (index !== -1) {\n nextUpdatedExpenses = updateIndex(nextUpdatedExpenses, index, updatedExpense)\n return\n }\n\n nextUpdatedExpenses = nextUpdatedExpenses.concat(updatedExpense)\n })\n\n setNewExpenses(nextNewExpenses)\n setUpdatedExpenses(nextUpdatedExpenses)\n onInteractionWithForm()\n }\n\n const handleRemoveExpense = removed => {\n if (removed.id.toString().length > 15) {\n const index = findIndexBy(newExpenses, 'id', removed.id)\n return setNewExpenses(removeIndex(newExpenses, index))\n }\n\n const index = findIndexBy(updatedExpenses, 'id', removed.id)\n if (index !== -1) {\n setUpdatedExpenses(removeIndex(updatedExpenses, index))\n }\n setRemovedExpenses(removedExpenses.concat(removed))\n onInteractionWithForm()\n }\n\n const handleSubmit = async e => {\n e.preventDefault()\n const erroneous = []\n const failedDeletes = []\n\n for (let i = 0; i < newExpenses.length; i++) {\n const { cost } = newExpenses[i]\n if (cost && cost !== '0') {\n await createExpense(newExpenses[i]).catch(errResponse =>\n erroneous.push(attachErrors(newExpenses[i], errResponse[1]))\n )\n }\n }\n\n for (let i = 0; i < updatedExpenses.length; i++) {\n await updateExpense(updatedExpenses[i]).catch(errResponse =>\n erroneous.push(attachErrors(updatedExpenses[i], errResponse[1]))\n )\n }\n\n for (let i = 0; i < removedExpenses.length; i++) {\n await deleteExpense(removedExpenses[i]).catch(errResponse =>\n failedDeletes.push(attachErrors(removedExpenses[i], errResponse[1]))\n )\n }\n\n if (erroneous.length) {\n handleUpdateExpenses(erroneous)\n }\n\n if (failedDeletes.length) {\n console.error('Failed to delete some expenses', failedDeletes)\n }\n\n if (!erroneous.length && !failedDeletes.length) {\n redirectTo(afterSubmitPath)\n }\n }\n\n const handleCancel = e => {\n e.preventDefault()\n window.history.back()\n }\n\n console.log({\n original: expenses.length,\n new: newExpenses.length,\n updated: updatedExpenses.length,\n removed: removedExpenses.length\n })\n\n return (\n \n {combinedExpenses &&\n (workplace ? (\n \n )\n}\n\nExpensesNew.propTypes = {\n afterSubmitPath: PropTypes.string.isRequired\n}\n","import React, { Fragment } from 'react'\nimport PropTypes from 'prop-types'\nimport FinanceForm from '../../interactive/FinanceForm'\nimport ActionsModal from '../../interactive/ActionsModal'\nimport IdleHelpPanel from '../../interactive/IdleHelpPanel'\n\nimport { fetch, omit, redirectTo } from '../../../modules/utils'\nimport { showIdleHelpPanel, onInteractionWithForm } from '../../../modules/idleHelpPanel'\n\nclass Edit extends React.Component {\n constructor(props) {\n super(props)\n\n this.state = {\n confirmationGiven: false,\n showModal: false,\n disabled: false,\n flash: false,\n finance: props.resource,\n flashType: 'info'\n }\n\n this.onChange = this.onChange.bind(this)\n this.handleSubmit = this.handleSubmit.bind(this)\n this.dismissConfirmationModal = this.dismissConfirmationModal.bind(this)\n this.askForConfirmation = this.askForConfirmation.bind(this)\n }\n\n onChange(name, value) {\n const { finance } = this.state\n const updateObj = typeof name == 'object' ? name : { [name]: value }\n this.setState({\n disabled: false,\n finance: Object.assign(finance, updateObj)\n })\n onInteractionWithForm()\n }\n\n dismissConfirmationModal() {\n this.setState({ showModal: false })\n }\n\n askForConfirmation() {\n this.setState({ showModal: true, confirmationGiven: true })\n }\n\n handleSubmit(e) {\n e.preventDefault()\n\n const { authenticityToken, requireConfirmation, referrer } = this.props\n const { finance, confirmationGiven } = this.state\n\n if (requireConfirmation && !confirmationGiven) {\n return this.askForConfirmation()\n }\n\n this.setState({ disabled: true, showModal: false })\n\n fetch('PATCH', `/finance/${finance.id}`, 'application/json', 'application/json', {\n finance: finance,\n utf8: '✓',\n authenticity_token: authenticityToken\n })\n .then(data => {\n if (referrer) {\n redirectTo(referrer)\n } else if (data.after_update_path) {\n redirectTo(data.after_update_path)\n }\n })\n .catch(errResponse => {\n const data = errResponse[1]\n console.error(JSON.stringify(data.errors))\n this.setState(data)\n })\n }\n\n render() {\n const { showModal } = this.state\n\n return (\n \n The questions about your financial history are vital in making sure we can calculate your refund correctly and get it paid out to you as quickly as possible. If there were any you weren’t sure of, get in touch and we can talk you through so nothing gets delayed later on. \n )\n }\n}\n\nEdit.defaultProps = {\n requireConfirmation: false,\n showCancelButton: true\n}\n\nEdit.propTypes = {\n leadText: PropTypes.string,\n showCancelButton: PropTypes.bool,\n requireConfirmation: PropTypes.bool,\n authenticityToken: PropTypes.string,\n options: PropTypes.array,\n submitButtonLabel: PropTypes.string,\n referrer: PropTypes.string,\n resource: PropTypes.object\n}\nexport default Edit\n","import React, { useEffect } from 'react'\nimport PropTypes from 'prop-types'\n\nimport PillCarousel from '../../display/PillCarousel'\nimport ImageTrustpilotCombo from '../../display/trustpilot/ImageTrustpilotCombo'\nimport FeaturesList from '../../display/FeaturesList'\n\nimport { trackEvent } from '../../../modules/tracking'\n\nexport default function IntroToMyRift({\n imageTrustpilotComboProps,\n pillCarouselProps,\n featuresListProps,\n authenticityToken\n}) {\n useEffect(() => {\n trackEvent('Viewed Intro to MyRIFT page')\n console.log('Tracked \"Viewed Intro to MyRIFT page\"')\n }, [])\n\n return (\n \n
\n
\n
\n\n
\n
\n
Start your claim today \n \n \n
\n
\n \n {showAddAddressButton && (\n \n Add an address\n \n )}\n \n \n )\n}\n\nAddressesIndex.propTypes = {\n lead: PropTypes.string.isRequired,\n addresses: PropTypes.arrayOf(PropTypes.object),\n startDate: PropTypes.object.isRequired,\n gaps: PropTypes.arrayOf(\n PropTypes.shape({\n startDate: PropTypes.object,\n endDate: PropTypes.object\n })\n ).isRequired\n}\n","import React, { Fragment } from 'react'\nimport PropTypes from 'prop-types'\n\nimport { updatePageTitle } from '../../../modules/legacyUtils'\nimport { flatten } from '../../../modules/utils'\n\nimport { ActionList, ContentWrapper, ContentWrapperInner, TileList } from '../../layout/Wrapper'\n\nimport ClaimWizard from '../../interactive/ClaimWizard'\nimport Action from '../../interactive/Action'\nimport Tile from '../../display/Tile'\n\nexport default function Dashboard({ claimSummary, locations, expenses, documents }) {\n const submitHeading = (function (status) {\n switch (status) {\n case 'complete':\n return 'Claim complete'\n case 'in-progress':\n return 'Claim review started'\n default:\n return 'Added everything?'\n }\n })(claimSummary?.status)\n\n const submitText = (function (status) {\n switch (status) {\n case 'complete':\n return 'You can still submit updates for review.'\n case 'in-progress':\n return 'A Tax Specialist will be in touch soon.'\n default:\n return 'Submit your claim for review.'\n }\n })(claimSummary?.status)\n\n const locationsCount = flatten((locations || []).map(loc => loc.data)).length\n const expensesCount = flatten((expenses || []).map(loc => loc.data)).length\n const documentsCount = documents?.length || 0\n\n updatePageTitle(claimSummary?.greeting || 'Welcome')\n\n return (\n \n \n \n \n 0 ? 'positive' : 'negative',\n label: `${locationsCount} location${locationsCount !== 1 ? 's' : ''}`\n }}\n modifiers=\"stretched\"\n tileAction={{\n href: '/work_locations/new',\n imgAlt: 'Add',\n imgName: 'plusWhite'\n }}\n />\n 0 ? 'positive' : 'negative',\n label: `${expensesCount} expense${expensesCount !== 1 ? 's' : ''}`\n }}\n modifiers=\"stretched\"\n tileAction={{\n href: '/expenses/new',\n imgAlt: 'Add',\n imgName: 'plusWhite'\n }}\n />\n 0 ? 'positive' : 'negative',\n label: `${documentsCount} upload${documentsCount !== 1 ? 's' : ''}`\n }}\n modifiers=\"stretched\"\n />\n \n \n \n \n \n \n \n \n \n \n )\n}\n\nDashboard.propTypes = {\n claimSummary: PropTypes.object,\n locations: PropTypes.arrayOf(PropTypes.object),\n expenses: PropTypes.arrayOf(PropTypes.object),\n documents: PropTypes.arrayOf(PropTypes.object)\n}\n","import React, { Fragment, useEffect, useMemo } from 'react'\nimport PropTypes from 'prop-types'\n\nimport Lead from '../../display/Lead'\nimport ConfigurableDisplayList from '../../display/ConfigurableDisplayList'\nimport ActionHeader from '../../interactive/ActionHeader'\nimport { updatePageTitle } from '../../../modules/legacyUtils'\nimport { generateDisplayListActions } from '../../../modules/timelines'\nimport { BulletList } from 'react-content-loader'\nexport default function EmploymentsIndex({ lead, employments, startDate, gaps }) {\n useEffect(() => {\n updatePageTitle('Employments')\n }, [])\n\n const resourcesLoaded = !!employments\n const list = useMemo(() => generateDisplayListActions(employments, gaps), [employments, gaps])\n\n return (\n \n \n \n Add an employment\n \n \n \n )\n}\n\nEmploymentsIndex.propTypes = {\n lead: PropTypes.string.isRequired,\n employments: PropTypes.arrayOf(PropTypes.object),\n startDate: PropTypes.object.isRequired,\n gaps: PropTypes.arrayOf(\n PropTypes.shape({\n startDate: PropTypes.object,\n endDate: PropTypes.object\n })\n ).isRequired\n}\n","import React, { Fragment } from 'react'\nimport PropTypes from 'prop-types'\n\nimport { updatePageTitle } from '../../../modules/legacyUtils'\nimport { memoisedGroupedGeneralExpenses, memoisedGroupedWorkplaceExpenses } from '../../../modules/expense'\n\nimport Lead from '../../display/Lead'\nimport TimelineGap from '../../display/TimelineGap'\nimport TitledDescriptionList from '../../display/TitledDescriptionList'\nimport EmptyState from '../../display/EmptyState'\nimport ActionHeader from '../../interactive/ActionHeader'\nimport { BulletList } from 'react-content-loader'\n\nexport default function ExpensesIndex({ expenses, locationsGroupedByEmployment }) {\n updatePageTitle('Expenses')\n\n const resourcesLoaded = !!expenses && !!locationsGroupedByEmployment\n const groupedWorkplaceExpenses = memoisedGroupedWorkplaceExpenses(expenses || [])\n const groupedGeneralExpenses = memoisedGroupedGeneralExpenses(expenses || [])\n\n const haveExpenses = !!expenses?.length\n const haveLocations = !!(locationsGroupedByEmployment || []).filter(l => l.data.length).length\n const haveWorkplaceExpenses = !!Object.keys(groupedWorkplaceExpenses || []).length\n const haveGeneralExpenses = !!Object.keys(groupedGeneralExpenses || []).length\n\n const renderExpensesGroup = group => {\n return Object.keys(group).map(title => {\n return \n {haveLocations && (\n \n \n {haveWorkplaceExpenses && (\n \n Add an expense\n \n )}\n \n {haveWorkplaceExpenses\n ? renderExpensesGroup(groupedWorkplaceExpenses)\n : renderExpenseTimelineGap(\n 'What workplace costs did you incur over the claim period?',\n true\n )}\n \n )}\n \n {haveGeneralExpenses && (\n \n Add an expense\n \n )}\n \n {haveGeneralExpenses\n ? renderExpensesGroup(groupedGeneralExpenses)\n : renderExpenseTimelineGap(\n 'What business costs did you incur over the claim period?',\n false\n )}\n \n ) : (\n \n \n From your lunch to toll charges, you can increase your refund by adding any expenses{' '}\n you paid for yourself. \n \n \n )\n}\n\nExpensesIndex.propTypes = {\n expenses: PropTypes.arrayOf(PropTypes.object),\n locationsGroupedByEmployment: PropTypes.arrayOf(PropTypes.object)\n}\n","import React, { Fragment, useMemo } from 'react'\nimport PropTypes from 'prop-types'\n\nimport { updatePageTitle } from '../../../modules/legacyUtils'\nimport { generateDisplayListActions } from '../../../modules/timelines'\n\nimport Lead from '../../display/Lead'\nimport ConfigurableDisplayList from '../../display/ConfigurableDisplayList'\nimport EmptyState from '../../display/EmptyState'\nimport ActionHeader from '../../interactive/ActionHeader'\n\nexport default function VehiclesIndex({ startDate, vehicles }) {\n updatePageTitle('Vehicles')\n\n const list = useMemo(() => {\n return generateDisplayListActions(vehicles, [], [], true)\n }, [vehicles])\n\n return (\n \n \n Knowing which vehicles you used for your journeys helps us calculate your refund{' '}\n more accurately. \n \n {vehicles?.length ? (\n \n \n \n Add a vehicle\n \n \n \n ) : (\n \n \n )}\n \n )\n}\n\nVehiclesIndex.propTypes = {\n vehicles: PropTypes.arrayOf(PropTypes.object),\n startDate: PropTypes.object.isRequired\n}\n","import React, { Fragment, useEffect, useMemo } from 'react'\nimport PropTypes from 'prop-types'\n\nimport { updatePageTitle } from '../../../modules/legacyUtils'\nimport { generateDisplayListActions } from '../../../modules/timelines'\n\nimport Lead from '../../display/Lead'\nimport ConfigurableDisplayList from '../../display/ConfigurableDisplayList'\nimport EmptyState from '../../display/EmptyState'\nimport ActionHeader from '../../interactive/ActionHeader'\nimport { BulletList } from 'react-content-loader'\n\nimport helperTextData from '../../../data/helperTextData.json'\n\nconst generateActionsForEmployments = (locations, gaps) => {\n return locations.map(({ heading, employment_id, data, started_at, ended_at }) => {\n const employmentGaps = gaps.filter(gap => gap.related_resource_id === employment_id)\n\n return {\n heading,\n list: generateDisplayListActions(data, employmentGaps, [], false, {\n heading,\n startedAt: started_at,\n endedAt: ended_at\n })\n }\n })\n}\n\nexport default function WorkLocationsIndex({ lead, locationsGroupedByEmployment, startDate, gaps }) {\n useEffect(() => {\n updatePageTitle('Workplaces')\n }, [])\n\n const resourcesLoaded = !!locationsGroupedByEmployment\n const lists = useMemo(() => {\n if (locationsGroupedByEmployment?.length) {\n return generateActionsForEmployments(locationsGroupedByEmployment, gaps)\n } else {\n return []\n }\n }, [startDate, locationsGroupedByEmployment, gaps])\n\n const renderForm = () => (\n <>\n {lists.length ? (\n lists.map(({ heading, list }, i) => (\n \n \n \n Add a workplace\n \n \n \n ))\n ) : (\n \n \n where you've lived from ${timelineStartDate.format(\n 'MMMM YYYY'\n )} until now.`\n : \"Welcome to MyRIFT , and your first claim. Let's start by taking your current home address.\"\n }\n addresses={resources?.addresses}\n startDate={timelineStartDate}\n endDate={timelineEndDate}\n gaps={gaps}\n />\n }\n />\n who you've worked for from ${timelineStartDate.format(\n 'MMMM YYYY'\n )} until now.`}\n employments={resources?.employments}\n startDate={timelineStartDate}\n endDate={timelineEndDate}\n gaps={gaps}\n />\n }\n />\n who you've worked for from ${timelineStartDate.format(\n 'MMMM YYYY'\n )} until now.`}\n employments={resources?.employments}\n startDate={timelineStartDate}\n endDate={timelineEndDate}\n gaps={gaps}\n />\n }\n />\n\n the locations you worked at during your employments.\"\n locationsGroupedByEmployment={resources?.locations}\n startDate={timelineStartDate}\n endDate={timelineEndDate}\n gaps={gaps}\n />\n }\n />\n\n the locations you worked at during these employments.\"\n locationsGroupedByEmployment={resources?.locations}\n startDate={timelineStartDate}\n endDate={timelineEndDate}\n gaps={gaps}\n />\n }\n />\n\n \n {showTimeline && (\n \n \n \n Next step\n \n \n \n )\n }\n\n return (\n \n Back to Home \n \n )\n}\n\nfunction ConfigureableContentWrapper({ children, showGrid, showFooter, showWrapper, prevHref, nextHref, href }) {\n if (!showWrapper && !showGrid) {\n return children\n }\n\n if (showGrid) {\n return {children} \n }\n\n return (\n \n \n {children}\n \n {showFooter && \n )\n}\n\nexport default function RouterWrapper() {\n return (\n \n \n )\n}\n","import React, { useEffect, useState } from 'react'\nimport PreferencesForm from '../../interactive/PreferencesForm'\nimport BankAccountForm from '../../interactive/BankAccountForm'\n\nimport { fetch, redirectTo, isIterable } from '../../../modules/utils'\n\nconst INITIAL_BANK_STATE = {\n id: null,\n name: null,\n trading_name: null,\n alt_name: null\n}\n\nconst INITIAL_BANK_ACCOUNT_STATE = {\n bank_id: null,\n account_number: '',\n sort_code: '',\n account_holder: ''\n}\n\nconst INITIAL_PREFERENCES_STATE = {\n bank_account_id: null,\n current_address_strings: [],\n gm_refund_method: 'Cheque',\n gm_creation_method: 'MyRIFT',\n communication: {\n email: null,\n sms: null,\n phone: null,\n post: null\n }\n}\n\nexport default function PreferencesIndex() {\n const [fetching, setFetching] = useState(true)\n const [submitting, setSubmitting] = useState(false)\n const [showBankDetails, setShowBankDetails] = useState(false)\n const [bank, setBank] = useState(INITIAL_BANK_STATE)\n const [bankAccount, setBankAccount] = useState(INITIAL_BANK_ACCOUNT_STATE)\n const [preferences, setPreferences] = useState(INITIAL_PREFERENCES_STATE)\n const [bankAccountErrors, setBankAccountErrors] = useState({})\n const [onlyShowBankDetails, setOnlyShowBankDetails] = useState(false)\n\n useEffect(() => {\n setFetching(true)\n\n fetch('GET', '/preferences.json')\n .then(preferences => {\n setPreferences(preferences)\n })\n .catch(e => {\n if (isIterable(e)) {\n const [message] = e\n console.error('Could not fetch preferences: ' + message)\n }\n })\n\n // Use this to create a simple variant of this page that only ever renders the\n // bank details form. Used in the wizard.\n\n setOnlyShowBankDetails(!!window.location.search.match(/bank-details/))\n }, [])\n\n useEffect(() => {\n if (fetching && preferences !== INITIAL_PREFERENCES_STATE) {\n fetchBankDetails()\n setFetching(false)\n }\n }, [preferences])\n\n const fetchBankDetails = () => {\n const { bank_account_id } = preferences\n\n if (!bank_account_id) {\n setFetching(false)\n return\n }\n setFetching(true)\n fetch('GET', `/bank_accounts/${bank_account_id}.json`).then(bankAccount => {\n setBankDetails(bankAccount)\n setFetching(false)\n })\n }\n\n const setBankDetails = bankAccount => {\n const { id, bank_id, bank_name } = bankAccount\n\n setBankAccount(bankAccount)\n setBankAccountErrors({})\n setFetching(false)\n setPreferences({ ...preferences, bank_account_id: id })\n setShowBankDetails(onlyShowBankDetails)\n setSubmitting(false)\n\n if (!bank_id) {\n return setBank({ ...INITIAL_BANK_STATE, name: bank_name })\n }\n\n return fetch('GET', `/banks/${bank_id}.json`).then(bank => {\n setBank(bank)\n })\n }\n\n const handleChange = preferencesStatePatch => {\n setPreferences({ ...preferences, ...preferencesStatePatch })\n }\n\n const toggleBankAccountDisplay = () => {\n setShowBankDetails(!showBankDetails)\n }\n\n const redirectHome = () => {\n window.location = '/my_rift/dashboard'\n }\n\n const cancelBankAccountChange = () => {\n if (onlyShowBankDetails) {\n redirectHome()\n } else {\n toggleBankAccountDisplay()\n fetchBankDetails()\n }\n }\n\n const handleBankAccountChange = (bankAccountChange, bank) => {\n setBankAccount({ ...bankAccount, ...bankAccountChange })\n\n if (bank) {\n setBank(bank)\n }\n }\n\n const handleBankAccountSubmit = e => {\n e.preventDefault()\n\n const requestData = {\n bank_account: bankAccount,\n utf8: '✓'\n }\n\n setSubmitting(true)\n\n const httpMethod = bankAccount.id ? 'PUT' : 'POST'\n const url = bankAccount.id ? `/bank_accounts/${bankAccount.id}.json` : `/bank_accounts.json`\n\n return fetch(httpMethod, url, 'application/json', null, requestData)\n .then(bankAccount => setBankDetails(bankAccount))\n .then(() => {\n if (onlyShowBankDetails) {\n redirectHome()\n }\n })\n .catch(e => {\n if (isIterable(e)) {\n const [, data] = e\n setSubmitting(false)\n setBankAccountErrors(data.errors)\n }\n })\n }\n\n const handleCancel = e => {\n e.preventDefault()\n window.history.back()\n }\n\n const handleSubmit = e => {\n e.preventDefault()\n\n const requestData = {\n preferences,\n utf8: '✓'\n }\n\n setSubmitting(true)\n\n return fetch('PUT', '/preferences.json', 'application/json', null, requestData)\n .then(() => {\n return redirectTo(document.referrer || '/users/1')\n })\n .catch(() => {\n alert('There was a problem updating your preferences.')\n return redirectTo(document.referrer || '/users/1')\n })\n }\n\n // If we're only ever going to render the bank details form\n // wait for all data to finish loading before displaying\n // anything:\n if (onlyShowBankDetails && fetching) {\n return null\n }\n\n return (\n <>\n {showBankDetails || onlyShowBankDetails ? (\n \n General \n \n \n Saved Items \n \n \n Settings \n \n {passwordPath != '#' && (\n \n \n Back to Home \n \n \n \n \n \n \n \n
\n \n \n )\n }\n}\n\nAccount.propTypes = {\n addressesPath: PropTypes.string.isRequired,\n basicDetailsPath: PropTypes.string.isRequired,\n claimsPath: PropTypes.string.isRequired,\n closeAccountPath: PropTypes.string.isRequired,\n employersPath: PropTypes.string.isRequired,\n financesPath: PropTypes.string.isRequired,\n passwordPath: PropTypes.string.isRequired,\n preferencesPath: PropTypes.string.isRequired,\n vehiclesPath: PropTypes.string.isRequired\n}\n\nAccount.defaultProps = {\n claimStatus: 'unsubmitted'\n}\nexport default Account\n","import React from 'react'\nimport PropTypes from 'prop-types'\n\nimport WorkLocationForm from '../../interactive/WorkLocationForm'\nimport EmploymentForm from '../../interactive/EmploymentForm'\nimport VehicleForm from '../../interactive/VehicleForm'\nimport IdleHelpPanel from '../../interactive/IdleHelpPanel'\n\nimport {\n fetch,\n redirectTo,\n existsByProperty,\n highlightFirstError,\n mergeOrAddByProperty,\n values,\n isIterable\n} from '../../../modules/utils'\nimport { updatePageTitle } from '../../../modules/legacyUtils'\nimport { fetchExpenseFrequencies } from '../../../modules/api'\nimport { getRangeDuration, parseDate } from '../../../modules/dates'\nimport { defaultStateForEmployment } from '../../../modules/workLocation'\nimport { showIdleHelpPanel, onInteractionWithForm } from '../../../modules/idleHelpPanel'\nimport { trackEvent } from '../../../modules/tracking'\n\nclass WorkLocationsNew extends React.Component {\n constructor(props) {\n super(props)\n\n const { modEmployee, personEmploymentId, publicTransportExpenseKinds, startedAt, endedAt } = props\n\n const defaultStartedAt = startedAt ? new Date(startedAt) : null\n const defaultEndedAt = endedAt ? new Date(endedAt) : null\n\n const rangeDuration = getRangeDuration(parseDate(defaultStartedAt), parseDate(defaultEndedAt, new Date()))\n\n this.state = {\n workLocation: {\n person_employment_id: personEmploymentId || null,\n person_vehicle_id: null,\n address_id: null,\n ministry_of_defence: modEmployee,\n started_at: defaultStartedAt,\n ended_at: defaultEndedAt,\n current: !endedAt,\n quantitative_frequency: modEmployee ? null : 5,\n qualitative_frequency: modEmployee ? null : 'Per week',\n expected_time_at_post: null,\n expected_time_at_post_years: modEmployee ? rangeDuration.years : null,\n expected_time_at_post_months: modEmployee ? rangeDuration.months : null,\n expected_time_at_post_weeks: modEmployee ? 0 : null,\n expected_time_at_post_changed_at: null,\n travel_home_frequency: null,\n travel_home_quantitative_frequency: !modEmployee ? null : 5,\n travel_home_qualitative_frequency: !modEmployee ? null : 'Per week',\n complex_routine: null,\n show_complex_routine: false,\n name: null,\n public_transport_expenses: [],\n received_reimbursements: !modEmployee ? null : false,\n reimbursements_quantity: null,\n address: {\n name: null,\n first_line: null,\n second_line: null,\n town: null,\n county: null,\n country: null,\n postcode: null,\n latitude: null,\n longitude: null\n },\n public_transport_options: {\n bus: false,\n train: false,\n tram: false,\n tube: false\n },\n transport: {\n own_vehicle: false,\n public_transport: false,\n car_share: false,\n company_vehicle: false,\n pickup_point: false,\n other: false\n }\n },\n addressLoaded: false,\n employmentId: null,\n employments: [],\n employmentsLoaded: false,\n errors: {},\n expenseFrequencies: [],\n publicTransportExpenseKinds: publicTransportExpenseKinds,\n showEmploymentForm: false,\n showVehicleForm: false,\n vehicleId: null,\n vehicles: [],\n vehiclesLoaded: false,\n workLocationLoaded: !props.id\n }\n\n this.showEmploymentForm = this.showEmploymentForm.bind(this)\n this.showVehicleForm = this.showVehicleForm.bind(this)\n this.showWorkLocationForm = this.showWorkLocationForm.bind(this)\n this.setWorkLocationState = this.setWorkLocationState.bind(this)\n this.handleSubmit = this.handleSubmit.bind(this)\n this.handleCancel = this.handleCancel.bind(this)\n }\n\n newRecord() {\n const { workLocation } = this.state\n return !workLocation.id\n }\n\n trackFilledInEvent(type) {\n if (this.newRecord()) {\n trackEvent(`Work location ${type} filled in`)\n }\n }\n\n showEmploymentForm(employmentId) {\n this.setState({\n employmentId,\n showEmploymentForm: true\n })\n }\n\n showVehicleForm(vehicleId) {\n this.setState({\n vehicleId,\n showVehicleForm: true\n })\n }\n\n showWorkLocationForm(e) {\n const newRecordCreated = e && !e.preventDefault\n\n if (!newRecordCreated) {\n e.preventDefault()\n return this.setState({\n showEmploymentForm: false,\n showVehicleForm: false\n })\n }\n\n // Merge or add the employment or vehicle to state to save a server\n // load:\n const record = e\n const isVehicle = !!record.vehicle\n const { vehicles, employments, workLocation } = this.state\n const model = isVehicle ? 'vehicles' : 'employments'\n const collection = isVehicle ? vehicles : employments\n const newRecord = !existsByProperty(collection, record.id, 'id')\n\n const nextState = {\n showEmploymentForm: false,\n showVehicleForm: false,\n [model]: mergeOrAddByProperty(collection, record, 'id')\n }\n\n // Sometimes we'll just be updating a record, in which case we don't want to\n // select it:\n if (newRecord) {\n if (isVehicle) {\n nextState['workLocation'] = {\n ...workLocation,\n person_vehicle_id: record.id\n }\n\n this.trackFilledInEvent('vehicle')\n } else {\n // employment\n nextState['workLocation'] = {\n ...workLocation,\n ...defaultStateForEmployment(record.id, record.ministry_of_defence)\n }\n\n this.trackFilledInEvent('employment')\n }\n }\n\n this.setState(nextState)\n }\n\n fetchErrors() {\n const { id } = this.props\n fetch('GET', `/work_locations/${id}/valid.json`).then(errors => {\n this.setState({ errors })\n })\n }\n\n fetchWorkLocation() {\n const { id } = this.props\n return fetch('GET', `/work_locations/${id}/edit.json`).then(workLocation => {\n this.setState({\n workLocation,\n workLocationLoaded: true\n })\n })\n }\n\n fetchEmployments() {\n fetch('GET', '/employments.json').then(employments =>\n this.setState({\n employments,\n employmentsLoaded: true\n })\n )\n }\n\n fetchVehicles() {\n fetch('GET', '/vehicles.json').then(vehicles =>\n this.setState({\n vehicles,\n vehiclesLoaded: true\n })\n )\n }\n\n selectedEmployment() {\n const { employments, employmentId } = this.state\n return employments.find(employment => employment.id == employmentId) || {}\n }\n\n selectedVehicle() {\n const { vehicles, vehicleId } = this.state\n return vehicles.find(vehicle => vehicle.id == vehicleId) || {}\n }\n\n componentDidMount() {\n const { id } = this.props\n\n this.fetchEmployments()\n this.fetchVehicles()\n fetchExpenseFrequencies().then(frequencies => this.setState({ expenseFrequencies: frequencies }))\n\n if (id) {\n this.fetchWorkLocation().then(() => {\n const { workLocation } = this.state\n if (!workLocation.valid) {\n this.fetchErrors()\n highlightFirstError()\n }\n })\n }\n }\n\n setWorkLocationState(workLocation, errors = {}) {\n this.setState({ workLocation, errors })\n }\n\n hasErrors() {\n const { errors } = this.state\n return !!values(errors).find(e => e && e.length)\n }\n\n handleCancel(e) {\n e.preventDefault()\n window.history.back()\n }\n\n handleSubmit(e) {\n e.preventDefault()\n\n const { authenticityToken, id, afterSubmitPath } = this.props\n const { workLocation } = this.state\n\n if (this.hasErrors()) {\n return highlightFirstError()\n }\n\n const requestData = {\n api_person_location: workLocation,\n utf8: '✓',\n authenticity_token: authenticityToken\n }\n\n const requestVerb = id ? 'PUT' : 'POST'\n const requestUri = id ? `/work_locations/${id}.json` : '/work_locations.json'\n\n return fetch(requestVerb, requestUri, 'application/json', null, requestData)\n .then(() => {\n return redirectTo(afterSubmitPath)\n })\n .catch(e => {\n if (isIterable(e)) {\n const [, data] = e\n this.setState({ errors: data.errors }, function () {\n highlightFirstError()\n })\n }\n })\n }\n\n // This just avoids excessive re-rendering of components while we wait for\n // The data we need to load from the rails server\n waitToRender() {\n const { workLocationLoaded, employmentsLoaded, vehiclesLoaded } = this.state\n return !workLocationLoaded || !employmentsLoaded || !vehiclesLoaded\n }\n\n getPageTitle() {\n const { id } = this.props\n const { showEmploymentForm, employmentId, showVehicleForm, vehicleId } = this.state\n\n if (showEmploymentForm) {\n return `${employmentId ? 'Edit' : 'New'} employer`\n }\n\n if (showVehicleForm) {\n return `${vehicleId ? 'Edit' : 'New'} vehicle`\n }\n\n return `${id ? 'Edit' : 'New'} workplace`\n }\n\n renderForm() {\n const { constructionEmployee, modEmployee, authenticityToken } = this.props\n const { showEmploymentForm, employments, workLocation, showVehicleForm, vehicles, errors } = this.state\n\n updatePageTitle(this.getPageTitle())\n\n if (showEmploymentForm) {\n return (\n onInteractionWithForm()}\n />\n )\n } else {\n return (\n vehicle.option_data)}\n onShowEmploymentForm={this.showEmploymentForm}\n onShowVehicleForm={this.showVehicleForm}\n onCancel={this.handleCancel}\n onChange={e => {\n onInteractionWithForm()\n this.setWorkLocationState(e)\n }}\n onSubmit={this.handleSubmit}\n errors={errors}\n />\n )\n }\n }\n\n render() {\n if (this.waitToRender()) {\n return null\n }\n\n return (\n <>\n {this.renderForm()}\n {showIdleHelpPanel(this.props.afterSubmitPath) && ${resourceHeading} ?`\n questionHeading = 'Change of address'\n questionText = `When did you move out of ${resourceHeading}?`\n break\n case 'employment':\n const modEmployment = !!lastResource.mod_branch\n timelineString = `Are you still working for${modEmployment ? ' the' : ''} ${resourceHeading} ?`\n questionHeading = 'End of employment'\n questionText = `When did you leave${modEmployment ? ' the' : ''} ${resourceHeading}?`\n break\n case 'employmentGap':\n timelineString = `Are you still unemployed ?`\n questionHeading = 'End of unemployment'\n questionText = `When did your unemployment end?`\n break\n case 'location':\n timelineString = `Are you still working at ${resourceHeading} ?`\n questionHeading = 'Change of workplace'\n questionText = `When did you stop working at ${resourceHeading}?`\n break\n case 'locationGap':\n timelineString = `Are you still not travelling to work ?`\n questionHeading = 'End of non-travel period'\n questionText = `When did you start travelling to work again?`\n break\n default:\n // These are never intended to display, but provide a serviceable default if for some\n // reason this ends up being accidentally used for an unsupported resource:\n timelineString = `Are you still at ${resourceHeading} ?`\n questionHeading = 'Change of end date'\n questionText = `When did you stop at ${resourceHeading}?`\n }\n\n const displayData = {\n timelineString,\n questionHeading,\n questionText,\n componentName: 'TimelineEndedAtPrompt',\n resourceType: resourceType,\n resourceId: lastResource.id\n }\n\n if (resourceType === 'location') {\n // These additional attributes are included so the retntion prompt can validate the supplied date\n // falls within the date of the employment this location is related to.\n displayData.relatedResourceHeading = additionalRetentionPromptData.heading\n displayData.minDate = parseDate(additionalRetentionPromptData.startedAt)\n displayData.maxDate = parseDate(additionalRetentionPromptData.endedAt, new Date())\n }\n\n resourcesAndGaps.splice(index, 0, {\n display_data: displayData\n })\n}\n\nfunction inferResourceType(resource) {\n switch (resource.class_name) {\n case 'Api::Person::Address':\n return 'address'\n break\n case 'Api::Person::Employment':\n return 'employment'\n break\n case 'Api::Person::EmploymentGap':\n return 'employmentGap'\n break\n case 'Api::Person::Location':\n return 'location'\n break\n case 'Api::Person::LocationGap':\n return 'locationGap'\n break\n }\n}\n\nfunction inDateRanges(periodStart, periodEnd, timelineGapDateRanges) {\n return timelineGapDateRanges.some(({ started_at, ended_at }) => {\n return periodStart >= started_at && periodEnd <= ended_at\n })\n}\n\nfunction toFirstDayOfMonth(date) {\n return date.date(1).hour(1).minute(0).second(0)\n}\n\nfunction toLastDayOfMonth(date) {\n return date.add(1, 'month').date(1).hour(1).minute(0).second(0).subtract(1, 'day')\n}\n\nfunction retentionDate() {\n const day = window.myRIFT.config.retentionDay\n const month = window.myRIFT.config.retentionMonth - 1\n const year = new Date().getFullYear()\n return new Date(year, month, day, 0, 0, 0, 0)\n}\n\nfunction afterNewRetentionDate() {\n return new Date() > retentionDate()\n}\n","import { fetch } from './utils'\n\nexport function trackEvent(name, data) {\n const postData = { event: { name, data } }\n return fetch('POST', '/events', 'application/json', null, postData).catch(() => {\n const windowMixpanelPresent = window.myRIFT.helpers.windowMixpanelPresent()\n if (windowMixpanelPresent) {\n window.mixpanel.track(name, data)\n return true\n }\n })\n}\n","export const BREAKPOINTS = {\n LARGE: 1120,\n MEDIUM: 768,\n SMALL: 576\n}\n\nexport function prefersReducedMotion() {\n return window.matchMedia('(prefers-reduced-motion: reduce)').matches\n}\n\nexport function preloadImages(urls) {\n urls.forEach(url => {\n const img = new Image()\n img.src = url\n })\n}\n\nexport function generateModifierClasses(componentClass, modifiers) {\n if (!modifiers) {\n return componentClass\n }\n\n return []\n .concat(modifiers)\n .map(modifier => `${componentClass}--${modifier}`)\n .concat([componentClass])\n .join(' ')\n}\n\nexport function buttonClasses(classes, modifiers, type) {\n let buttonClasses = classes || []\n modifiers = modifiers || []\n if (type == 'submit') {\n modifiers.push('primary')\n }\n buttonClasses = buttonClasses.concat(generateModifierClasses('button', modifiers))\n return buttonClasses.join(' ')\n}\n\nexport function fetch(method, railsRoute, contentType = null, accept = null, data = null, noAuth = false) {\n return new Promise(function (resolve, reject) {\n let xhr = new XMLHttpRequest()\n xhr.open(method, railsRoute)\n window.ajaxCount = window.ajaxCount == -1 ? 1 : window.ajaxCount + 1\n\n if (['POST', 'PATCH', 'PUT', 'DELETE'].indexOf(method) >= 0 && !noAuth) {\n const tokenElement = document.querySelector('meta[name=\"csrf-token\"]')\n const auth = tokenElement && tokenElement.getAttribute('content')\n xhr.setRequestHeader('X-CSRF-Token', auth)\n }\n\n if (contentType) {\n xhr.setRequestHeader('Content-Type', contentType)\n }\n\n if (accept) {\n xhr.setRequestHeader('Accept', contentType)\n }\n\n xhr.onload = function ({ target }) {\n // Sometimes we see errors arising from JSON endpoints not returning\n // JSON. This is just to log those responses when that happens to help\n // with debugging:\n if (!includes(['{', '['], target?.response[0]) && window.rg4js) {\n rg4js('recordBreadcrumb', 'Unparseable success JSON', {\n response: target.response\n })\n }\n\n window.ajaxCount -= 1\n console.log(`Fetched ${railsRoute} - ${window.ajaxCount || 'None'} remain.`)\n\n if (target.status === 500) {\n return reject([target.statusText], 500)\n }\n\n // We're logged out and Rails is returning us the login screen HTML.\n if (target && target.response.indexOf('You need to sign in or sign up') !== -1) {\n window.location = '/users/sign_in?session_expired=t'\n }\n\n if (target.status !== 200) {\n return reject([target.statusText, JSON.parse(target.response)])\n }\n\n resolve(JSON.parse(target.response))\n }\n\n xhr.onerror = function (e) {\n window.ajaxCount -= 1\n console.log(`Failed to fetch ${railsRoute} - ${window.ajaxCount || 'None'} remain.`)\n if (window.rg4js) {\n rg4js('send', e)\n }\n return reject(e)\n }\n\n xhr.send(data && JSON.stringify(data))\n })\n}\n\nexport function fullPath(path, queryObject) {\n const queryString = Object.keys(queryObject)\n .map(key => key + '=' + queryObject[key])\n .join('&')\n return queryString ? `${path}?${queryString}` : path\n}\n\nexport function redirectTo(path) {\n window.location = path\n}\n\nexport function propagateValue(name, value) {\n const { handlePropagation, onChange } = this.props\n if (handlePropagation) {\n const method = methodFromString(handlePropagation)\n method && method(name, value)\n }\n if (onChange) {\n onChange({ [name]: value })\n }\n}\n\nexport function methodCallFromString(originalOnClick) {\n let onClick = originalOnClick\n\n if (typeof originalOnClick === 'string') {\n onClick = function () {\n try {\n const callableFunction = new Function('event', originalOnClick)\n callableFunction.call(this)\n } catch (error) {\n console.error('Error executing the function:', error)\n }\n }\n }\n\n return onClick\n}\n\nexport function handleBreakpoint(breakpoint, smallerFunction, largerFunction) {\n let biggerThanBreakpoint = this.state._biggerThanBreakpoint || {}\n biggerThanBreakpoint[breakpoint] = window.innerWidth >= breakpoint\n this.setState({ _biggerThanBreakpoint: biggerThanBreakpoint })\n\n window.addEventListener('resize', e => {\n let biggerThanBreakpoint = this.state._biggerThanBreakpoint || {}\n const { innerWidth } = e.target\n\n if (innerWidth >= breakpoint && !biggerThanBreakpoint[breakpoint]) {\n biggerThanBreakpoint[breakpoint] = true\n this.setState({ _biggerThanBreakpoint: biggerThanBreakpoint }, largerFunction)\n } else if (innerWidth < breakpoint && biggerThanBreakpoint[breakpoint]) {\n biggerThanBreakpoint[breakpoint] = false\n this.setState({ _biggerThanBreakpoint: biggerThanBreakpoint }, smallerFunction)\n }\n })\n}\n\nexport function methodFromString(string) {\n if ('function' === typeof string) {\n return string\n }\n const keys = string.replace('window.', '').split('.')\n let object = window\n for (var i = 0; i < keys.length; i++) {\n object = object[keys[i]]\n }\n if ('function' === typeof object) {\n return object\n }\n return false\n}\n\n// If you are requesting the same path as your current path, you may need to add `.json`\n// to the path so that browsers don't cache the request when navigating back and forward\nexport function setStateFromPath(method, path, emptyState = {}) {\n return fetch(method, path, 'application/json', 'application/json')\n .then(data => this.setState(data || emptyState))\n .catch(e => {\n if (e) {\n console.error('Fetch failed: ' + e)\n }\n })\n}\n\nexport function setStateValueFromPath(method, path, value) {\n fetch(method, path, 'application/json', 'application/json')\n .then(data => this.setState({ [value]: data }))\n .catch(e => {\n if (e) {\n console.error('Fetch failed: ' + e)\n }\n })\n}\n\nexport function isIterable(obj) {\n if (!obj) {\n console.error('Expected an iterable, got nothing.')\n return false\n }\n if (typeof obj[Symbol.iterator] === 'function') {\n return true\n } else {\n console.error(`Expected an iterable, got: ${obj}.`)\n return false\n }\n}\n\nexport function helperId() {\n const { name, id, helperId } = this.props\n return helperId || `helper-${name || id}`\n}\n\nexport function inputName() {\n const { name, resourceName } = this.props\n return `${resourceName}[${name}]`\n}\n\nexport function inputId(includeValue = true) {\n const { name, value, resourceName } = this.props\n let niceValue = value\n if (typeof niceValue == 'string') niceValue = niceValue.toLowerCase()\n const prefix = resourceName.replace('[', '_').replace(']', '')\n return includeValue ? `${prefix}_${name}_${niceValue}` : `${prefix}_${name}`\n}\n\nexport function highlightFirstError() {\n setTimeout(function () {\n const errorItem = document.querySelector('.form-group--error')\n\n if (!errorItem) return false\n\n errorItem.closest('.form-group--error').scrollIntoView({ behavior: 'smooth', block: 'start' })\n\n errorItem.classList.remove('shake')\n setTimeout(function () {\n errorItem.classList.add('animated', 'animated--snail', 'shake')\n }, 100)\n }, 100)\n}\n\nexport function mapSrc(center, width, height, zoom = null) {\n const { google_api_key } = window\n let src = `https://maps.googleapis.com/maps/api/staticmap?key=${google_api_key}¢er=${center}&size=${width}x${height}&scale=2`\n if (zoom) src = `${src}&zoom=${zoom}`\n return src\n}\n\nexport function hasValues(obj) {\n if (!obj) {\n return false\n }\n\n const values = Object.keys(obj).map(key => obj[key])\n return values.some(value => !!value)\n}\n\nexport function existsByProperty(array, value, property) {\n return array.find(currentItem => currentItem[property] == value)\n}\n\nexport function mergeOrAddByProperty(array, item, property) {\n const existingItem = existsByProperty(array, item[property], property)\n\n if (!existingItem) {\n return array.concat(item)\n }\n\n array.splice(array.indexOf(existingItem), 1, item)\n return array\n}\n\nexport function getOrdinalIndicator(date) {\n if (date > 3 && date < 21) return 'th'\n switch (date % 10) {\n case 1:\n return 'st'\n case 2:\n return 'nd'\n case 3:\n return 'rd'\n default:\n return 'th'\n }\n}\n\nexport function omit(obj, omittedKeys) {\n if (!obj) {\n return {}\n }\n\n const result = {}\n\n const keys = Object.keys(obj)\n\n keys.forEach(key => {\n if (omittedKeys.indexOf(key) === -1) {\n result[key] = obj[key]\n }\n })\n\n return result\n}\n\nexport function capitalize(string) {\n return `${string[0].toUpperCase()}${string.slice(1)}`\n}\n\nexport function pick(obj, pickedKeys) {\n if (!obj) {\n return {}\n }\n\n if (!pickedKeys || !pickedKeys.length) {\n return { ...obj }\n }\n\n const result = {}\n\n pickedKeys.forEach(key => {\n if (obj[key] !== undefined) {\n result[key] = obj[key]\n }\n })\n\n return result\n}\n\nexport function snakeCase(str) {\n return (\n str &&\n str\n .match(/[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g)\n .map(x => x.toLowerCase())\n .join('_')\n )\n}\n\nexport function flatten(array) {\n let result = []\n for (let i = 0; i < array.length; i++) {\n result = result.concat(array[i])\n }\n return result\n}\n\nexport function groupBy(items, key) {\n const result = {}\n\n items.forEach(item => {\n if (result[item[key]]) {\n result[item[key]].push(item)\n } else {\n result[item[key]] = [item]\n }\n })\n\n return result\n}\n\nexport function uuidv4() {\n const str = () => ('00000000000000000' + (Math.random() * 0xffffffffffffffff).toString(16)).slice(-16)\n const a = str()\n const b = str()\n return a.slice(0, 8) + '-' + a.slice(8, 12) + '-4' + a.slice(13) + '-a' + b.slice(1, 4) + '-' + b.slice(4)\n}\n\nexport function isUuidv4(value) {\n return (\n typeof value === 'string' &&\n new RegExp('^[0-9A-F]{8}-[0-9A-F]{4}-4[0-9A-F]{3}-[89AB][0-9A-F]{3}-[0-9A-F]{12}$', 'i').test(value)\n )\n}\n\nexport const findBy = (items, property, value) => {\n return items.find(e => e[property] == value)\n}\n\nexport const findIndexBy = (items, property, value) => {\n return items.findIndex(e => e[property] == value)\n}\n\nexport const removeIndex = (items, index) => {\n const result = [].concat(items)\n result.splice(index, 1)\n return result\n}\n\nexport const updateIndex = (items, index, newEntry) => {\n const result = [].concat(items)\n result[index] = newEntry\n return result\n}\n\nexport const deDupe = items => {\n return [...new Set(items)]\n}\n\nexport const pluck = (items, key) => {\n return items.map(item => item[key])\n}\n\nexport const includes = (items, item) => {\n return items.indexOf(item) !== -1\n}\n\nexport const values = obj => {\n if (!obj) {\n return []\n }\n\n return Object.keys(obj).map(e => obj[e])\n}\n\nexport const toggleInclusion = (items, item) => {\n const index = items.indexOf(item)\n if (index === -1) {\n return [item].concat(items)\n }\n return removeIndex(items, index)\n}\n\nexport const goToEndOfInput = input => {\n if (input.createTextRange) {\n const fieldRange = input.createTextRange()\n fieldRange.collapse(false)\n fieldRange.select()\n } else {\n const length = input.value.length\n // Waits for the cursor to be placed.\n setTimeout(function () {\n input.setSelectionRange(length, length)\n }, 0)\n }\n}\n","export function defaultStateForEmployment(employmentId, employmentIsMod) {\n return {\n ministry_of_defence: employmentIsMod,\n person_employment_id: employmentId,\n expected_time_at_post: null,\n complex_routine: null,\n travel_home_frequency: null,\n quantitative_frequency: employmentIsMod ? null : 5,\n qualitative_frequency: employmentIsMod ? null : 'Per week',\n expected_time_at_post_years: employmentIsMod ? 2 : null,\n expected_time_at_post_months: employmentIsMod ? 0 : null,\n expected_time_at_post_weeks: employmentIsMod ? 0 : null,\n expected_time_at_post_changed_at: null,\n travel_home_quantitative_frequency: employmentIsMod ? 5 : null,\n travel_home_qualitative_frequency: employmentIsMod ? 'Per week' : null,\n name: null,\n received_reimbursements: employmentIsMod ? false : null\n }\n}\n","/* eslint no-console:0 */\n// This file is automatically compiled by Webpack, along with any other files\n// present in this directory. You're encouraged to place your actual application logic in\n// a relevant structure within app/javascript and only use these pack files to reference\n// that code so it'll be compiled.\n//\n// To reference this file, add <%= javascript_pack_tag 'application' %> to the appropriate\n// layout file, like app/views/layouts/application.html.erb\n\n// Keep an ajax counter (useful for knowing when the page\n// has loaded in tests. Set it to 0 if no ajax is performed.\n\nwindow.ajaxCount = -1\nwindow.loaded = false\n\nwindow.addEventListener('load', function () {\n window.loaded = true\n if (window.ajaxCount === -1) {\n window.ajaxCount = 0\n }\n})\n\nwindow.addEventListener('unload', function () {\n window.loaded = false\n})\n\n// Support component names relative to this directory:\nvar myCustomContext = require.context('components', true)\nvar ReactRailsUJS = require('react_ujs')\nReactRailsUJS.useContext(myCustomContext)\n"],"names":["map","webpackContext","req","id","webpackContextResolve","__webpack_require__","o","e","Error","code","keys","Object","resolve","module","exports","label","microcopy","onEdit","imageSrc","banks","React","Options","OptionsItem","OptionsItemLabel","modifiers","OptionsItemImage","src","alt","OptionsItemText","OptionsItemButton","onClick","children","className","generateModifierClasses","actionHref","actionLabel","link","href","Card","renderPreview","heading","preview","this","props","previewClasses","imgSrc","PreviewSvg","_extends","svg","render","missingInfoLink","progress","concat","push","cardClasses","CardTextSnippet","ProgressBar","defaultProps","CardPlaceholder","name","placeholderFromString","ClaimTracker","constructor","super","lastTab","trackers","filter","tracker","tax_years_label","pop","state","activeProgressOrder","progress_order","tabClicked","bind","getDerivedStateFromProps","prevTrackers","preventDefault","setState","parseInt","target","getAttribute","getStepModifiers","progressOrder","getExpectedCompleted","stepData","expected_complete_at","renderProgressTabs","tabs","length","Tabs","TabsList","data","index","TabsItem","key","TabsLink","value","renderPayoutList","refund","paidAt","rapidRefundLabels","refundLabel","payoutLabel","Date","toLocaleDateString","renderDisplayStatus","activeProgressTab","find","expected_refund","expected_paid_at","description","rapid_refund_payout_labels","Fragment","dangerouslySetInnerHTML","__html","footerLink","ContentWrapper","ContentWrapperInner","ClaimTrackerStep","expectedCompleted","iconName","icon_name","text","ContentFooter","ContentFooterLink","Emoji","EmojiImage","ConfigurableDisplayList","list","placeholderName","small","width","useViewport","columnCount","BREAKPOINTS","LARGE","mediumScreen","MEDIUM","DisplayList","item","i","keyText","componentName","TimelineEndedAtPrompt","timelineString","TimelineGap","renderPlaceholders","_item","classes","active","itemClasses","join","detail","buttonText","icon","omit","title","imgAlt","FeaturesList","features","feature","copy","File","activeTabIndex","nameValue","fileName","fileClicked","handleNameChange","tab","onClose","classList","contains","renderTabs","onDelete","Button","Icon","renderView","fileSize","AnchorButton","renderEdit","TextQuestion","autoComplete","resourceName","handlePropagation","ButtonGroup","ButtonGroupItem","buttonModifiers","element","disabled","FileInner","FlashMessage","body","messageList","type","dismissed","setDismissed","useState","validType","indexOf","alertClasses","validTitle","bodyChildren","message","FloatingContainer","mini","open","direction","OverlayWrapper","Helper","handleClickClose","helper","closest","remove","header","innerClasses","additionalInnerClasses","helperLink","handleClick","closeable","additionalContent","HelperTrigger","helperId","eventLabel","trackEvent","document","getElementById","toggle","tabIndex","ImageLinkList","items","onLinkClick","url","image","Lead","helperText","uuidv4","Logo","Home","My","Base","Modal","closeModal","displayed","classNames","padding","ANIMATION_DURATION","prefersReducedMotion","PillCarousel","slides","activeIndex","setActiveIndex","transition","setTransition","mobile","imageUrls","slide","mobileImage","useEffect","preloadImages","slideTo","nextIndex","animate","getNextIndex","useSwipeable","onSwipedLeft","onSwipedRight","imageAlt","pillLabel","pillIcon","slideIndex","PreviewSvgWrapper","PreviewSvgWrapperInner","svgFromString","max","Tile","tileAction","to","status","tileClasses","TileAction","redirectTo","iconFromString","imgName","TileInner","modifier","renderStatus","Link","Timeline","loaded","startDate","endDate","gaps","months","useMemo","timelineMonths","date","filled","TimelineStep","actions","ActionBar","srText","timelineClasses","APRIL","humanDateMonth","format","humanDateYear","month","dateTime","TitledDescriptionList","titleEl","DescriptionList","modifierClasses","ImageTrustpilotCombo","primaryImgUrl","primaryImgAlt","secondaryImgUrl","secondaryImgAlt","trustPilotSlides","TrustpilotCarousel","isSingleSlide","onLinkToTrustpilot","person","Stars","Action","buttonGroupClasses","buttonGroupMods","actionBarModClasses","mod","componentList","DatePicker","FloatingDatePicker","ErrorSpan","actionComponents","forEach","action","ActionComponent","ActionHeader","ActionList","window","innerWidth","componentDidMount","handleBreakpoint","apply","setTwoCol","unsetTwoCol","placesholders","amount","child","ActionsModal","handleOnClick","actionOnClick","methodCallFromString","trackingEvent","then","location","footer","AddressForm","current","onChange","renderDates","locked","endedAtLocked","address","errors","DateRangeQuestion","resource","questionText","helperTextData","currentName","currentChecked","fromError","started_at","toError","ended_at","currentText","fromDisabled","toDisabled","flash","flashType","handleSubmit","cancelClicked","FormWrapper","onSubmit","AddressLookupWithManualFallback","buttonClasses","formatTypedAccountNumber","previousAccountNumber","newAccountNumber","test","formatTypedSortCode","previousSortCode","newSortCode","numberChar","dashChar","writing","substr","typingThirdOrSixthCharacterAsNumber","typingThirdOrSixthCharacterAsDash","typingSecondOrFifthCharacterAsNumber","val","appendDash","BankAccountForm","handleBankChange","handleAccountNumberChange","handleSortCodeChange","handleAccountHolderChange","verb","bankAccount","updatePageTitle","changeNavVisibility","bank","bank_id","bank_name","account_number","sort_code","account_holder","onCancel","submitting","FormGroup","Question","BankInput","error","InputGroup","InputGroupItem","FormGroupHeader","FormGroupInput","FormGroupErrorMessage","DEFAULT_STATE","manual","selectionMade","getInitialState","toggleManualEntry","setBankState","setCustomBank","reset","organisation","renderManualEntry","defaultValue","FormLink","renderSelectedBank","trading_name","Bank","TypeAhead","lookupFunction","bankLookup","onSelection","placeholder","BasicDetailsForm","formatNinoValue","v","currentValue","user","national_insurance_number","toUpperCase","ninoValue","replace","formattedValue","substring","renderMODQuestions","MilitaryDataQuestions","renderTrades","trades","mainTrades","tradeOptions","trade","tradeSelections","OptionsList","options","selections","trade_id","modEmployee","full_name","email","phone","unique_tax_reference","reference_number","date_of_birth","DateGroup","showDay","dateChanged","minYear","getFullYear","maxYear","childProps","CheckBoxGroupInput","handleChange","checked","renderCheckBoxes","optionsItemModifiers","option","htmlFor","OptionsItemInput","OptionsItemIndicator","REFUND_METHOD_STEPS","YES_NO_STEPS","ClaimWizard","blank","fetchingState","currentData","notCurrent","pickerDirection","deferQueueableStep","setNotCurrent","setEndDate","setRefundMethod","setStateFromPath","setDirectionRight","setDirectionLeft","skipStep","secondaryText","refundMethod","setStageComplete","complete","previousStep","step","createButtonGroupItem","buttonType","renderQueueButtonGroupItems","renderRefundMethodButtonGroupItems","skipText","renderYesNoButtonGroupItems","renderPrimaryButtonGroupItemWithOptionalSkip","renderButtonGroupItems","queueable","renderButtonGroup","media","day","year","initialised","initialise","nextProps","dateValue","newDate","getDate","toString","padStart","getMonth","UNSAFE_componentWillReceiveProps","stateAttribute","propagateDate","inputName","postfix","inputId","dayInput","dayClasses","dayOptions","monthInput","monthClasses","monthOptions","monthNames","yearInput","min","required","hint","DateRangeInput","toggleChange","toName","undefined","renderToggle","prefix","defaultChecked","fromName","fromMinYear","fromMaxYear","toMinYear","toMaxYear","includeDay","Boolean","defaultDay","disabledText","ref","toDatePickerRef","DurationInput","years","weeks","timePeriod","nextState","valueErroneous","yearsError","monthsError","weeksError","Stepper","BENEFITS_OPTIONS","EmploymentForm","handleCancel","companySelected","toggleManualName","handleBenefitsChange","benefitsOptions","unchangedEmployment","addedValues","benefits","self_employed","ministry_of_defence","mod_branch","employment","assign","manualName","constructionEmployee","employmentUpdate","newState","medical_benefit","car_benefit","fuel_benefit","employer_loan","other","paid_under_cis","updatedParams","received_travel_reimbursements","onInteractionWithForm","company","isMOD","afterSubmitPath","onAfterSubmit","authenticityToken","method","path","formData","api_person_employment","utf8","authenticity_token","fetch","catch","isIterable","console","JSON","stringify","highlightFirstError","industry","YesNoQuestion","questionHeading","modQuestions","NonModQuestions","hideSelfEmployed","companyLookup","dates","history","back","nextBenefits","hideIndustry","showReimbursementsQuestion","showCijcQuestion","includeDontKnow","showIdleHelpPanel","IdleHelpPanel","page","EmploymentGapForm","unchangedEmploymentGap","employmentGap","employmentGapUpdate","referrer","api_person_employment_gap","EndedAtModal","minDate","maxDate","onConfirm","DateQuestion","errorChildren","spanProps","Array","isArray","ExpenseInputContainer","sub","expanded","first","last","ExpenseInputTitle","subtitle","ExpenseInputForm","expense","frequencies","showDescription","cost","expenseData","cleanInputPrice","formatPrice","onBlur","FrequencyDurationInput","ExpenseInputAction","ExpenseInput","dailyFoodCharge","expenses","expenseKindId","subExpenses","onAdd","onUpdate","onRemove","personLocationId","subExpensesVisible","defaultFrequency","freq","default","newExpense","defaultExpenseData","updateExpense","isNew","isUuidv4","hasCost","hasDescription","hasDates","hasUpdatedFrequency","expense_duration_id","newEmptyExpense","existingPricelessExpense","expenseFields","addExpense","ex","FetchAndRedirectButton","redirect_path","FilteredSelect","currentFilterIndex","fetchData","pathPrefix","filters","currentFilter","queryObject","pick","params","setStateValueFromPath","fullPath","indexOfFilterByName","selectedIndex","newFilterIndex","Math","propagateValue","lists","popularOptions","string","selectDefault","unshift","FinanceForm","finance","leadText","showCancelButton","submitButtonLabel","unpaid_tax","student_loan","bankruptcy","completed_tax_return","limited_company","working_from_home","FloatingPicker","showPicker","inputRef","hidePicker","blur","input","displayValue","readOnly","pickerClasses","Picker","onComplete","additionalClasses","noValidate","DATE_FORMAT","CLOSED_STATE","OPEN_STATE","OPEN_DATE_STATE","chosenFrequency","frequencyId","f","frequencyLabel","frequency","unit","durationLabel","longLabel","dayjs","FrequencySection","setVisualState","FloatingContainerInner","handleFrequencyChange","DurationSection","focusedField","setFocusedField","startOfClaimDate","endOfClaimDate","timelineDateRange","d","toDate","oneOff","currentYear","startedAtVal","endedAtVal","startFocused","endFocused","autoFocus","onFocus","showNav","handleDateCompletion","handleStartEndClaimPeriodClick","areSameDates","visualState","FrequencyInput","qualitativeFrequency","quantitativeFrequency","showDeprecatedOptions","Select","GeneralExpenseForm","employments","expenseKinds","expenseGroups","expenseFrequencies","visibleExpenseGroups","expenseGroup","expensesForKind","expense_kind_id","expenseGroupIndex","kindsForExpenseGroup","k","expense_group_id","workplace","expenseGroupKinds","snakeCase","general","headingContent","expenseKind","kindIndex","previousExpanded","frequenciesForExpenseKind","STUCK_TIMEOUT","idleTimeoutData","stuck","IDLE_TIMEOUT","idle","AUTO_HIDE_TIMEOUT","panelIsDisabled","useRef","panelIsVisible","setPanelIsVisible","triggeredIdleTimeout","setTriggeredIdleTimeout","triggeredStuckTimeout","setTriggeredStuckTimeout","userInputThrottle","getTime","testMode","response","disablePanel","count","removeEventListeners","triggerIdleTimeout","triggerStuckTimeout","timer","testLog","setTimeout","showPanel","clearTimeout","onUserDismissed","dismissForever","dismiss_forever","querySelector","evt","removeEventListener","throttle","addEventListener","now","Promise","myRIFT","openLiveChatPanel","minimized","setMinimized","callCentreIsOpen","renderChat","openingData","callCentreWillOpenToday","todaysDay","stepsContent","ScheduledCallback","LocationInput","ministryOfDefence","ModLocationInput","NonModLocationInput","findAddressPart","addressParts","partTypes","partType","result","part","types","long_name","Map","handleMarkerChange","latitude","longitude","latLng","lat","parseFloat","lng","mapEl","geocoder","google","maps","Geocoder","zoom","center","marker","Marker","draggable","mapIcon","addListener","updateMap","tip","scaledSize","Size","origin","Point","anchor","setCenter","setPosition","query","setIcon","geocode","results","geometry","address_components","numberPart","streetPart","trim","town","county","country","postcode","addressFromGoogleGeocodeResult","handleSelectChange","ids","select","margin","selectData","defaultSelectText","select_option","String","capitalize","basicText","toLowerCase","ADDRESS_INPUTS","first_line","second_line","setAddressField","setAddressState","handleAddressChange","hasErrors","hasAddressValues","addressMissingCoordinates","hasValues","methodFromString","renderTypeahead","typeaheadError","commonLocationLookup","renderSelectedAddress","mapSrc","selectionConfirmed","drawerClosed","setPartialAddressState","cancelConfirmation","confirmSelection","lookupSelectionConfirmed","partialAddressState","closeDrawer","afterAction","locationLookup","throttleMs","renderConfirmationDrawer","Drawer","visible","DrawerHeader","DrawerBody","DrawerFooter","cancelLabel","confirmLabel","showConfirmationDrawer","OptionalStepper","minValue","disableStepper","setDisableStepper","onStepperClick","RadioOption","updateValue","hiddenInputRef","prevPropsValue","resourceValue","event","CustomEvent","hiddenInput","dispatchEvent","optionItems","editAction","optionChecked","showSelect","selectionIds","selection","renderSelect","renderHelperTrigger","onHelpClick","activeTab","setActiveTab","setActiveTabIndex","animating","setAnimating","fadeOut","setFadeOut","fadeIn","setFadeIn","disabledOptionTitle","miniButtons","optionName","nextText","optionList","previousText","skipOptionText","noOfTabs","switchTabs","nextActiveTab","callback","handleButtonClick","handleTabClick","nextTabIndex","optionData","renderNavItem","style","underlineStyles","left","buttonLists","maxNoOptionsWithoutButtons","maxNoOptionsWithButtons","actionBar","optionClasses","actionButtonBase","allOptions","sliceTo","sliceFrom","slice","PreferencesForm","renderForm","handleRefundPreferenceChange","handleCommunicationPreferenceChange","communicationPreferences","sms","post","preferences","communication","gm_refund_method","renderAddBankAccountButton","onEditBankAccountClick","renderBankAccountInfo","renderCheckDeliveryMessage","current_address_strings","AlertText","showBankForm","hasBankAccount","bank_account_id","BankForm","Alert","AlertHeader","fetching","List","QuestionnaireBanner","QuestionnairePanel","QuestionnaireQuestion","subheading","question","QuestionnaireStage","backButton","answers","answer","answerImage","track","industryAnswers","initialiseQuestionnaires","add","handleLabelClick","additionalAttributes","DEFAULT_RESOURCES","bankDetails","userDetails","reviewData","employers","yesValues","noValues","workplaces","addresses","vehicles","DashboardBlock","editPath","Block","BlockHeader","BlockBody","DashboardFinanceFacts","Facts","FactsItem","DashboardMissingInfoMessage","linkText","linkHref","ReviewForm","twoCol","setSmallScreen","SMALL","setSubmitting","resources","setResources","dataFetched","submitText","submittable","groupedWorkplaceExpenses","memoisedGroupedWorkplaceExpenses","groupedGeneralExpenses","memoisedGroupedGeneralExpenses","timelineTitle","rawWorkplaces","flatten","w","invalidWorkplaces","class_name","valid","setInitialState","async","fetchReviewPageState","Grid","GridInner","HeadingDivider","display_data","createSubmission","minReached","maxReached","nextValue","valueString","isNaN","placeHolder","updaters","updateAddress","updateEmployment","updateEmploymentGap","updateLocation","updateLocationGap","confirmAddress","confirmEmployment","confirmEmploymentGap","confirmLocation","confirmLocationGap","resourceType","resourceId","relatedResourceHeading","modalDisplayed","setModalDisplayed","setDate","setError","confirmResourceAndRefreshPage","confirmFunction","reload","obj","inDateRange","dateRange","shortDateString","updateDateAndRefreshPage","updateFunction","loading","setLoading","typedValue","setTypedValue","setResults","lookupError","setLookupError","timeout","storeTimeout","clearInput","incrementSelected","noOfResults","nextFocusKey","currentFocusKey","focus","focusOnHover","activeElement","parentElement","resultSelected","currentFocus","selectedResult","inputClasses","onKeyDown","keyCode","persist","goToEndOfInput","focuskey","onMouseOver","match","beforeMatch","afterMatch","matchedSpan","resultHeading","UnstructuredDurationInput","forceStructuredInput","textValue","DEFAULT_QUALITATIVE_FREQUENCY","UnstructuredFrequencyInput","showTextInput","toggleStructuredInput","handleUnstructuredValueChange","handleStructuredValueChange","onUnstructuredValueChange","onStructuredValueChange","toggleLabel","VehicleForm","lookupRef","updateVehicleData","unchangedVehicle","owned","company_car","registration","kind","make","model","vehicle","stateUpdates","selectedVehicle","api_person_vehicle","regInput","regInputRef","regValue","errResponse","companyCar","VehicleLookup","propagateData","manualEntry","lookupInputRef","runLookup","retryLookup","inputChanged","popularMakes","showCollection","showRegInput","vrm","renderVehicleLookup","buttonMods","FormGroupCombo","FormGroupComboItem","renderManualEntryLink","renderManualEntrySection","renderVehicleEntry","renderVehicle","Collection","renderRetryLookupLink","PUBLIC_TRANSPORT_OPTIONS","TRANSPORT_OPTIONS","INITIAL_REIMBURSEMENTS_QUANTITY","PublicTransportOptionsExpenseInputs","publicTransportOptions","selectedOptions","entries","_k","_","WorkLocationForm","onShowEmploymentForm","onShowVehicleForm","editableEmployments","setEditableEmployments","editableVehicles","setEditableVehicles","receivedReimbursements","setReceivedReimbursements","received_reimbursements","reimbursementsQuantity","setReimbursementsQuantity","reimbursements_quantity","lastTrackingEventRef","person_employment_id","person_vehicle_id","public_transport_expenses","public_transport_options","transport","expected_time_at_post","expected_time_at_post_years","expected_time_at_post_months","expected_time_at_post_weeks","complex_routine","quantitative_frequency","qualitative_frequency","travel_home_frequency","travel_home_quantitative_frequency","travel_home_qualitative_frequency","ended_at_locked","own_vehicle","company_vehicle","public_transport","trackEventOnce","selectedEmployment","findId","findBy","routineError","showExpectationChangeQuestion","locationAttributes","rangeDuration","getRangeDuration","parseDate","expectedStayError","newAttributes","nextLocationData","nextLocationErrors","attachLocalErrors","updatedAttributeNames","employmentUpdated","includes","startedAtUpdated","endedAtUpdated","expectedTimeAtPostChangedAtUpdated","expected_time_at_post_changed_at","startedAt","endedAt","expectedTimeAtPostChangedAt","option_data","employmentStartedAt","employmentEndedAt","dateRangeString","updateLinkedAttributes","routineHeading","routineText","modExpectedStayText","datesText","employmentText","locationText","travelText","unstructuredRoutine","deprecatedOptions","routineHelper","Selection","editText","editClick","addText","addClick","emp","handleEmploymentChange","employmentId","defaultStateForEmployment","address_id","addressErrors","handleDateChange","attribute","durationString","monthBit","handleExpectedTimeAtPostChange","questionHeadingSmall","handleStructuredFrequencyChange","handleTransportChange","transportMethod","handleVehicleChange","handlePublicTransportChange","publicTransportMethod","newExpenses","some","handlePublicTransportExpenseChange","modified","WorkLocationGapForm","unchangedLocationGap","locationGap","locationGapUpdate","work_location_gap","ExpenseKindWorkplaceExpenseInputs","dailyFoodChargeLocationIds","locations","expenseKindName","expenseGroupLocations","expenseKindForExpenseGroupAndKindName","locationIndex","locationExpenses","expensesForKindAndLocation","WorkplaceExpenseForm","onToggleKind","visibleKindNames","setVisibleKindNames","setDailyFoodChargeLocationIds","allExpenseKindNames","uniqueExpenseKindNames","renderableData","renderableExpenseGroups","expenseGroupsForExpenseKindName","renderableLocations","locationsForExpenseGroup","hasLocations","cl","expenseKindOptions","dailyFoodChargeOptions","pluck","l","modExpenseGroupId","eg","modMealsExpenseKindId","nextVisibleExpenseKindNames","expenseKindNamesWithExpenses","locationIdsWithFoodChargeExpenses","visibleRenderableData","kindName","toggleInclusion","showBreak","handleDailyFoodChargeToggle","locationId","adding","updatedExpenses","foodChargeEligibleExpenses","daily_food_charge","valueOnLoad","allowNil","inputValue","renderHeading","attributes","baseParams","yes","no","dontKnow","AddressLookupAddressDisplay","onTryLookupClick","tryLookupLabelText","collectionText","AddressLookupAddressSelect","selectOptions","deliveryPoints","organisation_name","line_1","line_2","department_name","sort","a","b","localeCompare","AddressLookupAutomatedLookupFields","lookupNumberRef","lookupPostcodeRef","lookupInputKeyDown","handleLookupClick","onLookup","onAddressSelect","onInputChange","onTryManualEntryClick","showAddressSelect","showPostcodeError","AddressLookupManualEntryFields","buildFirstAndSecondLines","deliveryPoint","handleAddressSelect","handleLookup","handleLookupSuccess","handleLookupError","showManualEntry","showLookupEntry","clearLookupError","houseNumber","success","failure","crafty_postcode_api_key","error_code","error_msg","lookupResults","knownData","traditional_county","postal_county","delivery_points","delivery_point_count","firstLine","toLocaleLowerCase","matcher","startsWith","processResults","postcodeLookup","streetData","err","resetData","showAddress","showLookup","stateFromProps","handleComplete","componentDidUpdate","prevProps","prevState","getDateValue","defaultDate","parts","split","reverse","clearValues","partialState","nextDateState","buildDate","datePickerDateOptions","fromDatePickerRef","updatedErrors","prevFromError","prevToError","pickerRef","currentDate","pickerInput","helpers","triggerElementChange","dateInputValue","actionBarActions","renderLinks","handleEditClick","labelFunction","NAV_LINKS","MastheadNav","pathname","usePolledLocation","pageConfig","pageConfigForPathname","links","timelineStage","MastheadTimelineStages","activeStage","MastheadNavList","stageClasses","TIMELINE_PAGE_CONFIGS","pageName","utc","steps","intro","form","confirmation","initialState","currentStep","callbackPreference","otherDaySelectedValue","timeSelectedValue","nextOpenDayString","nextOpenTimeString","callbackTimeOptions","otherDayOptions","callbackScheduled","selectedDayIndex","submissionErrorText","init","nextStep","onClickNext","initCallbackPreference","initOtherDayOptions","newCallbackPreference","newNextOpenDayString","newSelectedDayIndex","setSelectedDayAsString","setCallbackTimeOptions","sliceIndex","days","createDayString","createDayWithOridinalString","openingTimesToday","openingTimes","newNextOpenTimeString","createTimeString","from","newCallbackTimeOptions","times","createTimeRangeString","newTimeSelectedValue","prevstate","hideError","currentTarget","onCallbackDayChange","onCallbackPreferenceChange","payload","scheduled_at","scheduleCallback","callAPI","created_at","showError","reject","newOtherDaySelectedValue","newSelectedDayString","selectedDayAsString","formattableDateUTC","time","getOrdinalIndicator","renderHeader","renderFooter","linkTarget","ScheduledCallbackBody","ContentForm","callbackPreferences","splice","ContentBasic","timeSelectedValueSplit","propTypes","modalId","PropTypes","isRequired","scheduledCallback","onModalClose","handleClose","Wrapper","baseClass","createElement","FileContent","ListItem","TileList","NewOrEdit","unchangedAddress","nextAddress","deriveStateFromProps","attributeObject","api_person_address","createOrUpdate","ReviewTimelinesIndex","submissionPath","DashboardClaimTracker","fetchClaims","getUploadUrl","bucketName","personId","uid","fileExtension","Index","currentId","displayIncome","deleting","editing","kindIds","pendingFiles","selectedIncomeType","showingUploadWindow","uploadKindId","uploadStatuses","uploadSubKindId","fileDisplayRef","fileUploadRef","deleteDocument","editDocument","handleLeavePage","showAllDocuments","showIncomes","uploadsAdded","uploadsInputClicked","getStatusName","getDocumentStatus","getIncomeStatus","generateModifiers","shouldDisplayIncome","incomes","documentsByKind","pendingIncomes","pendingFilesByKind","updateDomToIncomes","isIncomes","wrapper","ReactDOM","addDocument","appendChild","reactButton","fetchDocuments","componentWillUnmount","documents","statusData","subKindIds","foundIndex","findIndex","original_file_name","editPersonUpload","doc","showDocument","incomeType","subKind","click","file","generateFilePreviews","files","uids","_this","reader","FileReader","updatePendingFile","readAsDataURL","addPendingFiles","nextPendingFiles","size","kindId","subKindId","uploadFiles","docs","reduce","previousPromise","fileIndex","uploadFile","presignedUploadUrl","filename","createPresignedUploadUrl","presignedUrl","onProgress","xhr","XMLHttpRequest","ajaxCount","setRequestHeader","onload","onerror","upload","onprogress","send","uploadFileToS3","createPersonUpload","upload_kind_id","upload_sub_kind_id","addDocumentsAndClearPendingFiles","newDocuments","filteredNewDocuments","rg4js","multiple","filesArray","maxFileSizeReached","MAX_FILE_SIZE_MB","alert","archived_at","documentById","renderIncomes","editable","renderFile","currentDocument","file_data","calculateProgress","total","uploadingLabel","s","upload_status_id","hasPendingDocument","pendingDocuments","statusName","setData","getStatusData","proof_of_address","renderTileAction","selector","creatable","failed","renderTiles","photoId","proofOfAddress","payslips","pendingPhotoIds","pendingProofOfAddresses","pendingPayslips","hasPendingPhotoId","hasPendingProofOfAddress","accept","SUN","SAT","FRI","before","referenceHourMinute","hour","getHours","minute","getMinutes","refHour","refMinute","after","nextOpeningTime","getDay","openToday","nextOpenTomorrow","ErrorPage","callCentreCopy","nextOpen","whenOpen","showSignOut","showGoHome","messageText","attachErrors","combineExpenses","originalExpenses","removedExpenses","updatedExpense","expenseIndex","removedExpense","ExpensesNew","search","setNewExpenses","setUpdatedExpenses","setRemovedExpenses","combinedExpenses","all","fetchExpenseKinds","fetchExpenseGroups","fetchExpenseFrequencies","fetchExpenses","fetchEmployments","fetchLocations","handleAddExpenses","added","handleUpdateExpenses","updates","nextNewExpenses","nextUpdatedExpenses","findIndexBy","updateIndex","handleRemoveExpense","removed","removeIndex","erroneous","failedDeletes","createExpense","deleteExpense","log","original","new","updated","Edit","confirmationGiven","showModal","dismissConfirmationModal","askForConfirmation","updateObj","requireConfirmation","after_update_path","IntroToMyRift","imageTrustpilotComboProps","pillCarouselProps","featuresListProps","AddressesIndex","lead","resourcesLoaded","showAddAddressButton","generateDisplayListActions","BulletList","Dashboard","claimSummary","submitHeading","locationsCount","loc","expensesCount","documentsCount","greeting","EmploymentsIndex","ExpensesIndex","locationsGroupedByEmployment","haveExpenses","haveLocations","haveWorkplaceExpenses","haveGeneralExpenses","renderExpensesGroup","group","renderExpenseTimelineGap","EmptyState","VehiclesIndex","generateActionsForEmployments","employment_id","employmentGaps","gap","related_resource_id","WorkLocationsIndex","MyRIFT","useLocation","timelineResource","resourcesRequired","prevHref","nextHref","showFooter","showGrid","showTimeline","showWrapper","showIdleUserPanel","prevPathname","confirmResource","fetchAndSetResources","timelineStartDate","timelineEndDate","dateRangesForTimelineGaps","timelineGaps","trackable","setHeaderAction","removeHeaderAction","ConfigureableContentWrapper","Routes","Route","claimStatus","ConfigurableContentFooter","RouterWrapper","Router","INITIAL_BANK_STATE","alt_name","INITIAL_BANK_ACCOUNT_STATE","INITIAL_PREFERENCES_STATE","gm_creation_method","PreferencesIndex","setFetching","showBankDetails","setShowBankDetails","setBank","setBankAccount","setPreferences","bankAccountErrors","setBankAccountErrors","onlyShowBankDetails","setOnlyShowBankDetails","fetchBankDetails","setBankDetails","toggleBankAccountDisplay","redirectHome","cancelBankAccountChange","handleBankAccountChange","bankAccountChange","requestData","bank_account","httpMethod","preferencesStatePatch","Account","addressesPath","basicDetailsPath","claimsPath","closeAccountPath","employersPath","financesPath","passwordPath","preferencesPath","vehiclesPath","WorkLocationsNew","personEmploymentId","publicTransportExpenseKinds","defaultStartedAt","defaultEndedAt","workLocation","show_complex_routine","bus","train","tram","tube","car_share","pickup_point","addressLoaded","employmentsLoaded","showEmploymentForm","showVehicleForm","vehicleId","vehiclesLoaded","workLocationLoaded","showWorkLocationForm","setWorkLocationState","newRecord","trackFilledInEvent","record","isVehicle","collection","existsByProperty","mergeOrAddByProperty","fetchErrors","fetchWorkLocation","fetchVehicles","values","api_person_location","requestVerb","requestUri","waitToRender","getPageTitle","icons","arrowWhite","arrow","beers","bell","brokenHeart","bubble","burger","car","cash","chevron","claim","close","computer","cool","createAccount","cross","crown","envelope","eye","examine","experts","folder","greenTick","grimace","home","hundred","info","letter","lock","man","mapPin","mapPinTip","minus","partyPopper","pin","plus","plusWhite","plusBlue","rocket","receiveRefund","scroll","shirt","smartphone","smug","snap","speakToUs","telephone","telephoneOld","thumbUp","trash","trashGrey","zzz","placeholders","accountPlaceholder","addressesPlaceholder","documentsPlaceholder","employersPlaceholder","expensesPlaceholder","vehiclesPlaceholder","workplacesPlaceholder","svgs","fileSVG","folderSVG","imageSVG","slideshowSVG","spreadsheetSVG","textSVG","bankOfIrelandBank","bankOfScotlandBank","Barclays","barclaysBank","clydesdaleBank","danskeBank","firstDirectBank","firstTrustBank","Halifax","halifaxBank","hsbcBank","lloydsBank","metroBank","Monzo","monzoBank","nationwideBank","NatWest","natwestBank","royalBankOfScotlandBank","Santander","santanderBank","starlingBank","tescoBank","theCoOperativeBank","thinkmoney","thinkMoneyBank","tsbBank","ulsterBank","yorkshireBank","getJSON","putJSON","addressData","addressId","employmentData","employmentGapData","employmentGapId","locationData","locationGapData","locationGapId","keyword","fetchers","fetchClaimSummary","resp","fetchTimelineGaps","fetchAddresses","resourceState","promisedResources","fetchResource","stepName","start","middle","end","duration","totalSlides","isBetween","dayValue","loadDisabled","monthValue","yearOptions","minDateYear","afterToday","beforeMinDate","leapDay","yearValue","date1","date2","diff","unroundedYears","as","roundedYears","floor","unroundedMonths","subtract","roundedMonths","round","dateString","fallback","rangeStartDate","rangeEndDate","workplaceExpenses","groupBy","expenseDurationId","person_location_id","claimable_percentage","person_id","allFrequencies","permittedFrequencyIds","permitted_expense_duration_ids","deDupe","mealsIndex","expenseGroupIds","rawLocations","selfEmployedEmployments","modEmployments","generalEmployments","existingExpenseKindIds","existingKinds","Number","toFixed","setWidth","handleWindowResize","setPathname","interval","setInterval","clearInterval","isDirectFromDashboard","isDirectFromTimelines","willRedirectToTimelines","Event","HEADER_BUTTON_CLASS","titleText","innerHTML","insertAdjacentHTML","nav","timelineAddresses","nextStage","prevStage","timelineEmployments","timelineWorkLocations","timelineExpenses","timelineReview","ALL_PAGE_CONFIGS","dashboard","workLocations","review","entry","_afterNewRetentionDate","afterNewRetentionDate","fromYear","toYear","UTC","filledDateRanges","monthCount","firstEntry","lastEntry","periodStart","periodEnd","second","toFirstDayOfMonth","inDateRanges","g","resource_name","startedAtArr","endedAtArr","preceding_resource_id","succeeding_resource_id","dataToOmit","skipRetentionPrompts","additionalRetentionPromptData","res","resourcesAndGaps","resourceIds","hasNoResource","hasSucceedingResource","hasPrecedingResource","isDisplayableTimelineGap","needsRetentionPrompt","attachRentionPrompt","attachRetentionPrompts","resourceValid","resourceCreatedAt","resourceConfirmedAt","last_confirmed_at","_retentionDate","retentionDate","lastResource","resourceHeading","inferResourceType","modEmployment","displayData","timelineGapDateRanges","config","retentionDay","retentionMonth","postData","windowMixpanelPresent","mixpanel","matchMedia","matches","urls","Image","componentClass","railsRoute","contentType","noAuth","tokenElement","auth","statusText","parse","queryString","originalOnClick","Function","call","breakpoint","smallerFunction","largerFunction","biggerThanBreakpoint","_biggerThanBreakpoint","object","emptyState","Symbol","iterator","includeValue","niceValue","errorItem","scrollIntoView","behavior","block","height","google_api_key","array","property","currentItem","existingItem","omittedKeys","pickedKeys","str","x","random","RegExp","newEntry","Set","createTextRange","fieldRange","collapse","setSelectionRange","employmentIsMod","myCustomContext","require","useContext"],"sourceRoot":""} 
\n 
\n \n 
\n 
\n