Commit b36862c5 authored by Audrey Hamelers's avatar Audrey Hamelers
parent 0ebdf39a
Pipeline #12955 passed with stages
in 5 minutes and 47 seconds
......@@ -4,7 +4,7 @@ import Dropzone from 'react-dropzone'
import styled, { createGlobalStyle } from 'styled-components'
import { debounce } from 'lodash'
import { th, override } from '@pubsweet/ui-toolkit'
import { Action, TextField, Icon, Checkbox } from '@pubsweet/ui'
import { Action, TextField, Icon, Checkbox, ErrorText } from '@pubsweet/ui'
import { LoadingIcon, Select } from '../ui'
import { FileLightbox } from '../preview-files'
import { SubmissionTypes, FileTypes, ManuscriptTypes } from './uploadtypes'
......@@ -184,11 +184,12 @@ class UploadFileListItem extends React.Component {
label: this.props.file.label ? this.props.file.label : '',
type: this.props.file.type ? this.props.file.type : '',
loading: false,
tooLong: false,
}
static contextType = UserContext
render() {
const currentUser = this.context
const { label, type, loading } = this.state
const { label, type, loading, tooLong } = this.state
const { types, file, manuscript, pdfSend, setNotification } = this.props
return (
<Mutation
......@@ -305,8 +306,12 @@ class UploadFileListItem extends React.Component {
const val = e.target.value
const obj = {}
obj[key] = val
this.setState(obj)
updateFileHandler(obj)
if (key === 'label' && val.length > 100) {
this.setState({ tooLong: true })
} else {
this.setState(Object.assign({ tooLong: false }, obj))
updateFileHandler(obj)
}
}
return (
<FileListItem>
......@@ -326,19 +331,30 @@ class UploadFileListItem extends React.Component {
options={types}
value={type}
/>
<TextField
invalidTest={
!file.label &&
SubmissionTypes.some(t => t.value === file.type)
}
label="Label to appear in text"
name="label"
onBlur={onPropChange}
onChange={e => this.setState({ label: e.target.value })}
placeholder="F1, Fig. 1, Figure 1"
value={label}
/>
<div>
<TextField
invalidTest={
(!file.label &&
SubmissionTypes.some(
t => t.value === file.type,
)) ||
tooLong
}
label="Label to appear in text"
name="label"
onBlur={onPropChange}
onChange={e =>
this.setState({ label: e.target.value })
}
placeholder="F1, Fig. 1, Figure 1"
value={label}
/>
{tooLong && (
<ErrorText>
Label must be under 100 characters
</ErrorText>
)}
</div>
</React.Fragment>
<ButtonDiv>
<ReplaceButton
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment