diff options
author | Saturnino Abril <saturnino.abril@gmail.com> | 2017-08-05 02:00:23 +0800 |
---|---|---|
committer | Christopher Speller <crspeller@gmail.com> | 2017-08-04 11:00:23 -0700 |
commit | 2c8a5ffd971f00648e7bc5f48993fc187f3179f2 (patch) | |
tree | 2376bd6ae34e9e21cdf57e240e62ad67492df654 /webapp | |
parent | c973608ccb47373b60b333617f04bde8a3978521 (diff) | |
download | chat-2c8a5ffd971f00648e7bc5f48993fc187f3179f2.tar.gz chat-2c8a5ffd971f00648e7bc5f48993fc187f3179f2.tar.bz2 chat-2c8a5ffd971f00648e7bc5f48993fc187f3179f2.zip |
[PLT-2407] Improve ordering of uploaded attachments (#7022)
* improve ordering of uploaded attachments
* use LocalizationStore.getLocale() when comparing file names
Diffstat (limited to 'webapp')
-rw-r--r-- | webapp/components/file_attachment_list/file_attachment_list.jsx | 10 | ||||
-rw-r--r-- | webapp/components/file_preview.jsx | 3 | ||||
-rw-r--r-- | webapp/components/file_upload.jsx | 14 | ||||
-rw-r--r-- | webapp/utils/utils.jsx | 5 |
4 files changed, 21 insertions, 11 deletions
diff --git a/webapp/components/file_attachment_list/file_attachment_list.jsx b/webapp/components/file_attachment_list/file_attachment_list.jsx index 31b1ac424..a497a0004 100644 --- a/webapp/components/file_attachment_list/file_attachment_list.jsx +++ b/webapp/components/file_attachment_list/file_attachment_list.jsx @@ -61,14 +61,16 @@ export default class FileAttachmentList extends React.Component { render() { const postFiles = []; + let fileInfos = []; if (this.props.fileInfos && this.props.fileInfos.length > 0) { - for (let i = 0; i < Math.min(this.props.fileInfos.length, Constants.MAX_DISPLAY_FILES); i++) { - const fileInfo = this.props.fileInfos[i]; + fileInfos = this.props.fileInfos.sort((a, b) => a.create_at - b.create_at); + for (let i = 0; i < Math.min(fileInfos.length, Constants.MAX_DISPLAY_FILES); i++) { + const fileInfo = fileInfos[i]; postFiles.push( <FileAttachment key={fileInfo.id} - fileInfo={this.props.fileInfos[i]} + fileInfo={fileInfos[i]} index={i} handleImageClick={this.handleImageClick} compactDisplay={this.props.compactDisplay} @@ -96,7 +98,7 @@ export default class FileAttachmentList extends React.Component { show={this.state.showPreviewModal} onModalDismissed={() => this.setState({showPreviewModal: false})} startId={this.state.startImgIndex} - fileInfos={this.props.fileInfos} + fileInfos={fileInfos} /> </div> ); diff --git a/webapp/components/file_preview.jsx b/webapp/components/file_preview.jsx index 93ee53515..3ec656fd4 100644 --- a/webapp/components/file_preview.jsx +++ b/webapp/components/file_preview.jsx @@ -41,7 +41,8 @@ export default class FilePreview extends React.Component { render() { var previews = []; - this.props.fileInfos.forEach((info) => { + const fileInfos = this.props.fileInfos.sort((a, b) => a.create_at - b.create_at); + fileInfos.forEach((info) => { const type = Utils.getFileType(info.extension); let className = 'file-preview'; diff --git a/webapp/components/file_upload.jsx b/webapp/components/file_upload.jsx index 0b32ab66e..0eb12a097 100644 --- a/webapp/components/file_upload.jsx +++ b/webapp/components/file_upload.jsx @@ -72,6 +72,8 @@ class FileUpload extends React.Component { } uploadFiles(files) { + const sortedFiles = Utils.sortFilesByName(files); + // clear any existing errors this.props.onUploadError(null); @@ -83,9 +85,9 @@ class FileUpload extends React.Component { // keep track of how many files have been too large const tooLargeFiles = []; - for (let i = 0; i < files.length && numUploads < uploadsRemaining; i++) { - if (files[i].size > global.mm_config.MaxFileSize) { - tooLargeFiles.push(files[i]); + for (let i = 0; i < sortedFiles.length && numUploads < uploadsRemaining; i++) { + if (sortedFiles[i].size > global.mm_config.MaxFileSize) { + tooLargeFiles.push(sortedFiles[i]); continue; } @@ -93,8 +95,8 @@ class FileUpload extends React.Component { const clientId = Utils.generateId(); const request = uploadFile( - files[i], - files[i].name, + sortedFiles[i], + sortedFiles[i].name, channelId, clientId, this.fileUploadSuccess.bind(this, channelId), @@ -111,7 +113,7 @@ class FileUpload extends React.Component { } const {formatMessage} = this.props.intl; - if (files.length > uploadsRemaining) { + if (sortedFiles.length > uploadsRemaining) { this.props.onUploadError(formatMessage(holders.limited, {count: Constants.MAX_UPLOAD_FILES})); } else if (tooLargeFiles.length > 1) { var tooLargeFilenames = tooLargeFiles.map((file) => file.name).join(', '); diff --git a/webapp/utils/utils.jsx b/webapp/utils/utils.jsx index f12fcefba..89e031a3c 100644 --- a/webapp/utils/utils.jsx +++ b/webapp/utils/utils.jsx @@ -475,6 +475,11 @@ export function splitFileLocation(fileLocation) { return {ext, name: filename, path: filePath}; } +export function sortFilesByName(files) { + const locale = LocalizationStore.getLocale(); + return Array.from(files).sort((a, b) => a.name.localeCompare(b.name, locale, {numeric: true})); +} + export function toTitleCase(str) { function doTitleCase(txt) { return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase(); |