diff --git a/ui/component/claimRepostButton/view.jsx b/ui/component/claimRepostButton/view.jsx
index accecf6ff..57aa58850 100644
--- a/ui/component/claimRepostButton/view.jsx
+++ b/ui/component/claimRepostButton/view.jsx
@@ -15,6 +15,8 @@ type Props = {
export default function ClaimRepostButton(props: Props) {
const { uri, claim, hasChannels, doOpenModal, doToast } = props;
+ const [contentUri, setContentUri] = React.useState('');
+ const [repostUri, setRepostUri] = React.useState('');
return (
diff --git a/ui/component/repostCreate/view.jsx b/ui/component/repostCreate/view.jsx
index 09a29f3ab..b92bd8780 100644
--- a/ui/component/repostCreate/view.jsx
+++ b/ui/component/repostCreate/view.jsx
@@ -3,6 +3,7 @@
import * as ICONS from 'constants/icons';
import { MINIMUM_PUBLISH_BID, INVALID_NAME_ERROR } from 'constants/claim';
import React from 'react';
+import { useHistory } from 'react-router';
import Card from 'component/common/card';
import Button from 'component/button';
import ChannelSelector from 'component/channelSelector';
@@ -41,6 +42,12 @@ type Props = {
activeChannelClaim: ?ChannelClaim,
fetchingMyChannels: boolean,
incognito: boolean,
+ contentUri: string,
+ setContentUri: () => void,
+ repostUri: string,
+ setRepostUri: () => void,
+ isModal: boolean,
+ redirectUri?: string,
};
function RepostCreate(props: Props) {
@@ -64,6 +71,12 @@ function RepostCreate(props: Props) {
fetchingMyChannels,
incognito,
doHideModal,
+ contentUri,
+ setContentUri,
+ repostUri,
+ setRepostUri,
+ isModal,
+ redirectUri
} = props;
const defaultName = name || (claim && claim.name) || '';
@@ -75,9 +88,8 @@ function RepostCreate(props: Props) {
const [enteredRepostName, setEnteredRepostName] = React.useState(defaultName);
const [available, setAvailable] = React.useState(true);
const [enteredContent, setEnteredContentUri] = React.useState(undefined);
- const [contentUri, setContentUri] = React.useState('');
- const [repostUri, setRepostUri] = React.useState('');
const [contentError, setContentError] = React.useState('');
+ const { replace, goBack } = useHistory();
const resolvingRepost = isResolvingEnteredRepost || isResolvingPassedRepost;
const repostUrlName = `lbry://${incognito || !activeChannelClaim ? '' : `${activeChannelClaim.name}/`}`;
@@ -250,6 +262,28 @@ function RepostCreate(props: Props) {
const repostClaimId = contentClaimId || enteredClaimId;
+ const getRedirect = (entered, passed, redirect) => {
+ if (redirect) {
+ return redirect;
+ } else if (entered) {
+ try {
+ const { claimName } = parseURI(entered);
+ return claimName ? `/${claimName}` : '/';
+ } catch (e) {
+ return '/';
+ }
+ } else if (passed) {
+ try {
+ const { claimName } = parseURI(passed);
+ return claimName ? `/${claimName}` : '/';
+ } catch (e) {
+ return '/';
+ }
+ } else {
+ return '/';
+ }
+ };
+
function handleSubmit() {
if (enteredRepostName && repostBid && repostClaimId) {
doRepost({
@@ -265,14 +299,23 @@ function RepostCreate(props: Props) {
linkText: __('Uploads'),
linkTarget: '/uploads',
});
- doHideModal();
+ if (isModal) {
+ doHideModal();
+ } else {
+ replace(getRedirect(contentUri, uri, redirectUri));
+ }
});
}
}
+
function cancelIt() {
doClearRepostError();
- doHideModal();
+ if (isModal) {
+ doHideModal();
+ } else {
+ goBack();
+ }
}
if (fetchingMyChannels) {
diff --git a/ui/component/router/view.jsx b/ui/component/router/view.jsx
index f7e8c3c4a..2b3a8cbbb 100644
--- a/ui/component/router/view.jsx
+++ b/ui/component/router/view.jsx
@@ -48,6 +48,7 @@ import PasswordSetPage from 'page/passwordSet';
import PublishPage from 'page/publish';
import ReportContentPage from 'page/reportContent';
import ReportPage from 'page/report';
+import RepostNew from 'page/repost'
import SearchPage from 'page/search';
import SettingsCreatorPage from 'page/settingsCreator';
@@ -272,6 +273,7 @@ function AppRouter(props: Props) {
component={ChannelsFollowingDiscoverPage}
/>
+
diff --git a/ui/modal/modalRepost/view.jsx b/ui/modal/modalRepost/view.jsx
index e51d34c6e..01309c056 100644
--- a/ui/modal/modalRepost/view.jsx
+++ b/ui/modal/modalRepost/view.jsx
@@ -4,17 +4,22 @@ import { Modal } from 'modal/modal';
import RepostCreate from 'component/repostCreate';
type Props = {
- closeModal: () => void,
- uri: string,
+ closeModal: () => void,
+ uri: string,
+ name: string,
+ contentUri: string,
+ setContentUri: () => void,
+ repostUri: string,
+ setRepostUri: () => void,
}
class ModalRepost extends React.PureComponent {
render() {
- const { closeModal, uri } = this.props;
+ const { closeModal, uri, name, contentUri, setContentUri, repostUri, setRepostUri } = this.props;
return (
-
+
);
}
diff --git a/ui/page/repost/index.js b/ui/page/repost/index.js
new file mode 100644
index 000000000..6dcd035be
--- /dev/null
+++ b/ui/page/repost/index.js
@@ -0,0 +1,15 @@
+import { connect } from 'react-redux';
+
+import { doResolveUri } from 'redux/actions/claims';
+import { selectBalance } from 'redux/selectors/wallet';
+import RepostPage from './view';
+
+const select = (state, props) => ({
+ balance: selectBalance(state),
+});
+
+const perform = (dispatch) => ({
+ resolveUri: (uri) => dispatch(doResolveUri(uri)),
+});
+
+export default connect(select, perform)(RepostPage);
diff --git a/ui/page/repost/view.jsx b/ui/page/repost/view.jsx
new file mode 100644
index 000000000..b1e2e1023
--- /dev/null
+++ b/ui/page/repost/view.jsx
@@ -0,0 +1,77 @@
+// @flow
+import React from 'react';
+import Page from 'component/page';
+import { useHistory } from 'react-router';
+import RepostCreate from 'component/repostCreate';
+import YrblWalletEmpty from 'component/yrblWalletEmpty';
+import useThrottle from 'effects/use-throttle';
+import classnames from 'classnames';
+
+type Props = {
+ balance: number,
+ resolveUri: string => void,
+};
+function RepostPage(props: Props) {
+ const { balance, resolveUri } = props;
+
+ const REPOST_FROM = 'from';
+ const REPOST_TO = 'to';
+ const REDIRECT = 'redirect';
+ const {
+ location: { search },
+ } = useHistory();
+
+ const urlParams = new URLSearchParams(search);
+ const repostFrom = urlParams.get(REPOST_FROM);
+ const redirectUri = urlParams.get(REDIRECT);
+ const repostTo = urlParams.get(REPOST_TO);
+ const [contentUri, setContentUri] = React.useState('');
+ const [repostUri, setRepostUri] = React.useState('');
+ const throttledContentValue = useThrottle(contentUri, 500);
+ const throttledRepostValue = useThrottle(repostUri, 500);
+
+ React.useEffect(() => {
+ if (throttledContentValue) {
+ resolveUri(throttledContentValue);
+ }
+ }, [throttledContentValue, resolveUri]);
+
+ React.useEffect(() => {
+ if (throttledRepostValue) {
+ resolveUri(throttledRepostValue);
+ }
+ }, [throttledRepostValue, resolveUri]);
+
+ React.useEffect(() => {
+ if (repostTo) {
+ resolveUri(repostTo);
+ }
+ }, [repostTo, resolveUri]);
+
+ const decodedFrom = repostFrom && decodeURIComponent(repostFrom);
+ return (
+
+ {balance === 0 && }
+
+
+
+
+ );
+}
+
+export default RepostPage;