Fix default channel changing with active channel on header

This commit is contained in:
Rafael 2022-05-05 09:23:31 -03:00 committed by Thomas Zarebczan
parent 9325a3e03e
commit f191cf0b88
6 changed files with 29 additions and 19 deletions

View file

@ -1,23 +1,23 @@
import { connect } from 'react-redux';
import * as SETTINGS from 'constants/settings';
import { selectMyChannelClaims, selectClaimsByUri, selectOdyseeMembershipForUri } from 'redux/selectors/claims';
import { selectActiveChannelClaim, selectIncognito } from 'redux/selectors/app';
import { doSetActiveChannel, doSetIncognito } from 'redux/actions/app';
import { doFetchUserMemberships } from 'redux/actions/user';
import { doSetClientSetting } from 'redux/actions/settings';
import { selectClientSetting } from 'redux/selectors/settings';
import { selectDefaultChannelClaim } from 'redux/selectors/settings';
import ChannelSelector from './view';
const select = (state, props) => {
const { storeSelection } = props;
const activeChannelClaim = selectActiveChannelClaim(state);
const defaultChannelClaim = selectDefaultChannelClaim(state);
return {
channels: selectMyChannelClaims(state),
activeChannelClaim,
activeChannelClaim: storeSelection ? defaultChannelClaim : activeChannelClaim,
incognito: selectIncognito(state),
odyseeMembershipByUri: (uri) => selectOdyseeMembershipForUri(state, uri),
claimsByUri: selectClaimsByUri(state),
hasDefaultChannel: Boolean(selectClientSetting(state, SETTINGS.ACTIVE_CHANNEL_CLAIM)),
};
};

View file

@ -1,13 +1,13 @@
import { connect } from 'react-redux';
import { doSignOut } from 'redux/actions/app';
import { selectActiveChannelClaim } from 'redux/selectors/app';
import { selectDefaultChannelClaim } from 'redux/selectors/settings';
import { selectMyChannelClaimIds } from 'redux/selectors/claims';
import { selectUserEmail, selectUserVerifiedEmail } from 'redux/selectors/user';
import HeaderProfileMenuButton from './view';
const select = (state) => ({
myChannelClaimIds: selectMyChannelClaimIds(state),
activeChannelClaim: selectActiveChannelClaim(state),
defaultChannelClaim: selectDefaultChannelClaim(state),
authenticated: selectUserVerifiedEmail(state),
email: selectUserEmail(state),
});

View file

@ -18,21 +18,21 @@ import Button from 'component/button';
type HeaderMenuButtonProps = {
myChannelClaimIds: ?Array<string>,
activeChannelClaim: ?ChannelClaim,
defaultChannelClaim: ?ChannelClaim,
authenticated: boolean,
email: ?string,
signOut: () => void,
};
export default function HeaderProfileMenuButton(props: HeaderMenuButtonProps) {
const { myChannelClaimIds, activeChannelClaim, authenticated, email, signOut } = props;
const { myChannelClaimIds, defaultChannelClaim, authenticated, email, signOut } = props;
const [anchorEl, setAnchorEl] = React.useState(null);
const open = Boolean(anchorEl);
const handleClick = (event) => setAnchorEl(!anchorEl ? event.currentTarget : null);
const handleClose = () => setAnchorEl(null);
const activeChannelUrl = activeChannelClaim && activeChannelClaim.permanent_url;
const activeChannelUrl = defaultChannelClaim && defaultChannelClaim.permanent_url;
// activeChannel will be: undefined = fetching, null = nothing, or { channel claim }
const noActiveChannel = activeChannelUrl === null;
const pendingChannelFetch = !noActiveChannel && myChannelClaimIds === undefined;

View file

@ -1,17 +1,17 @@
import { connect } from 'react-redux';
import SelectChannel from './view';
import { selectMyChannelClaims, selectFetchingMyChannels } from 'redux/selectors/claims';
import { selectActiveChannelClaim } from 'redux/selectors/app';
import { selectActiveChannelClaimId } from 'redux/selectors/app';
import { doSetActiveChannel } from 'redux/actions/app';
const select = (state) => ({
myChannelClaims: selectMyChannelClaims(state),
fetchingChannels: selectFetchingMyChannels(state),
activeChannelClaimId: selectActiveChannelClaim(state)?.claim_id,
activeChannelClaimId: selectActiveChannelClaimId(state),
});
const perform = (dispatch) => ({
setActiveChannel: (claimId, override) => dispatch(doSetActiveChannel(claimId, override)),
});
const perform = {
setActiveChannel: doSetActiveChannel,
};
export default connect(select, perform)(SelectChannel);

View file

@ -1,8 +1,7 @@
import { createSelector } from 'reselect';
import * as SETTINGS from 'constants/settings';
import { selectClaimWithId, selectMyChannelClaims, selectStakedLevelForChannelUri } from 'redux/selectors/claims';
import { selectUserEmail } from 'redux/selectors/user';
import { selectClientSetting } from 'redux/selectors/settings';
import { selectDefaultChannelClaim } from 'redux/selectors/settings';
export const selectState = (state) => state.app || {};
@ -70,9 +69,9 @@ export const selectActiveChannelId = (state) => selectState(state).activeChannel
export const selectActiveChannelClaim = createSelector(
(state) => selectClaimWithId(state, selectActiveChannelId(state)), // i.e. 'byId[activeChannelId]' specifically, instead of just 'byId'.
(state) => selectUserEmail(state),
(state) => selectClaimWithId(state, selectClientSetting(state, SETTINGS.ACTIVE_CHANNEL_CLAIM)),
selectDefaultChannelClaim,
selectMyChannelClaims,
(activeChannelClaim, userEmail, storedChannel, myChannelClaims) => {
(activeChannelClaim, userEmail, defaultChannel, myChannelClaims) => {
// Null: has none. Undefined: not resolved, default state, could have or not
if (!userEmail || myChannelClaims === null) {
return null;
@ -82,7 +81,7 @@ export const selectActiveChannelClaim = createSelector(
if (activeChannelClaim) return activeChannelClaim;
if (storedChannel) return storedChannel;
if (defaultChannel) return defaultChannel;
const myChannelClaimsByEffectiveAmount = myChannelClaims.slice().sort((a, b) => {
const effectiveAmountA = (a.meta && Number(a.meta.effective_amount)) || 0;
@ -100,6 +99,11 @@ export const selectActiveChannelClaim = createSelector(
}
);
export const selectActiveChannelClaimId = createSelector(
selectActiveChannelClaim,
(activeChannelClaim) => activeChannelClaim?.claim_id
);
export const selectActiveChannelStakedLevel = (state) => {
const activeChannelClaim = selectActiveChannelClaim(state);
if (!activeChannelClaim) {

View file

@ -5,6 +5,7 @@ import SUPPORTED_BROWSER_LANGUAGES from 'constants/supported_browser_languages';
import { createSelector } from 'reselect';
import { ENABLE_MATURE } from 'config';
import { getDefaultHomepageKey, getDefaultLanguage } from 'util/default-languages';
import { selectClaimWithId } from 'redux/selectors/claims';
const selectState = (state) => state.settings || {};
@ -81,3 +82,8 @@ export const selectWildWestDisabled = (state) => {
};
export const selectosNotificationsEnabled = (state) => selectClientSetting(state, SETTINGS.OS_NOTIFICATIONS_ENABLED);
export const selectDefaultChannelClaim = createSelector(
(state) => selectClaimWithId(state, selectClientSetting(state, SETTINGS.ACTIVE_CHANNEL_CLAIM)),
(defaultChannelClaim) => defaultChannelClaim
);