respond to pr comments

This commit is contained in:
Sean Yesmunt 2019-06-19 01:05:43 -04:00
parent dae603339b
commit 6d25fa7d41
25 changed files with 144 additions and 77 deletions

View file

@ -1,6 +1,6 @@
// @flow
import React, { Fragment } from 'react';
import FileList from 'component/fileList';
import ClaimList from 'component/claimList';
import HiddenNsfwClaims from 'component/hiddenNsfwClaims';
import { withRouter } from 'react-router-dom';
import Paginate from 'component/common/paginate';
@ -35,7 +35,7 @@ function ChannelContent(props: Props) {
{!channelIsMine && <HiddenNsfwClaims className="card__content help" uri={uri} />}
{hasContent && <FileList noHeader uris={claimsInChannel.map(claim => claim.permanent_url)} />}
{hasContent && <ClaimList header={false} uris={claimsInChannel.map(claim => claim.permanent_url)} />}
<Paginate
onPageChange={page => fetchClaims(uri, page)}

View file

@ -1,5 +1,5 @@
import { connect } from 'react-redux';
import FileList from './view';
import ClaimList from './view';
const select = state => ({});
@ -8,4 +8,4 @@ const perform = dispatch => ({});
export default connect(
select,
perform
)(FileList);
)(ClaimList);

View file

