Revert "Open the actual image when clicking on the image viewer"

This reverts commit 6a99947ac2d3fada59438d818599af6b68dcebd8.

ui/component/fileRender/index.js

@@ -1,17 +1,14 @@
 import { connect } from 'react-redux';
 import {
   makeSelectClaimForUri,
-  makeSelectFileInfoForUri,
   makeSelectThumbnailForUri,
   makeSelectContentTypeForUri,
   makeSelectDownloadPathForUri,
   makeSelectStreamingUrlForUri,
-  makeSelectClaimIsMine,
   SETTINGS,
 } from 'lbry-redux';
 import { makeSelectClientSetting } from 'redux/selectors/settings';
 import { makeSelectFileRenderModeForUri, makeSelectFileExtensionForUri } from 'redux/selectors/content';
-import { doOpenModal } from 'redux/actions/app';
 import FileRender from './view';
 
 const select = (state, props) => {
@@ -26,13 +23,7 @@ const select = (state, props) => {
     streamingUrl: makeSelectStreamingUrlForUri(props.uri)(state),
     renderMode: makeSelectFileRenderModeForUri(props.uri)(state),
     autoplay: autoplay,
-    fileInfo: makeSelectFileInfoForUri(props.uri)(state),
-    claimIsMine: makeSelectClaimIsMine(props.uri)(state),
   };
 };
 
-const perform = (dispatch) => ({
+export default connect(select)(FileRender);
-  openModal: (modal, props) => dispatch(doOpenModal(modal, props)),
-});
-
-export default connect(select, perform)(FileRender);

ui/component/fileRender/view.jsx

@@ -35,9 +35,6 @@ type Props = {
   thumbnail: string,
   desktopPlayStartTime?: number,
   className?: string,
-  fileInfo: ?FileListItem,
-  openModal: (id: string, { path: string }) => void,
-  claimIsMine: boolean,
 };
 
 class FileRender extends React.PureComponent<Props> {
@@ -79,11 +76,8 @@ class FileRender extends React.PureComponent<Props> {
       fileExtension,
       streamingUrl,
       uri,
-      fileInfo,
       renderMode,
       desktopPlayStartTime,
-      openModal,
-      claimIsMine,
     } = this.props;
     const source = streamingUrl;
 
@@ -99,9 +93,7 @@ class FileRender extends React.PureComponent<Props> {
           />
         );
       case RENDER_MODES.IMAGE:
-        return (
+        return <ImageViewer uri={uri} source={source} />;
-          <ImageViewer uri={uri} source={source} fileInfo={fileInfo} openModal={openModal} claimIsMine={claimIsMine} />
-        );
       case RENDER_MODES.HTML:
         return <HtmlViewer source={downloadPath || source} />;
       case RENDER_MODES.DOCUMENT:
@@ -110,7 +102,7 @@ class FileRender extends React.PureComponent<Props> {
           <DocumentViewer
             source={{
               // @if TARGET='app'
-              file: (options) => fs.createReadStream(downloadPath, options),
+              file: options => fs.createReadStream(downloadPath, options),
               // @endif
               stream: source,
               fileExtension,
@@ -139,7 +131,7 @@ class FileRender extends React.PureComponent<Props> {
           <ComicBookViewer
             source={{
               // @if TARGET='app'
-              file: (options) => fs.createReadStream(downloadPath, options),
+              file: options => fs.createReadStream(downloadPath, options),
               // @endif
               stream: source,
             }}

ui/component/viewers/imageViewer.jsx

@@ -2,17 +2,13 @@
 import React from 'react';
 import Card from 'component/common/card';
 import ErrorText from 'component/common/error-text';
-import * as MODALS from 'constants/modal_types';
 
 type Props = {
   source: string,
-  fileInfo: ?FileListItem,
-  openModal: (id: string, { path: string }) => void,
-  claimIsMine: boolean,
 };
 
 function ImageViewer(props: Props) {
-  const { source, fileInfo, openModal, claimIsMine } = props;
+  const { source } = props;
   const [loadingError, setLoadingError] = React.useState(false);
 
   return (
@@ -25,16 +21,7 @@ function ImageViewer(props: Props) {
       )}
       {!loadingError && (
         <div className="file-viewer">
-          <img
+          <img src={source} onError={() => setLoadingError(true)} />
-            src={source}
-            onError={() => setLoadingError(true)}
-            onClick={() => {
-              openModal(MODALS.CONFIRM_EXTERNAL_RESOURCE, {
-                path: (fileInfo && fileInfo.download_path) || '',
-                isMine: claimIsMine,
-              });
-            }}
-          />
         </div>
       )}
     </React.Fragment>

ui/modal/modalOpenExternalResource/view.jsx

@@ -1,9 +1,7 @@
 // @flow
-import React, { useCallback, useEffect } from 'react';
+import React from 'react';
 import { Modal } from 'modal/modal';
 import { formatFileSystemPath } from 'util/url';
-import { FormField } from 'component/common/form';
-import usePersistedState from 'effects/use-persisted-state';
 // @if TARGET='app'
 import { shell } from 'electron';
 // @endif
@@ -17,10 +15,13 @@ type Props = {
 };
 
 function ModalOpenExternalResource(props: Props) {
-  const [stopWarning, setStopWarning] = usePersistedState('stop-warning', false);
   const { uri, isTrusted, path, isMine, closeModal } = props;
 
-  const openResource = useCallback(() => {
+  if ((uri && isTrusted) || (path && isMine)) {
+    openResource();
+  }
+
+  function openResource() {
     // @if TARGET='app'
     const { openExternal, openPath, showItemInFolder } = shell;
     if (uri) {
@@ -41,14 +42,7 @@ function ModalOpenExternalResource(props: Props) {
     // @endif
 
     closeModal();
-  }, [closeModal, path, uri]);
-
-  useEffect(() => {
-    if ((uri && isTrusted) || (path && isMine) || stopWarning) {
-      openResource();
   }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [uri, isTrusted, path, isMine, openResource]);
 
   return (
     <Modal
@@ -66,15 +60,6 @@ function ModalOpenExternalResource(props: Props) {
       </p>
       <blockquote>{uri || path}</blockquote>
       <p>{__('LBRY Inc is not responsible for its content, click continue to proceed at your own risk.')}</p>
-      <div className="stop-warning">
-        <FormField
-          type="checkbox"
-          checked={stopWarning}
-          onChange={() => setStopWarning(!stopWarning)}
-          label={__("Don't Show This Message Again")}
-          name="stop_warning"
-        />
-      </div>
     </Modal>
   );
 }

ui/scss/component/_file-render.scss

@@ -726,9 +726,3 @@ video::-internal-media-controls-overlay-cast-button {
     }
   }
 }
-
-.file-page__image {
-  img {
-    cursor: pointer;
-  }
-}

ui/scss/component/_modal.scss

@@ -92,7 +92,3 @@
   overflow-y: scroll;
   white-space: pre-wrap;
 }
-
-.stop-warning {
-  margin-top: 20px;
-}