diff --git a/ui/component/collectionEdit/index.js b/ui/component/collectionEdit/index.js
index 1f0fb52c8..dcda3c8ab 100644
--- a/ui/component/collectionEdit/index.js
+++ b/ui/component/collectionEdit/index.js
@@ -23,6 +23,7 @@ import CollectionForm from './view';
import { selectActiveChannelClaim, selectIncognito } from 'redux/selectors/app';
import { doSetActiveChannel, doSetIncognito } from 'redux/actions/app';
import { doCollectionEdit } from 'redux/actions/collections';
+import { doResetThumbnailStatus } from 'redux/actions/publish';
const select = (state, props) => ({
claim: makeSelectClaimForUri(props.uri)(state),
@@ -52,6 +53,7 @@ const perform = (dispatch, ownProps) => ({
setActiveChannel: (claimId) => dispatch(doSetActiveChannel(claimId)),
setIncognito: (incognito) => dispatch(doSetIncognito(incognito)),
doCollectionEdit: (params) => dispatch(doCollectionEdit(ownProps.collectionId, params)),
+ resetThumbnailStatus: () => dispatch(doResetThumbnailStatus()),
});
export default connect(select, perform)(CollectionForm);
diff --git a/ui/component/collectionEdit/view.jsx b/ui/component/collectionEdit/view.jsx
index 97f2bf7b1..8976fa97f 100644
--- a/ui/component/collectionEdit/view.jsx
+++ b/ui/component/collectionEdit/view.jsx
@@ -58,6 +58,7 @@ type Props = {
setActiveChannel: (string) => void,
setIncognito: (boolean) => void,
doCollectionEdit: (CollectionEditParams) => void,
+ resetThumbnailStatus: () => void,
};
function CollectionForm(props: Props) {
@@ -92,6 +93,7 @@ function CollectionForm(props: Props) {
setIncognito,
onDone,
doCollectionEdit,
+ resetThumbnailStatus,
} = props;
const activeChannelName = activeChannelClaim && activeChannelClaim.name;
let prefix = 'lbry://';
@@ -158,7 +160,7 @@ function CollectionForm(props: Props) {
}
function handleUpdateThumbnail(update: { [string]: string }) {
- if (update.thumbnail_url) {
+ if (update.thumbnail_url !== undefined) {
setParam(update);
} else if (update.thumbnail_status) {
setThumbStatus(update.thumbnail_status);
@@ -309,6 +311,10 @@ function CollectionForm(props: Props) {
}
}, [uri, hasClaim]);
+ React.useEffect(() => {
+ resetThumbnailStatus();
+ }, [resetThumbnailStatus]);
+
return (
<>
@@ -358,8 +364,8 @@ function CollectionForm(props: Props) {
/>
({
- ...selectPublishFormValues(state),
- fileInfos: selectFileInfosByOutpoint(state),
- myClaimForUri: selectMyClaimForUri(state),
-});
+const select = (state, props) => {
+ const publishFormFields = selectPublishFormValues(state);
+ return {
+ ...publishFormFields,
+ thumbnail: props.thumbnail || publishFormFields.thumbnail,
+ fileInfos: selectFileInfosByOutpoint(state),
+ myClaimForUri: selectMyClaimForUri(state),
+ };
+};
const perform = (dispatch) => ({
updatePublishForm: (value) => dispatch(doUpdatePublishForm(value)),
diff --git a/ui/component/selectThumbnail/view.jsx b/ui/component/selectThumbnail/view.jsx
index 5690988fc..8998272ae 100644
--- a/ui/component/selectThumbnail/view.jsx
+++ b/ui/component/selectThumbnail/view.jsx
@@ -69,10 +69,10 @@ function SelectThumbnail(props: Props) {
function handleThumbnailChange(e: SyntheticInputEvent<*>) {
const newThumbnail = e.target.value.replace(' ', '');
-
if (updateThumbnailParams) {
updateThumbnailParams({ thumbnail_url: newThumbnail });
- } else {
+ }
+ if (updatePublishForm) {
updatePublishForm({ thumbnail: newThumbnail });
}
}
@@ -108,16 +108,22 @@ function SelectThumbnail(props: Props) {
style={{ display: 'none' }}
src={thumbnail}
alt={__('Thumbnail Preview')}
- onError={() =>
- publishForm
- ? updatePublishForm({ thumbnailError: true })
- : updateThumbnailParams({ thumbnail_error: Boolean(thumbnail) })
- }
- onLoad={() =>
- publishForm
- ? updatePublishForm({ thumbnailError: !isUrlInput })
- : updateThumbnailParams({ thumbnail_error: !isUrlInput })
- }
+ onError={() => {
+ if (updateThumbnailParams) {
+ updateThumbnailParams({ thumbnail_error: Boolean(thumbnail) });
+ }
+ if (publishForm) {
+ updatePublishForm({ thumbnailError: true });
+ }
+ }}
+ onLoad={() => {
+ if (updateThumbnailParams) {
+ updateThumbnailParams({ thumbnail_error: !isUrlInput });
+ }
+ if (publishForm) {
+ updatePublishForm({ thumbnailError: !isUrlInput });
+ }
+ }}
/>
);
@@ -157,7 +163,7 @@ function SelectThumbnail(props: Props) {
onFileChosen={(file) =>
openModal(MODALS.CONFIRM_THUMBNAIL_UPLOAD, {
file,
- cb: (url) => !publishForm && updateThumbnailParams({ thumbnail_url: url }),
+ cb: (url) => updateThumbnailParams && updateThumbnailParams({ thumbnail_url: url }),
})
}
/>