Revert "Open the actual image when clicking on the image viewer"
This reverts commit 6a99947ac2d3fada59438d818599af6b68dcebd8.
This commit is contained in:
parent
6144b08cf9
commit
00017e241e
6 changed files with 13 additions and 68 deletions
|
@ -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);
|
|
||||||
|
|
|
@ -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,
|
||||||
}}
|
}}
|
||||||
|
|
|
@ -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>
|
||||||
|
|
|
@ -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>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -726,9 +726,3 @@ video::-internal-media-controls-overlay-cast-button {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.file-page__image {
|
|
||||||
img {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
|
@ -92,7 +92,3 @@
|
||||||
overflow-y: scroll;
|
overflow-y: scroll;
|
||||||
white-space: pre-wrap;
|
white-space: pre-wrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
.stop-warning {
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
|
|
Loading…
Reference in a new issue