diff --git a/app/soapbox/features/compose/components/upload.js b/app/soapbox/features/compose/components/upload.js index 14b8ba5c9..4e03d1268 100644 --- a/app/soapbox/features/compose/components/upload.js +++ b/app/soapbox/features/compose/components/upload.js @@ -9,6 +9,40 @@ import classNames from 'classnames'; import Icon from 'soapbox/components/icon'; import Blurhash from 'soapbox/components/blurhash'; +const MIMETYPE_ICONS = { + 'application/x-freearc': 'file-archive-o', + 'application/x-bzip': 'file-archive-o', + 'application/x-bzip2': 'file-archive-o', + 'application/gzip': 'file-archive-o', + 'application/vnd.rar': 'file-archive-o', + 'application/x-tar': 'file-archive-o', + 'application/zip': 'file-archive-o', + 'application/x-7z-compressed': 'file-archive-o', + 'application/x-csh': 'file-code-o', + 'application/html': 'file-code-o', + 'text/javascript': 'file-code-o', + 'application/json': 'file-code-o', + 'application/ld+json': 'file-code-o', + 'application/x-httpd-php': 'file-code-o', + 'application/x-sh': 'file-code-o', + 'application/xhtml+xml': 'file-code-o', + 'application/xml': 'file-code-o', + 'application/epub+zip': 'file-epub-o', + 'application/vnd.oasis.opendocument.spreadsheet': 'file-excel-o', + 'application/vnd.ms-excel': 'file-excel-o', + 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': 'file-excel-o', + 'application/pdf': 'file-pdf-o', + 'application/vnd.oasis.opendocument.presentation': 'file-powerpoint-o', + 'application/vnd.ms-powerpoint': 'file-powerpoint-o', + 'application/vnd.openxmlformats-officedocument.presentationml.presentation': 'file-powerpoint-o', + 'text/plain': 'file-text-o', + 'application/rtf': 'file-text-o', + 'application/msword': 'file-word-o', + 'application/x-abiword': 'file-word-o', + 'application/vnd.openxmlformats-officedocument.wordprocessingml.document': 'file-word-o', + 'application/vnd.oasis.opendocument.text': 'file-word-o', +}; + const messages = defineMessages({ description: { id: 'upload_form.description', defaultMessage: 'Describe for the visually impaired' }, delete: { id: 'upload_form.undo', defaultMessage: 'Delete' }, @@ -100,6 +134,11 @@ class Upload extends ImmutablePureComponent { const x = ((focusX / 2) + .5) * 100; const y = ((focusY / -2) + .5) * 100; const mediaType = media.get('type'); + const uploadIcon = mediaType === 'unknown' && ( + + ); return (
@@ -115,7 +154,7 @@ class Upload extends ImmutablePureComponent { >
- + {mediaType !== 'unknown' && }
@@ -140,6 +179,7 @@ class Upload extends ImmutablePureComponent { )} + {uploadIcon}
)} diff --git a/app/styles/components/compose-form.scss b/app/styles/components/compose-form.scss index ad16bd35d..9daba415c 100644 --- a/app/styles/components/compose-form.scss +++ b/app/styles/components/compose-form.scss @@ -297,6 +297,14 @@ height: 100%; object-fit: cover; } + + > i.fa { + width: 100%; + color: hsla(var(--primary-text-color_hsl), 0.4); + font-size: 64px; + text-align: center; + line-height: 160px; + } } }