shit-tier channel search results
This commit is contained in:
parent
91d4dd610e
commit
401bb85272
5 changed files with 85 additions and 2 deletions
19
ui/js/component/channelTile/index.js
Normal file
19
ui/js/component/channelTile/index.js
Normal file
|
@ -0,0 +1,19 @@
|
||||||
|
import React from "react";
|
||||||
|
import { connect } from "react-redux";
|
||||||
|
import { doFetchClaimCountByChannel } from "actions/content";
|
||||||
|
import { makeSelectClaimForUri } from "selectors/claims";
|
||||||
|
import { doNavigate } from "actions/navigation";
|
||||||
|
import { makeSelectTotalItemsForChannel } from "selectors/content";
|
||||||
|
import ChannelTile from "./view";
|
||||||
|
|
||||||
|
const select = (state, props) => ({
|
||||||
|
claim: makeSelectClaimForUri(props.uri)(state),
|
||||||
|
totalItems: makeSelectTotalItemsForChannel(props.uri)(state),
|
||||||
|
});
|
||||||
|
|
||||||
|
const perform = dispatch => ({
|
||||||
|
fetchClaimCount: uri => dispatch(doFetchClaimCountByChannel(uri)),
|
||||||
|
navigate: (path, params) => dispatch(doNavigate(path, params)),
|
||||||
|
});
|
||||||
|
|
||||||
|
export default connect(select, perform)(ChannelTile);
|
50
ui/js/component/channelTile/view.jsx
Normal file
50
ui/js/component/channelTile/view.jsx
Normal file
|
@ -0,0 +1,50 @@
|
||||||
|
import React from "react";
|
||||||
|
import { TruncatedText, BusyMessage } from "component/common.js";
|
||||||
|
|
||||||
|
class ChannelTile extends React.PureComponent {
|
||||||
|
componentDidMount() {
|
||||||
|
const { uri, fetchClaimCount } = this.props;
|
||||||
|
|
||||||
|
fetchClaimCount(uri);
|
||||||
|
}
|
||||||
|
|
||||||
|
componentWillReceiveProps(nextProps) {
|
||||||
|
const { uri, fetchClaimCount } = this.props;
|
||||||
|
|
||||||
|
if (nextProps.uri != uri) {
|
||||||
|
fetchClaimCount(uri);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { navigate, totalItems, uri } = this.props;
|
||||||
|
|
||||||
|
let onClick = () => navigate("/show", { uri });
|
||||||
|
|
||||||
|
return (
|
||||||
|
<section className="file-tile card">
|
||||||
|
<div onClick={onClick} className="card__link">
|
||||||
|
<div className="file-tile__content">
|
||||||
|
<div className="card__title-primary">
|
||||||
|
<h3>
|
||||||
|
<TruncatedText lines={1}>{uri}</TruncatedText>
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
<div className="card__content card__subtext">
|
||||||
|
{isNaN(totalItems) &&
|
||||||
|
<BusyMessage message={__("Resolving channel")} />}
|
||||||
|
{totalItems > 0 &&
|
||||||
|
<span>
|
||||||
|
This is a channel with over {totalItems} items inside of it.
|
||||||
|
</span>}
|
||||||
|
{totalItems === 0 &&
|
||||||
|
<span className="empty">This is an empty channel.</span>}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ChannelTile;
|
|
@ -1,7 +1,9 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import FileTile from "component/fileTile";
|
import FileTile from "component/fileTile";
|
||||||
|
import ChannelTile from "component/channelTile";
|
||||||
import Link from "component/link";
|
import Link from "component/link";
|
||||||
import { BusyMessage } from "component/common.js";
|
import { BusyMessage } from "component/common.js";
|
||||||
|
import lbryuri from "lbryuri";
|
||||||
|
|
||||||
const SearchNoResults = props => {
|
const SearchNoResults = props => {
|
||||||
const { query } = props;
|
const { query } = props;
|
||||||
|
@ -45,7 +47,12 @@ class FileListSearch extends React.PureComponent {
|
||||||
<BusyMessage message={__("Refreshing the Dewey Decimals")} />}
|
<BusyMessage message={__("Refreshing the Dewey Decimals")} />}
|
||||||
|
|
||||||
{uris && uris.length
|
{uris && uris.length
|
||||||
? uris.map(uri => <FileTile key={uri} uri={uri} />)
|
? uris.map(
|
||||||
|
uri =>
|
||||||
|
lbryuri.parse(uri).name[0] === "@"
|
||||||
|
? <ChannelTile key={uri} uri={uri} />
|
||||||
|
: <FileTile key={uri} uri={uri} />
|
||||||
|
)
|
||||||
: !isSearching && <SearchNoResults query={query} />}
|
: !isSearching && <SearchNoResults query={query} />}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
|
@ -16,7 +16,7 @@ class ModalUpgrade extends React.PureComponent {
|
||||||
onConfirmed={downloadUpgrade}
|
onConfirmed={downloadUpgrade}
|
||||||
onAborted={skipUpgrade}
|
onAborted={skipUpgrade}
|
||||||
>
|
>
|
||||||
<h3 className="text-center">{__("LBRY Just Got BTTR")}</h3>
|
<h3 className="text-center">{__("LBRY Leveled Up")}</h3>
|
||||||
<br />
|
<br />
|
||||||
<p>
|
<p>
|
||||||
{__("An updated version of LBRY is now available.")}
|
{__("An updated version of LBRY is now available.")}
|
||||||
|
|
|
@ -34,6 +34,13 @@ export const selectChannelPages = createSelector(
|
||||||
state => state.channelPages || {}
|
state => state.channelPages || {}
|
||||||
);
|
);
|
||||||
|
|
||||||
|
export const makeSelectTotalItemsForChannel = uri => {
|
||||||
|
return createSelector(
|
||||||
|
selectChannelPages,
|
||||||
|
byUri => (byUri && byUri[uri]) * 10
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
export const makeSelectTotalPagesForChannel = uri => {
|
export const makeSelectTotalPagesForChannel = uri => {
|
||||||
return createSelector(selectChannelPages, byUri => byUri && byUri[uri]);
|
return createSelector(selectChannelPages, byUri => byUri && byUri[uri]);
|
||||||
};
|
};
|
||||||
|
|
Loading…
Add table
Reference in a new issue