improve mediaType detection

package.json

@@ -50,6 +50,7 @@
     "keytar": "^4.2.1",
     "lbry-redux": "lbryio/lbry-redux#341db02c090e0121ff7f5d2e74fa35b06213d858",
     "localforage": "^1.7.1",
+    "mime": "^2.3.1",
     "mixpanel-browser": "^2.17.1",
     "moment": "^2.22.0",
     "qrcode.react": "^0.8.0",

src/renderer/component/video/internal/player.jsx

@@ -221,6 +221,7 @@ class VideoPlayer extends React.PureComponent {
   }
 
   showLoadingScreen(isFileType, isPlayableType) {
+    const { mediaType } = this.props;
     const { hasMetadata, unplayable, unsupported, fileSource } = this.state;
 
     const loader = {
@@ -238,7 +239,8 @@ class VideoPlayer extends React.PureComponent {
 
     // Files
     const isLoadingFile = !fileSource && isFileType;
-    const isUnsupported = !this.supportedType() && isPlayableType && !isFileType;
+    const isUnsupported =
+      (mediaType === 'application' || !this.supportedType()) && !isFileType && !isPlayableType;
 
     // Media (audio, video)
     const isUnplayable = isPlayableType && unplayable;
@@ -251,7 +253,7 @@ class VideoPlayer extends React.PureComponent {
 
       // Show unsupported error message
     } else if (isUnsupported || isUnplayable) {
-      loader.loadingStatus = isFileType ? unsupportedMessage : unplayableMessage;
+      loader.loadingStatus = isUnsupported ? unsupportedMessage : unplayableMessage;
     }
 
     return loader;

src/renderer/page/file/view.jsx

@@ -1,6 +1,6 @@
 // @flow
 import * as React from 'react';
-import { Lbry, buildURI, normalizeURI, MODALS } from 'lbry-redux';
+import { buildURI, normalizeURI, MODALS } from 'lbry-redux';
 import Video from 'component/video';
 import Thumbnail from 'component/common/thumbnail';
 import FilePrice from 'component/filePrice';
@@ -21,6 +21,7 @@ import FileDownloadLink from 'component/fileDownloadLink';
 import classnames from 'classnames';
 import { FormField, FormRow } from 'component/common/form';
 import ToolTip from 'component/common/tooltip';
+import getMediaType from 'util/getMediaType';
 
 type Props = {
   claim: Claim,
@@ -130,7 +131,7 @@ class FilePage extends React.Component<Props> {
     const isRewardContent = rewardedContentClaimIds.includes(claim.claim_id);
     const shouldObscureThumbnail = obscureNsfw && metadata.nsfw;
     const fileName = fileInfo ? fileInfo.file_name : null;
-    const mediaType = fileName ? Lbry.getMediaType(null, fileName) : Lbry.getMediaType(contentType);
+    const mediaType = getMediaType(contentType, fileName);
     const showFile =
       PLAYABLE_MEDIA_TYPES.includes(mediaType) || PREVIEW_MEDIA_TYPES.includes(mediaType);
     const channelClaimId =

src/renderer/util/getMediaType.js

@@ -0,0 +1,32 @@
+import mime from 'mime';
+
+const formats = [
+  [/\.(mp4|m4v|webm|flv|f4v|ogv)$/i, 'video'],
+  [/\.(mp3|m4a|aac|wav|flac|ogg|opus)$/i, 'audio'],
+  [/\.(html|htm|xml|pdf|odf|doc|docx|md|markdown|txt|epub|org)$/i, 'document'],
+  [/\.(stl|obj|fbx|gcode)$/i, '3D-file'],
+];
+
+export default function getMediaType(contentType, fileName) {
+  const extName = mime.getExtension(contentType);
+  const fileExt = extName ? `.${extName}` : null;
+  const testString = fileName || fileExt;
+
+  // Get mediaType from file extension
+  if (testString) {
+    const res = formats.reduce((ret, testpair) => {
+      const [regex, mediaType] = testpair;
+
+      return regex.test(ret) ? mediaType : ret;
+    }, testString);
+
+    if (res !== testString) return res;
+  }
+
+  // Get mediaType from contentType
+  if (contentType) {
+    return /^[^/]+/.exec(contentType)[0];
+  }
+
+  return 'unknown';
+}

yarn.lock

@@ -5564,9 +5564,9 @@ lazy-val@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/lazy-val/-/lazy-val-1.0.3.tgz#bb97b200ef00801d94c317e29dc6ed39e31c5edc"
 
-lbry-redux@lbryio/lbry-redux#201d78b68a329065ee5d2a03bfb1607ea0666588:
+lbry-redux@lbryio/lbry-redux#341db02c090e0121ff7f5d2e74fa35b06213d858:
   version "0.0.1"
-  resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/201d78b68a329065ee5d2a03bfb1607ea0666588"
+  resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/341db02c090e0121ff7f5d2e74fa35b06213d858"
   dependencies:
     proxy-polyfill "0.1.6"
     reselect "^3.0.0"