diff --git a/ui/component/channelSelector/view.jsx b/ui/component/channelSelector/view.jsx index de3569c1b..ce0f8f7f9 100644 --- a/ui/component/channelSelector/view.jsx +++ b/ui/component/channelSelector/view.jsx @@ -27,7 +27,6 @@ type Props = { storeSelection?: boolean, doSetClientSetting: (key: string, value: string, pushPrefs: boolean) => void, isHeaderMenu: boolean, - hasDefaultChannel: boolean, }; export default function ChannelSelector(props: Props) { @@ -43,13 +42,10 @@ export default function ChannelSelector(props: Props) { storeSelection, doSetClientSetting, isHeaderMenu, - hasDefaultChannel, } = props; const hideAnon = Boolean(props.hideAnon || storeSelection); - const defaultChannelRef = React.useRef(hasDefaultChannel); - const { push, location: { pathname }, @@ -66,20 +62,6 @@ export default function ChannelSelector(props: Props) { } } - React.useEffect(() => { - defaultChannelRef.current = hasDefaultChannel; - }, [hasDefaultChannel]); - - React.useEffect(() => { - return () => { - // has a default channel selected, clear the current active channel - if (defaultChannelRef.current) { - doSetActiveChannel(null, true); - } - }; - // eslint-disable-next-line react-hooks/exhaustive-deps - }, []); - return (
diff --git a/ui/component/router/index.js b/ui/component/router/index.js index 13d57e7e1..12f1a37cf 100644 --- a/ui/component/router/index.js +++ b/ui/component/router/index.js @@ -6,7 +6,7 @@ import { selectClientSetting, selectHomepageData, selectWildWestDisabled } from import Router from './view'; import { normalizeURI } from 'util/lbryURI'; import { selectTitleForUri } from 'redux/selectors/claims'; -import { doSetHasNavigated } from 'redux/actions/app'; +import { doSetHasNavigated, doSetActiveChannel } from 'redux/actions/app'; import { doUserSetReferrer } from 'redux/actions/user'; import { selectHasUnclaimedRefereeReward } from 'redux/selectors/rewards'; import { selectUnseenNotificationCount } from 'redux/selectors/notifications'; @@ -39,12 +39,14 @@ const select = (state) => { wildWestDisabled: selectWildWestDisabled(state), unseenCount: selectUnseenNotificationCount(state), hideTitleNotificationCount: selectClientSetting(state, SETTINGS.HIDE_TITLE_NOTIFICATION_COUNT), + hasDefaultChannel: Boolean(selectClientSetting(state, SETTINGS.ACTIVE_CHANNEL_CLAIM)), }; }; -const perform = (dispatch) => ({ - setHasNavigated: () => dispatch(doSetHasNavigated()), - setReferrer: (referrer) => dispatch(doUserSetReferrer(referrer)), -}); +const perform = { + setHasNavigated: doSetHasNavigated, + setReferrer: doUserSetReferrer, + doSetActiveChannel, +}; export default connect(select, perform)(Router); diff --git a/ui/component/router/view.jsx b/ui/component/router/view.jsx index 83b2e34ae..28b64fbe4 100644 --- a/ui/component/router/view.jsx +++ b/ui/component/router/view.jsx @@ -141,6 +141,8 @@ type Props = { wildWestDisabled: boolean, unseenCount: number, hideTitleNotificationCount: boolean, + hasDefaultChannel: boolean, + doSetActiveChannel: (claimId: ?string, override?: boolean) => void, }; type PrivateRouteProps = Props & { @@ -182,8 +184,12 @@ function AppRouter(props: Props) { wildWestDisabled, unseenCount, hideTitleNotificationCount, + hasDefaultChannel, + doSetActiveChannel, } = props; + const defaultChannelRef = React.useRef(hasDefaultChannel); + const { entries, listen, action: historyAction } = history; const entryIndex = history.index; const urlParams = new URLSearchParams(search); @@ -275,6 +281,20 @@ function AppRouter(props: Props) { } }, [currentScroll, pathname, search, hash, resetScroll, hasLinkedCommentInUrl, historyAction]); + React.useEffect(() => { + defaultChannelRef.current = hasDefaultChannel; + }, [hasDefaultChannel]); + + React.useEffect(() => { + return () => { + // has a default channel selected, clear the current active channel + if (defaultChannelRef.current) { + doSetActiveChannel(null, true); + } + }; + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [pathname]); + // react-router doesn't decode pathanmes before doing the route matching check // We have to redirect here because if we redirect on the server, it might get encoded again // in the browser causing a redirect loop diff --git a/ui/component/selectChannel/index.js b/ui/component/selectChannel/index.js index 5c09726c6..280411ef9 100644 --- a/ui/component/selectChannel/index.js +++ b/ui/component/selectChannel/index.js @@ -1,16 +1,13 @@ import { connect } from 'react-redux'; -import * as SETTINGS from 'constants/settings'; import SelectChannel from './view'; import { selectMyChannelClaims, selectFetchingMyChannels } from 'redux/selectors/claims'; import { selectActiveChannelClaim } from 'redux/selectors/app'; import { doSetActiveChannel } from 'redux/actions/app'; -import { selectClientSetting } from 'redux/selectors/settings'; const select = (state) => ({ myChannelClaims: selectMyChannelClaims(state), fetchingChannels: selectFetchingMyChannels(state), activeChannelClaimId: selectActiveChannelClaim(state)?.claim_id, - hasDefaultChannel: Boolean(selectClientSetting(state, SETTINGS.ACTIVE_CHANNEL_CLAIM)), }); const perform = (dispatch) => ({ diff --git a/ui/component/selectChannel/view.jsx b/ui/component/selectChannel/view.jsx index 5fc8b7ed0..db1b20c4b 100644 --- a/ui/component/selectChannel/view.jsx +++ b/ui/component/selectChannel/view.jsx @@ -11,7 +11,6 @@ type Props = { myChannelClaims: ?Array, fetchingChannels: boolean, activeChannelClaimId: ?string, - hasDefaultChannel: boolean, setActiveChannel: (claimId: ?string, override?: boolean) => void, }; @@ -24,12 +23,9 @@ function SelectChannel(props: Props) { injected = [], tiny, activeChannelClaimId, - hasDefaultChannel, setActiveChannel, } = props; - const defaultChannelRef = React.useRef(hasDefaultChannel); - function handleChannelChange(event: SyntheticInputEvent<*>) { const channelClaimId = event.target.value; setActiveChannel(channelClaimId); @@ -40,20 +36,6 @@ function SelectChannel(props: Props) { mine = myChannelClaims.filter((x) => channelIds.includes(x.claim_id)); } - React.useEffect(() => { - defaultChannelRef.current = hasDefaultChannel; - }, [hasDefaultChannel]); - - React.useEffect(() => { - return () => { - // has a default channel selected, clear the current active channel - if (defaultChannelRef.current) { - setActiveChannel(null, true); - } - }; - // eslint-disable-next-line react-hooks/exhaustive-deps - }, []); - return ( <>