From ac62156229d28ec034af723cdd011c44f460eab9 Mon Sep 17 00:00:00 2001 From: jessop <jessop@lbry.com> Date: Wed, 5 Feb 2020 13:01:07 -0500 Subject: [PATCH] fix bugs and review changes --- ui/component/abandonedChannelPreview/view.jsx | 13 ++++--------- ui/component/claimList/view.jsx | 6 +++--- ui/component/claimPreview/view.jsx | 13 ++++++------- ui/component/splash/view.jsx | 2 +- ui/page/channelsFollowingManage/view.jsx | 2 +- ui/redux/actions/app.js | 7 ++++--- ui/scss/component/_claim-list.scss | 4 ++++ ui/scss/themes/dark.scss | 1 + ui/scss/themes/light.scss | 1 + 9 files changed, 25 insertions(+), 24 deletions(-) diff --git a/ui/component/abandonedChannelPreview/view.jsx b/ui/component/abandonedChannelPreview/view.jsx index 11cb6c033..bc2430392 100644 --- a/ui/component/abandonedChannelPreview/view.jsx +++ b/ui/component/abandonedChannelPreview/view.jsx @@ -22,12 +22,7 @@ function AbandonedChannelPreview(props: Props) { const { channelName } = parseURI(uri); return ( - <li - className={classnames('claim-preview__wrapper', { - 'claim-preview__wrapper--channel': type !== 'inline', - 'claim-preview__wrapper--inline': type === 'inline', - })} - > + <li className={classnames('claim-preview__wrapper', 'claim-preview__wrapper--notice')}> <div className={classnames('claim-preview', { 'claim-preview--large': type === 'large' })}> <ChannelThumbnail uri={uri} /> <div className="claim-preview__text"> @@ -35,11 +30,11 @@ function AbandonedChannelPreview(props: Props) { <div className="claim-preview-info"> <div className="claim-preview__title">{channelName}</div> </div> - <div className="media__subtitle">{`This channel may have been abandoned.`}</div> + <div className="media__subtitle">{__(`This channel may have been unpublished.`)}</div> </div> <div className="claim-preview__actions"> + {/* SubscribeButton uses resolved permanentUri; modifying it didn't seem worth it. */} <Button - // ref={buttonRef} iconColor="red" icon={ICONS.UNSUBSCRIBE} button={'alt'} @@ -47,7 +42,7 @@ function AbandonedChannelPreview(props: Props) { onClick={e => { e.stopPropagation(); doChannelUnsubscribe({ - channelName, + channelName: `@${channelName}`, uri, }); }} diff --git a/ui/component/claimList/view.jsx b/ui/component/claimList/view.jsx index 3f2975383..c4ce9adaf 100644 --- a/ui/component/claimList/view.jsx +++ b/ui/component/claimList/view.jsx @@ -29,7 +29,7 @@ type Props = { persistedStorageKey?: string, showHiddenByUser: boolean, headerLabel?: string | Node, - nullPreviewBehavior?: string, + showUnresolvedClaims?: boolean, }; export default function ClaimList(props: Props) { @@ -48,7 +48,7 @@ export default function ClaimList(props: Props) { id, showHiddenByUser, headerLabel, - nullPreviewBehavior, + showUnresolvedClaims, } = props; const [scrollBottomCbMap, setScrollBottomCbMap] = useState({}); const [currentSort, setCurrentSort] = usePersistedState(persistedStorageKey, SORT_NEW); @@ -132,7 +132,7 @@ export default function ClaimList(props: Props) { key={uri} uri={uri} type={type} - nullPreview={nullPreviewBehavior} + showUnresolvedClaim={showUnresolvedClaims} properties={type !== 'small' ? undefined : false} showUserBlocked={showHiddenByUser} customShouldHide={(claim: StreamClaim) => { diff --git a/ui/component/claimPreview/view.jsx b/ui/component/claimPreview/view.jsx index 4d15f0e3d..3b981abc8 100644 --- a/ui/component/claimPreview/view.jsx +++ b/ui/component/claimPreview/view.jsx @@ -55,7 +55,7 @@ type Props = { streamingUrl: ?string, getFile: string => void, customShouldHide?: Claim => boolean, - nullPreview?: string, + showUnresolvedClaim?: boolean, }; const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => { @@ -86,12 +86,12 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => { getFile, streamingUrl, customShouldHide, - nullPreview, + showUnresolvedClaim, } = props; const shouldFetch = claim === undefined || (claim !== null && claim.value_type === 'channel' && isEmpty(claim.meta) && !pending); const abandoned = !isResolvingUri && !claim; - const showPublishLink = abandoned && placeholder === 'publish'; + const showPublishLink = abandoned && !showUnresolvedClaim && placeholder === 'publish'; const hideActions = type === 'small' || type === 'tooltip'; const canonicalUrl = claim && claim.canonical_url; @@ -117,7 +117,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => { let shouldHide = placeholder !== 'loading' && !showUserBlocked && - ((abandoned && !nullPreview === 'abandonedChannel' && !showPublishLink) || (!claimIsMine && obscureNsfw && nsfw)); + ((abandoned && !showUnresolvedClaim && !showPublishLink) || (!claimIsMine && obscureNsfw && nsfw)); // This will be replaced once blocking is done at the wallet server level if (claim && !claimIsMine && !shouldHide && blackListedOutpoints) { @@ -186,7 +186,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => { return null; } - if (placeholder === 'loading' || (isResolvingUri && !claim)) { + if (placeholder === 'loading' || claim === undefined || (isResolvingUri && !claim)) { return ( <li disabled @@ -206,7 +206,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => { ); } - if (nullPreview === 'abandonedChannel' && !isResolvingUri && !claim) { + if (!shouldFetch && showUnresolvedClaim && !isResolvingUri && claim === null) { return <AbandonedChannelPreview uri={uri} type />; } if (placeholder === 'publish' && !claim && uri.startsWith('lbry://@')) { @@ -264,7 +264,6 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => { </NavLink> {!isChannel && <FileProperties uri={uri} />} </div> - <ClaimPreviewSubtitle uri={uri} type={type} /> </div> <div className="claim-preview__actions"> diff --git a/ui/component/splash/view.jsx b/ui/component/splash/view.jsx index 422a49b07..d29713ed2 100644 --- a/ui/component/splash/view.jsx +++ b/ui/component/splash/view.jsx @@ -51,7 +51,7 @@ export default class SplashScreen extends React.PureComponent<Props, State> { message: __('Connecting'), launchedModal: false, error: false, - launchWithIncompatibleDaemon: false, + launchWithIncompatibleDaemon: !process.env.NODE_ENV === 'production', isRunning: false, waitingForWallet: 0, }; diff --git a/ui/page/channelsFollowingManage/view.jsx b/ui/page/channelsFollowingManage/view.jsx index de83a0555..439fc8106 100644 --- a/ui/page/channelsFollowingManage/view.jsx +++ b/ui/page/channelsFollowingManage/view.jsx @@ -38,7 +38,7 @@ function ChannelsFollowingManagePage(props: Props) { return ( <Page> <ClaimList - nullPreviewBehavior={'abandonedChannel'} + showUnresolvedClaims header={viewingSuggestedSubs ? __('Discover New Channels') : __('Channels You Follow')} headerAltControls={ <Button diff --git a/ui/redux/actions/app.js b/ui/redux/actions/app.js index 9036000ef..7c7ff49a0 100644 --- a/ui/redux/actions/app.js +++ b/ui/redux/actions/app.js @@ -262,7 +262,7 @@ export function doCheckDaemonVersion() { Lbry.version().then(({ lbrynet_version: lbrynetVersion }) => { // Avoid the incompatible daemon modal if running in dev mode // Lets you run a different daemon than the one specified in package.json - if (config.lbrynetDaemonVersion === lbrynetVersion) { + if (config.lbrynetDaemonVersion === lbrynetVersion || process.env.NODE_ENV !== 'production') { return dispatch({ type: ACTIONS.DAEMON_VERSION_MATCH, }); @@ -271,8 +271,9 @@ export function doCheckDaemonVersion() { dispatch({ type: ACTIONS.DAEMON_VERSION_MISMATCH, }); - - return dispatch(doOpenModal(MODALS.INCOMPATIBLE_DAEMON)); + if (process.env.NODE_ENV === 'production') { + return dispatch(doOpenModal(MODALS.INCOMPATIBLE_DAEMON)); + } }); // @endif // @if TARGET='web' diff --git a/ui/scss/component/_claim-list.scss b/ui/scss/component/_claim-list.scss index 8e3df7f33..beabfe8c3 100644 --- a/ui/scss/component/_claim-list.scss +++ b/ui/scss/component/_claim-list.scss @@ -69,6 +69,10 @@ background-color: var(--color-card-background-highlighted); } +.claim-preview__wrapper--notice { + background-color: var(--color-notice); +} + .claim-preview__wrapper--inline { padding: 0; } diff --git a/ui/scss/themes/dark.scss b/ui/scss/themes/dark.scss index e6a38127c..fb65af542 100644 --- a/ui/scss/themes/dark.scss +++ b/ui/scss/themes/dark.scss @@ -38,6 +38,7 @@ --color-modal-background: var(--color-header-background); --color-comment-menu: #6a6a6a; --color-comment-menu-hovering: #e0e0e0; + --color-notice: #58563b; // Text --color-text: #eeeeee; diff --git a/ui/scss/themes/light.scss b/ui/scss/themes/light.scss index 9b78f2cd9..527921def 100644 --- a/ui/scss/themes/light.scss +++ b/ui/scss/themes/light.scss @@ -14,6 +14,7 @@ --color-error: #fcafca; --color-comment-menu: #e0e0e0; --color-comment-menu-hovering: #6a6a6a; + --color-notice: #fef3ca; // Text --color-text-selection-bg: var(--color-secondary-alt);