Undo the channel-clamping and let user figure out from Toast

Several issues with the clamping behavior:
- Problems trying to sync with the activeChannel setting.
- Corner-cases like unable to un-react because the comment and react channel was different; global mods not be able to change channels to do certain actions.

Just let the user know what are the channel(s) that they used to comment previously in the Toast.
This commit is contained in:
infinite-persistence 2022-05-06 15:12:20 +08:00 committed by Thomas Zarebczan
parent fd12a98b1b
commit 26f9cf3a4f
5 changed files with 16 additions and 29 deletions

View file

@ -11,11 +11,10 @@ import SelectChannel from 'component/selectChannel';
type SelectorProps = { type SelectorProps = {
isReply: boolean, isReply: boolean,
isLivestream: boolean, isLivestream: boolean,
channelIds?: Array<string>, // Specific channel IDs to show. Must be a subset of own channels.
}; };
export const FormChannelSelector = (selectorProps: SelectorProps) => { export const FormChannelSelector = (selectorProps: SelectorProps) => {
const { isReply, isLivestream, channelIds } = selectorProps; const { isReply, isLivestream } = selectorProps;
return ( return (
<div className="comment-create__label-wrapper"> <div className="comment-create__label-wrapper">
@ -23,7 +22,7 @@ export const FormChannelSelector = (selectorProps: SelectorProps) => {
{(isReply ? __('Replying as') : isLivestream ? __('Chat as') : __('Comment as')) + ' '} {(isReply ? __('Replying as') : isLivestream ? __('Chat as') : __('Comment as')) + ' '}
</span> </span>
<SelectChannel tiny channelIds={channelIds} /> <SelectChannel tiny />
</div> </div>
); );
}; };

View file

@ -12,7 +12,7 @@ import { doCommentCreate, doFetchCreatorSettings, doCommentById } from 'redux/ac
import { doSendTip, doSendCashTip } from 'redux/actions/wallet'; import { doSendTip, doSendCashTip } from 'redux/actions/wallet';
import { doToast } from 'redux/actions/notifications'; import { doToast } from 'redux/actions/notifications';
import { selectActiveChannelClaim } from 'redux/selectors/app'; import { selectActiveChannelClaim } from 'redux/selectors/app';
import { selectMyCommentedChannelIdsForId, selectSettingsByChannelId } from 'redux/selectors/comments'; import { selectSettingsByChannelId } from 'redux/selectors/comments';
import { getChannelIdFromClaim } from 'util/claim'; import { getChannelIdFromClaim } from 'util/claim';
import { doOpenModal } from 'redux/actions/app'; import { doOpenModal } from 'redux/actions/app';
import { selectClientSetting } from 'redux/selectors/settings'; import { selectClientSetting } from 'redux/selectors/settings';
@ -45,7 +45,6 @@ const select = (state, props) => {
settingsByChannelId: selectSettingsByChannelId(state), settingsByChannelId: selectSettingsByChannelId(state),
supportDisabled: makeSelectTagInClaimOrChannelForUri(uri, DISABLE_SUPPORT_TAG)(state), supportDisabled: makeSelectTagInClaimOrChannelForUri(uri, DISABLE_SUPPORT_TAG)(state),
preferredCurrency: selectClientSetting(state, SETTINGS.PREFERRED_CURRENCY), preferredCurrency: selectClientSetting(state, SETTINGS.PREFERRED_CURRENCY),
myCommentedChannelIds: selectMyCommentedChannelIdsForId(state, claim?.claim_id),
}; };
}; };

View file

