From 7102f06b829f6140f731ab1f4fc0ac14d6268e2f Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Tue, 9 Jul 2019 01:53:24 -0400 Subject: [PATCH 01/20] fix lbry/component style overrides in forms --- src/ui/page/settings/view.jsx | 18 ++++++++---------- src/ui/scss/component/_button.scss | 3 +-- src/ui/scss/component/_form-field.scss | 16 +++++++++++++++- static/locales/en.json | 2 +- 4 files changed, 25 insertions(+), 14 deletions(-) diff --git a/src/ui/page/settings/view.jsx b/src/ui/page/settings/view.jsx index b36f00549..81f8411df 100644 --- a/src/ui/page/settings/view.jsx +++ b/src/ui/page/settings/view.jsx @@ -173,16 +173,14 @@ class SettingsPage extends React.PureComponent {
-
- { - setDaemonSetting('download_dir', newDirectory); - }} - /> -

{__('LBRY downloads will be saved here.')}

- + { + setDaemonSetting('download_dir', newDirectory); + }} + /> +

{__('LBRY downloads will be saved here.')}

diff --git a/src/ui/scss/component/_button.scss b/src/ui/scss/component/_button.scss index f0d8f22ca..b60075c64 100644 --- a/src/ui/scss/component/_button.scss +++ b/src/ui/scss/component/_button.scss @@ -44,8 +44,7 @@ line-height: var(--button-height); border-radius: var(--button-radius); font-size: 1.1rem; - padding-top: 0; - padding-bottom: 0; + padding: 0 var(--spacing-medium); box-sizing: border-box; } diff --git a/src/ui/scss/component/_form-field.scss b/src/ui/scss/component/_form-field.scss index f8bddebba..763861992 100644 --- a/src/ui/scss/component/_form-field.scss +++ b/src/ui/scss/component/_form-field.scss @@ -1,5 +1,16 @@ @import '~@lbry/components/sass/form/_index.scss'; +// Reset lbry components style that turns buttons inside of forms black +form { + .button--primary, + [type='submit'] { + &:not(:hover), + &:hover { + @extend .button--primary; + } + } +} + textarea { &::placeholder { opacity: 0.4; @@ -223,7 +234,10 @@ fieldset-section { } } - .button { + .button, + // specificity needed because of @lbry/component rules + // @lbry/componentfixme + .button[type='submit']:not(:hover) { border-top-left-radius: 0; border-bottom-left-radius: 0; border-top-right-radius: var(--input-border-radius); diff --git a/static/locales/en.json b/static/locales/en.json index cc3e68b74..4be62f8a9 100644 --- a/static/locales/en.json +++ b/static/locales/en.json @@ -576,4 +576,4 @@ "Are you sure you want to remove this support?": "Are you sure you want to remove this support?", "These credits are permanently yours and can be removed at any time. Removing this support will reduce the claim's discoverability and return the LBC to your spendable balance.": "These credits are permanently yours and can be removed at any time. Removing this support will reduce the claim's discoverability and return the LBC to your spendable balance.", "The better your tags are, the easier it will be for people to discover your channel.": "The better your tags are, the easier it will be for people to discover your channel." -} \ No newline at end of file +} -- 2.45.2 From 4d414775bce2e950029176b4722f962eaeb4c192 Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Tue, 9 Jul 2019 02:02:08 -0400 Subject: [PATCH 02/20] update lbry-redux --- .eslintrc.json | 1 + src/ui/redux/actions/publish.js | 2 +- yarn.lock | 4 ++-- 3 files changed, 4 insertions(+), 3 deletions(-) diff --git a/.eslintrc.json b/.eslintrc.json index 7f85a5aea..86ec5da22 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -29,6 +29,7 @@ "indent": 0, "jsx-quotes": ["error", "prefer-double"], "new-cap": 0, + "no-console": 1, "no-multi-spaces": 0, "no-redeclare": 0, "no-return-await": 0, diff --git a/src/ui/redux/actions/publish.js b/src/ui/redux/actions/publish.js index b09f2d017..81bc886c3 100644 --- a/src/ui/redux/actions/publish.js +++ b/src/ui/redux/actions/publish.js @@ -347,7 +347,7 @@ export const doPublish = () => (dispatch: Dispatch, getState: () => {}) => { dispatch({ type: ACTIONS.PUBLISH_FAIL }); dispatch(doError(error.message)); }; - console.log('PP', publishPayload); + return Lbry.publish(publishPayload).then(success, failure); }; diff --git a/yarn.lock b/yarn.lock index a66f83eb7..bd4f2c55c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6646,9 +6646,9 @@ lazy-val@^1.0.3, lazy-val@^1.0.4: yargs "^13.2.2" zstd-codec "^0.1.1" -lbry-redux@lbryio/lbry-redux#bb82aed61a5569e565daa784eb25fc1d639c0c22: +lbry-redux@lbryio/lbry-redux#0ff6364a40253387fbe1c4a5b5cd444f616d84e6: version "0.0.1" - resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/bb82aed61a5569e565daa784eb25fc1d639c0c22" + resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/0ff6364a40253387fbe1c4a5b5cd444f616d84e6" dependencies: proxy-polyfill "0.1.6" reselect "^3.0.0" -- 2.45.2 From 985f60d83c739ba3a08cf3ac80fb77de223cd439 Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Tue, 9 Jul 2019 02:11:30 -0400 Subject: [PATCH 03/20] fix: mature tags in dark mode --- src/ui/scss/component/_badge.scss | 4 ++++ src/ui/scss/component/_form-field.scss | 7 ++++--- 2 files changed, 8 insertions(+), 3 deletions(-) diff --git a/src/ui/scss/component/_badge.scss b/src/ui/scss/component/_badge.scss index 51b180243..06f2a134a 100644 --- a/src/ui/scss/component/_badge.scss +++ b/src/ui/scss/component/_badge.scss @@ -31,4 +31,8 @@ svg { stroke: $lbry-black; } + + [data-mode='dark'] & { + background-color: rgba($lbry-grape-1, 0.3); + } } diff --git a/src/ui/scss/component/_form-field.scss b/src/ui/scss/component/_form-field.scss index 763861992..73464662b 100644 --- a/src/ui/scss/component/_form-field.scss +++ b/src/ui/scss/component/_form-field.scss @@ -236,13 +236,14 @@ fieldset-section { .button, // specificity needed because of @lbry/component rules - // @lbry/componentfixme - .button[type='submit']:not(:hover) { + // @lbry/componentsfixme + .button[type='submit']:not(:hover), + .button[type='submit']:hover { + border-color: $lbry-black; border-top-left-radius: 0; border-bottom-left-radius: 0; border-top-right-radius: var(--input-border-radius); border-bottom-right-radius: var(--input-border-radius); - border-color: $lbry-black; } } -- 2.45.2 From da861ca6699471b8279d6b4b8465ec4fda6c9d72 Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Thu, 11 Jul 2019 14:06:25 -0400 Subject: [PATCH 04/20] add style to visited claim previews --- src/ui/component/claimListDiscover/view.jsx | 5 +++-- src/ui/component/claimPreview/index.js | 2 ++ src/ui/component/claimPreview/view.jsx | 6 ++++-- src/ui/redux/selectors/content.js | 6 ++++++ src/ui/scss/component/_claim-list.scss | 13 ++++++++++++- 5 files changed, 27 insertions(+), 5 deletions(-) diff --git a/src/ui/component/claimListDiscover/view.jsx b/src/ui/component/claimListDiscover/view.jsx index ed4dfed6a..214a753a5 100644 --- a/src/ui/component/claimListDiscover/view.jsx +++ b/src/ui/component/claimListDiscover/view.jsx @@ -29,7 +29,7 @@ const SEARCH_TIMES = [TIME_DAY, TIME_WEEK, TIME_MONTH, TIME_YEAR, TIME_ALL]; type Props = { uris: Array, subscribedChannels: Array, - doClaimSearch: (number, {}) => void, + doClaimSearch: ({}) => void, injectedItem: any, tags: Array, loading: boolean, @@ -87,7 +87,8 @@ function ClaimListDiscover(props: Props) { } } - doClaimSearch(20, options); + options.page_size = PAGE_SIZE; + doClaimSearch(options); }, [personal, personalSort, typeSort, timeSort, doClaimSearch, page, tagsString, channelsIdString, showNsfw]); function getLabel(type) { diff --git a/src/ui/component/claimPreview/index.js b/src/ui/component/claimPreview/index.js index 96bcfdc89..7277c96e5 100644 --- a/src/ui/component/claimPreview/index.js +++ b/src/ui/component/claimPreview/index.js @@ -11,6 +11,7 @@ import { } from 'lbry-redux'; import { selectBlackListedOutpoints, selectFilteredOutpoints } from 'lbryinc'; import { selectShowNsfw } from 'redux/selectors/settings'; +import { makeSelectHasVisitedUri } from 'redux/selectors/content'; import ClaimPreview from './view'; const select = (state, props) => ({ @@ -24,6 +25,7 @@ const select = (state, props) => ({ nsfw: makeSelectClaimIsNsfw(props.uri)(state), blackListedOutpoints: selectBlackListedOutpoints(state), filteredOutpoints: selectFilteredOutpoints(state), + hasVisitedUri: makeSelectHasVisitedUri(props.uri)(state), }); const perform = dispatch => ({ diff --git a/src/ui/component/claimPreview/view.jsx b/src/ui/component/claimPreview/view.jsx index 8da045d10..8a2d73485 100644 --- a/src/ui/component/claimPreview/view.jsx +++ b/src/ui/component/claimPreview/view.jsx @@ -29,6 +29,7 @@ type Props = { nsfw: boolean, placeholder: boolean, type: string, + hasVisitedUri: boolean, blackListedOutpoints: Array<{ txid: string, nout: number, @@ -56,6 +57,7 @@ function ClaimPreview(props: Props) { type, blackListedOutpoints, filteredOutpoints, + hasVisitedUri, } = props; const haventFetched = claim === undefined; const abandoned = !isResolvingUri && !claim && !placeholder; @@ -65,7 +67,6 @@ function ClaimPreview(props: Props) { let shouldHide = abandoned || (!claimIsMine && obscureNsfw && nsfw); // This will be replaced once blocking is done at the wallet server level - if (claim && !shouldHide && blackListedOutpoints) { shouldHide = blackListedOutpoints.some(outpoint => outpoint.txid === claim.txid && outpoint.nout === claim.nout); } @@ -117,7 +118,8 @@ function ClaimPreview(props: Props) { onContextMenu={handleContextMenu} className={classnames('claim-preview', { 'claim-preview--large': type === 'large', - 'claim-list__pending': pending, + 'claim-preview--visited': hasVisitedUri, + 'claim-preview--pending': pending, })} > {isChannel ? : } diff --git a/src/ui/redux/selectors/content.js b/src/ui/redux/selectors/content.js index 6a3b46284..c5f4a5b13 100644 --- a/src/ui/redux/selectors/content.js +++ b/src/ui/redux/selectors/content.js @@ -58,6 +58,12 @@ export const makeSelectHistoryForUri = (uri: string) => history => history.find(i => i.uri === uri) ); +export const makeSelectHasVisitedUri = (uri: string) => + createSelector( + makeSelectHistoryForUri(uri), + history => Boolean(history) + ); + export const selectRecentHistory = createSelector( selectHistory, history => { diff --git a/src/ui/scss/component/_claim-list.scss b/src/ui/scss/component/_claim-list.scss index 0bd17e228..8b0a41d19 100644 --- a/src/ui/scss/component/_claim-list.scss +++ b/src/ui/scss/component/_claim-list.scss @@ -129,7 +129,18 @@ } } -.claim-list__pending { +.claim-preview--visited { + // Still keep the normal styles on hover regardless of if they have visited the claim + &:not(:hover) { + color: lighten($lbry-black, 35%); + + [data-mode='dark'] & { + color: darken($lbry-white, 35%); + } + } +} + +.claim-preview--pending { cursor: pointer; opacity: 0.6; -- 2.45.2 From 075f745ddd91a194a4f498cc1b3527a762b5d37b Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Thu, 11 Jul 2019 14:16:39 -0400 Subject: [PATCH 05/20] add tag to wunderbar autocomplete --- src/ui/component/common/icon-custom.jsx | 6 ++++++ src/ui/component/wunderbar/view.jsx | 28 +++++++++++++++++-------- src/ui/constants/icons.js | 1 + src/ui/scss/component/_wunderbar.scss | 1 + 4 files changed, 27 insertions(+), 9 deletions(-) diff --git a/src/ui/component/common/icon-custom.jsx b/src/ui/component/common/icon-custom.jsx index 4057af42e..a96191376 100644 --- a/src/ui/component/common/icon-custom.jsx +++ b/src/ui/component/common/icon-custom.jsx @@ -253,6 +253,12 @@ export const icons = { ), + [ICONS.TAG]: buildIcon( + + + + + ), [ICONS.SUPPORT]: buildIcon( diff --git a/src/ui/component/wunderbar/view.jsx b/src/ui/component/wunderbar/view.jsx index b4d40f692..94f8b45e2 100644 --- a/src/ui/component/wunderbar/view.jsx +++ b/src/ui/component/wunderbar/view.jsx @@ -3,10 +3,11 @@ import * as PAGES from 'constants/pages'; import * as ICONS from 'constants/icons'; import React from 'react'; import classnames from 'classnames'; -import { normalizeURI, SEARCH_TYPES, isURIValid, buildURI } from 'lbry-redux'; +import { normalizeURI, SEARCH_TYPES, isURIValid } from 'lbry-redux'; +import { withRouter } from 'react-router'; import Icon from 'component/common/icon'; -import { parseQueryParams } from 'util/query-params'; import Autocomplete from './internal/autocomplete'; +import Tag from 'component/tag'; const L_KEY_CODE = 76; const ESC_KEY_CODE = 27; @@ -22,6 +23,7 @@ type Props = { doBlur: () => void, focused: boolean, doShowSnackBar: string => void, + history: { push: string => void }, }; type State = { @@ -51,10 +53,12 @@ class WunderBar extends React.PureComponent { getSuggestionIcon = (type: string) => { switch (type) { - case 'file': + case SEARCH_TYPES.FILE: return ICONS.FILE; - case 'channel': + case SEARCH_TYPES.CHANNEL: return ICONS.CHANNEL; + case SEARCH_TYPES.TAG: + return ICONS.TAG; default: return ICONS.SEARCH; } @@ -90,7 +94,7 @@ class WunderBar extends React.PureComponent { } handleSubmit(value: string, suggestion?: { value: string, type: string }) { - const { onSubmit, onSearch, doShowSnackBar } = this.props; + const { onSubmit, onSearch, doShowSnackBar, history } = this.props; const query = value.trim(); const showSnackError = () => { @@ -99,8 +103,10 @@ class WunderBar extends React.PureComponent { // User selected a suggestion if (suggestion) { - if (suggestion.type === 'search') { + if (suggestion.type === SEARCH_TYPES.SEARCH) { onSearch(query); + } else if (suggestion.type === SEARCH_TYPES.TAG) { + history.push(`/$/${PAGES.TAGS}?t=${suggestion.value}`); } else if (isURIValid(query)) { const uri = normalizeURI(query); onSubmit(uri); @@ -157,18 +163,22 @@ class WunderBar extends React.PureComponent { )} renderItem={({ value, type }, isHighlighted) => (
- {value} + + {type === SEARCH_TYPES.TAG ? : value} + {isHighlighted && ( {type === SEARCH_TYPES.SEARCH && __('Search')} {type === SEARCH_TYPES.CHANNEL && __('View channel')} {type === SEARCH_TYPES.FILE && __('View file')} + {type === SEARCH_TYPES.TAG && __('View Tag')} )}
@@ -179,4 +189,4 @@ class WunderBar extends React.PureComponent { } } -export default WunderBar; +export default withRouter(WunderBar); diff --git a/src/ui/constants/icons.js b/src/ui/constants/icons.js index a5306cdce..502d19de9 100644 --- a/src/ui/constants/icons.js +++ b/src/ui/constants/icons.js @@ -69,4 +69,5 @@ export const MUSIC_EQUALIZER = 'Sliders'; export const LIGHT = 'Sun'; export const DARK = 'Moon'; export const LIBRARY = 'Folder'; +export const TAG = 'Tag'; export const SUPPORT = 'TrendingUp'; diff --git a/src/ui/scss/component/_wunderbar.scss b/src/ui/scss/component/_wunderbar.scss index e3266c463..574e7ca31 100644 --- a/src/ui/scss/component/_wunderbar.scss +++ b/src/ui/scss/component/_wunderbar.scss @@ -72,6 +72,7 @@ box-shadow: 0 1px 5px rgba($lbry-black, 0.15); min-width: 100%; overflow: hidden; + font-size: 14px; [data-mode='dark'] & { background-color: $lbry-gray-5; -- 2.45.2 From 6a0e5b685757e4a4619ad1a0b5a85d9ec0e0fb95 Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Thu, 11 Jul 2019 14:23:25 -0400 Subject: [PATCH 06/20] update lbry-redux --- yarn.lock | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/yarn.lock b/yarn.lock index bd4f2c55c..ad12f83c1 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6646,9 +6646,9 @@ lazy-val@^1.0.3, lazy-val@^1.0.4: yargs "^13.2.2" zstd-codec "^0.1.1" -lbry-redux@lbryio/lbry-redux#0ff6364a40253387fbe1c4a5b5cd444f616d84e6: +lbry-redux@lbryio/lbry-redux#15e36688fb762b0b424a837de0f5a405b05463a2: version "0.0.1" - resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/0ff6364a40253387fbe1c4a5b5cd444f616d84e6" + resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/15e36688fb762b0b424a837de0f5a405b05463a2" dependencies: proxy-polyfill "0.1.6" reselect "^3.0.0" -- 2.45.2 From 75ff0a9cf07de22a71f68cc4373c0cce1a154345 Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Thu, 11 Jul 2019 14:23:38 -0400 Subject: [PATCH 07/20] v0.34.0-rc.6 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 5f0088c03..c34276e2e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "LBRY", - "version": "0.34.0-rc.5", + "version": "0.34.0-rc.6", "description": "A browser for the LBRY network, a digital marketplace controlled by its users.", "keywords": [ "lbry" -- 2.45.2 From 68dd41cbbc1a8821d4f582cab4247d69b3195732 Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Thu, 11 Jul 2019 15:03:31 -0400 Subject: [PATCH 08/20] fix: handle claims with invalid names --- src/ui/component/claimPreview/view.jsx | 13 ++++++++++--- .../internal/transaction-list-item.jsx | 10 +++++----- yarn.lock | 4 ++-- 3 files changed, 17 insertions(+), 10 deletions(-) diff --git a/src/ui/component/claimPreview/view.jsx b/src/ui/component/claimPreview/view.jsx index 8a2d73485..8d178fa28 100644 --- a/src/ui/component/claimPreview/view.jsx +++ b/src/ui/component/claimPreview/view.jsx @@ -61,9 +61,16 @@ function ClaimPreview(props: Props) { } = props; const haventFetched = claim === undefined; const abandoned = !isResolvingUri && !claim && !placeholder; - const { isChannel } = parseURI(uri); const claimsInChannel = (claim && claim.meta.claims_in_channel) || 0; + let isValid; + try { + parseURI(uri); + isValid = true; + } catch (e) { + isValid = false; + } + const isChannel = isValid ? parseURI(uri).isChannel : false; let shouldHide = abandoned || (!claimIsMine && obscureNsfw && nsfw); // This will be replaced once blocking is done at the wallet server level @@ -90,7 +97,7 @@ function ClaimPreview(props: Props) { } useEffect(() => { - if (!isResolvingUri && haventFetched && uri) { + if (isValid && !isResolvingUri && haventFetched && uri) { resolveUri(uri); } }, [isResolvingUri, uri, resolveUri, haventFetched]); @@ -118,7 +125,7 @@ function ClaimPreview(props: Props) { onContextMenu={handleContextMenu} className={classnames('claim-preview', { 'claim-preview--large': type === 'large', - 'claim-preview--visited': hasVisitedUri, + 'claim-preview--visited': !isChannel && hasVisitedUri, 'claim-preview--pending': pending, })} > diff --git a/src/ui/component/transactionList/internal/transaction-list-item.jsx b/src/ui/component/transactionList/internal/transaction-list-item.jsx index 8984b24d5..fae6f93e9 100644 --- a/src/ui/component/transactionList/internal/transaction-list-item.jsx +++ b/src/ui/component/transactionList/internal/transaction-list-item.jsx @@ -44,10 +44,12 @@ class TransactionListItem extends React.PureComponent { const { amount, claim_id: claimId, claim_name: name, date, fee, txid, type } = transaction; // Ensure the claim name exists and is valid + let uri; let claimName = name; - if (claimName) { + try { ({ claimName } = parseURI(name)); - } + uri = buildURI({ claimName: claimName, claimId }); + } catch (e) {} const dateFormat = { month: 'short', @@ -72,9 +74,7 @@ class TransactionListItem extends React.PureComponent { {reward && {reward.reward_title}} - {claimName && claimId && ( - ); } else { diff --git a/src/ui/page/channel/index.js b/src/ui/page/channel/index.js index a4715823e..667546b11 100644 --- a/src/ui/page/channel/index.js +++ b/src/ui/page/channel/index.js @@ -5,6 +5,7 @@ import { makeSelectThumbnailForUri, makeSelectCoverForUri, selectCurrentChannelPage, + makeSelectClaimForUri, } from 'lbry-redux'; import ChannelPage from './view'; @@ -14,6 +15,7 @@ const select = (state, props) => ({ cover: makeSelectCoverForUri(props.uri)(state), channelIsMine: makeSelectClaimIsMine(props.uri)(state), page: selectCurrentChannelPage(state), + claim: makeSelectClaimForUri(props.uri)(state), }); export default connect( diff --git a/src/ui/page/channel/view.jsx b/src/ui/page/channel/view.jsx index 522c98cdc..daf9c766e 100644 --- a/src/ui/page/channel/view.jsx +++ b/src/ui/page/channel/view.jsx @@ -20,6 +20,7 @@ const ABOUT_PAGE = `about`; type Props = { uri: string, + claim: ChannelClaim, title: ?string, cover: ?string, thumbnail: ?string, @@ -31,12 +32,12 @@ type Props = { }; function ChannelPage(props: Props) { - const { uri, title, cover, history, location, page, channelIsMine, thumbnail } = props; + const { uri, title, cover, history, location, page, channelIsMine, thumbnail, claim } = props; const { channelName } = parseURI(uri); const { search } = location; const urlParams = new URLSearchParams(search); const currentView = urlParams.get(PAGE_VIEW_QUERY) || undefined; - + const { permanent_url: permanentUrl } = claim; const [editing, setEditing] = useState(false); const [thumbPreview, setThumbPreview] = useState(thumbnail); const [coverPreview, setCoverPreview] = useState(cover); @@ -90,7 +91,7 @@ function ChannelPage(props: Props) { {editing ? __('Editing Your Channel') : __('About')}
- +
diff --git a/src/ui/page/discover/view.jsx b/src/ui/page/discover/view.jsx index c51756bf1..885dbb7e5 100644 --- a/src/ui/page/discover/view.jsx +++ b/src/ui/page/discover/view.jsx @@ -16,7 +16,7 @@ function DiscoverPage(props: Props) { return ( tag.name)} meta={