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

This reverts commit 6a99947ac2d3fada59438d818599af6b68dcebd8.
This commit is contained in:
togekk1 2021-02-17 22:44:37 +08:00 committed by Sean Yesmunt
parent 6144b08cf9
commit 00017e241e
6 changed files with 13 additions and 68 deletions

View file

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

View file

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

View file

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

View file

@ -1,9 +1,7 @@
// @flow // @flow
import React, { useCallback, useEffect } from 'react'; import React from 'react';
import { Modal } from 'modal/modal'; import { Modal } from 'modal/modal';
import { formatFileSystemPath } from 'util/url'; import { formatFileSystemPath } from 'util/url';
import { FormField } from 'component/common/form';
import usePersistedState from 'effects/use-persisted-state';
// @if TARGET='app' // @if TARGET='app'
import { shell } from 'electron'; import { shell } from 'electron';
// @endif // @endif
@ -17,10 +15,13 @@ type Props = {
}; };
function ModalOpenExternalResource(props: Props) { function ModalOpenExternalResource(props: Props) {
const [stopWarning, setStopWarning] = usePersistedState('stop-warning', false);
const { uri, isTrusted, path, isMine, closeModal } = props; const { uri, isTrusted, path, isMine, closeModal } = props;
const openResource = useCallback(() => { if ((uri && isTrusted) || (path && isMine)) {
openResource();
}
function openResource() {
// @if TARGET='app' // @if TARGET='app'
const { openExternal, openPath, showItemInFolder } = shell; const { openExternal, openPath, showItemInFolder } = shell;
if (uri) { if (uri) {
@ -41,14 +42,7 @@ function ModalOpenExternalResource(props: Props) {
// @endif // @endif
closeModal(); 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 ( return (
<Modal <Modal
@ -66,15 +60,6 @@ function ModalOpenExternalResource(props: Props) {
</p> </p>
<blockquote>{uri || path}</blockquote> <blockquote>{uri || path}</blockquote>
<p>{__('LBRY Inc is not responsible for its content, click continue to proceed at your own risk.')}</p> <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> </Modal>
); );
} }

View file

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

View file

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