Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
{/* this div matches the number of cell of the previous table-row, it allows proper alignment of borders */}
<div> </div>
) : null
return (
<li>
{progressDisplay}
<div>
<span data-original-title="{createdMessageText}" data-toggle="tooltip">{this.props.fileName}</span>
<span>{formatFileSize( this.props.fileSize )}</span>
</div>
{deleteBtn}
{successIcon}
{errorMessage}
</li>
)
}
{label ? <label>{label}{help && }</label> : null}
<div>
<input disabled="{disabled}" type="file" name="{name}"> { this.setValue( e, { input, meta } ) }} />
<span>
{
!!filename && !!filesize
? <span>
<span>
<span>{wordings.name}:</span> {filename}</span>, <span><span>{wordings.size}:</span> {formatFileSize( filesize )}</span>
</span>
: !fileUploaded ? <span>{wordings.noFileChosen}</span> : <span>{wordings.fileUploaded}</span>
}
</span></div>
{( meta.touched && !!meta.error ) ? <p>{meta.error}</p> : ( collapseErrorSpace || this.state.loadingError ? null : <p> </p> )}
{
( input.value && displayPreview && fileContent ) ?
<div>
<em><small>{label && <span>{label}</span>}{wordings.previewLowerCase}</small></em>
{
getAsDataUrl ? (
<div><img src="{fileContent}" style="{{"></div>
) : <pre>{fileContent}</pre></div>
{label ? <label>{label}{help && }</label> : null}
<div>
<input disabled="{disabled}" type="file" name="{name}"> { setValue( e, field.input, onFileLoaded, setFileContent, setLoadingError, setFilename, setFilesize ) }} />
<span>
{
!!filename && !!filesize
? <span>
<span>
<span>{wordings.name}:</span> {filename}</span>, <span><span>{wordings.size}:</span> {formatFileSize( filesize )}</span>
</span>
: !fileUploaded ? <span>{wordings.noFileChosen}</span> : <span>{wordings.fileUploaded}</span>
}
</span></div>
{( meta.touched && !!meta.error ) ? <p>{meta.error}</p> : ( collapseErrorSpace || loadingError ? null : <p> </p> )}
{
( input.value && displayPreview && fileContent ) ?
<div>
<em><small>{label && <span>{label}</span>}{wordings.previewLowerCase}</small></em>
<pre>{fileContent}</pre>
</div> : null
}
<div>
<div>
<div>
<h5>{wordings.selectedFile}</h5>
<p>
<span>{wordings.name.toLowerCase()}</span>
<br>
<em>{this.props.fileData.name}</em>
</p>
<p>
<span>{wordings.size.toLowerCase()}</span>
<br>
<em>{formatFileSize( this.props.fileData.size )}</em>
</p>
</div>
</div>
<div>
<div>
<div>
<label>{wordings.fileType}</label>
<select value="{impFileType}" name="impFileType">
<option value="CSV">CSV</option>
<option value="EXCEL">Excel</option>
</select>
</div></div></div></div>
let errors = this.state.invalidFiles.map( ( file, idx ) => {
return (
<div>
<span><strong>{file.name}</strong> - </span><em>{formatFileSize( file.size )}, {file.type || wordings.unknownFormat}</em>
</div>
)
} )
<div>
<div>
<ul style="{{">
{filesDisplay}
</ul>
{
this.state.invalidFiles.length ? (
<div>
<button type="button">×</button>
<div>
<strong>{wordings.invalidFile}</strong>
<span data-target="#inputFormatInfo" data-toggle="collapse">
<div style="{{" id="inputFormatInfo">
{this.props.mimeTypeAccepted ? <div><strong>{wordings.contentType}</strong><span>{this.props.mimeTypeAccepted}</span></div> : null}
{this.props.maxBytesSize ? <div><strong>{wordings.maxSize}</strong><span>{formatFileSize( this.props.maxBytesSize )}</span></div> : null}
</div>
</span></div>
{errors}
</div>
) : null
}
</div>
</div>
{cancelBtn}
)