Bring back repost page from previous changes for direct link

ui/component/router/view.jsx

@@ -83,6 +83,7 @@ const PasswordSetPage = lazyImport(() => import('page/passwordSet' /* webpackChu
 const PublishPage = lazyImport(() => import('page/publish' /* webpackChunkName: "publish" */));
 const ReportContentPage = lazyImport(() => import('page/reportContent' /* webpackChunkName: "reportContent" */));
 const ReportPage = lazyImport(() => import('page/report' /* webpackChunkName: "report" */));
+const RepostNew = lazyImport(() => import('page/repost' /* webpackChunkName: "repost" */));
 const RewardsPage = lazyImport(() => import('page/rewards' /* webpackChunkName: "rewards" */));
 const RewardsVerifyPage = lazyImport(() => import('page/rewardsVerify' /* webpackChunkName: "rewardsVerify" */));
 const SearchPage = lazyImport(() => import('page/search' /* webpackChunkName: "search" */));
@@ -351,6 +352,7 @@ function AppRouter(props: Props) {
         />
         <PrivateRoute {...props} path={`/$/${PAGES.INVITE}`} component={InvitePage} />
         <PrivateRoute {...props} path={`/$/${PAGES.CHANNEL_NEW}`} component={ChannelNew} />
+        <PrivateRoute {...props} path={`/$/${PAGES.REPOST_NEW}`} component={RepostNew} />
         <PrivateRoute {...props} path={`/$/${PAGES.UPLOADS}`} component={FileListPublished} />
         <PrivateRoute {...props} path={`/$/${PAGES.CREATOR_DASHBOARD}`} component={CreatorDashboard} />
         <PrivateRoute {...props} path={`/$/${PAGES.UPLOAD}`} component={PublishPage} />

ui/constants/pageTitles.js

@@ -31,6 +31,7 @@ export const PAGE_TITLE = {
   [PAGES.RECEIVE]: 'Your address',
   [PAGES.REPORT]: 'Report an issue or request a feature',
   [PAGES.REPORT_CONTENT]: 'Report content',
+  [PAGES.REPOST_NEW]: 'Repost',
   [PAGES.REWARDS]: 'Rewards',
   [PAGES.REWARDS_VERIFY]: 'Verify to earn Credits',
   [PAGES.SEARCH]: 'Search',

ui/constants/pages.js

@@ -45,6 +45,7 @@ exports.REPORT = 'report';
 exports.REPORT_CONTENT = 'report_content';
 exports.REWARDS = 'rewards';
 exports.REWARDS_VERIFY = 'rewards/verify';
+exports.REPOST_NEW = 'repost';
 exports.SEND = 'send';
 exports.SETTINGS = 'settings';
 exports.SETTINGS_STRIPE_CARD = 'settings/card';

ui/page/repost/index.js

@@ -0,0 +1,14 @@
+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 = {
+  resolveUri: doResolveUri,
+};
+
+export default connect(select, perform)(RepostPage);

ui/page/repost/view.jsx

@@ -0,0 +1,76 @@
+// @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';
+
+const REPOST_PARAMS = {
+  FROM: 'from',
+  TO: 'to',
+  REDIRECT: 'redirect',
+};
+
+type Props = {
+  // --redux--
+  balance: number,
+  resolveUri: (string) => void,
+};
+
+function RepostPage(props: Props) {
+  const { balance, resolveUri } = props;
+
+  const {
+    location: { search },
+  } = useHistory();
+
+  const [contentUri, setContentUri] = React.useState('');
+  const [repostUri, setRepostUri] = React.useState('');
+
+  const urlParams = new URLSearchParams(search);
+  const repostFrom = urlParams.get(REPOST_PARAMS.FROM);
+  const redirectUri = urlParams.get(REPOST_PARAMS.REDIRECT);
+  const repostTo = urlParams.get(REPOST_PARAMS.TO);
+
+  const decodedFrom = repostFrom && decodeURIComponent(repostFrom);
+  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]);
+
+  return (
+    <Page noFooter noSideNavigation backout={{ title: __('Repost'), backLabel: __('Back') }}>
+      {balance === 0 && <YrblWalletEmpty />}
+      <div className={balance === 0 ? 'card--disabled' : undefined}>
+        <RepostCreate
+          uri={decodedFrom}
+          name={repostTo}
+          redirectUri={redirectUri}
+          repostUri={repostUri}
+          contentUri={contentUri}
+          setContentUri={setContentUri}
+          setRepostUri={setRepostUri}
+        />
+      </div>
+    </Page>
+  );
+}
+
+export default RepostPage;