box-ui-elements 15.0.0-beta.7 → 15.0.0

package/es/elements/content-sidebar/activity-feed/task-form/TaskForm.js

@@ -39,6 +39,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 import * as React from 'react';
 import noop from 'lodash/noop';
 import getProp from 'lodash/get';
+import isEmpty from 'lodash/isEmpty';
 import classNames from 'classnames';
 import { FormattedMessage, injectIntl } from 'react-intl';
 import commonMessages from '../../../../common/messages';
@@ -94,7 +95,7 @@ function (_React$Component) {
 
     _defineProperty(_assertThisInitialized(_this), "state", _this.getInitialFormState());
 
-    _defineProperty(_assertThisInitialized(_this), "validateForm", function (only) {
+    _defineProperty(_assertThisInitialized(_this), "validateForm", function (only, invalidSubmitValidityState) {
       _this.setState(function (state) {
         var intl = _this.props.intl;
         var approvers = state.approvers,
@@ -112,10 +113,14 @@ function (_React$Component) {
           code: 'required',
           message: intl.formatMessage(commonMessages.requiredFieldError)
         };
+        var taskDueDateError = {
+          code: 'invalid',
+          message: intl.formatMessage(commonMessages.invalidDateError)
+        };
         var formValidityState = {
           taskAssignees: (approverTextInput.length ? assigneeFieldInvalidError : null) || (approvers.length ? null : assigneeFieldMissingError),
           taskName: message ? null : messageFieldError,
-          taskDueDate: null
+          taskDueDate: getProp(invalidSubmitValidityState, 'taskDueDate.validityState.patternMismatch') ? taskDueDateError : null
         };
         var isValid = Object.values(formValidityState).every(function (val) {
           return val == null;
@@ -136,8 +141,12 @@ function (_React$Component) {
       return _this.setState(_this.getInitialFormState());
     });
 
-    _defineProperty(_assertThisInitialized(_this), "handleInvalidSubmit", function () {
-      _this.validateForm();
+    _defineProperty(_assertThisInitialized(_this), "handleInvalidSubmit", function (invalidSubmitValidityState) {
+      if (!isEmpty(invalidSubmitValidityState)) {
+        _this.validateForm(undefined, invalidSubmitValidityState);
+      } else {
+        _this.validateForm();
+      }
     });
 
     _defineProperty(_assertThisInitialized(_this), "handleSubmitSuccess", function () {
@@ -493,6 +502,7 @@ function (_React$Component) {
         className: "bcs-task-add-due-date-input",
         error: this.getErrorByFieldname('taskDueDate'),
         inputProps: (_ref5 = {}, _defineProperty(_ref5, INTERACTION_TARGET, ACTIVITY_TARGETS.TASK_DATE_PICKER), _defineProperty(_ref5, 'data-testid', 'task-form-date-input'), _ref5),
+        isAccessible: true,
         isDisabled: isForbiddenErrorOnEdit,
         isKeyboardInputAllowed: true,
         isRequired: false,

package/es/elements/content-sidebar/activity-feed/task-form/TaskForm.js.flow

@@ -6,6 +6,7 @@
 import * as React from 'react';
 import noop from 'lodash/noop';
 import getProp from 'lodash/get';
+import isEmpty from 'lodash/isEmpty';
 import classNames from 'classnames';
 import { FormattedMessage, injectIntl } from 'react-intl';
 import type { InjectIntlProvidedProps } from 'react-intl';
@@ -83,6 +84,8 @@ type Props = TaskFormProps & TaskFormConsumerProps & InjectIntlProvidedProps;
 
 type TaskFormFieldName = 'taskName' | 'taskAssignees' | 'taskDueDate';
 
+type TaskFormInvalidSubmitState = { [key: TaskFormFieldName]: ?{ validityState: ?{ patternMismatch: boolean } } };
+
 type State = {|
     approverTextInput: string, // partial text input value for approver field before autocomplete/select
     approvers: Array<TaskCollabAssignee>,
@@ -135,7 +138,7 @@ class TaskForm extends React.Component<Props, State> {
         };
     }
 
-    validateForm = (only?: TaskFormFieldName) => {
+    validateForm = (only?: TaskFormFieldName, invalidSubmitValidityState?: ?TaskFormInvalidSubmitState) => {
         this.setState(state => {
             const { intl } = this.props;
             const { approvers, message, approverTextInput } = state;
@@ -151,12 +154,18 @@ class TaskForm extends React.Component<Props, State> {
                 code: 'required',
                 message: intl.formatMessage(commonMessages.requiredFieldError),
             };
+            const taskDueDateError = {
+                code: 'invalid',
+                message: intl.formatMessage(commonMessages.invalidDateError),
+            };
             const formValidityState = {
                 taskAssignees:
                     (approverTextInput.length ? assigneeFieldInvalidError : null) ||
                     (approvers.length ? null : assigneeFieldMissingError),
                 taskName: message ? null : messageFieldError,
-                taskDueDate: null,
+                taskDueDate: getProp(invalidSubmitValidityState, 'taskDueDate.validityState.patternMismatch')
+                    ? taskDueDateError
+                    : null,
             };
             const isValid = Object.values(formValidityState).every(val => val == null);
             return {
@@ -175,8 +184,12 @@ class TaskForm extends React.Component<Props, State> {
 
     clearForm = () => this.setState(this.getInitialFormState());
 
-    handleInvalidSubmit = () => {
-        this.validateForm();
+    handleInvalidSubmit = (invalidSubmitValidityState?: ?TaskFormInvalidSubmitState) => {
+        if (!isEmpty(invalidSubmitValidityState)) {
+            this.validateForm(undefined, invalidSubmitValidityState);
+        } else {
+            this.validateForm();
+        }
     };
 
     handleSubmitSuccess = () => {
@@ -273,7 +286,6 @@ class TaskForm extends React.Component<Props, State> {
             // Modify date to be the end of day (minus 1 millisecond) for the given due date
             dateValue.setHours(23, 59, 59, 999);
         }
-
         this.setState({ dueDate: dateValue });
         this.validateForm('taskDueDate');
     };
@@ -448,6 +460,7 @@ class TaskForm extends React.Component<Props, State> {
                                 [INTERACTION_TARGET]: ACTIVITY_TARGETS.TASK_DATE_PICKER,
                                 'data-testid': 'task-form-date-input',
                             }}
+                            isAccessible
                             isDisabled={isForbiddenErrorOnEdit}
                             isKeyboardInputAllowed
                             isRequired={false}

package/es/elements/content-sidebar/activity-feed/task-form/TaskForm.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/elements/content-sidebar/activity-feed/task-form/TaskForm.js"],"names":["React","noop","getProp","classNames","FormattedMessage","injectIntl","commonMessages","messages","commentFormMessages","Form","ModalActions","ContactDatalistItem","TextArea","DatePicker","Checkbox","PillSelectorDropdown","Button","FeatureFlag","PrimaryButton","TASK_COMPLETION_RULE_ANY","TASK_COMPLETION_RULE_ALL","TASK_EDIT_MODE_CREATE","TASK_EDIT_MODE_EDIT","ACTIVITY_TARGETS","INTERACTION_TARGET","TaskError","convertAssigneesToSelectorItems","approvers","map","target","newSelectorItem","id","name","item","value","text","TaskForm","getInitialFormState","only","setState","state","intl","props","message","approverTextInput","assigneeFieldMissingError","code","formatMessage","requiredFieldError","assigneeFieldInvalidError","invalidUserError","messageFieldError","formValidityState","taskAssignees","length","taskName","taskDueDate","isValid","Object","values","every","val","fieldName","validateForm","onSubmitSuccess","clearForm","isLoading","e","onSubmitError","taskType","editMode","dueDate","addedAssignees","getAddedAssignees","removedAssignees","getRemovedAssignees","filter","assignee","type","getTime","currentApprovers","approverIds","approver","currentApprover","indexOf","currentApproverIds","createTask","editTask","completionRule","dueDateString","toISOString","completion_rule","description","due_at","handleSubmitSuccess","handleSubmitError","date","dateValue","Date","setHours","event","checked","getApproverWithQuery","pills","concat","pill","role","status","permissions","can_delete","can_update","option","index","splice","persist","currentTarget","onCancel","approverSelectorContacts","className","error","isDisabled","inputContainerClassNames","isCreateEditMode","selectedApprovers","approverOptions","find","pillSelectorOverlayClasses","scrollable","submitButtonMessage","tasksAddTaskFormSubmitLabel","tasksEditTaskFormSubmitLabel","shouldShowCompletionRule","isCompletionRuleCheckboxDisabled","isCompletionRuleCheckboxChecked","isForbiddenErrorOnEdit","handleInvalidSubmit","handleValidSubmit","getErrorByFieldname","tasksAddTaskFormSelectAssigneesLabel","handleApproverSelectorInput","handleApproverSelectorRemove","handleApproverSelectorSelect","approvalAddAssignee","taskCreateGroupLabel","email","taskAnyCheckboxLabel","taskAnyInfoGroupTooltip","handleCompletionRuleChange","taskAnyInfoTooltip","tasksAddTaskFormMessageLabel","handleChangeMessage","commentWrite","TASK_DATE_PICKER","tasksAddTaskFormDueDateLabel","handleDueDateChange","approvalSelectDate","undefined","APPROVAL_FORM_CANCEL","handleCancelClick","addResinInfo","tasksAddTaskFormCancelLabel","APPROVAL_FORM_POST","Component","TaskFormUnwrapped"],"mappings":"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","sourcesContent":["/**\n * @flow\n * @file Component for Approval comment form\n */\n\nimport * as React from 'react';\nimport noop from 'lodash/noop';\nimport getProp from 'lodash/get';\nimport classNames from 'classnames';\nimport { FormattedMessage, injectIntl } from 'react-intl';\nimport type { InjectIntlProvidedProps } from 'react-intl';\nimport commonMessages from '../../../../common/messages';\nimport messages from './messages';\nimport commentFormMessages from '../comment-form/messages';\nimport Form from '../../../../components/form-elements/form/Form';\nimport ModalActions from '../../../../components/modal/ModalActions';\nimport ContactDatalistItem from '../../../../components/contact-datalist-item/ContactDatalistItem';\nimport TextArea from '../../../../components/text-area';\nimport DatePicker from '../../../../components/date-picker/DatePicker';\nimport Checkbox from '../../../../components/checkbox';\nimport PillSelectorDropdown from '../../../../components/pill-selector-dropdown/PillSelectorDropdown';\nimport Button from '../../../../components/button/Button';\nimport { FeatureFlag } from '../../../common/feature-checking';\nimport PrimaryButton from '../../../../components/primary-button/PrimaryButton';\nimport {\n    TASK_COMPLETION_RULE_ANY,\n    TASK_COMPLETION_RULE_ALL,\n    TASK_EDIT_MODE_CREATE,\n    TASK_EDIT_MODE_EDIT,\n} from '../../../../constants';\nimport { ACTIVITY_TARGETS, INTERACTION_TARGET } from '../../../common/interactionTargets';\nimport type {\n    TaskCompletionRule,\n    TaskCollabAssignee,\n    TaskType,\n    TaskEditMode,\n    TaskUpdatePayload,\n} from '../../../../common/types/tasks';\nimport TaskError from './TaskError';\nimport type { GetAvatarUrlCallback } from '../../../common/flowTypes';\nimport type { ElementsXhrError } from '../../../../common/types/api';\nimport type { SelectorItems, SelectorItem, UserMini, GroupMini } from '../../../../common/types/core';\n\nimport './TaskForm.scss';\n\ntype TaskFormProps = {|\n    error?: { status: number }, // TODO: update to ElementsXhrError once API supports it\n    isDisabled?: boolean,\n    onCancel: () => any,\n    onSubmitError: (e: ElementsXhrError) => any,\n    onSubmitSuccess: () => any,\n    taskType: TaskType,\n|};\n\ntype TaskFormFieldProps = {|\n    approvers: Array<TaskCollabAssignee>,\n    completionRule: TaskCompletionRule,\n    dueDate?: ?string,\n    id: string,\n    message: string,\n|};\n\ntype TaskFormConsumerProps = {|\n    ...TaskFormFieldProps,\n    approverSelectorContacts: SelectorItems<UserMini | GroupMini>,\n    className?: string,\n    createTask: (\n        text: string,\n        approvers: SelectorItems<>,\n        taskType: TaskType,\n        dueDate: ?string,\n        completionRule: TaskCompletionRule,\n        onSuccess: ?Function,\n        onError: ?Function,\n    ) => any,\n    editMode?: TaskEditMode,\n    editTask?: (task: TaskUpdatePayload, onSuccess: ?Function, onError: ?Function) => any,\n    getApproverWithQuery?: Function,\n    getAvatarUrl: GetAvatarUrlCallback,\n|};\n\ntype Props = TaskFormProps & TaskFormConsumerProps & InjectIntlProvidedProps;\n\ntype TaskFormFieldName = 'taskName' | 'taskAssignees' | 'taskDueDate';\n\ntype State = {|\n    approverTextInput: string, // partial text input value for approver field before autocomplete/select\n    approvers: Array<TaskCollabAssignee>,\n    completionRule: TaskCompletionRule,\n    dueDate?: ?Date,\n    formValidityState: { [key: TaskFormFieldName]: ?{ code: string, message: string } },\n    id: string,\n    isLoading: boolean,\n    isValid: ?boolean,\n    message: string,\n|};\n\nfunction convertAssigneesToSelectorItems(approvers: Array<TaskCollabAssignee>): SelectorItems<> {\n    return approvers.map(({ target }) => {\n        const newSelectorItem: SelectorItem<UserMini | GroupMini> = {\n            id: target.id,\n            name: target.name,\n            item: target,\n            value: target.id,\n            text: target.name, // for PillSelectorDropdown SelectorOptions type\n        };\n\n        return newSelectorItem;\n    });\n}\n\nclass TaskForm extends React.Component<Props, State> {\n    static defaultProps = {\n        approvers: [],\n        approverSelectorContacts: [],\n        editMode: TASK_EDIT_MODE_CREATE,\n        id: '',\n        message: '',\n    };\n\n    state = this.getInitialFormState();\n\n    getInitialFormState() {\n        const { dueDate, id, message, approvers, completionRule } = this.props;\n        return {\n            id,\n            completionRule: completionRule || TASK_COMPLETION_RULE_ALL,\n            approvers,\n            approverTextInput: '',\n            dueDate: dueDate ? new Date(dueDate) : null,\n            formValidityState: {},\n            message,\n            isLoading: false,\n            isValid: null,\n        };\n    }\n\n    validateForm = (only?: TaskFormFieldName) => {\n        this.setState(state => {\n            const { intl } = this.props;\n            const { approvers, message, approverTextInput } = state;\n            const assigneeFieldMissingError = {\n                code: 'required',\n                message: intl.formatMessage(commonMessages.requiredFieldError),\n            };\n            const assigneeFieldInvalidError = {\n                code: 'invalid',\n                message: intl.formatMessage(commonMessages.invalidUserError),\n            };\n            const messageFieldError = {\n                code: 'required',\n                message: intl.formatMessage(commonMessages.requiredFieldError),\n            };\n            const formValidityState = {\n                taskAssignees:\n                    (approverTextInput.length ? assigneeFieldInvalidError : null) ||\n                    (approvers.length ? null : assigneeFieldMissingError),\n                taskName: message ? null : messageFieldError,\n                taskDueDate: null,\n            };\n            const isValid = Object.values(formValidityState).every(val => val == null);\n            return {\n                isValid,\n                formValidityState: only\n                    ? { ...state.formValidityState, [only]: formValidityState[only] }\n                    : formValidityState,\n            };\n        });\n    };\n\n    getErrorByFieldname = (fieldName: TaskFormFieldName) => {\n        const { formValidityState } = this.state;\n        return formValidityState[fieldName] ? formValidityState[fieldName].message : null;\n    };\n\n    clearForm = () => this.setState(this.getInitialFormState());\n\n    handleInvalidSubmit = () => {\n        this.validateForm();\n    };\n\n    handleSubmitSuccess = () => {\n        const { onSubmitSuccess } = this.props;\n        if (onSubmitSuccess) {\n            onSubmitSuccess();\n        }\n\n        this.clearForm();\n        this.setState({ isLoading: false });\n    };\n\n    handleSubmitError = (e: ElementsXhrError) => {\n        const { onSubmitError } = this.props;\n        onSubmitError(e);\n        this.setState({ isLoading: false });\n    };\n\n    addResinInfo = (): Object => {\n        const { id, taskType, editMode } = this.props;\n        const { dueDate } = this.state;\n        const addedAssignees = this.getAddedAssignees();\n        const removedAssignees = this.getRemovedAssignees();\n\n        return {\n            'data-resin-taskid': id,\n            'data-resin-tasktype': taskType,\n            'data-resin-isediting': editMode === TASK_EDIT_MODE_EDIT,\n            'data-resin-numassigneesadded': addedAssignees.filter(assignee => assignee.target.type === 'user').length,\n            'data-resin-numgroupssadded': addedAssignees.filter(assignee => assignee.target.type === 'group').length,\n            'data-resin-numassigneesremoved': removedAssignees.length,\n            'data-resin-assigneesadded': addedAssignees.map(assignee => assignee.target.id),\n            'data-resin-assigneesremoved': removedAssignees.map(assignee => assignee.target.id),\n            'data-resin-duedate': dueDate && dueDate.getTime(),\n        };\n    };\n\n    getAddedAssignees = (): Array<TaskCollabAssignee> => {\n        // Added assignees are the ones in state that weren't in the prop\n        const { approvers } = this.props;\n        const { approvers: currentApprovers } = this.state;\n        const approverIds = approvers.map(approver => approver.id);\n        return currentApprovers.filter(currentApprover => approverIds.indexOf(currentApprover.id) === -1);\n    };\n\n    getRemovedAssignees = (): Array<TaskCollabAssignee> => {\n        // Assignees to remove are the ones in the prop that cannot be found in state\n        const { approvers } = this.props;\n        const { approvers: currentApprovers } = this.state;\n        const currentApproverIds = currentApprovers.map(currentApprover => currentApprover.id);\n        return approvers.filter(approver => currentApproverIds.indexOf(approver.id) === -1);\n    };\n\n    handleValidSubmit = (): void => {\n        const { id, createTask, editTask, editMode, taskType } = this.props;\n        const { message, approvers: currentApprovers, dueDate, completionRule, isValid } = this.state;\n        const dueDateString = dueDate && dueDate.toISOString();\n\n        if (!isValid) return;\n\n        this.setState({ isLoading: true });\n\n        if (editMode === TASK_EDIT_MODE_EDIT && editTask) {\n            editTask(\n                {\n                    id,\n                    completion_rule: completionRule,\n                    description: message,\n                    due_at: dueDateString,\n                    addedAssignees: convertAssigneesToSelectorItems(this.getAddedAssignees()),\n                    removedAssignees: this.getRemovedAssignees(),\n                },\n                this.handleSubmitSuccess,\n                this.handleSubmitError,\n            );\n        } else {\n            createTask(\n                message,\n                convertAssigneesToSelectorItems(currentApprovers),\n                taskType,\n                dueDateString,\n                completionRule,\n                this.handleSubmitSuccess,\n                this.handleSubmitError,\n            );\n        }\n    };\n\n    handleDueDateChange = (date: ?string): void => {\n        let dateValue = null;\n        if (date) {\n            dateValue = new Date(date);\n            // The date given to us is midnight of the date selected.\n            // Modify date to be the end of day (minus 1 millisecond) for the given due date\n            dateValue.setHours(23, 59, 59, 999);\n        }\n\n        this.setState({ dueDate: dateValue });\n        this.validateForm('taskDueDate');\n    };\n\n    handleCompletionRuleChange = (event: SyntheticInputEvent<HTMLInputElement>) => {\n        this.setState({ completionRule: event.target.checked ? TASK_COMPLETION_RULE_ANY : TASK_COMPLETION_RULE_ALL });\n    };\n\n    handleApproverSelectorInput = (value: any): void => {\n        const { getApproverWithQuery = noop } = this.props;\n        this.setState({ approverTextInput: value });\n        getApproverWithQuery(value);\n    };\n\n    handleApproverSelectorSelect = (pills: Array<any>): void => {\n        this.setState({\n            approvers: this.state.approvers.concat(\n                pills.map(pill => {\n                    return {\n                        id: '',\n                        target: pill.item,\n                        role: 'ASSIGNEE',\n                        type: 'task_collaborator',\n                        status: 'NOT_STARTED',\n                        permissions: { can_delete: false, can_update: false },\n                    };\n                }),\n            ),\n            approverTextInput: '',\n        });\n\n        this.validateForm('taskAssignees');\n    };\n\n    handleApproverSelectorRemove = (option: any, index: number): void => {\n        const approvers = [...this.state.approvers];\n        approvers.splice(index, 1);\n        this.setState({ approvers });\n        this.validateForm('taskAssignees');\n    };\n\n    handleChangeMessage = (e: SyntheticInputEvent<HTMLTextAreaElement>) => {\n        e.persist();\n        this.setState({ message: e.currentTarget.value });\n        this.validateForm('taskName');\n    };\n\n    handleCancelClick = () => {\n        this.props.onCancel();\n    };\n\n    render() {\n        const { approverSelectorContacts, className, error, isDisabled, intl, editMode, taskType } = this.props;\n        const { dueDate, approvers, message, formValidityState, isLoading, completionRule } = this.state;\n        const inputContainerClassNames = classNames('bcs-task-input-container', 'bcs-task-input-is-open', className);\n        const isCreateEditMode = editMode === TASK_EDIT_MODE_CREATE;\n        const selectedApprovers = convertAssigneesToSelectorItems(approvers);\n\n        // filter out selected approvers\n        // map to datalist item format\n        const approverOptions = approverSelectorContacts.filter(\n            ({ id }) => !selectedApprovers.find(({ value }) => value === id),\n        );\n\n        const pillSelectorOverlayClasses = classNames({\n            scrollable: approverOptions.length > 4,\n        });\n\n        const submitButtonMessage = isCreateEditMode\n            ? messages.tasksAddTaskFormSubmitLabel\n            : messages.tasksEditTaskFormSubmitLabel;\n        const shouldShowCompletionRule = approvers.length > 0;\n\n        // Enable checkbox when there is a group or multiple users being assigned\n        // TODO: consider setting contants for assignee types to src/constants.js\n        // - move from src/features/collaborator-avatars/constants.js\n        const isCompletionRuleCheckboxDisabled =\n            approvers.filter(approver => approver.target.type === 'group').length <= 0 &&\n            approvers.filter(approver => approver.target.type === 'user').length <= 1;\n\n        const isCompletionRuleCheckboxChecked = completionRule === TASK_COMPLETION_RULE_ANY;\n        const isForbiddenErrorOnEdit = isLoading || (getProp(error, 'status') === 403 && !isCreateEditMode);\n\n        return (\n            <div className={inputContainerClassNames} data-resin-component=\"taskform\">\n                <div className=\"bcs-task-input-form-container\">\n                    <TaskError editMode={editMode} error={error} taskType={taskType} />\n                    <Form\n                        formValidityState={formValidityState}\n                        onInvalidSubmit={this.handleInvalidSubmit}\n                        onValidSubmit={this.handleValidSubmit}\n                    >\n                        <PillSelectorDropdown\n                            className={pillSelectorOverlayClasses}\n                            error={this.getErrorByFieldname('taskAssignees')}\n                            disabled={isForbiddenErrorOnEdit}\n                            inputProps={{ 'data-testid': 'task-form-assignee-input' }}\n                            isRequired\n                            label={<FormattedMessage {...messages.tasksAddTaskFormSelectAssigneesLabel} />}\n                            name=\"taskAssignees\"\n                            onBlur={() => this.validateForm('taskAssignees')}\n                            onInput={this.handleApproverSelectorInput}\n                            onRemove={this.handleApproverSelectorRemove}\n                            onSelect={this.handleApproverSelectorSelect}\n                            placeholder={intl.formatMessage(commentFormMessages.approvalAddAssignee)}\n                            selectedOptions={selectedApprovers}\n                            selectorOptions={approverOptions}\n                            shouldSetActiveItemOnOpen\n                            shouldClearUnmatchedInput\n                            validateForError={() => this.validateForm('taskAssignees')}\n                        >\n                            {approverOptions.map(({ id, name, item = {} }) => (\n                                <ContactDatalistItem\n                                    key={id}\n                                    data-testid=\"task-assignee-option\"\n                                    name={name}\n                                    subtitle={\n                                        item.type === 'group' ? (\n                                            <FormattedMessage {...messages.taskCreateGroupLabel} />\n                                        ) : (\n                                            item.email\n                                        )\n                                    }\n                                />\n                            ))}\n                        </PillSelectorDropdown>\n\n                        {shouldShowCompletionRule && (\n                            <>\n                                <FeatureFlag feature=\"activityFeed.tasks.assignToGroup\">\n                                    <Checkbox\n                                        data-testid=\"task-form-completion-rule-checkbox-group\"\n                                        isChecked={isCompletionRuleCheckboxChecked}\n                                        isDisabled={isCompletionRuleCheckboxDisabled || isForbiddenErrorOnEdit}\n                                        label={<FormattedMessage {...messages.taskAnyCheckboxLabel} />}\n                                        tooltip={intl.formatMessage(messages.taskAnyInfoGroupTooltip)}\n                                        name=\"completionRule\"\n                                        onChange={this.handleCompletionRuleChange}\n                                    />\n                                </FeatureFlag>\n                                <FeatureFlag not feature=\"activityFeed.tasks.assignToGroup\">\n                                    <Checkbox\n                                        data-testid=\"task-form-completion-rule-checkbox\"\n                                        isChecked={isCompletionRuleCheckboxChecked}\n                                        isDisabled={isCompletionRuleCheckboxDisabled || isForbiddenErrorOnEdit}\n                                        label={<FormattedMessage {...messages.taskAnyCheckboxLabel} />}\n                                        tooltip={intl.formatMessage(messages.taskAnyInfoTooltip)}\n                                        name=\"completionRule\"\n                                        onChange={this.handleCompletionRuleChange}\n                                    />\n                                </FeatureFlag>\n                            </>\n                        )}\n\n                        <TextArea\n                            className=\"bcs-task-name-input\"\n                            data-testid=\"task-form-name-input\"\n                            disabled={isDisabled || isForbiddenErrorOnEdit}\n                            error={this.getErrorByFieldname('taskName')}\n                            isRequired\n                            label={<FormattedMessage {...messages.tasksAddTaskFormMessageLabel} />}\n                            name=\"taskName\"\n                            onBlur={() => this.validateForm('taskName')}\n                            onChange={this.handleChangeMessage}\n                            placeholder={intl.formatMessage(commentFormMessages.commentWrite)}\n                            value={message}\n                        />\n                        <DatePicker\n                            className=\"bcs-task-add-due-date-input\"\n                            error={this.getErrorByFieldname('taskDueDate')}\n                            inputProps={{\n                                [INTERACTION_TARGET]: ACTIVITY_TARGETS.TASK_DATE_PICKER,\n                                'data-testid': 'task-form-date-input',\n                            }}\n                            isDisabled={isForbiddenErrorOnEdit}\n                            isKeyboardInputAllowed\n                            isRequired={false}\n                            label={<FormattedMessage {...messages.tasksAddTaskFormDueDateLabel} />}\n                            minDate={new Date()}\n                            name=\"taskDueDate\"\n                            onChange={this.handleDueDateChange}\n                            placeholder={intl.formatMessage(commentFormMessages.approvalSelectDate)}\n                            value={dueDate || undefined}\n                        />\n                        <ModalActions>\n                            <Button\n                                className=\"bcs-task-input-cancel-btn\"\n                                data-resin-target={ACTIVITY_TARGETS.APPROVAL_FORM_CANCEL}\n                                data-testid=\"task-form-cancel-button\"\n                                onClick={this.handleCancelClick}\n                                isDisabled={isLoading}\n                                type=\"button\"\n                                {...this.addResinInfo()}\n                            >\n                                <FormattedMessage {...messages.tasksAddTaskFormCancelLabel} />\n                            </Button>\n                            <PrimaryButton\n                                className=\"bcs-task-input-submit-btn\"\n                                data-resin-target={ACTIVITY_TARGETS.APPROVAL_FORM_POST}\n                                data-testid=\"task-form-submit-button\"\n                                isDisabled={isForbiddenErrorOnEdit}\n                                isLoading={isLoading}\n                                {...this.addResinInfo()}\n                            >\n                                <FormattedMessage {...submitButtonMessage} />\n                            </PrimaryButton>\n                        </ModalActions>\n                    </Form>\n                </div>\n            </div>\n        );\n    }\n}\n\n// For testing only\nexport { TaskForm as TaskFormUnwrapped };\nexport type { TaskFormConsumerProps as TaskFormProps };\n\nexport default injectIntl(TaskForm);\n"],"file":"TaskForm.js"}
+{"version":3,"sources":["../../../../../src/elements/content-sidebar/activity-feed/task-form/TaskForm.js"],"names":["React","noop","getProp","isEmpty","classNames","FormattedMessage","injectIntl","commonMessages","messages","commentFormMessages","Form","ModalActions","ContactDatalistItem","TextArea","DatePicker","Checkbox","PillSelectorDropdown","Button","FeatureFlag","PrimaryButton","TASK_COMPLETION_RULE_ANY","TASK_COMPLETION_RULE_ALL","TASK_EDIT_MODE_CREATE","TASK_EDIT_MODE_EDIT","ACTIVITY_TARGETS","INTERACTION_TARGET","TaskError","convertAssigneesToSelectorItems","approvers","map","target","newSelectorItem","id","name","item","value","text","TaskForm","getInitialFormState","only","invalidSubmitValidityState","setState","state","intl","props","message","approverTextInput","assigneeFieldMissingError","code","formatMessage","requiredFieldError","assigneeFieldInvalidError","invalidUserError","messageFieldError","taskDueDateError","invalidDateError","formValidityState","taskAssignees","length","taskName","taskDueDate","isValid","Object","values","every","val","fieldName","validateForm","undefined","onSubmitSuccess","clearForm","isLoading","e","onSubmitError","taskType","editMode","dueDate","addedAssignees","getAddedAssignees","removedAssignees","getRemovedAssignees","filter","assignee","type","getTime","currentApprovers","approverIds","approver","currentApprover","indexOf","currentApproverIds","createTask","editTask","completionRule","dueDateString","toISOString","completion_rule","description","due_at","handleSubmitSuccess","handleSubmitError","date","dateValue","Date","setHours","event","checked","getApproverWithQuery","pills","concat","pill","role","status","permissions","can_delete","can_update","option","index","splice","persist","currentTarget","onCancel","approverSelectorContacts","className","error","isDisabled","inputContainerClassNames","isCreateEditMode","selectedApprovers","approverOptions","find","pillSelectorOverlayClasses","scrollable","submitButtonMessage","tasksAddTaskFormSubmitLabel","tasksEditTaskFormSubmitLabel","shouldShowCompletionRule","isCompletionRuleCheckboxDisabled","isCompletionRuleCheckboxChecked","isForbiddenErrorOnEdit","handleInvalidSubmit","handleValidSubmit","getErrorByFieldname","tasksAddTaskFormSelectAssigneesLabel","handleApproverSelectorInput","handleApproverSelectorRemove","handleApproverSelectorSelect","approvalAddAssignee","taskCreateGroupLabel","email","taskAnyCheckboxLabel","taskAnyInfoGroupTooltip","handleCompletionRuleChange","taskAnyInfoTooltip","tasksAddTaskFormMessageLabel","handleChangeMessage","commentWrite","TASK_DATE_PICKER","tasksAddTaskFormDueDateLabel","handleDueDateChange","approvalSelectDate","APPROVAL_FORM_CANCEL","handleCancelClick","addResinInfo","tasksAddTaskFormCancelLabel","APPROVAL_FORM_POST","Component","TaskFormUnwrapped"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;AAKA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,IAAP,MAAiB,aAAjB;AACA,OAAOC,OAAP,MAAoB,YAApB;AACA,OAAOC,OAAP,MAAoB,gBAApB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,gBAAT,EAA2BC,UAA3B,QAA6C,YAA7C;AAEA,OAAOC,cAAP,MAA2B,6BAA3B;AACA,OAAOC,QAAP,MAAqB,YAArB;AACA,OAAOC,mBAAP,MAAgC,0BAAhC;AACA,OAAOC,IAAP,MAAiB,gDAAjB;AACA,OAAOC,YAAP,MAAyB,2CAAzB;AACA,OAAOC,mBAAP,MAAgC,kEAAhC;AACA,OAAOC,QAAP,MAAqB,kCAArB;AACA,OAAOC,UAAP,MAAuB,+CAAvB;AACA,OAAOC,QAAP,MAAqB,iCAArB;AACA,OAAOC,oBAAP,MAAiC,oEAAjC;AACA,OAAOC,MAAP,MAAmB,sCAAnB;AACA,SAASC,WAAT,QAA4B,kCAA5B;AACA,OAAOC,aAAP,MAA0B,qDAA1B;AACA,SACIC,wBADJ,EAEIC,wBAFJ,EAGIC,qBAHJ,EAIIC,mBAJJ,QAKO,uBALP;AAMA,SAASC,gBAAT,EAA2BC,kBAA3B,QAAqD,oCAArD;AAQA,OAAOC,SAAP,MAAsB,aAAtB;AAKA,OAAO,iBAAP;;AAwDA,SAASC,+BAAT,CAAyCC,SAAzC,EAAgG;AAC5F,SAAOA,SAAS,CAACC,GAAV,CAAc,gBAAgB;AAAA,QAAbC,MAAa,QAAbA,MAAa;AACjC,QAAMC,eAAmD,GAAG;AACxDC,MAAAA,EAAE,EAAEF,MAAM,CAACE,EAD6C;AAExDC,MAAAA,IAAI,EAAEH,MAAM,CAACG,IAF2C;AAGxDC,MAAAA,IAAI,EAAEJ,MAHkD;AAIxDK,MAAAA,KAAK,EAAEL,MAAM,CAACE,EAJ0C;AAKxDI,MAAAA,IAAI,EAAEN,MAAM,CAACG,IAL2C,CAKrC;;AALqC,KAA5D;AAQA,WAAOF,eAAP;AACH,GAVM,CAAP;AAWH;;IAEKM,Q;;;;;;;;;;;;;;;;;;4DASM,MAAKC,mBAAL,E;;mEAiBO,UAACC,IAAD,EAA2BC,0BAA3B,EAAwF;AACnG,YAAKC,QAAL,CAAc,UAAAC,KAAK,EAAI;AAAA,YACXC,IADW,GACF,MAAKC,KADH,CACXD,IADW;AAAA,YAEXf,SAFW,GAE+Bc,KAF/B,CAEXd,SAFW;AAAA,YAEAiB,OAFA,GAE+BH,KAF/B,CAEAG,OAFA;AAAA,YAESC,iBAFT,GAE+BJ,KAF/B,CAESI,iBAFT;AAGnB,YAAMC,yBAAyB,GAAG;AAC9BC,UAAAA,IAAI,EAAE,UADwB;AAE9BH,UAAAA,OAAO,EAAEF,IAAI,CAACM,aAAL,CAAmB1C,cAAc,CAAC2C,kBAAlC;AAFqB,SAAlC;AAIA,YAAMC,yBAAyB,GAAG;AAC9BH,UAAAA,IAAI,EAAE,SADwB;AAE9BH,UAAAA,OAAO,EAAEF,IAAI,CAACM,aAAL,CAAmB1C,cAAc,CAAC6C,gBAAlC;AAFqB,SAAlC;AAIA,YAAMC,iBAAiB,GAAG;AACtBL,UAAAA,IAAI,EAAE,UADgB;AAEtBH,UAAAA,OAAO,EAAEF,IAAI,CAACM,aAAL,CAAmB1C,cAAc,CAAC2C,kBAAlC;AAFa,SAA1B;AAIA,YAAMI,gBAAgB,GAAG;AACrBN,UAAAA,IAAI,EAAE,SADe;AAErBH,UAAAA,OAAO,EAAEF,IAAI,CAACM,aAAL,CAAmB1C,cAAc,CAACgD,gBAAlC;AAFY,SAAzB;AAIA,YAAMC,iBAAiB,GAAG;AACtBC,UAAAA,aAAa,EACT,CAACX,iBAAiB,CAACY,MAAlB,GAA2BP,yBAA3B,GAAuD,IAAxD,MACCvB,SAAS,CAAC8B,MAAV,GAAmB,IAAnB,GAA0BX,yBAD3B,CAFkB;AAItBY,UAAAA,QAAQ,EAAEd,OAAO,GAAG,IAAH,GAAUQ,iBAJL;AAKtBO,UAAAA,WAAW,EAAE1D,OAAO,CAACsC,0BAAD,EAA6B,2CAA7B,CAAP,GACPc,gBADO,GAEP;AAPgB,SAA1B;AASA,YAAMO,OAAO,GAAGC,MAAM,CAACC,MAAP,CAAcP,iBAAd,EAAiCQ,KAAjC,CAAuC,UAAAC,GAAG;AAAA,iBAAIA,GAAG,IAAI,IAAX;AAAA,SAA1C,CAAhB;AACA,eAAO;AACHJ,UAAAA,OAAO,EAAPA,OADG;AAEHL,UAAAA,iBAAiB,EAAEjB,IAAI,qBACZG,KAAK,CAACc,iBADM,sBACcjB,IADd,EACqBiB,iBAAiB,CAACjB,IAAD,CADtC,KAEjBiB;AAJH,SAAP;AAMH,OAnCD;AAoCH,K;;0EAEqB,UAACU,SAAD,EAAkC;AAAA,UAC5CV,iBAD4C,GACtB,MAAKd,KADiB,CAC5Cc,iBAD4C;AAEpD,aAAOA,iBAAiB,CAACU,SAAD,CAAjB,GAA+BV,iBAAiB,CAACU,SAAD,CAAjB,CAA6BrB,OAA5D,GAAsE,IAA7E;AACH,K;;gEAEW;AAAA,aAAM,MAAKJ,QAAL,CAAc,MAAKH,mBAAL,EAAd,CAAN;AAAA,K;;0EAEU,UAACE,0BAAD,EAA8D;AAChF,UAAI,CAACrC,OAAO,CAACqC,0BAAD,CAAZ,EAA0C;AACtC,cAAK2B,YAAL,CAAkBC,SAAlB,EAA6B5B,0BAA7B;AACH,OAFD,MAEO;AACH,cAAK2B,YAAL;AACH;AACJ,K;;0EAEqB,YAAM;AAAA,UAChBE,eADgB,GACI,MAAKzB,KADT,CAChByB,eADgB;;AAExB,UAAIA,eAAJ,EAAqB;AACjBA,QAAAA,eAAe;AAClB;;AAED,YAAKC,SAAL;;AACA,YAAK7B,QAAL,CAAc;AAAE8B,QAAAA,SAAS,EAAE;AAAb,OAAd;AACH,K;;wEAEmB,UAACC,CAAD,EAAyB;AAAA,UACjCC,aADiC,GACf,MAAK7B,KADU,CACjC6B,aADiC;AAEzCA,MAAAA,aAAa,CAACD,CAAD,CAAb;;AACA,YAAK/B,QAAL,CAAc;AAAE8B,QAAAA,SAAS,EAAE;AAAb,OAAd;AACH,K;;mEAEc,YAAc;AAAA,wBACU,MAAK3B,KADf;AAAA,UACjBZ,EADiB,eACjBA,EADiB;AAAA,UACb0C,QADa,eACbA,QADa;AAAA,UACHC,QADG,eACHA,QADG;AAAA,UAEjBC,OAFiB,GAEL,MAAKlC,KAFA,CAEjBkC,OAFiB;;AAGzB,UAAMC,cAAc,GAAG,MAAKC,iBAAL,EAAvB;;AACA,UAAMC,gBAAgB,GAAG,MAAKC,mBAAL,EAAzB;;AAEA,aAAO;AACH,6BAAqBhD,EADlB;AAEH,+BAAuB0C,QAFpB;AAGH,gCAAwBC,QAAQ,KAAKpD,mBAHlC;AAIH,wCAAgCsD,cAAc,CAACI,MAAf,CAAsB,UAAAC,QAAQ;AAAA,iBAAIA,QAAQ,CAACpD,MAAT,CAAgBqD,IAAhB,KAAyB,MAA7B;AAAA,SAA9B,EAAmEzB,MAJhG;AAKH,sCAA8BmB,cAAc,CAACI,MAAf,CAAsB,UAAAC,QAAQ;AAAA,iBAAIA,QAAQ,CAACpD,MAAT,CAAgBqD,IAAhB,KAAyB,OAA7B;AAAA,SAA9B,EAAoEzB,MAL/F;AAMH,0CAAkCqB,gBAAgB,CAACrB,MANhD;AAOH,qCAA6BmB,cAAc,CAAChD,GAAf,CAAmB,UAAAqD,QAAQ;AAAA,iBAAIA,QAAQ,CAACpD,MAAT,CAAgBE,EAApB;AAAA,SAA3B,CAP1B;AAQH,uCAA+B+C,gBAAgB,CAAClD,GAAjB,CAAqB,UAAAqD,QAAQ;AAAA,iBAAIA,QAAQ,CAACpD,MAAT,CAAgBE,EAApB;AAAA,SAA7B,CAR5B;AASH,8BAAsB4C,OAAO,IAAIA,OAAO,CAACQ,OAAR;AAT9B,OAAP;AAWH,K;;wEAEmB,YAAiC;AACjD;AADiD,UAEzCxD,SAFyC,GAE3B,MAAKgB,KAFsB,CAEzChB,SAFyC;AAAA,UAG9ByD,gBAH8B,GAGT,MAAK3C,KAHI,CAGzCd,SAHyC;AAIjD,UAAM0D,WAAW,GAAG1D,SAAS,CAACC,GAAV,CAAc,UAAA0D,QAAQ;AAAA,eAAIA,QAAQ,CAACvD,EAAb;AAAA,OAAtB,CAApB;AACA,aAAOqD,gBAAgB,CAACJ,MAAjB,CAAwB,UAAAO,eAAe;AAAA,eAAIF,WAAW,CAACG,OAAZ,CAAoBD,eAAe,CAACxD,EAApC,MAA4C,CAAC,CAAjD;AAAA,OAAvC,CAAP;AACH,K;;0EAEqB,YAAiC;AACnD;AADmD,UAE3CJ,SAF2C,GAE7B,MAAKgB,KAFwB,CAE3ChB,SAF2C;AAAA,UAGhCyD,gBAHgC,GAGX,MAAK3C,KAHM,CAG3Cd,SAH2C;AAInD,UAAM8D,kBAAkB,GAAGL,gBAAgB,CAACxD,GAAjB,CAAqB,UAAA2D,eAAe;AAAA,eAAIA,eAAe,CAACxD,EAApB;AAAA,OAApC,CAA3B;AACA,aAAOJ,SAAS,CAACqD,MAAV,CAAiB,UAAAM,QAAQ;AAAA,eAAIG,kBAAkB,CAACD,OAAnB,CAA2BF,QAAQ,CAACvD,EAApC,MAA4C,CAAC,CAAjD;AAAA,OAAzB,CAAP;AACH,K;;wEAEmB,YAAY;AAAA,yBAC6B,MAAKY,KADlC;AAAA,UACpBZ,EADoB,gBACpBA,EADoB;AAAA,UAChB2D,UADgB,gBAChBA,UADgB;AAAA,UACJC,QADI,gBACJA,QADI;AAAA,UACMjB,QADN,gBACMA,QADN;AAAA,UACgBD,QADhB,gBACgBA,QADhB;AAAA,wBAEuD,MAAKhC,KAF5D;AAAA,UAEpBG,OAFoB,eAEpBA,OAFoB;AAAA,UAEAwC,gBAFA,eAEXzD,SAFW;AAAA,UAEkBgD,OAFlB,eAEkBA,OAFlB;AAAA,UAE2BiB,cAF3B,eAE2BA,cAF3B;AAAA,UAE2ChC,OAF3C,eAE2CA,OAF3C;AAG5B,UAAMiC,aAAa,GAAGlB,OAAO,IAAIA,OAAO,CAACmB,WAAR,EAAjC;AAEA,UAAI,CAAClC,OAAL,EAAc;;AAEd,YAAKpB,QAAL,CAAc;AAAE8B,QAAAA,SAAS,EAAE;AAAb,OAAd;;AAEA,UAAII,QAAQ,KAAKpD,mBAAb,IAAoCqE,QAAxC,EAAkD;AAC9CA,QAAAA,QAAQ,CACJ;AACI5D,UAAAA,EAAE,EAAFA,EADJ;AAEIgE,UAAAA,eAAe,EAAEH,cAFrB;AAGII,UAAAA,WAAW,EAAEpD,OAHjB;AAIIqD,UAAAA,MAAM,EAAEJ,aAJZ;AAKIjB,UAAAA,cAAc,EAAElD,+BAA+B,CAAC,MAAKmD,iBAAL,EAAD,CALnD;AAMIC,UAAAA,gBAAgB,EAAE,MAAKC,mBAAL;AANtB,SADI,EASJ,MAAKmB,mBATD,EAUJ,MAAKC,iBAVD,CAAR;AAYH,OAbD,MAaO;AACHT,QAAAA,UAAU,CACN9C,OADM,EAENlB,+BAA+B,CAAC0D,gBAAD,CAFzB,EAGNX,QAHM,EAINoB,aAJM,EAKND,cALM,EAMN,MAAKM,mBANC,EAON,MAAKC,iBAPC,CAAV;AASH;AACJ,K;;0EAEqB,UAACC,IAAD,EAAyB;AAC3C,UAAIC,SAAS,GAAG,IAAhB;;AACA,UAAID,IAAJ,EAAU;AACNC,QAAAA,SAAS,GAAG,IAAIC,IAAJ,CAASF,IAAT,CAAZ,CADM,CAEN;AACA;;AACAC,QAAAA,SAAS,CAACE,QAAV,CAAmB,EAAnB,EAAuB,EAAvB,EAA2B,EAA3B,EAA+B,GAA/B;AACH;;AACD,YAAK/D,QAAL,CAAc;AAAEmC,QAAAA,OAAO,EAAE0B;AAAX,OAAd;;AACA,YAAKnC,YAAL,CAAkB,aAAlB;AACH,K;;iFAE4B,UAACsC,KAAD,EAAkD;AAC3E,YAAKhE,QAAL,CAAc;AAAEoD,QAAAA,cAAc,EAAEY,KAAK,CAAC3E,MAAN,CAAa4E,OAAb,GAAuBtF,wBAAvB,GAAkDC;AAApE,OAAd;AACH,K;;kFAE6B,UAACc,KAAD,EAAsB;AAAA,kCACR,MAAKS,KADG,CACxC+D,oBADwC;AAAA,UACxCA,oBADwC,sCACjB1G,IADiB;;AAEhD,YAAKwC,QAAL,CAAc;AAAEK,QAAAA,iBAAiB,EAAEX;AAArB,OAAd;;AACAwE,MAAAA,oBAAoB,CAACxE,KAAD,CAApB;AACH,K;;mFAE8B,UAACyE,KAAD,EAA6B;AACxD,YAAKnE,QAAL,CAAc;AACVb,QAAAA,SAAS,EAAE,MAAKc,KAAL,CAAWd,SAAX,CAAqBiF,MAArB,CACPD,KAAK,CAAC/E,GAAN,CAAU,UAAAiF,IAAI,EAAI;AACd,iBAAO;AACH9E,YAAAA,EAAE,EAAE,EADD;AAEHF,YAAAA,MAAM,EAAEgF,IAAI,CAAC5E,IAFV;AAGH6E,YAAAA,IAAI,EAAE,UAHH;AAIH5B,YAAAA,IAAI,EAAE,mBAJH;AAKH6B,YAAAA,MAAM,EAAE,aALL;AAMHC,YAAAA,WAAW,EAAE;AAAEC,cAAAA,UAAU,EAAE,KAAd;AAAqBC,cAAAA,UAAU,EAAE;AAAjC;AANV,WAAP;AAQH,SATD,CADO,CADD;AAaVrE,QAAAA,iBAAiB,EAAE;AAbT,OAAd;;AAgBA,YAAKqB,YAAL,CAAkB,eAAlB;AACH,K;;mFAE8B,UAACiD,MAAD,EAAcC,KAAd,EAAsC;AACjE,UAAMzF,SAAS,sBAAO,MAAKc,KAAL,CAAWd,SAAlB,CAAf;;AACAA,MAAAA,SAAS,CAAC0F,MAAV,CAAiBD,KAAjB,EAAwB,CAAxB;;AACA,YAAK5E,QAAL,CAAc;AAAEb,QAAAA,SAAS,EAATA;AAAF,OAAd;;AACA,YAAKuC,YAAL,CAAkB,eAAlB;AACH,K;;0EAEqB,UAACK,CAAD,EAAiD;AACnEA,MAAAA,CAAC,CAAC+C,OAAF;;AACA,YAAK9E,QAAL,CAAc;AAAEI,QAAAA,OAAO,EAAE2B,CAAC,CAACgD,aAAF,CAAgBrF;AAA3B,OAAd;;AACA,YAAKgC,YAAL,CAAkB,UAAlB;AACH,K;;wEAEmB,YAAM;AACtB,YAAKvB,KAAL,CAAW6E,QAAX;AACH,K;;;;;;;0CApNqB;AAAA,yBAC0C,KAAK7E,KAD/C;AAAA,UACVgC,OADU,gBACVA,OADU;AAAA,UACD5C,EADC,gBACDA,EADC;AAAA,UACGa,OADH,gBACGA,OADH;AAAA,UACYjB,SADZ,gBACYA,SADZ;AAAA,UACuBiE,cADvB,gBACuBA,cADvB;AAElB,aAAO;AACH7D,QAAAA,EAAE,EAAFA,EADG;AAEH6D,QAAAA,cAAc,EAAEA,cAAc,IAAIxE,wBAF/B;AAGHO,QAAAA,SAAS,EAATA,SAHG;AAIHkB,QAAAA,iBAAiB,EAAE,EAJhB;AAKH8B,QAAAA,OAAO,EAAEA,OAAO,GAAG,IAAI2B,IAAJ,CAAS3B,OAAT,CAAH,GAAuB,IALpC;AAMHpB,QAAAA,iBAAiB,EAAE,EANhB;AAOHX,QAAAA,OAAO,EAAPA,OAPG;AAQH0B,QAAAA,SAAS,EAAE,KARR;AASHV,QAAAA,OAAO,EAAE;AATN,OAAP;AAWH;;;6BAyMQ;AAAA;AAAA;;AAAA,yBACwF,KAAKjB,KAD7F;AAAA,UACG8E,wBADH,gBACGA,wBADH;AAAA,UAC6BC,SAD7B,gBAC6BA,SAD7B;AAAA,UACwCC,KADxC,gBACwCA,KADxC;AAAA,UAC+CC,UAD/C,gBAC+CA,UAD/C;AAAA,UAC2DlF,IAD3D,gBAC2DA,IAD3D;AAAA,UACiEgC,QADjE,gBACiEA,QADjE;AAAA,UAC2ED,QAD3E,gBAC2EA,QAD3E;AAAA,yBAEiF,KAAKhC,KAFtF;AAAA,UAEGkC,OAFH,gBAEGA,OAFH;AAAA,UAEYhD,SAFZ,gBAEYA,SAFZ;AAAA,UAEuBiB,OAFvB,gBAEuBA,OAFvB;AAAA,UAEgCW,iBAFhC,gBAEgCA,iBAFhC;AAAA,UAEmDe,SAFnD,gBAEmDA,SAFnD;AAAA,UAE8DsB,cAF9D,gBAE8DA,cAF9D;AAGL,UAAMiC,wBAAwB,GAAG1H,UAAU,CAAC,0BAAD,EAA6B,wBAA7B,EAAuDuH,SAAvD,CAA3C;AACA,UAAMI,gBAAgB,GAAGpD,QAAQ,KAAKrD,qBAAtC;AACA,UAAM0G,iBAAiB,GAAGrG,+BAA+B,CAACC,SAAD,CAAzD,CALK,CAOL;AACA;;AACA,UAAMqG,eAAe,GAAGP,wBAAwB,CAACzC,MAAzB,CACpB;AAAA,YAAGjD,EAAH,SAAGA,EAAH;AAAA,eAAY,CAACgG,iBAAiB,CAACE,IAAlB,CAAuB;AAAA,cAAG/F,KAAH,SAAGA,KAAH;AAAA,iBAAeA,KAAK,KAAKH,EAAzB;AAAA,SAAvB,CAAb;AAAA,OADoB,CAAxB;AAIA,UAAMmG,0BAA0B,GAAG/H,UAAU,CAAC;AAC1CgI,QAAAA,UAAU,EAAEH,eAAe,CAACvE,MAAhB,GAAyB;AADK,OAAD,CAA7C;AAIA,UAAM2E,mBAAmB,GAAGN,gBAAgB,GACtCvH,QAAQ,CAAC8H,2BAD6B,GAEtC9H,QAAQ,CAAC+H,4BAFf;AAGA,UAAMC,wBAAwB,GAAG5G,SAAS,CAAC8B,MAAV,GAAmB,CAApD,CApBK,CAsBL;AACA;AACA;;AACA,UAAM+E,gCAAgC,GAClC7G,SAAS,CAACqD,MAAV,CAAiB,UAAAM,QAAQ;AAAA,eAAIA,QAAQ,CAACzD,MAAT,CAAgBqD,IAAhB,KAAyB,OAA7B;AAAA,OAAzB,EAA+DzB,MAA/D,IAAyE,CAAzE,IACA9B,SAAS,CAACqD,MAAV,CAAiB,UAAAM,QAAQ;AAAA,eAAIA,QAAQ,CAACzD,MAAT,CAAgBqD,IAAhB,KAAyB,MAA7B;AAAA,OAAzB,EAA8DzB,MAA9D,IAAwE,CAF5E;AAIA,UAAMgF,+BAA+B,GAAG7C,cAAc,KAAKzE,wBAA3D;AACA,UAAMuH,sBAAsB,GAAGpE,SAAS,IAAKrE,OAAO,CAAC0H,KAAD,EAAQ,QAAR,CAAP,KAA6B,GAA7B,IAAoC,CAACG,gBAAlF;AAEA,aACI;AAAK,QAAA,SAAS,EAAED,wBAAhB;AAA0C,gCAAqB;AAA/D,SACI;AAAK,QAAA,SAAS,EAAC;AAAf,SACI,oBAAC,SAAD;AAAW,QAAA,QAAQ,EAAEnD,QAArB;AAA+B,QAAA,KAAK,EAAEiD,KAAtC;AAA6C,QAAA,QAAQ,EAAElD;AAAvD,QADJ,EAEI,oBAAC,IAAD;AACI,QAAA,iBAAiB,EAAElB,iBADvB;AAEI,QAAA,eAAe,EAAE,KAAKoF,mBAF1B;AAGI,QAAA,aAAa,EAAE,KAAKC;AAHxB,SAKI,oBAAC,oBAAD;AACI,QAAA,SAAS,EAAEV,0BADf;AAEI,QAAA,KAAK,EAAE,KAAKW,mBAAL,CAAyB,eAAzB,CAFX;AAGI,QAAA,QAAQ,EAAEH,sBAHd;AAII,QAAA,UAAU,EAAE;AAAE,yBAAe;AAAjB,SAJhB;AAKI,QAAA,UAAU,MALd;AAMI,QAAA,KAAK,EAAE,oBAAC,gBAAD,EAAsBnI,QAAQ,CAACuI,oCAA/B,CANX;AAOI,QAAA,IAAI,EAAC,eAPT;AAQI,QAAA,MAAM,EAAE;AAAA,iBAAM,MAAI,CAAC5E,YAAL,CAAkB,eAAlB,CAAN;AAAA,SARZ;AASI,QAAA,OAAO,EAAE,KAAK6E,2BATlB;AAUI,QAAA,QAAQ,EAAE,KAAKC,4BAVnB;AAWI,QAAA,QAAQ,EAAE,KAAKC,4BAXnB;AAYI,QAAA,WAAW,EAAEvG,IAAI,CAACM,aAAL,CAAmBxC,mBAAmB,CAAC0I,mBAAvC,CAZjB;AAaI,QAAA,eAAe,EAAEnB,iBAbrB;AAcI,QAAA,eAAe,EAAEC,eAdrB;AAeI,QAAA,yBAAyB,MAf7B;AAgBI,QAAA,yBAAyB,MAhB7B;AAiBI,QAAA,gBAAgB,EAAE;AAAA,iBAAM,MAAI,CAAC9D,YAAL,CAAkB,eAAlB,CAAN;AAAA;AAjBtB,SAmBK8D,eAAe,CAACpG,GAAhB,CAAoB;AAAA,YAAGG,EAAH,SAAGA,EAAH;AAAA,YAAOC,IAAP,SAAOA,IAAP;AAAA,+BAAaC,IAAb;AAAA,YAAaA,IAAb,2BAAoB,EAApB;AAAA,eACjB,oBAAC,mBAAD;AACI,UAAA,GAAG,EAAEF,EADT;AAEI,yBAAY,sBAFhB;AAGI,UAAA,IAAI,EAAEC,IAHV;AAII,UAAA,QAAQ,EACJC,IAAI,CAACiD,IAAL,KAAc,OAAd,GACI,oBAAC,gBAAD,EAAsB3E,QAAQ,CAAC4I,oBAA/B,CADJ,GAGIlH,IAAI,CAACmH;AARjB,UADiB;AAAA,OAApB,CAnBL,CALJ,EAwCKb,wBAAwB,IACrB,0CACI,oBAAC,WAAD;AAAa,QAAA,OAAO,EAAC;AAArB,SACI,oBAAC,QAAD;AACI,uBAAY,0CADhB;AAEI,QAAA,SAAS,EAAEE,+BAFf;AAGI,QAAA,UAAU,EAAED,gCAAgC,IAAIE,sBAHpD;AAII,QAAA,KAAK,EAAE,oBAAC,gBAAD,EAAsBnI,QAAQ,CAAC8I,oBAA/B,CAJX;AAKI,QAAA,OAAO,EAAE3G,IAAI,CAACM,aAAL,CAAmBzC,QAAQ,CAAC+I,uBAA5B,CALb;AAMI,QAAA,IAAI,EAAC,gBANT;AAOI,QAAA,QAAQ,EAAE,KAAKC;AAPnB,QADJ,CADJ,EAYI,oBAAC,WAAD;AAAa,QAAA,GAAG,MAAhB;AAAiB,QAAA,OAAO,EAAC;AAAzB,SACI,oBAAC,QAAD;AACI,uBAAY,oCADhB;AAEI,QAAA,SAAS,EAAEd,+BAFf;AAGI,QAAA,UAAU,EAAED,gCAAgC,IAAIE,sBAHpD;AAII,QAAA,KAAK,EAAE,oBAAC,gBAAD,EAAsBnI,QAAQ,CAAC8I,oBAA/B,CAJX;AAKI,QAAA,OAAO,EAAE3G,IAAI,CAACM,aAAL,CAAmBzC,QAAQ,CAACiJ,kBAA5B,CALb;AAMI,QAAA,IAAI,EAAC,gBANT;AAOI,QAAA,QAAQ,EAAE,KAAKD;AAPnB,QADJ,CAZJ,CAzCR,EAmEI,oBAAC,QAAD;AACI,QAAA,SAAS,EAAC,qBADd;AAEI,uBAAY,sBAFhB;AAGI,QAAA,QAAQ,EAAE3B,UAAU,IAAIc,sBAH5B;AAII,QAAA,KAAK,EAAE,KAAKG,mBAAL,CAAyB,UAAzB,CAJX;AAKI,QAAA,UAAU,MALd;AAMI,QAAA,KAAK,EAAE,oBAAC,gBAAD,EAAsBtI,QAAQ,CAACkJ,4BAA/B,CANX;AAOI,QAAA,IAAI,EAAC,UAPT;AAQI,QAAA,MAAM,EAAE;AAAA,iBAAM,MAAI,CAACvF,YAAL,CAAkB,UAAlB,CAAN;AAAA,SARZ;AASI,QAAA,QAAQ,EAAE,KAAKwF,mBATnB;AAUI,QAAA,WAAW,EAAEhH,IAAI,CAACM,aAAL,CAAmBxC,mBAAmB,CAACmJ,YAAvC,CAVjB;AAWI,QAAA,KAAK,EAAE/G;AAXX,QAnEJ,EAgFI,oBAAC,UAAD;AACI,QAAA,SAAS,EAAC,6BADd;AAEI,QAAA,KAAK,EAAE,KAAKiG,mBAAL,CAAyB,aAAzB,CAFX;AAGI,QAAA,UAAU,sCACLrH,kBADK,EACgBD,gBAAgB,CAACqI,gBADjC,0BAEN,aAFM,EAES,sBAFT,SAHd;AAOI,QAAA,YAAY,MAPhB;AAQI,QAAA,UAAU,EAAElB,sBARhB;AASI,QAAA,sBAAsB,MAT1B;AAUI,QAAA,UAAU,EAAE,KAVhB;AAWI,QAAA,KAAK,EAAE,oBAAC,gBAAD,EAAsBnI,QAAQ,CAACsJ,4BAA/B,CAXX;AAYI,QAAA,OAAO,EAAE,IAAIvD,IAAJ,EAZb;AAaI,QAAA,IAAI,EAAC,aAbT;AAcI,QAAA,QAAQ,EAAE,KAAKwD,mBAdnB;AAeI,QAAA,WAAW,EAAEpH,IAAI,CAACM,aAAL,CAAmBxC,mBAAmB,CAACuJ,kBAAvC,CAfjB;AAgBI,QAAA,KAAK,EAAEpF,OAAO,IAAIR;AAhBtB,QAhFJ,EAkGI,oBAAC,YAAD,QACI,oBAAC,MAAD;AACI,QAAA,SAAS,EAAC,2BADd;AAEI,6BAAmB5C,gBAAgB,CAACyI,oBAFxC;AAGI,uBAAY,yBAHhB;AAII,QAAA,OAAO,EAAE,KAAKC,iBAJlB;AAKI,QAAA,UAAU,EAAE3F,SALhB;AAMI,QAAA,IAAI,EAAC;AANT,SAOQ,KAAK4F,YAAL,EAPR,GASI,oBAAC,gBAAD,EAAsB3J,QAAQ,CAAC4J,2BAA/B,CATJ,CADJ,EAYI,oBAAC,aAAD;AACI,QAAA,SAAS,EAAC,2BADd;AAEI,6BAAmB5I,gBAAgB,CAAC6I,kBAFxC;AAGI,uBAAY,yBAHhB;AAII,QAAA,UAAU,EAAE1B,sBAJhB;AAKI,QAAA,SAAS,EAAEpE;AALf,SAMQ,KAAK4F,YAAL,EANR,GAQI,oBAAC,gBAAD,EAAsB9B,mBAAtB,CARJ,CAZJ,CAlGJ,CAFJ,CADJ,CADJ;AAiIH;;;;EAlYkBrI,KAAK,CAACsK,S,GAqY7B;;;gBArYMjI,Q,kBACoB;AAClBT,EAAAA,SAAS,EAAE,EADO;AAElB8F,EAAAA,wBAAwB,EAAE,EAFR;AAGlB/C,EAAAA,QAAQ,EAAErD,qBAHQ;AAIlBU,EAAAA,EAAE,EAAE,EAJc;AAKlBa,EAAAA,OAAO,EAAE;AALS,C;;AAqY1B,SAASR,QAAQ,IAAIkI,iBAArB;AAGA,eAAejK,UAAU,CAAC+B,QAAD,CAAzB","sourcesContent":["/**\n * @flow\n * @file Component for Approval comment form\n */\n\nimport * as React from 'react';\nimport noop from 'lodash/noop';\nimport getProp from 'lodash/get';\nimport isEmpty from 'lodash/isEmpty';\nimport classNames from 'classnames';\nimport { FormattedMessage, injectIntl } from 'react-intl';\nimport type { InjectIntlProvidedProps } from 'react-intl';\nimport commonMessages from '../../../../common/messages';\nimport messages from './messages';\nimport commentFormMessages from '../comment-form/messages';\nimport Form from '../../../../components/form-elements/form/Form';\nimport ModalActions from '../../../../components/modal/ModalActions';\nimport ContactDatalistItem from '../../../../components/contact-datalist-item/ContactDatalistItem';\nimport TextArea from '../../../../components/text-area';\nimport DatePicker from '../../../../components/date-picker/DatePicker';\nimport Checkbox from '../../../../components/checkbox';\nimport PillSelectorDropdown from '../../../../components/pill-selector-dropdown/PillSelectorDropdown';\nimport Button from '../../../../components/button/Button';\nimport { FeatureFlag } from '../../../common/feature-checking';\nimport PrimaryButton from '../../../../components/primary-button/PrimaryButton';\nimport {\n    TASK_COMPLETION_RULE_ANY,\n    TASK_COMPLETION_RULE_ALL,\n    TASK_EDIT_MODE_CREATE,\n    TASK_EDIT_MODE_EDIT,\n} from '../../../../constants';\nimport { ACTIVITY_TARGETS, INTERACTION_TARGET } from '../../../common/interactionTargets';\nimport type {\n    TaskCompletionRule,\n    TaskCollabAssignee,\n    TaskType,\n    TaskEditMode,\n    TaskUpdatePayload,\n} from '../../../../common/types/tasks';\nimport TaskError from './TaskError';\nimport type { GetAvatarUrlCallback } from '../../../common/flowTypes';\nimport type { ElementsXhrError } from '../../../../common/types/api';\nimport type { SelectorItems, SelectorItem, UserMini, GroupMini } from '../../../../common/types/core';\n\nimport './TaskForm.scss';\n\ntype TaskFormProps = {|\n    error?: { status: number }, // TODO: update to ElementsXhrError once API supports it\n    isDisabled?: boolean,\n    onCancel: () => any,\n    onSubmitError: (e: ElementsXhrError) => any,\n    onSubmitSuccess: () => any,\n    taskType: TaskType,\n|};\n\ntype TaskFormFieldProps = {|\n    approvers: Array<TaskCollabAssignee>,\n    completionRule: TaskCompletionRule,\n    dueDate?: ?string,\n    id: string,\n    message: string,\n|};\n\ntype TaskFormConsumerProps = {|\n    ...TaskFormFieldProps,\n    approverSelectorContacts: SelectorItems<UserMini | GroupMini>,\n    className?: string,\n    createTask: (\n        text: string,\n        approvers: SelectorItems<>,\n        taskType: TaskType,\n        dueDate: ?string,\n        completionRule: TaskCompletionRule,\n        onSuccess: ?Function,\n        onError: ?Function,\n    ) => any,\n    editMode?: TaskEditMode,\n    editTask?: (task: TaskUpdatePayload, onSuccess: ?Function, onError: ?Function) => any,\n    getApproverWithQuery?: Function,\n    getAvatarUrl: GetAvatarUrlCallback,\n|};\n\ntype Props = TaskFormProps & TaskFormConsumerProps & InjectIntlProvidedProps;\n\ntype TaskFormFieldName = 'taskName' | 'taskAssignees' | 'taskDueDate';\n\ntype TaskFormInvalidSubmitState = { [key: TaskFormFieldName]: ?{ validityState: ?{ patternMismatch: boolean } } };\n\ntype State = {|\n    approverTextInput: string, // partial text input value for approver field before autocomplete/select\n    approvers: Array<TaskCollabAssignee>,\n    completionRule: TaskCompletionRule,\n    dueDate?: ?Date,\n    formValidityState: { [key: TaskFormFieldName]: ?{ code: string, message: string } },\n    id: string,\n    isLoading: boolean,\n    isValid: ?boolean,\n    message: string,\n|};\n\nfunction convertAssigneesToSelectorItems(approvers: Array<TaskCollabAssignee>): SelectorItems<> {\n    return approvers.map(({ target }) => {\n        const newSelectorItem: SelectorItem<UserMini | GroupMini> = {\n            id: target.id,\n            name: target.name,\n            item: target,\n            value: target.id,\n            text: target.name, // for PillSelectorDropdown SelectorOptions type\n        };\n\n        return newSelectorItem;\n    });\n}\n\nclass TaskForm extends React.Component<Props, State> {\n    static defaultProps = {\n        approvers: [],\n        approverSelectorContacts: [],\n        editMode: TASK_EDIT_MODE_CREATE,\n        id: '',\n        message: '',\n    };\n\n    state = this.getInitialFormState();\n\n    getInitialFormState() {\n        const { dueDate, id, message, approvers, completionRule } = this.props;\n        return {\n            id,\n            completionRule: completionRule || TASK_COMPLETION_RULE_ALL,\n            approvers,\n            approverTextInput: '',\n            dueDate: dueDate ? new Date(dueDate) : null,\n            formValidityState: {},\n            message,\n            isLoading: false,\n            isValid: null,\n        };\n    }\n\n    validateForm = (only?: TaskFormFieldName, invalidSubmitValidityState?: ?TaskFormInvalidSubmitState) => {\n        this.setState(state => {\n            const { intl } = this.props;\n            const { approvers, message, approverTextInput } = state;\n            const assigneeFieldMissingError = {\n                code: 'required',\n                message: intl.formatMessage(commonMessages.requiredFieldError),\n            };\n            const assigneeFieldInvalidError = {\n                code: 'invalid',\n                message: intl.formatMessage(commonMessages.invalidUserError),\n            };\n            const messageFieldError = {\n                code: 'required',\n                message: intl.formatMessage(commonMessages.requiredFieldError),\n            };\n            const taskDueDateError = {\n                code: 'invalid',\n                message: intl.formatMessage(commonMessages.invalidDateError),\n            };\n            const formValidityState = {\n                taskAssignees:\n                    (approverTextInput.length ? assigneeFieldInvalidError : null) ||\n                    (approvers.length ? null : assigneeFieldMissingError),\n                taskName: message ? null : messageFieldError,\n                taskDueDate: getProp(invalidSubmitValidityState, 'taskDueDate.validityState.patternMismatch')\n                    ? taskDueDateError\n                    : null,\n            };\n            const isValid = Object.values(formValidityState).every(val => val == null);\n            return {\n                isValid,\n                formValidityState: only\n                    ? { ...state.formValidityState, [only]: formValidityState[only] }\n                    : formValidityState,\n            };\n        });\n    };\n\n    getErrorByFieldname = (fieldName: TaskFormFieldName) => {\n        const { formValidityState } = this.state;\n        return formValidityState[fieldName] ? formValidityState[fieldName].message : null;\n    };\n\n    clearForm = () => this.setState(this.getInitialFormState());\n\n    handleInvalidSubmit = (invalidSubmitValidityState?: ?TaskFormInvalidSubmitState) => {\n        if (!isEmpty(invalidSubmitValidityState)) {\n            this.validateForm(undefined, invalidSubmitValidityState);\n        } else {\n            this.validateForm();\n        }\n    };\n\n    handleSubmitSuccess = () => {\n        const { onSubmitSuccess } = this.props;\n        if (onSubmitSuccess) {\n            onSubmitSuccess();\n        }\n\n        this.clearForm();\n        this.setState({ isLoading: false });\n    };\n\n    handleSubmitError = (e: ElementsXhrError) => {\n        const { onSubmitError } = this.props;\n        onSubmitError(e);\n        this.setState({ isLoading: false });\n    };\n\n    addResinInfo = (): Object => {\n        const { id, taskType, editMode } = this.props;\n        const { dueDate } = this.state;\n        const addedAssignees = this.getAddedAssignees();\n        const removedAssignees = this.getRemovedAssignees();\n\n        return {\n            'data-resin-taskid': id,\n            'data-resin-tasktype': taskType,\n            'data-resin-isediting': editMode === TASK_EDIT_MODE_EDIT,\n            'data-resin-numassigneesadded': addedAssignees.filter(assignee => assignee.target.type === 'user').length,\n            'data-resin-numgroupssadded': addedAssignees.filter(assignee => assignee.target.type === 'group').length,\n            'data-resin-numassigneesremoved': removedAssignees.length,\n            'data-resin-assigneesadded': addedAssignees.map(assignee => assignee.target.id),\n            'data-resin-assigneesremoved': removedAssignees.map(assignee => assignee.target.id),\n            'data-resin-duedate': dueDate && dueDate.getTime(),\n        };\n    };\n\n    getAddedAssignees = (): Array<TaskCollabAssignee> => {\n        // Added assignees are the ones in state that weren't in the prop\n        const { approvers } = this.props;\n        const { approvers: currentApprovers } = this.state;\n        const approverIds = approvers.map(approver => approver.id);\n        return currentApprovers.filter(currentApprover => approverIds.indexOf(currentApprover.id) === -1);\n    };\n\n    getRemovedAssignees = (): Array<TaskCollabAssignee> => {\n        // Assignees to remove are the ones in the prop that cannot be found in state\n        const { approvers } = this.props;\n        const { approvers: currentApprovers } = this.state;\n        const currentApproverIds = currentApprovers.map(currentApprover => currentApprover.id);\n        return approvers.filter(approver => currentApproverIds.indexOf(approver.id) === -1);\n    };\n\n    handleValidSubmit = (): void => {\n        const { id, createTask, editTask, editMode, taskType } = this.props;\n        const { message, approvers: currentApprovers, dueDate, completionRule, isValid } = this.state;\n        const dueDateString = dueDate && dueDate.toISOString();\n\n        if (!isValid) return;\n\n        this.setState({ isLoading: true });\n\n        if (editMode === TASK_EDIT_MODE_EDIT && editTask) {\n            editTask(\n                {\n                    id,\n                    completion_rule: completionRule,\n                    description: message,\n                    due_at: dueDateString,\n                    addedAssignees: convertAssigneesToSelectorItems(this.getAddedAssignees()),\n                    removedAssignees: this.getRemovedAssignees(),\n                },\n                this.handleSubmitSuccess,\n                this.handleSubmitError,\n            );\n        } else {\n            createTask(\n                message,\n                convertAssigneesToSelectorItems(currentApprovers),\n                taskType,\n                dueDateString,\n                completionRule,\n                this.handleSubmitSuccess,\n                this.handleSubmitError,\n            );\n        }\n    };\n\n    handleDueDateChange = (date: ?string): void => {\n        let dateValue = null;\n        if (date) {\n            dateValue = new Date(date);\n            // The date given to us is midnight of the date selected.\n            // Modify date to be the end of day (minus 1 millisecond) for the given due date\n            dateValue.setHours(23, 59, 59, 999);\n        }\n        this.setState({ dueDate: dateValue });\n        this.validateForm('taskDueDate');\n    };\n\n    handleCompletionRuleChange = (event: SyntheticInputEvent<HTMLInputElement>) => {\n        this.setState({ completionRule: event.target.checked ? TASK_COMPLETION_RULE_ANY : TASK_COMPLETION_RULE_ALL });\n    };\n\n    handleApproverSelectorInput = (value: any): void => {\n        const { getApproverWithQuery = noop } = this.props;\n        this.setState({ approverTextInput: value });\n        getApproverWithQuery(value);\n    };\n\n    handleApproverSelectorSelect = (pills: Array<any>): void => {\n        this.setState({\n            approvers: this.state.approvers.concat(\n                pills.map(pill => {\n                    return {\n                        id: '',\n                        target: pill.item,\n                        role: 'ASSIGNEE',\n                        type: 'task_collaborator',\n                        status: 'NOT_STARTED',\n                        permissions: { can_delete: false, can_update: false },\n                    };\n                }),\n            ),\n            approverTextInput: '',\n        });\n\n        this.validateForm('taskAssignees');\n    };\n\n    handleApproverSelectorRemove = (option: any, index: number): void => {\n        const approvers = [...this.state.approvers];\n        approvers.splice(index, 1);\n        this.setState({ approvers });\n        this.validateForm('taskAssignees');\n    };\n\n    handleChangeMessage = (e: SyntheticInputEvent<HTMLTextAreaElement>) => {\n        e.persist();\n        this.setState({ message: e.currentTarget.value });\n        this.validateForm('taskName');\n    };\n\n    handleCancelClick = () => {\n        this.props.onCancel();\n    };\n\n    render() {\n        const { approverSelectorContacts, className, error, isDisabled, intl, editMode, taskType } = this.props;\n        const { dueDate, approvers, message, formValidityState, isLoading, completionRule } = this.state;\n        const inputContainerClassNames = classNames('bcs-task-input-container', 'bcs-task-input-is-open', className);\n        const isCreateEditMode = editMode === TASK_EDIT_MODE_CREATE;\n        const selectedApprovers = convertAssigneesToSelectorItems(approvers);\n\n        // filter out selected approvers\n        // map to datalist item format\n        const approverOptions = approverSelectorContacts.filter(\n            ({ id }) => !selectedApprovers.find(({ value }) => value === id),\n        );\n\n        const pillSelectorOverlayClasses = classNames({\n            scrollable: approverOptions.length > 4,\n        });\n\n        const submitButtonMessage = isCreateEditMode\n            ? messages.tasksAddTaskFormSubmitLabel\n            : messages.tasksEditTaskFormSubmitLabel;\n        const shouldShowCompletionRule = approvers.length > 0;\n\n        // Enable checkbox when there is a group or multiple users being assigned\n        // TODO: consider setting contants for assignee types to src/constants.js\n        // - move from src/features/collaborator-avatars/constants.js\n        const isCompletionRuleCheckboxDisabled =\n            approvers.filter(approver => approver.target.type === 'group').length <= 0 &&\n            approvers.filter(approver => approver.target.type === 'user').length <= 1;\n\n        const isCompletionRuleCheckboxChecked = completionRule === TASK_COMPLETION_RULE_ANY;\n        const isForbiddenErrorOnEdit = isLoading || (getProp(error, 'status') === 403 && !isCreateEditMode);\n\n        return (\n            <div className={inputContainerClassNames} data-resin-component=\"taskform\">\n                <div className=\"bcs-task-input-form-container\">\n                    <TaskError editMode={editMode} error={error} taskType={taskType} />\n                    <Form\n                        formValidityState={formValidityState}\n                        onInvalidSubmit={this.handleInvalidSubmit}\n                        onValidSubmit={this.handleValidSubmit}\n                    >\n                        <PillSelectorDropdown\n                            className={pillSelectorOverlayClasses}\n                            error={this.getErrorByFieldname('taskAssignees')}\n                            disabled={isForbiddenErrorOnEdit}\n                            inputProps={{ 'data-testid': 'task-form-assignee-input' }}\n                            isRequired\n                            label={<FormattedMessage {...messages.tasksAddTaskFormSelectAssigneesLabel} />}\n                            name=\"taskAssignees\"\n                            onBlur={() => this.validateForm('taskAssignees')}\n                            onInput={this.handleApproverSelectorInput}\n                            onRemove={this.handleApproverSelectorRemove}\n                            onSelect={this.handleApproverSelectorSelect}\n                            placeholder={intl.formatMessage(commentFormMessages.approvalAddAssignee)}\n                            selectedOptions={selectedApprovers}\n                            selectorOptions={approverOptions}\n                            shouldSetActiveItemOnOpen\n                            shouldClearUnmatchedInput\n                            validateForError={() => this.validateForm('taskAssignees')}\n                        >\n                            {approverOptions.map(({ id, name, item = {} }) => (\n                                <ContactDatalistItem\n                                    key={id}\n                                    data-testid=\"task-assignee-option\"\n                                    name={name}\n                                    subtitle={\n                                        item.type === 'group' ? (\n                                            <FormattedMessage {...messages.taskCreateGroupLabel} />\n                                        ) : (\n                                            item.email\n                                        )\n                                    }\n                                />\n                            ))}\n                        </PillSelectorDropdown>\n\n                        {shouldShowCompletionRule && (\n                            <>\n                                <FeatureFlag feature=\"activityFeed.tasks.assignToGroup\">\n                                    <Checkbox\n                                        data-testid=\"task-form-completion-rule-checkbox-group\"\n                                        isChecked={isCompletionRuleCheckboxChecked}\n                                        isDisabled={isCompletionRuleCheckboxDisabled || isForbiddenErrorOnEdit}\n                                        label={<FormattedMessage {...messages.taskAnyCheckboxLabel} />}\n                                        tooltip={intl.formatMessage(messages.taskAnyInfoGroupTooltip)}\n                                        name=\"completionRule\"\n                                        onChange={this.handleCompletionRuleChange}\n                                    />\n                                </FeatureFlag>\n                                <FeatureFlag not feature=\"activityFeed.tasks.assignToGroup\">\n                                    <Checkbox\n                                        data-testid=\"task-form-completion-rule-checkbox\"\n                                        isChecked={isCompletionRuleCheckboxChecked}\n                                        isDisabled={isCompletionRuleCheckboxDisabled || isForbiddenErrorOnEdit}\n                                        label={<FormattedMessage {...messages.taskAnyCheckboxLabel} />}\n                                        tooltip={intl.formatMessage(messages.taskAnyInfoTooltip)}\n                                        name=\"completionRule\"\n                                        onChange={this.handleCompletionRuleChange}\n                                    />\n                                </FeatureFlag>\n                            </>\n                        )}\n\n                        <TextArea\n                            className=\"bcs-task-name-input\"\n                            data-testid=\"task-form-name-input\"\n                            disabled={isDisabled || isForbiddenErrorOnEdit}\n                            error={this.getErrorByFieldname('taskName')}\n                            isRequired\n                            label={<FormattedMessage {...messages.tasksAddTaskFormMessageLabel} />}\n                            name=\"taskName\"\n                            onBlur={() => this.validateForm('taskName')}\n                            onChange={this.handleChangeMessage}\n                            placeholder={intl.formatMessage(commentFormMessages.commentWrite)}\n                            value={message}\n                        />\n                        <DatePicker\n                            className=\"bcs-task-add-due-date-input\"\n                            error={this.getErrorByFieldname('taskDueDate')}\n                            inputProps={{\n                                [INTERACTION_TARGET]: ACTIVITY_TARGETS.TASK_DATE_PICKER,\n                                'data-testid': 'task-form-date-input',\n                            }}\n                            isAccessible\n                            isDisabled={isForbiddenErrorOnEdit}\n                            isKeyboardInputAllowed\n                            isRequired={false}\n                            label={<FormattedMessage {...messages.tasksAddTaskFormDueDateLabel} />}\n                            minDate={new Date()}\n                            name=\"taskDueDate\"\n                            onChange={this.handleDueDateChange}\n                            placeholder={intl.formatMessage(commentFormMessages.approvalSelectDate)}\n                            value={dueDate || undefined}\n                        />\n                        <ModalActions>\n                            <Button\n                                className=\"bcs-task-input-cancel-btn\"\n                                data-resin-target={ACTIVITY_TARGETS.APPROVAL_FORM_CANCEL}\n                                data-testid=\"task-form-cancel-button\"\n                                onClick={this.handleCancelClick}\n                                isDisabled={isLoading}\n                                type=\"button\"\n                                {...this.addResinInfo()}\n                            >\n                                <FormattedMessage {...messages.tasksAddTaskFormCancelLabel} />\n                            </Button>\n                            <PrimaryButton\n                                className=\"bcs-task-input-submit-btn\"\n                                data-resin-target={ACTIVITY_TARGETS.APPROVAL_FORM_POST}\n                                data-testid=\"task-form-submit-button\"\n                                isDisabled={isForbiddenErrorOnEdit}\n                                isLoading={isLoading}\n                                {...this.addResinInfo()}\n                            >\n                                <FormattedMessage {...submitButtonMessage} />\n                            </PrimaryButton>\n                        </ModalActions>\n                    </Form>\n                </div>\n            </div>\n        );\n    }\n}\n\n// For testing only\nexport { TaskForm as TaskFormUnwrapped };\nexport type { TaskFormConsumerProps as TaskFormProps };\n\nexport default injectIntl(TaskForm);\n"],"file":"TaskForm.js"}

package/es/elements/content-sidebar/versions/StaticVersionSidebar.js

@@ -0,0 +1,78 @@
+/**
+ * 
+ * @file Static Versions Sidebar component
+ * @author Box
+ */
+import * as React from 'react';
+import { FormattedMessage } from 'react-intl';
+import BoxDrive140 from '../../../illustration/BoxDrive140';
+import { BackButton } from '../../common/nav-button';
+import PrimaryButton from '../../../components/primary-button';
+import { LoadingIndicatorWrapper } from '../../../components/loading-indicator';
+import VersionsMenu from './VersionsMenu';
+import messages from './messages';
+import './StaticVersionsSidebar.scss';
+
+var StaticVersionsSidebar = function StaticVersionsSidebar(_ref) {
+  var isLoading = _ref.isLoading,
+      onUpgradeClick = _ref.onUpgradeClick,
+      parentName = _ref.parentName,
+      showUpsellWithPicture = _ref.showUpsellWithPicture;
+  var versionTimestamp = new Date();
+  versionTimestamp.setDate(versionTimestamp.getDate() - 1);
+  var versions = ['1', '2', '3'].map(function (versionNumber) {
+    return {
+      id: versionNumber,
+      version_number: versionNumber,
+      type: 'file_version',
+      permissions: {
+        can_preview: true
+      },
+      created_at: versionTimestamp.toUTCString(),
+      modified_by: null,
+      size: 1875887,
+      trashed_at: null,
+      uploader_display_name: 'John Doe'
+    };
+  });
+  return React.createElement("div", {
+    className: "bcs-StaticVersionSidebar",
+    role: "tabpanel",
+    "data-resin-component": "preview",
+    "data-resin-feature": "versions"
+  }, React.createElement("div", {
+    className: "bcs-StaticVersionSidebar-header"
+  }, React.createElement("h3", {
+    className: "bcs-StaticVersionSidebar-title"
+  }, React.createElement(React.Fragment, null, React.createElement(BackButton, {
+    "data-resin-target": "back",
+    to: "/".concat(parentName)
+  }), React.createElement(FormattedMessage, messages.versionsTitle)))), React.createElement("div", {
+    className: "bcs-StaticVersionSidebar-content-wrapper"
+  }, React.createElement(LoadingIndicatorWrapper, {
+    className: "bcs-StaticVersionSidebar-content",
+    crawlerPosition: "top",
+    isLoading: isLoading
+  }, React.createElement(VersionsMenu, {
+    versions: versions,
+    fileId: "1",
+    versionCount: 3,
+    versionLimit: 3
+  }))), React.createElement("div", {
+    className: "bcs-StaticVersionSidebar-upsell-wrapper"
+  }, React.createElement("div", {
+    className: "bcs-StaticVersionSidebar-upsell"
+  }, showUpsellWithPicture && React.createElement(BoxDrive140, {
+    className: "bcs-StaticVersionSidebar-upsell-icon"
+  }), React.createElement("p", {
+    className: "bcs-StaticVersionSidebar-upsell-header"
+  }, React.createElement(FormattedMessage, messages.versionUpgradeLink)), React.createElement("p", null, React.createElement(FormattedMessage, messages.versionUpsell)), React.createElement(PrimaryButton, {
+    className: "bcs-StaticVersionSidebar-upsell-button",
+    "data-resin-target": "versioning_error_upgrade_cta",
+    onClick: onUpgradeClick,
+    type: "button"
+  }, React.createElement(FormattedMessage, messages.upgradeButton)))));
+};
+
+export default StaticVersionsSidebar;
+//# sourceMappingURL=StaticVersionSidebar.js.map

package/es/elements/content-sidebar/versions/StaticVersionSidebar.js.flow

@@ -0,0 +1,97 @@
+/**
+ * @flow
+ * @file Static Versions Sidebar component
+ * @author Box
+ */
+
+import * as React from 'react';
+import { FormattedMessage } from 'react-intl';
+
+import BoxDrive140 from '../../../illustration/BoxDrive140';
+
+import { BackButton } from '../../common/nav-button';
+import PrimaryButton from '../../../components/primary-button';
+import { LoadingIndicatorWrapper } from '../../../components/loading-indicator';
+import VersionsMenu from './VersionsMenu';
+
+import messages from './messages';
+
+import './StaticVersionsSidebar.scss';
+
+type Props = {
+    isLoading: boolean,
+    onUpgradeClick: () => void,
+    parentName: string,
+    showUpsellWithPicture: boolean,
+};
+
+const StaticVersionsSidebar = ({ isLoading, onUpgradeClick, parentName, showUpsellWithPicture }: Props): React.Node => {
+    const versionTimestamp = new Date();
+    versionTimestamp.setDate(versionTimestamp.getDate() - 1);
+
+    const versions = ['1', '2', '3'].map(versionNumber => {
+        return {
+            id: versionNumber,
+            version_number: versionNumber,
+            type: 'file_version',
+            permissions: {
+                can_preview: true,
+            },
+            created_at: versionTimestamp.toUTCString(),
+            modified_by: null,
+            size: 1875887,
+            trashed_at: null,
+            uploader_display_name: 'John Doe',
+        };
+    });
+
+    return (
+        <div
+            className="bcs-StaticVersionSidebar"
+            role="tabpanel"
+            data-resin-component="preview"
+            data-resin-feature="versions"
+        >
+            <div className="bcs-StaticVersionSidebar-header">
+                <h3 className="bcs-StaticVersionSidebar-title">
+                    <>
+                        <BackButton data-resin-target="back" to={`/${parentName}`} />
+                        <FormattedMessage {...messages.versionsTitle} />
+                    </>
+                </h3>
+            </div>
+
+            <div className="bcs-StaticVersionSidebar-content-wrapper">
+                <LoadingIndicatorWrapper
+                    className="bcs-StaticVersionSidebar-content"
+                    crawlerPosition="top"
+                    isLoading={isLoading}
+                >
+                    <VersionsMenu versions={versions} fileId="1" versionCount={3} versionLimit={3} />
+                </LoadingIndicatorWrapper>
+            </div>
+
+            <div className="bcs-StaticVersionSidebar-upsell-wrapper">
+                <div className="bcs-StaticVersionSidebar-upsell">
+                    {showUpsellWithPicture && <BoxDrive140 className="bcs-StaticVersionSidebar-upsell-icon" />}
+                    <p className="bcs-StaticVersionSidebar-upsell-header">
+                        <FormattedMessage {...messages.versionUpgradeLink} />
+                    </p>
+                    <p>
+                        <FormattedMessage {...messages.versionUpsell} />
+                    </p>
+                    <PrimaryButton
+                        className="bcs-StaticVersionSidebar-upsell-button"
+                        data-resin-target="versioning_error_upgrade_cta"
+                        onClick={onUpgradeClick}
+                        type="button"
+                    >
+                        <FormattedMessage {...messages.upgradeButton} />
+                    </PrimaryButton>
+                </div>
+            </div>
+        </div>
+    );
+};
+
+export default StaticVersionsSidebar;

package/es/elements/content-sidebar/versions/StaticVersionSidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/elements/content-sidebar/versions/StaticVersionSidebar.js"],"names":["React","FormattedMessage","BoxDrive140","BackButton","PrimaryButton","LoadingIndicatorWrapper","VersionsMenu","messages","StaticVersionsSidebar","isLoading","onUpgradeClick","parentName","showUpsellWithPicture","versionTimestamp","Date","setDate","getDate","versions","map","versionNumber","id","version_number","type","permissions","can_preview","created_at","toUTCString","modified_by","size","trashed_at","uploader_display_name","versionsTitle","versionUpgradeLink","versionUpsell","upgradeButton"],"mappings":"AAAA;;;;;AAMA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,gBAAT,QAAiC,YAAjC;AAEA,OAAOC,WAAP,MAAwB,mCAAxB;AAEA,SAASC,UAAT,QAA2B,yBAA3B;AACA,OAAOC,aAAP,MAA0B,oCAA1B;AACA,SAASC,uBAAT,QAAwC,uCAAxC;AACA,OAAOC,YAAP,MAAyB,gBAAzB;AAEA,OAAOC,QAAP,MAAqB,YAArB;AAEA,OAAO,8BAAP;;AASA,IAAMC,qBAAqB,GAAG,SAAxBA,qBAAwB,OAAyF;AAAA,MAAtFC,SAAsF,QAAtFA,SAAsF;AAAA,MAA3EC,cAA2E,QAA3EA,cAA2E;AAAA,MAA3DC,UAA2D,QAA3DA,UAA2D;AAAA,MAA/CC,qBAA+C,QAA/CA,qBAA+C;AACnH,MAAMC,gBAAgB,GAAG,IAAIC,IAAJ,EAAzB;AACAD,EAAAA,gBAAgB,CAACE,OAAjB,CAAyBF,gBAAgB,CAACG,OAAjB,KAA6B,CAAtD;AAEA,MAAMC,QAAQ,GAAG,CAAC,GAAD,EAAM,GAAN,EAAW,GAAX,EAAgBC,GAAhB,CAAoB,UAAAC,aAAa,EAAI;AAClD,WAAO;AACHC,MAAAA,EAAE,EAAED,aADD;AAEHE,MAAAA,cAAc,EAAEF,aAFb;AAGHG,MAAAA,IAAI,EAAE,cAHH;AAIHC,MAAAA,WAAW,EAAE;AACTC,QAAAA,WAAW,EAAE;AADJ,OAJV;AAOHC,MAAAA,UAAU,EAAEZ,gBAAgB,CAACa,WAAjB,EAPT;AAQHC,MAAAA,WAAW,EAAE,IARV;AASHC,MAAAA,IAAI,EAAE,OATH;AAUHC,MAAAA,UAAU,EAAE,IAVT;AAWHC,MAAAA,qBAAqB,EAAE;AAXpB,KAAP;AAaH,GAdgB,CAAjB;AAgBA,SACI;AACI,IAAA,SAAS,EAAC,0BADd;AAEI,IAAA,IAAI,EAAC,UAFT;AAGI,4BAAqB,SAHzB;AAII,0BAAmB;AAJvB,KAMI;AAAK,IAAA,SAAS,EAAC;AAAf,KACI;AAAI,IAAA,SAAS,EAAC;AAAd,KACI,0CACI,oBAAC,UAAD;AAAY,yBAAkB,MAA9B;AAAqC,IAAA,EAAE,aAAMnB,UAAN;AAAvC,IADJ,EAEI,oBAAC,gBAAD,EAAsBJ,QAAQ,CAACwB,aAA/B,CAFJ,CADJ,CADJ,CANJ,EAeI;AAAK,IAAA,SAAS,EAAC;AAAf,KACI,oBAAC,uBAAD;AACI,IAAA,SAAS,EAAC,kCADd;AAEI,IAAA,eAAe,EAAC,KAFpB;AAGI,IAAA,SAAS,EAAEtB;AAHf,KAKI,oBAAC,YAAD;AAAc,IAAA,QAAQ,EAAEQ,QAAxB;AAAkC,IAAA,MAAM,EAAC,GAAzC;AAA6C,IAAA,YAAY,EAAE,CAA3D;AAA8D,IAAA,YAAY,EAAE;AAA5E,IALJ,CADJ,CAfJ,EAyBI;AAAK,IAAA,SAAS,EAAC;AAAf,KACI;AAAK,IAAA,SAAS,EAAC;AAAf,KACKL,qBAAqB,IAAI,oBAAC,WAAD;AAAa,IAAA,SAAS,EAAC;AAAvB,IAD9B,EAEI;AAAG,IAAA,SAAS,EAAC;AAAb,KACI,oBAAC,gBAAD,EAAsBL,QAAQ,CAACyB,kBAA/B,CADJ,CAFJ,EAKI,+BACI,oBAAC,gBAAD,EAAsBzB,QAAQ,CAAC0B,aAA/B,CADJ,CALJ,EAQI,oBAAC,aAAD;AACI,IAAA,SAAS,EAAC,wCADd;AAEI,yBAAkB,8BAFtB;AAGI,IAAA,OAAO,EAAEvB,cAHb;AAII,IAAA,IAAI,EAAC;AAJT,KAMI,oBAAC,gBAAD,EAAsBH,QAAQ,CAAC2B,aAA/B,CANJ,CARJ,CADJ,CAzBJ,CADJ;AA+CH,CAnED;;AAqEA,eAAe1B,qBAAf","sourcesContent":["/**\n * @flow\n * @file Static Versions Sidebar component\n * @author Box\n */\n\nimport * as React from 'react';\nimport { FormattedMessage } from 'react-intl';\n\nimport BoxDrive140 from '../../../illustration/BoxDrive140';\n\nimport { BackButton } from '../../common/nav-button';\nimport PrimaryButton from '../../../components/primary-button';\nimport { LoadingIndicatorWrapper } from '../../../components/loading-indicator';\nimport VersionsMenu from './VersionsMenu';\n\nimport messages from './messages';\n\nimport './StaticVersionsSidebar.scss';\n\ntype Props = {\n    isLoading: boolean,\n    onUpgradeClick: () => void,\n    parentName: string,\n    showUpsellWithPicture: boolean,\n};\n\nconst StaticVersionsSidebar = ({ isLoading, onUpgradeClick, parentName, showUpsellWithPicture }: Props): React.Node => {\n    const versionTimestamp = new Date();\n    versionTimestamp.setDate(versionTimestamp.getDate() - 1);\n\n    const versions = ['1', '2', '3'].map(versionNumber => {\n        return {\n            id: versionNumber,\n            version_number: versionNumber,\n            type: 'file_version',\n            permissions: {\n                can_preview: true,\n            },\n            created_at: versionTimestamp.toUTCString(),\n            modified_by: null,\n            size: 1875887,\n            trashed_at: null,\n            uploader_display_name: 'John Doe',\n        };\n    });\n\n    return (\n        <div\n            className=\"bcs-StaticVersionSidebar\"\n            role=\"tabpanel\"\n            data-resin-component=\"preview\"\n            data-resin-feature=\"versions\"\n        >\n            <div className=\"bcs-StaticVersionSidebar-header\">\n                <h3 className=\"bcs-StaticVersionSidebar-title\">\n                    <>\n                        <BackButton data-resin-target=\"back\" to={`/${parentName}`} />\n                        <FormattedMessage {...messages.versionsTitle} />\n                    </>\n                </h3>\n            </div>\n\n            <div className=\"bcs-StaticVersionSidebar-content-wrapper\">\n                <LoadingIndicatorWrapper\n                    className=\"bcs-StaticVersionSidebar-content\"\n                    crawlerPosition=\"top\"\n                    isLoading={isLoading}\n                >\n                    <VersionsMenu versions={versions} fileId=\"1\" versionCount={3} versionLimit={3} />\n                </LoadingIndicatorWrapper>\n            </div>\n\n            <div className=\"bcs-StaticVersionSidebar-upsell-wrapper\">\n                <div className=\"bcs-StaticVersionSidebar-upsell\">\n                    {showUpsellWithPicture && <BoxDrive140 className=\"bcs-StaticVersionSidebar-upsell-icon\" />}\n                    <p className=\"bcs-StaticVersionSidebar-upsell-header\">\n                        <FormattedMessage {...messages.versionUpgradeLink} />\n                    </p>\n                    <p>\n                        <FormattedMessage {...messages.versionUpsell} />\n                    </p>\n                    <PrimaryButton\n                        className=\"bcs-StaticVersionSidebar-upsell-button\"\n                        data-resin-target=\"versioning_error_upgrade_cta\"\n                        onClick={onUpgradeClick}\n                        type=\"button\"\n                    >\n                        <FormattedMessage {...messages.upgradeButton} />\n                    </PrimaryButton>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default StaticVersionsSidebar;\n"],"file":"StaticVersionSidebar.js"}

package/es/elements/content-sidebar/versions/StaticVersionsSidebar.scss

@@ -0,0 +1,67 @@
+@import '../../../styles/variables';
+@import '../../common/variables';
+
+.bcs-StaticVersionSidebar {
+    position: relative;
+    width: 341px; // 1px extra to account for the margin left
+    margin-left: -1px; // -1px to make nav button hover not have blank space
+    border-left: 1px solid $bdl-gray-10;
+
+    .bcs-StaticVersionSidebar-header {
+        display: flex;
+        align-items: center;
+        height: 60px;
+        margin: 0 25px;
+        border-bottom: 1px solid $bdl-gray-10;
+
+        .bcs-StaticVersionSidebar-title {
+            display: flex;
+            font-size: 16px;
+        }
+    }
+
+    .bcs-StaticVersionSidebar-content-wrapper {
+        position: absolute;
+        width: calc(100% - 20px);
+
+        .bcs-StaticVersionSidebar-content {
+            padding-left: 25px;
+            pointer-events: none;
+
+            button[data-resin-iscurrent='true'].bcs-VersionsItemButton {
+                width: 100%;
+                background-color: $hover-blue-background;
+                border: 1px solid $bdl-box-blue;
+            }
+        }
+    }
+}
+
+.bcs-StaticVersionSidebar-upsell-wrapper {
+    position: relative;
+    height: 100%;
+    text-align: center;
+    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 30%);
+
+    .bcs-StaticVersionSidebar-upsell {
+        position: absolute;
+        top: 30%;
+        padding: 48px;
+
+        .bcs-StaticVersionSidebar-upsell-icon {
+            width: 80px;
+            height: 80px;
+        }
+
+        .bcs-StaticVersionSidebar-upsell-header {
+            margin: 0 0 10px;
+            font-weight: bold;
+        }
+
+        .bcs-StaticVersionSidebar-upsell-button {
+            margin-top: -8px;
+            padding: 10px 15px;
+            border-radius: 5px;
+        }
+    }
+}

package/es/elements/content-sidebar/versions/VersionsSidebar.js

@@ -16,6 +16,7 @@ import messages from './messages';
 import SidebarContent from '../SidebarContent';
 import VersionsMenu from './VersionsMenu';
 import { BackButton } from '../../common/nav-button';
+import PlainButton from '../../../components/plain-button/PlainButton';
 import { DEFAULT_FETCH_END } from '../../../constants';
 import { LoadingIndicatorWrapper } from '../../../components/loading-indicator';
 import './VersionsSidebar.scss';
@@ -23,14 +24,16 @@ var MAX_VERSIONS = DEFAULT_FETCH_END;
 
 var VersionsSidebar = function VersionsSidebar(_ref) {
   var error = _ref.error,
+      errorTitle = _ref.errorTitle,
+      onUpgradeClick = _ref.onUpgradeClick,
       isLoading = _ref.isLoading,
       parentName = _ref.parentName,
       versions = _ref.versions,
-      rest = _objectWithoutProperties(_ref, ["error", "isLoading", "parentName", "versions"]);
+      rest = _objectWithoutProperties(_ref, ["error", "errorTitle", "onUpgradeClick", "isLoading", "parentName", "versions"]);
 
   var showLimit = versions.length >= MAX_VERSIONS;
   var showVersions = !!versions.length;
-  var showEmpty = !isLoading && !showVersions;
+  var showEmpty = !isLoading && !showVersions && !onUpgradeClick;
   var showError = !!error;
   return React.createElement(SidebarContent, {
     className: "bcs-Versions",
@@ -45,8 +48,13 @@ var VersionsSidebar = function VersionsSidebar(_ref) {
     crawlerPosition: "top",
     isLoading: isLoading
   }, showError && React.createElement(InlineError, {
-    title: React.createElement(FormattedMessage, messages.versionServerError)
-  }, React.createElement(FormattedMessage, error)), showEmpty && React.createElement("div", {
+    title: React.createElement(FormattedMessage, errorTitle)
+  }, React.createElement(FormattedMessage, error), onUpgradeClick && React.createElement(PlainButton, {
+    onClick: onUpgradeClick,
+    "data-resin-target": "versioning_error_error_message_upgrade_cta",
+    type: "button",
+    className: "bcs-Versions-upgrade"
+  }, React.createElement(FormattedMessage, messages.versionUpgradeLink))), showEmpty && React.createElement("div", {
     className: "bcs-Versions-empty"
   }, React.createElement(FormattedMessage, messages.versionsEmpty)), showVersions && React.createElement("div", {
     className: "bcs-Versions-menu"