Commit graph

3 commits

Author SHA1 Message Date
Amit Uttam
66a6e5c932 [MM-10813] Design update for Post attachments (#3511)
* [MM-10813] Design update for Post attachments

Fixes https://github.com/mattermost/mattermost-server/issues/12841

* Updated visual treatment for Post attachments (images, documents, videos)
* Grouped image attachments, expanding to fit Post width dimension
* Itemized listing of non-image attachments
* Special handling of "small" image attachments (<48 point width/height)

* Set attachment post width to max width of portrait orientation

Accounts for post display offset and extra spacing used for rendering post replies.

* Use available Post real estate: flex: 1 instead of width 100%

* Image spacing responsibility: AttachmentList -> AttachmentImage

* Fit download progress circle correctly over new attachment icons

* Layers progress circle over the icon, rather than under.
* Uses offset constant as far as possible, rather than fixed point spaces.

* Refactor props and 'more' counting for image file attachment(s)

* Implement conditional gutter between image attachments

Flex's `justifyContent: space-between` won't work in this case because of the use of `absoluteFill` and `paddingBottom: 100%` in the box placeholder for an image attachment to auto-fill *all* available flex space.

* Additional snapshots for Post file attachment scenarios

* Use new 'text' icon for text files (.txt, .rtf)

Depends on https://github.com/mattermost/mattermost-redux/pull/979

Even without the change to mattermost-redux above, text files will default to pre-existing "code" icon.

* Set file attachment icon background to theme

Default to transparent. Override if explicitly specified.

* Treat animated GIFs as images when auto-adjusting attachment width

* Fix images layout, progressive image margins, and gallery for images and videos

* fix on iPad (splitview, permanent sidebar) card types and image sizes

* Add all files back to the gallery
2019-11-15 22:41:09 -05:00
Peter Dave Hello
d5a0b50d9a Optimize png image with zopflipng lossless compression (#2682) 2019-04-22 21:57:49 -04:00
Chris Duarte
3b7a6df617 PLT-5530 Render placeholder icons + metadata for file attachments in posts list (#249)
* Add icons for file types

* Compress image files for file type icons

* Add constants for file types

* Add utils for file metadata

* Add actions & reducers for fetching file attachments

* Render file attachments in posts

* Add reducers for handling files requests

* Refactor getFileType in file utils

* Refactor getFileIconPath in file utils

* Refactor getFormattedFileSize in file utils

* Trim trailing whitespace in getTruncatedFilename

* Style file attachment metadata

* Remove entity store reducer for files fetch failure

* Change filesForPost to fileIdsForPost in files store

* Use a selector for getFilesForPost

* Memoize getFilesForPost selector

* Dispatch postId with getFilesForPost

* Add test for getFilesForPost

* Upload seed file in getFilesForPost test

* Display correct icon for image attachments

* Fix reducers for receiving files for post

Expect response data to be array not object

* Style attachment post

* Merge headers (defaults + opts) in Client.doFetch

* Upload file as FormData

* Use form-data lib instead of built-in polyfill

* Associate file with post in getFilesForPost test

* Improve assertions in getFilesForPost test

* Check for createPost failure in getFilesForPost test

* Use correct post id in getFilesForPost test

* Use client not action to create post in getFilesForPost test

* Fix file upload in getFilesForPost test

* Add assertion for name of uploaded file

* Update attachment post style

* Fix spelling of loadFilesForPostIfNecessary

* Remove eslint-disable no-magic-numbers from file_utils.js

* Remove unused index prop from FileAttachment

* Clarify code for merging headers in Client.getOptions

* Dynamically truncate file attachment names

* Extract component for FileAttachmentIcon

* Use white bg for FileAttachmentIcon to match webapp styles

* Match webapp styles for file attachment borders

* Move file icon path lookup to FileAttachmentIcon

* Use more logical ordering for file type lookup
2017-02-17 17:40:40 -05:00