@ -75,7 +75,6 @@ type Props = {
doSendTip: (params: {}, isSupport: boolean, successCb: (any) => void, errorCb: (any) => void, boolean) => void, doSendTip: (params: {}, isSupport: boolean, successCb: (any) => void, errorCb: (any) => void, boolean) => void,
doOpenModal: (id: string, any) => void, doOpenModal: (id: string, any) => void,
preferredCurrency: string, preferredCurrency: string,
myCommentedChannelIds?: Array<string>,
}; };
export function CommentCreate(props: Props) { export function CommentCreate(props: Props) {
@ -112,7 +111,6 @@ export function CommentCreate(props: Props) {
setQuickReply, setQuickReply,
doOpenModal, doOpenModal,
preferredCurrency, preferredCurrency,
myCommentedChannelIds,
} = props; } = props;
const isMobile = useIsMobile(); const isMobile = useIsMobile();
@ -591,17 +589,7 @@ export function CommentCreate(props: Props) {
className={isReply ? 'create__reply' : 'create__comment'} className={isReply ? 'create__reply' : 'create__comment'}
disabled={isFetchingChannels || disableInput} disabled={isFetchingChannels || disableInput}
isLivestream={isLivestream} isLivestream={isLivestream}
label={ label={<FormChannelSelector isReply={Boolean(isReply)} isLivestream={Boolean(isLivestream)} />}
<FormChannelSelector
isReply={Boolean(isReply)}
isLivestream={Boolean(isLivestream)}
channelIds={
!claimIsMine && myCommentedChannelIds && myCommentedChannelIds.length > 0
? myCommentedChannelIds
: undefined
}
/>
}
noticeLabel={ noticeLabel={
isMobile && ( isMobile && (
<HelpText deletedComment={deletedComment} minAmount={minAmount} minSuper={minSuper} minTip={minTip} /> <HelpText deletedComment={deletedComment} minAmount={minAmount} minSuper={minSuper} minTip={minTip} />

View file

@ -6,7 +6,6 @@ type Props = {
tiny?: boolean, tiny?: boolean,
label?: string, label?: string,
injected?: ?Array<string>, injected?: ?Array<string>,
channelIds?: Array<string>, // Specific channel IDs to show. Must be a subset of own channels.
// --- Redux --- // --- Redux ---
myChannelClaims: ?Array<ChannelClaim>, myChannelClaims: ?Array<ChannelClaim>,
fetchingChannels: boolean, fetchingChannels: boolean,
@ -17,7 +16,6 @@ type Props = {
function SelectChannel(props: Props) { function SelectChannel(props: Props) {
const { const {
fetchingChannels, fetchingChannels,
channelIds,
myChannelClaims = [], myChannelClaims = [],
label, label,
injected = [], injected = [],
@ -31,11 +29,6 @@ function SelectChannel(props: Props) {
setActiveChannel(channelClaimId); setActiveChannel(channelClaimId);
} }
let mine = myChannelClaims;
if (myChannelClaims && channelIds) {
mine = myChannelClaims.filter((x) => channelIds.includes(x.claim_id));
}
return ( return (
<> <>
<FormField <FormField
@ -51,8 +44,8 @@ function SelectChannel(props: Props) {
<option>{__('Loading your channels...')}</option> <option>{__('Loading your channels...')}</option>
) : ( ) : (
<> <>
{mine && {myChannelClaims &&
mine.map(({ name, claim_id: claimId }) => ( myChannelClaims.map(({ name, claim_id: claimId }) => (
<option key={claimId} value={claimId}> <option key={claimId} value={claimId}>
{name} {name}
</option> </option>

View file

@ -7,7 +7,7 @@ import Lbry from 'lbry';
import { resolveApiMessage } from 'util/api-message'; import { resolveApiMessage } from 'util/api-message';
import { parseURI, buildURI, isURIEqual } from 'util/lbryURI'; import { parseURI, buildURI, isURIEqual } from 'util/lbryURI';
import { devToast, dispatchToast, doFailedSignatureToast } from 'util/toast-wrappers'; import { devToast, dispatchToast, doFailedSignatureToast } from 'util/toast-wrappers';
import { selectClaimForUri, selectClaimsByUri, selectMyChannelClaims } from 'redux/selectors/claims'; import { selectClaimForUri, selectClaimsById, selectClaimsByUri, selectMyChannelClaims } from 'redux/selectors/claims';
import { doResolveUris, doClaimSearch, doResolveClaimIds } from 'redux/actions/claims'; import { doResolveUris, doClaimSearch, doResolveClaimIds } from 'redux/actions/claims';
import { doToast, doSeeNotifications } from 'redux/actions/notifications'; import { doToast, doSeeNotifications } from 'redux/actions/notifications';
import { import {
@ -646,7 +646,15 @@ export function doCommentCreate(uri: string, livestream: boolean, params: Commen
if (myCommentedChannelIds && myCommentedChannelIds.length) { if (myCommentedChannelIds && myCommentedChannelIds.length) {
if (!myCommentedChannelIds.includes(activeChannelClaim.claim_id)) { if (!myCommentedChannelIds.includes(activeChannelClaim.claim_id)) {
dispatchToast(dispatch, __('Commenting from multiple channels is not allowed.')); const claimById = selectClaimsById(state);
const commentedChannelNames = myCommentedChannelIds.map((id) => claimById[id]?.name);
dispatchToast(
dispatch,
__('Commenting from multiple channels is not allowed.'),
commentedChannelNames.join(' • '),
'long'
);
return; return;
} }
} }