- ) => void,
hideLink?: boolean,
setChannelActive: boolean => void,
beginPublish: string => void,
pendingIds: Array,
+ isResolvingWinningUri: boolean,
+ winningClaim: ?Claim,
};
export default function SearchTopClaim(props: Props) {
- const { doResolveUris, query = '', winningUri, hideLink = false, setChannelActive, beginPublish } = props;
+ const {
+ doResolveUris,
+ query = '',
+ winningUri,
+ winningClaim,
+ hideLink = false,
+ setChannelActive,
+ beginPublish,
+ isResolvingWinningUri,
+ } = props;
const uriFromQuery = `lbry://${query}`;
const { push } = useHistory();
let name;
@@ -60,82 +70,69 @@ export default function SearchTopClaim(props: Props) {
}
}, [doResolveUris, uriFromQuery, channelUriFromQuery]);
+ if (winningUri && !winningClaim && isResolvingWinningUri) {
+ return null;
+ }
+
return (
-
-
- {winningUri && (
-
- )}
- {winningUri && (
- {
};
render() {
- const { title, subtitle, type, className, actions, small, alwaysShow = false } = this.props;
+ const { title, subtitle, type, className, actions, alwaysShow = false } = this.props;
const image = yrblTypes[type];
@@ -33,7 +32,7 @@ export default class extends React.PureComponent {
{
}
);
};
+
+export const makeSelectIsResolvingWinningUri = (query: string = '') => {
+ const uriFromQuery = `lbry://${query}`;
+ let channelUriFromQuery;
+ try {
+ const { isChannel } = parseURI(uriFromQuery);
+ if (!isChannel) {
+ channelUriFromQuery = `lbry://@${query}`;
+ }
+ } catch (e) {}
+
+ return createSelector(
+ makeSelectIsUriResolving(uriFromQuery),
+ channelUriFromQuery ? makeSelectIsUriResolving(channelUriFromQuery) : () => {},
+ (claim1IsResolving, claim2IsResolving) => {
+ return claim1IsResolving || claim2IsResolving;
+ }
+ );
+};
diff --git a/ui/scss/component/_empty.scss b/ui/scss/component/_empty.scss
index 8695a9018..388d21fe0 100644
--- a/ui/scss/component/_empty.scss
+++ b/ui/scss/component/_empty.scss
@@ -11,6 +11,10 @@
}
}
+.empty__wrap--padded {
+ padding: var(--spacing-xl) 0;
+}
+
.empty__text {
color: var(--color-text-empty);
font-style: italic;
diff --git a/ui/scss/component/_media.scss b/ui/scss/component/_media.scss
index a68fdf272..65f8fab03 100644
--- a/ui/scss/component/_media.scss
+++ b/ui/scss/component/_media.scss
@@ -30,32 +30,6 @@
max-width: 100%;
white-space: nowrap;
}
-
- // This is terrible and should not be removed
- .icon {
- margin-right: var(--spacing-xs) / 2;
- margin-bottom: -0.08rem;
- }
-}
-
-.media__uri--inline {
- @extend .media__uri;
- position: relative;
- transform: none;
- overflow: hidden;
- text-overflow: ellipsis;
-}
-
-.media__uri--right {
- @extend .media__uri;
- right: 0;
-}
-
-.media__uri--right--yt-badge {
- @extend .media__uri--right;
- @media (max-width: $breakpoint-small) {
- display: none;
- }
}
// M E D I A
- {text && (
-
+ return (
+
-
- )}
- {text}
-
+
+ );
}
-
-export default Empty;
diff --git a/ui/component/searchTopClaim/index.js b/ui/component/searchTopClaim/index.js
index 23670d5c6..65cc16fe9 100644
--- a/ui/component/searchTopClaim/index.js
+++ b/ui/component/searchTopClaim/index.js
@@ -1,14 +1,20 @@
import { connect } from 'react-redux';
-import { doResolveUris, doClearPublish, doPrepareEdit, selectPendingIds } from 'lbry-redux';
-import { makeSelectWinningUriForQuery } from 'redux/selectors/search';
+import { doResolveUris, doClearPublish, doPrepareEdit, selectPendingIds, makeSelectClaimForUri } from 'lbry-redux';
+import { makeSelectWinningUriForQuery, makeSelectIsResolvingWinningUri } from 'redux/selectors/search';
import SearchTopClaim from './view';
import { push } from 'connected-react-router';
import * as PAGES from 'constants/pages';
-const select = (state, props) => ({
- winningUri: makeSelectWinningUriForQuery(props.query)(state),
- pendingIds: selectPendingIds(state),
-});
+const select = (state, props) => {
+ const winningUri = makeSelectWinningUriForQuery(props.query)(state);
+
+ return {
+ winningUri,
+ winningClaim: winningUri ? makeSelectClaimForUri(winningUri)(state) : undefined,
+ isResolvingWinningUri: props.query ? makeSelectIsResolvingWinningUri(props.query)(state) : false,
+ pendingIds: selectPendingIds(state),
+ };
+};
const perform = dispatch => ({
beginPublish: name => {
diff --git a/ui/component/searchTopClaim/view.jsx b/ui/component/searchTopClaim/view.jsx
index db64b7f78..03106daa9 100644
--- a/ui/component/searchTopClaim/view.jsx
+++ b/ui/component/searchTopClaim/view.jsx
@@ -10,20 +10,30 @@ import I18nMessage from 'component/i18nMessage';
import { useHistory } from 'react-router';
import LbcSymbol from 'component/common/lbc-symbol';
import { DOMAIN } from 'config';
-import Yrbl from 'component/yrbl';
type Props = {
query: string,
- winningUri: ?Claim,
+ winningUri: ?string,
doResolveUris: (Array
+ {text && (
+
- );
- }
+
+
+ )}
{text}
+
- (
-
-
);
}
diff --git a/ui/component/yrbl/index.jsx b/ui/component/yrbl/index.jsx
index 2e60c6d06..44af157be 100644
--- a/ui/component/yrbl/index.jsx
+++ b/ui/component/yrbl/index.jsx
@@ -11,7 +11,6 @@ type Props = {
className?: string,
actions?: Node,
alwaysShow?: boolean,
- small: boolean,
};
const yrblTypes = {
@@ -25,7 +24,7 @@ export default class extends React.PureComponent
+ {winningUri && (
+
+ )}
+ {!hideLink && winningUri && (
+
+
+
+ )}
+ {winningUri && (
+
+ (
+
+
+ )}
+ {!winningUri && uriFromQuery && (
+
+ push(`/$/${PAGES.REPOST_NEW}?to=${name}`)} label={__('Repost')} />
+ ),
+ publish: (
+
+
- )}
- />
-
- )}
- {!winningUri && uriFromQuery && (
-
- push(`/$/${PAGES.REPOST_NEW}?to=${name}`)}
- label={__('Repost')}
- />
- ),
- publish:
- )}
- {!hideLink && winningUri && (
-
-
-
- )}
-
-
+ ),
+ }}
+ >
+ You have found the edge of the internet. %repost% or %publish% your stuff here to claim this spot.
+
+
+
+
+ )}
+