@ -2,7 +2,7 @@
import type { Node } from 'react';
import React from 'react';
import classnames from 'classnames';
import FileListItem from 'component/fileListItem';
import ClaimListItem from 'component/claimListItem';
import Spinner from 'component/spinner';
import { FormField } from 'component/common/form';
import usePersistedState from 'util/use-persisted-state';
@ -12,31 +12,19 @@ const SORT_OLD = 'old';
type Props = {
uris: Array<string>,
header: Node,
header: Node | boolean,
headerAltControls: Node,
injectedItem?: Node,
loading: boolean,
noHeader?: boolean,
slim?: string,
type: string,
empty?: string,
meta?: Node,
// If using the default header, this is a unique ID needed to persist the state of the filter setting
persistedStorageKey?: string,
};
export default function FileList(props: Props) {
const {
uris,
header,
headerAltControls,
injectedItem,
loading,
persistedStorageKey,
noHeader,
slim,
empty,
meta,
} = props;
export default function ClaimList(props: Props) {
const { uris, headerAltControls, injectedItem, loading, persistedStorageKey, empty, meta, type, header } = props;
const [currentSort, setCurrentSort] = usePersistedState(persistedStorageKey, SORT_NEW);
const sortedUris = uris && currentSort === SORT_OLD ? uris.reverse() : uris;
const hasUris = uris && !!uris.length;
@ -47,8 +35,8 @@ export default function FileList(props: Props) {
return (
<section className={classnames('file-list')}>
{!noHeader && (
<div className={classnames('file-list__header', { 'file-list__header--slim': slim })}>
{header !== false && (
<div className={classnames('file-list__header', { 'file-list__header--small': type === 'small' })}>
{header || (
<FormField
className="file-list__dropdown"
@ -70,7 +58,7 @@ export default function FileList(props: Props) {
<ul>
{sortedUris.map((uri, index) => (
<React.Fragment key={uri}>
<FileListItem uri={uri} slim={slim} />
<ClaimListItem uri={uri} type={type} />
{index === 4 && injectedItem && <li className="file-list__item--injected">{injectedItem}</li>}
</React.Fragment>
))}

View file

@ -1,6 +1,6 @@
import { connect } from 'react-redux';
import { doClaimSearch, selectLastClaimSearchUris, selectFetchingClaimSearch, doToggleTagFollow } from 'lbry-redux';
import FileListDiscover from './view';
import ClaimListDiscover from './view';
const select = state => ({
uris: selectLastClaimSearchUris(state),
@ -15,4 +15,4 @@ const perform = {
export default connect(
select,
perform
)(FileListDiscover);
)(ClaimListDiscover);

View file

@ -3,7 +3,7 @@ import type { Node } from 'react';
import React, { useEffect } from 'react';
import moment from 'moment';
import { FormField } from 'component/common/form';
import FileList from 'component/fileList';
import ClaimList from 'component/claimList';
import Tag from 'component/tag';
import usePersistedState from 'util/use-persisted-state';
@ -32,7 +32,7 @@ type Props = {
meta?: Node,
};
function FileListDiscover(props: Props) {
function ClaimListDiscover(props: Props) {
const { doClaimSearch, uris, tags, loading, personal, injectedItem, meta } = props;
const [personalSort, setPersonalSort] = usePersistedState('file-list-trending:personalSort', SEARCH_SORT_YOU);
const [typeSort, setTypeSort] = usePersistedState('file-list-trending:typeSort', TYPE_TRENDING);
@ -125,7 +125,7 @@ function FileListDiscover(props: Props) {
return (
<div className="card">
<FileList
<ClaimList
meta={meta}
loading={loading}
uris={uris}
@ -137,4 +137,4 @@ function FileListDiscover(props: Props) {
);
}
export default FileListDiscover;
export default ClaimListDiscover;

View file

@ -10,7 +10,7 @@ import {
makeSelectClaimIsNsfw,
} from 'lbry-redux';
import { selectShowNsfw } from 'redux/selectors/settings';
import FileListItem from './view';
import ClaimListItem from './view';
const select = (state, props) => ({
pending: makeSelectClaimIsPending(props.uri)(state),
@ -30,4 +30,4 @@ const perform = dispatch => ({
export default connect(
select,
perform
)(FileListItem);
)(ClaimListItem);

View file

@ -10,7 +10,7 @@ import UriIndicator from 'component/uriIndicator';
import TruncatedText from 'component/common/truncated-text';
import DateTime from 'component/dateTime';
import FileProperties from 'component/fileProperties';
import FileTags from 'component/fileTags';
import ClaimTags from 'component/claimTags';
import SubscribeButton from 'component/subscribeButton';
import ChannelThumbnail from 'component/channelThumbnail';
@ -27,12 +27,11 @@ type Props = {
thumbnail: string,
title: string,
nsfw: boolean,
large: boolean,
placeholder: boolean,
slim: boolean,
type: string,
};
function FileListItem(props: Props) {
function ClaimListItem(props: Props) {
const {
obscureNsfw,
claimIsMine,
@ -45,9 +44,8 @@ function FileListItem(props: Props) {
nsfw,
resolveUri,
claim,
large,
placeholder,
slim,
type,
} = props;
const haventFetched = claim === undefined;
@ -98,7 +96,7 @@ function FileListItem(props: Props) {
onClick={onClick}
onContextMenu={handleContextMenu}
className={classnames('file-list__item', {
'file-list__item--large': large,
'file-list__item--large': type === 'large',
})}
>
{isChannel ? <ChannelThumbnail uri={uri} /> : <CardMedia thumbnail={thumbnail} />}
@ -107,7 +105,7 @@ function FileListItem(props: Props) {
<div className="file-list__item-title">
<TruncatedText text={title || (claim && claim.name)} lines={1} />
</div>
{!slim && (
{type !== 'small' && (
<div>
{isChannel && <SubscribeButton uri={uri.startsWith('lbry://') ? uri : `lbry://${uri}`} />}
{!isChannel && <FileProperties uri={uri} />}
@ -122,11 +120,11 @@ function FileListItem(props: Props) {
<div>{isChannel ? `${claimsInChannel} ${__('publishes')}` : <DateTime timeAgo uri={uri} />}</div>
</div>
<FileTags uri={uri} slim={slim} />
<ClaimTags uri={uri} type={type} />
</div>
</div>
</li>
);
}
export default withRouter(FileListItem);
export default withRouter(ClaimListItem);

View file

@ -1,6 +1,6 @@
import { connect } from 'react-redux';
import { makeSelectTagsForUri, selectFollowedTags } from 'lbry-redux';
import FileTags from './view';
import ClaimTags from './view';
const select = (state, props) => ({
tags: makeSelectTagsForUri(props.uri)(state),
@ -10,4 +10,4 @@ const select = (state, props) => ({
export default connect(
select,
null
)(FileTags);
)(ClaimTags);

View file

@ -10,13 +10,12 @@ const LARGE_TAGS = 10;
type Props = {
tags: Array<string>,
followedTags: Array<Tag>,
large: boolean,
slim: boolean,
type: string,
};
export default function FileTags(props: Props) {
const { tags, followedTags, large, slim } = props;
const numberOfTags = slim ? SLIM_TAGS : large ? LARGE_TAGS : NORMAL_TAGS;
export default function ClaimTags(props: Props) {
const { tags, followedTags, type } = props;
const numberOfTags = type === 'small' ? SLIM_TAGS : type === 'large' ? LARGE_TAGS : NORMAL_TAGS;
let tagsToDisplay = [];
for (var i = 0; tagsToDisplay.length < numberOfTags - 2; i++) {
@ -44,7 +43,7 @@ export default function FileTags(props: Props) {
}
return (
<div className={classnames('file-properties', { 'file-properties--large': large })}>
<div className={classnames('file-properties', { 'file-properties--large': type === 'large' })}>
{tagsToDisplay.map(tag => (
<Button key={tag} title={tag} navigate={`$/tags?t=${tag}`} className="tag" label={tag} />
))}

View file

@ -1,6 +1,6 @@
// @flow
import React from 'react';
import FileList from 'component/fileList';
import ClaimList from 'component/claimList';
type Props = {
uri: string,
@ -52,8 +52,8 @@ export default class RecommendedContent extends React.PureComponent<Props> {
return (
<section className="card">
<FileList
slim
<ClaimList
type="small"
loading={isSearching}
uris={recommendedContent}
header={<span>{__('Related')}</span>}

View file

@ -22,6 +22,7 @@ class RewardSummary extends React.Component<Props> {
{fetching && __('You have...')}
{!fetching && hasRewards ? (
<React.Fragment>
{/* @i18nfixme */}
{__('You have')}
&nbsp;
<CreditAmount inheritStyle amount={unclaimedRewardAmount} precision={8} />

View file

@ -1,6 +1,6 @@
// @flow
import React from 'react';
import FileListDiscover from 'component/fileListDiscover';
import ClaimListDiscover from 'component/claimListDiscover';
import TagsSelect from 'component/tagsSelect';
import Page from 'component/page';
@ -12,7 +12,7 @@ function DiscoverPage(props: Props) {
const { followedTags } = props;
return (
<Page>
<FileListDiscover
<ClaimListDiscover
personal
tags={followedTags.map(tag => tag.name)}
injectedItem={<TagsSelect showClose title={__('Make This Your Own')} />}

View file

@ -19,7 +19,7 @@ import FileDownloadLink from 'component/fileDownloadLink';
import classnames from 'classnames';
import getMediaType from 'util/get-media-type';
import RecommendedContent from 'component/recommendedContent';
import FileTags from 'component/fileTags';
import ClaimTags from 'component/claimTags';
type Props = {
claim: StreamClaim,
@ -281,7 +281,9 @@ class FilePage extends React.Component<Props> {
</div>
<div className="media__info--large">
<FileTags uri={uri} large />
<ClaimTags uri={uri} type="large" />
</div>
<div className="media__info--large">
<FileDetails uri={uri} />
</div>
</div>

View file

@ -1,7 +1,7 @@
// @flow
import React from 'react';
import Button from 'component/button';
import FileList from 'component/fileList';
import ClaimList from 'component/claimList';
type Props = {
fetching: boolean,
@ -18,7 +18,7 @@ function FileListDownloaded(props: Props) {
<React.Fragment>
{hasDownloads ? (
<div className="card">
<FileList persistedStorageKey="file-list-downloaded" uris={downloadedUris} loading={fetching} />
<ClaimList persistedStorageKey="claim-list-downloaded" uris={downloadedUris} loading={fetching} />
</div>
) : (
<div className="main--empty">

View file

@ -1,7 +1,7 @@
// @flow
import React, { useEffect } from 'react';
import Button from 'component/button';
import FileList from 'component/fileList';
import ClaimList from 'component/claimList';
import Page from 'component/page';
type Props = {
@ -21,7 +21,7 @@ function FileListPublished(props: Props) {
<Page notContained>
{uris && uris.length ? (
<div className="card">
<FileList loading={fetching} persistedStorageKey="file-list-published" uris={uris} />
<ClaimList loading={fetching} persistedStorageKey="claim-list-published" uris={uris} />
</div>
) : (
<div className="main--empty">

View file

@ -26,7 +26,7 @@ class InvitePage extends React.PureComponent<Props> {
const { isPending, isFailed } = this.props;
return (
<div className="">
<div>
{isPending && <BusyIndicator message={__('Checking your invite status')} />}
{!isPending && isFailed && <span className="empty">{__('Failed to retrieve invite status.')}</span>}
{!isPending && !isFailed && (

View file

@ -2,8 +2,8 @@
import * as ICONS from 'constants/icons';
import React, { useEffect, Fragment } from 'react';
import { isURIValid, normalizeURI } from 'lbry-redux';
import FileListItem from 'component/fileListItem';
import FileList from 'component/fileList';
import ClaimListItem from 'component/claimListItem';
import ClaimList from 'component/claimList';
import Page from 'component/page';
import SearchOptions from 'component/searchOptions';
import Button from 'component/button';
@ -49,12 +49,12 @@ export default function SearchPage(props: Props) {
<Button button="alt" navigate={uri} className="media__uri">
{uri}
</Button>
<FileListItem uri={uri} large />
<ClaimListItem uri={uri} type="large" />
</header>
)}
<div className="card">
<FileList
<ClaimList
uris={uris}
header={<SearchOptions />}
headerAltControls={

View file

@ -2,7 +2,7 @@
import * as PAGES from 'constants/pages';
import React, { useEffect } from 'react';
import Page from 'component/page';
import FileList from 'component/fileList';
import ClaimList from 'component/claimList';
import Button from 'component/button';
type Props = {
@ -62,7 +62,7 @@ export default function SubscriptionsPage(props: Props) {
return (
<Page>
<div className="card">
<FileList
<ClaimList
loading={loading}
header={<h1>{viewingSuggestedSubs ? __('Discover New Channels') : __('Latest From Your Subscriptions')}</h1>}
headerAltControls={

View file

@ -1,7 +1,7 @@
// @flow
import React from 'react';
import Page from 'component/page';
import FileListDiscover from 'component/fileListDiscover';
import ClaimListDiscover from 'component/claimListDiscover';
import Button from 'component/button';
type Props = {
@ -28,7 +28,7 @@ function TagsPage(props: Props) {
return (
<Page>
<FileListDiscover
<ClaimListDiscover
tags={tags}
meta={
<Button

View file

@ -16,7 +16,7 @@ const selectState = state => state.subscriptions || {};
// Returns the list of channel uris a user is subscribed to
export const selectSubscriptions = createSelector(
selectState,
state => state.subscriptions.sort((a, b) => a.channelName.localeCompare(b.channelName))
state => state.subscriptions && state.subscriptions.sort((a, b) => a.channelName.localeCompare(b.channelName))
);
// Fetching list of users subscriptions

View file

@ -26,7 +26,7 @@
}
}
.file-list__header--slim {
.file-list__header--small {
height: 3rem;
font-size: 1em;
}

View file

@ -8,7 +8,6 @@
.navigation {
width: var(--side-nav-width);
font-size: 1.4rem;
position: fixed;
@media (max-width: 600px) {
display: none;
@ -36,6 +35,10 @@
color: lighten($lbry-black, 20%);
margin-top: var(--spacing-miniscule);
.icon {
margin-right: var(--spacing-small);
}
&:hover {
color: $lbry-teal-4;
.icon {

View file

@ -73,7 +73,7 @@
padding-right: 0;
span {
margin-left: var(--spacing-tiny);
margin-left: var(--spacing-small);
}
}
@ -85,7 +85,8 @@
.menu__title,
.menu__link {
font-size: 1.2rem;
font-size: 1.3rem;
color: lighten($lbry-black, 20%);
.icon {
margin-right: var(--spacing-small);

View file

@ -175,5 +175,77 @@
"Try": "Try",
"refreshing the app": "refreshing the app",
"to fix it": "to fix it",
"Search": "Search"
"Search": "Search",
"Starting up": "Starting up",
"Connecting": "Connecting",
"It looks like you deleted or moved this file. We're rebuilding it now. It will only take a few seconds.": "It looks like you deleted or moved this file. We're rebuilding it now. It will only take a few seconds.",
"Newest First": "Newest First",
"Oldest First": "Oldest First",
"Contact": "Contact",
"Site": "Site",
"Send a tip to": "Send a tip to",
"This will appear as a tip for \"Why I Quit YouTube\".": "This will appear as a tip for \"Why I Quit YouTube\".",
"You sent 10 LBC as a tip, Mahalo!": "You sent 10 LBC as a tip, Mahalo!",
"History": "History",
"/wallet": "/wallet",
"Pending": "Pending",
"You have %s in unclaimed rewards.": "You have %s in unclaimed rewards.",
"Download Directory": "Download Directory",
"LBRY downloads will be saved here.": "LBRY downloads will be saved here.",
"Max Purchase Price": "Max Purchase Price",
"No Limit": "No Limit",
"Choose limit": "Choose limit",
"This will prevent you from purchasing any content over a certain cost, as a safety measure.": "This will prevent you from purchasing any content over a certain cost, as a safety measure.",
"Purchase Confirmations": "Purchase Confirmations",
"Always confirm before purchasing content": "Always confirm before purchasing content",
"Only confirm purchases over a certain price": "Only confirm purchases over a certain price",
"When this option is chosen, LBRY won't ask you to confirm downloads below your chosen price.": "When this option is chosen, LBRY won't ask you to confirm downloads below your chosen price.",
"Content Settings": "Content Settings",
"Show NSFW content": "Show NSFW content",
"NSFW content may include nudity, intense sexuality, profanity, or other adult content. By displaying NSFW content, you are affirming you are of legal age to view mature content in your country or jurisdiction. ": "NSFW content may include nudity, intense sexuality, profanity, or other adult content. By displaying NSFW content, you are affirming you are of legal age to view mature content in your country or jurisdiction. ",
"Notifications": "Notifications",
"Show Desktop Notifications": "Show Desktop Notifications",
"Get notified when a publish is confirmed, or when new content is available to watch.": "Get notified when a publish is confirmed, or when new content is available to watch.",
"Share Diagnostic Data": "Share Diagnostic Data",
"Help make LBRY better by contributing analytics and diagnostic data about my usage.": "Help make LBRY better by contributing analytics and diagnostic data about my usage.",
"You will be ineligible to earn rewards while diagnostics are not being shared.": "You will be ineligible to earn rewards while diagnostics are not being shared.",
"Appearance": "Appearance",
"Theme": "Theme",
"Automatic dark mode (9pm to 8am)": "Automatic dark mode (9pm to 8am)",
"Wallet Security": "Wallet Security",
"Encrypt my wallet with a custom password.": "Encrypt my wallet with a custom password.",
"Secure your local wallet data with a custom password.": "Secure your local wallet data with a custom password.",
"Lost passwords cannot be recovered.": "Lost passwords cannot be recovered.",
"Experimental Settings": "Experimental Settings",
"Automatically download new content from my subscriptions": "Automatically download new content from my subscriptions",
"The latest file from each of your subscriptions will be downloaded for quick access as soon as it's published.": "The latest file from each of your subscriptions will be downloaded for quick access as soon as it's published.",
"Autoplay media files": "Autoplay media files",
"Autoplay video and audio files when navigating to a file, as well as the next related item when a file finishes playing.": "Autoplay video and audio files when navigating to a file, as well as the next related item when a file finishes playing.",
"Multi-language support is brand new and incomplete. Switching your language may have unintended consequences.": "Multi-language support is brand new and incomplete. Switching your language may have unintended consequences.",
"Application Cache": "Application Cache",
"This will clear the application cache. Your wallet will not be affected.": "This will clear the application cache. Your wallet will not be affected.",
"Clear Cache": "Clear Cache",
"Choose Directory": "Choose Directory",
"Currency": "Currency",
"LBRY Credits (LBC)": "LBRY Credits (LBC)",
"US Dollars": "US Dollars",
"There's nothing available at this location.": "There's nothing available at this location.",
"Loading decentralized data...": "Loading decentralized data...",
"Confirm File Remove": "Confirm File Remove",
"Remove": "Remove",
"Are you sure you'd like to remove": "Are you sure you'd like to remove",
"from the LBRY app?": "from the LBRY app?",
"Also delete this file from my computer": "Also delete this file from my computer",
"Less": "Less",
"Warning!": "Warning!",
"Confirm External Resource": "Confirm External Resource",
"Continue": "Continue",
"This file has been shared with you by other people.": "This file has been shared with you by other people.",
"LBRY Inc is not responsible for its content, click continue to proceed at your own risk.": "LBRY Inc is not responsible for its content, click continue to proceed at your own risk.",
"Find what you were looking for?": "Find what you were looking for?",
"Yes": "Yes",
"No": "No",
"These search results are provided by LBRY, Inc.": "These search results are provided by LBRY, Inc.",
"FILTER": "FILTER",
"View file": "View file"
}

View file

@ -283,5 +283,8 @@
"Open file": "Otwórz plik",
"NEW": "NEW",
"Failed to load settings.": "Failed to load settings.",
"Multi-language support is brand new and incomplete. Switching your language may have unintended consequences.": "Multi-language support is brand new and incomplete. Switching your language may have unintended consequences."
"Multi-language support is brand new and incomplete. Switching your language may have unintended consequences.": "Multi-language support is brand new and incomplete. Switching your language may have unintended consequences.",
"Wallet": "Wallet",
"Home": "Home",
"Following": "Following"
}