New moderation tools: block & mute #5572
63 changed files with 1015 additions and 502 deletions
4
flow-typed/Comment.js
vendored
4
flow-typed/Comment.js
vendored
|
@ -27,6 +27,10 @@ declare type CommentsState = {
|
|||
myReactsByCommentId: any,
|
||||
othersReactsByCommentId: any,
|
||||
pendingCommentReactions: Array<string>,
|
||||
moderationBlockList: ?Array<string>,
|
||||
fetchingModerationBlockList: boolean,
|
||||
blockingByUri: {},
|
||||
unBlockingByUri: {},
|
||||
};
|
||||
|
||||
declare type CommentReactParams = {
|
||||
|
|
|
@ -53,7 +53,7 @@
|
|||
"electron-updater": "^4.2.4",
|
||||
"express": "^4.17.1",
|
||||
"if-env": "^1.0.4",
|
||||
"remove-markdown": "^0.3.0",
|
||||
"remove-markdown": "^0.3.0",
|
||||
"tempy": "^0.6.0",
|
||||
"videojs-logo": "^2.1.4"
|
||||
},
|
||||
|
@ -184,7 +184,7 @@
|
|||
"redux-thunk": "^2.2.0",
|
||||
"remark": "^9.0.0",
|
||||
"remark-attr": "^0.8.3",
|
||||
"remark-breaks": "^1.0.5",
|
||||
"remark-breaks": "^1.0.5",
|
||||
"remark-emoji": "^2.0.1",
|
||||
"remark-frontmatter": "^2.0.0",
|
||||
"remark-react": "^8.0.0",
|
||||
|
|
|
@ -6,6 +6,8 @@ const Comments = {
|
|||
enabled: Boolean(COMMENT_SERVER_API),
|
||||
|
||||
moderation_block: (params: ModerationBlockParams) => fetchCommentsApi('moderation.Block', params),
|
||||
moderation_unblock: (params: ModerationBlockParams) => fetchCommentsApi('moderation.UnBlock', params),
|
||||
moderation_block_list: (params: ModerationBlockParams) => fetchCommentsApi('moderation.BlockedList', params),
|
||||
comment_list: (params: CommentListParams) => fetchCommentsApi('comment.List', params),
|
||||
comment_abandon: (params: CommentAbandonParams) => fetchCommentsApi('comment.Abandon', params),
|
||||
};
|
||||
|
@ -30,8 +32,8 @@ function fetchCommentsApi(method: string, params: {}) {
|
|||
};
|
||||
|
||||
return fetch(url, options)
|
||||
.then(res => res.json())
|
||||
.then(res => res.result);
|
||||
.then((res) => res.json())
|
||||
.then((res) => res.result);
|
||||
}
|
||||
|
||||
export default Comments;
|
||||
|
|
|
@ -1,14 +1,6 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { selectBlockedChannels } from 'redux/selectors/blocked';
|
||||
import { doChannelUnsubscribe } from 'redux/actions/subscriptions';
|
||||
import { doOpenModal } from 'redux/actions/app';
|
||||
import AbandonedChannelPreview from './view';
|
||||
|
||||
const select = (state, props) => ({
|
||||
blockedChannelUris: selectBlockedChannels(state),
|
||||
});
|
||||
const select = (state, props) => ({});
|
||||
|
||||
export default connect(select, {
|
||||
doChannelUnsubscribe,
|
||||
doOpenModal,
|
||||
})(AbandonedChannelPreview);
|
||||
export default connect(select)(AbandonedChannelPreview);
|
||||
|
|
|
@ -2,28 +2,18 @@
|
|||
import React from 'react';
|
||||
import classnames from 'classnames';
|
||||
import ChannelThumbnail from 'component/channelThumbnail';
|
||||
import Button from 'component/button';
|
||||
import { parseURI } from 'lbry-redux';
|
||||
import * as ICONS from '../../constants/icons';
|
||||
import * as MODALS from 'constants/modal_types';
|
||||
|
||||
type SubscriptionArgs = {
|
||||
channelName: string,
|
||||
uri: string,
|
||||
};
|
||||
import ChannelBlockButton from 'component/channelBlockButton';
|
||||
import ChannelMuteButton from 'component/channelMuteButton';
|
||||
|
||||
type Props = {
|
||||
uri: string,
|
||||
doChannelUnsubscribe: SubscriptionArgs => void,
|
||||
type: string,
|
||||
blockedChannelUris: Array<string>,
|
||||
doOpenModal: (string, {}) => void,
|
||||
};
|
||||
|
||||
function AbandonedChannelPreview(props: Props) {
|
||||
const { uri, doChannelUnsubscribe, type, blockedChannelUris, doOpenModal } = props;
|
||||
const { uri, type } = props;
|
||||
const { channelName } = parseURI(uri);
|
||||
const isBlockedChannel = blockedChannelUris.includes(uri);
|
||||
|
||||
return (
|
||||
<li className={classnames('claim-preview__wrapper', 'claim-preview__wrapper--notice')}>
|
||||
|
@ -37,31 +27,10 @@ function AbandonedChannelPreview(props: Props) {
|
|||
<div className="media__subtitle">{__(`This channel may have been unpublished.`)}</div>
|
||||
</div>
|
||||
<div className="claim-preview__actions">
|
||||
{isBlockedChannel && (
|
||||
<Button
|
||||
iconColor="red"
|
||||
icon={ICONS.UNBLOCK}
|
||||
button={'alt'}
|
||||
label={__('Unblock')}
|
||||
onClick={() => doOpenModal(MODALS.REMOVE_BLOCKED, { blockedUri: uri })}
|
||||
/>
|
||||
)}
|
||||
{/* SubscribeButton uses resolved permanentUri; modifying it didn't seem worth it. */}
|
||||
{!isBlockedChannel && (
|
||||
<Button
|
||||
iconColor="red"
|
||||
icon={ICONS.UNSUBSCRIBE}
|
||||
button={'alt'}
|
||||
label={__('Unfollow')}
|
||||
onClick={e => {
|
||||
e.stopPropagation();
|
||||
doChannelUnsubscribe({
|
||||
channelName: `@${channelName}`,
|
||||
uri,
|
||||
});
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
<div className="section__actions">
|
||||
<ChannelBlockButton uri={uri} />
|
||||
<ChannelMuteButton uri={uri} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -27,9 +27,10 @@ import {
|
|||
doSetActiveChannel,
|
||||
doSetIncognito,
|
||||
} from 'redux/actions/app';
|
||||
import { doFetchModBlockedList } from 'redux/actions/comments';
|
||||
import App from './view';
|
||||
|
||||
const select = state => ({
|
||||
const select = (state) => ({
|
||||
user: selectUser(state),
|
||||
accessToken: selectAccessToken(state),
|
||||
theme: selectThemePath(state),
|
||||
|
@ -48,18 +49,19 @@ const select = state => ({
|
|||
myChannelUrls: selectMyChannelUrls(state),
|
||||
});
|
||||
|
||||
const perform = dispatch => ({
|
||||
const perform = (dispatch) => ({
|
||||
fetchAccessToken: () => dispatch(doFetchAccessToken()),
|
||||
fetchChannelListMine: () => dispatch(doFetchChannelListMine()),
|
||||
setLanguage: language => dispatch(doSetLanguage(language)),
|
||||
setLanguage: (language) => dispatch(doSetLanguage(language)),
|
||||
signIn: () => dispatch(doSignIn()),
|
||||
requestDownloadUpgrade: () => dispatch(doDownloadUpgradeRequested()),
|
||||
updatePreferences: () => dispatch(doGetAndPopulatePreferences()),
|
||||
getWalletSyncPref: () => dispatch(doGetWalletSyncPreference()),
|
||||
syncLoop: noInterval => dispatch(doSyncLoop(noInterval)),
|
||||
syncLoop: (noInterval) => dispatch(doSyncLoop(noInterval)),
|
||||
setReferrer: (referrer, doClaim) => dispatch(doUserSetReferrer(referrer, doClaim)),
|
||||
setActiveChannelIfNotSet: () => dispatch(doSetActiveChannel()),
|
||||
setIncognito: () => dispatch(doSetIncognito()),
|
||||
fetchModBlockedList: () => dispatch(doFetchModBlockedList()),
|
||||
});
|
||||
|
||||
export default hot(connect(select, perform)(App));
|
||||
|
|
|
@ -56,14 +56,14 @@ type Props = {
|
|||
goForward: () => void,
|
||||
index: number,
|
||||
length: number,
|
||||
push: string => void,
|
||||
push: (string) => void,
|
||||
},
|
||||
fetchAccessToken: () => void,
|
||||
fetchChannelListMine: () => void,
|
||||
signIn: () => void,
|
||||
requestDownloadUpgrade: () => void,
|
||||
onSignedIn: () => void,
|
||||
setLanguage: string => void,
|
||||
setLanguage: (string) => void,
|
||||
isUpgradeAvailable: boolean,
|
||||
autoUpdateDownloaded: boolean,
|
||||
updatePreferences: () => Promise<any>,
|
||||
|
@ -83,7 +83,8 @@ type Props = {
|
|||
activeChannelClaim: ?ChannelClaim,
|
||||
myChannelUrls: ?Array<string>,
|
||||
setActiveChannelIfNotSet: () => void,
|
||||
setIncognito: boolean => void,
|
||||
setIncognito: (boolean) => void,
|
||||
fetchModBlockedList: () => void,
|
||||
};
|
||||
|
||||
function App(props: Props) {
|
||||
|
@ -114,6 +115,7 @@ function App(props: Props) {
|
|||
activeChannelClaim,
|
||||
setActiveChannelIfNotSet,
|
||||
setIncognito,
|
||||
fetchModBlockedList,
|
||||
} = props;
|
||||
|
||||
const appRef = useRef();
|
||||
|
@ -134,7 +136,7 @@ function App(props: Props) {
|
|||
const showUpgradeButton =
|
||||
(autoUpdateDownloaded || (process.platform === 'linux' && isUpgradeAvailable)) && !upgradeNagClosed;
|
||||
// referral claiming
|
||||
const referredRewardAvailable = rewards && rewards.some(reward => reward.reward_type === REWARDS.TYPE_REFEREE);
|
||||
const referredRewardAvailable = rewards && rewards.some((reward) => reward.reward_type === REWARDS.TYPE_REFEREE);
|
||||
const urlParams = new URLSearchParams(search);
|
||||
const rawReferrerParam = urlParams.get('r');
|
||||
const sanitizedReferrerParam = rawReferrerParam && rawReferrerParam.replace(':', '#');
|
||||
|
@ -166,7 +168,7 @@ function App(props: Props) {
|
|||
|
||||
useEffect(() => {
|
||||
if (!uploadCount) return;
|
||||
const handleBeforeUnload = event => {
|
||||
const handleBeforeUnload = (event) => {
|
||||
event.preventDefault();
|
||||
event.returnValue = 'magic'; // without setting this to something it doesn't work
|
||||
};
|
||||
|
@ -176,7 +178,7 @@ function App(props: Props) {
|
|||
|
||||
// allows user to navigate history using the forward and backward buttons on a mouse
|
||||
useEffect(() => {
|
||||
const handleForwardAndBackButtons = e => {
|
||||
const handleForwardAndBackButtons = (e) => {
|
||||
switch (e.button) {
|
||||
case MOUSE_BACK_BTN:
|
||||
history.index > 0 && history.goBack();
|
||||
|
@ -192,7 +194,7 @@ function App(props: Props) {
|
|||
|
||||
// allows user to pause miniplayer using the spacebar without the page scrolling down
|
||||
useEffect(() => {
|
||||
const handleKeyPress = e => {
|
||||
const handleKeyPress = (e) => {
|
||||
if (e.key === ' ' && e.target === document.body) {
|
||||
e.preventDefault();
|
||||
}
|
||||
|
@ -244,6 +246,10 @@ function App(props: Props) {
|
|||
} else if (hasNoChannels) {
|
||||
setIncognito(true);
|
||||
}
|
||||
|
||||
if (hasMyChannels) {
|
||||
fetchModBlockedList();
|
||||
}
|
||||
}, [hasMyChannels, hasNoChannels, hasActiveChannelClaim, setActiveChannelIfNotSet, setIncognito]);
|
||||
|
||||
useEffect(() => {
|
||||
|
@ -358,7 +364,7 @@ function App(props: Props) {
|
|||
[`${MAIN_WRAPPER_CLASS}--scrollbar`]: useCustomScrollbar,
|
||||
})}
|
||||
ref={appRef}
|
||||
onContextMenu={IS_WEB ? undefined : e => openContextMenu(e)}
|
||||
onContextMenu={IS_WEB ? undefined : (e) => openContextMenu(e)}
|
||||
>
|
||||
{IS_WEB && lbryTvApiStatus === STATUS_DOWN ? (
|
||||
<Yrbl
|
||||
|
|
|
@ -1,18 +0,0 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { makeSelectClaimIsMine, makeSelectShortUrlForUri, makeSelectPermanentUrlForUri } from 'lbry-redux';
|
||||
import { selectChannelIsBlocked } from 'redux/selectors/blocked';
|
||||
import { doToast } from 'redux/actions/notifications';
|
||||
import { doToggleBlockChannel } from 'redux/actions/blocked';
|
||||
import BlockButton from './view';
|
||||
|
||||
const select = (state, props) => ({
|
||||
channelIsBlocked: selectChannelIsBlocked(props.uri)(state),
|
||||
claimIsMine: makeSelectClaimIsMine(props.uri)(state),
|
||||
shortUrl: makeSelectShortUrlForUri(props.uri)(state),
|
||||
permanentUrl: makeSelectPermanentUrlForUri(props.uri)(state),
|
||||
});
|
||||
|
||||
export default connect(select, {
|
||||
toggleBlockChannel: doToggleBlockChannel,
|
||||
doToast,
|
||||
})(BlockButton);
|
|
@ -1,49 +0,0 @@
|
|||
// @flow
|
||||
import * as ICONS from 'constants/icons';
|
||||
import * as PAGES from 'constants/pages';
|
||||
import React, { useRef } from 'react';
|
||||
import Button from 'component/button';
|
||||
import useHover from 'effects/use-hover';
|
||||
|
||||
type Props = {
|
||||
permanentUrl: ?string,
|
||||
shortUrl: string,
|
||||
isSubscribed: boolean,
|
||||
toggleBlockChannel: (uri: string) => void,
|
||||
channelIsBlocked: boolean,
|
||||
claimIsMine: boolean,
|
||||
doToast: ({ message: string, linkText: string, linkTarget: string }) => void,
|
||||
};
|
||||
|
||||
export default function BlockButton(props: Props) {
|
||||
const { permanentUrl, shortUrl, toggleBlockChannel, channelIsBlocked, claimIsMine, doToast } = props;
|
||||
|
||||
const blockRef = useRef();
|
||||
const isHovering = useHover(blockRef);
|
||||
const blockLabel = channelIsBlocked ? __('Blocked') : __('Block');
|
||||
const blockTitlePrefix = channelIsBlocked ? __('Unblock this channel') : __('Block this channel');
|
||||
const blockedOverride = channelIsBlocked && isHovering && __('Unblock');
|
||||
|
||||
return permanentUrl && (!claimIsMine || channelIsBlocked) ? (
|
||||
<Button
|
||||
ref={blockRef}
|
||||
icon={ICONS.BLOCK}
|
||||
button={'alt'}
|
||||
label={blockedOverride || blockLabel}
|
||||
title={blockTitlePrefix}
|
||||
requiresAuth={IS_WEB}
|
||||
onClick={e => {
|
||||
e.stopPropagation();
|
||||
if (!channelIsBlocked) {
|
||||
doToast({
|
||||
message: __('Blocked %channelUrl%', { channelUrl: shortUrl }),
|
||||
linkText: __('Manage'),
|
||||
linkTarget: `/${PAGES.BLOCKED}`,
|
||||
});
|
||||
}
|
||||
|
||||
toggleBlockChannel(permanentUrl);
|
||||
}}
|
||||
/>
|
||||
) : null;
|
||||
}
|
14
ui/component/channelBlockButton/index.js
Normal file
14
ui/component/channelBlockButton/index.js
Normal file
|
@ -0,0 +1,14 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { doCommentModUnBlock, doCommentModBlock } from 'redux/actions/comments';
|
||||
import { makeSelectChannelIsBlocked, makeSelectUriIsBlockingOrUnBlocking } from 'redux/selectors/comments';
|
||||
import ChannelBlockButton from './view';
|
||||
|
||||
const select = (state, props) => ({
|
||||
isBlocked: makeSelectChannelIsBlocked(props.uri)(state),
|
||||
isBlockingOrUnBlocking: makeSelectUriIsBlockingOrUnBlocking(props.uri)(state),
|
||||
});
|
||||
|
||||
export default connect(select, {
|
||||
doCommentModUnBlock,
|
||||
doCommentModBlock,
|
||||
})(ChannelBlockButton);
|
41
ui/component/channelBlockButton/view.jsx
Normal file
41
ui/component/channelBlockButton/view.jsx
Normal file
|
@ -0,0 +1,41 @@
|
|||
// @flow
|
||||
import React from 'react';
|
||||
import Button from 'component/button';
|
||||
|
||||
type Props = {
|
||||
uri: string,
|
||||
isBlocked: boolean,
|
||||
isBlockingOrUnBlocking: boolean,
|
||||
doCommentModUnBlock: (string) => void,
|
||||
doCommentModBlock: (string) => void,
|
||||
};
|
||||
|
||||
function ChannelBlockButton(props: Props) {
|
||||
const { uri, doCommentModUnBlock, doCommentModBlock, isBlocked, isBlockingOrUnBlocking } = props;
|
||||
|
||||
function handleClick() {
|
||||
if (isBlocked) {
|
||||
doCommentModUnBlock(uri);
|
||||
} else {
|
||||
doCommentModBlock(uri);
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<Button
|
||||
button={isBlocked ? 'alt' : 'secondary'}
|
||||
label={
|
||||
isBlocked
|
||||
? isBlockingOrUnBlocking
|
||||
? __('Unblocking...')
|
||||
: __('Unblock')
|
||||
: isBlockingOrUnBlocking
|
||||
? __('Blocking...')
|
||||
: __('Block')
|
||||
}
|
||||
onClick={handleClick}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
export default ChannelBlockButton;
|
|
@ -8,7 +8,7 @@ import {
|
|||
makeSelectClaimForUri,
|
||||
SETTINGS,
|
||||
} from 'lbry-redux';
|
||||
import { selectChannelIsBlocked } from 'redux/selectors/blocked';
|
||||
import { makeSelectChannelIsMuted } from 'redux/selectors/blocked';
|
||||
import { withRouter } from 'react-router';
|
||||
import { selectUserVerifiedEmail } from 'redux/selectors/user';
|
||||
import { makeSelectClientSetting } from 'redux/selectors/settings';
|
||||
|
@ -24,7 +24,7 @@ const select = (state, props) => {
|
|||
fetching: makeSelectFetchingChannelClaims(props.uri)(state),
|
||||
totalPages: makeSelectTotalPagesInChannelSearch(props.uri, PAGE_SIZE)(state),
|
||||
channelIsMine: makeSelectClaimIsMine(props.uri)(state),
|
||||
channelIsBlocked: selectChannelIsBlocked(props.uri)(state),
|
||||
channelIsBlocked: makeSelectChannelIsMuted(props.uri)(state),
|
||||
claim: props.uri && makeSelectClaimForUri(props.uri)(state),
|
||||
isAuthenticated: selectUserVerifiedEmail(state),
|
||||
showMature: makeSelectClientSetting(SETTINGS.SHOW_MATURE)(state),
|
||||
|
|
12
ui/component/channelMuteButton/index.js
Normal file
12
ui/component/channelMuteButton/index.js
Normal file
|
@ -0,0 +1,12 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { doToggleMuteChannel } from 'redux/actions/blocked';
|
||||
import { makeSelectChannelIsMuted } from 'redux/selectors/blocked';
|
||||
import ChannelMuteButton from './view';
|
||||
|
||||
const select = (state, props) => ({
|
||||
isMuted: makeSelectChannelIsMuted(props.uri)(state),
|
||||
});
|
||||
|
||||
export default connect(select, {
|
||||
doToggleMuteChannel,
|
||||
})(ChannelMuteButton);
|
24
ui/component/channelMuteButton/view.jsx
Normal file
24
ui/component/channelMuteButton/view.jsx
Normal file
|
@ -0,0 +1,24 @@
|
|||
// @flow
|
||||
import React from 'react';
|
||||
import Button from 'component/button';
|
||||
|
||||
type Props = {
|
||||
uri: string,
|
||||
isMuted: boolean,
|
||||
channelClaim: ?ChannelClaim,
|
||||
doToggleMuteChannel: (string) => void,
|
||||
};
|
||||
|
||||
function ChannelBlockButton(props: Props) {
|
||||
const { uri, doToggleMuteChannel, isMuted } = props;
|
||||
|
||||
return (
|
||||
<Button
|
||||
button={isMuted ? 'alt' : 'secondary'}
|
||||
label={isMuted ? __('Unmute') : __('Mute')}
|
||||
onClick={() => doToggleMuteChannel(uri)}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
export default ChannelBlockButton;
|
|
@ -11,6 +11,7 @@ import CreditAmount from 'component/common/credit-amount';
|
|||
type Props = {
|
||||
channelClaim: ChannelClaim,
|
||||
large?: boolean,
|
||||
inline?: boolean,
|
||||
};
|
||||
|
||||
function getChannelLevel(amount: number): number {
|
||||
|
@ -47,7 +48,7 @@ function getChannelIcon(level: number): string {
|
|||
}
|
||||
|
||||
function ChannelStakedIndicator(props: Props) {
|
||||
const { channelClaim, large = false } = props;
|
||||
const { channelClaim, large = false, inline = false } = props;
|
||||
|
||||
if (!channelClaim || !channelClaim.meta) {
|
||||
return null;
|
||||
|
@ -79,6 +80,7 @@ function ChannelStakedIndicator(props: Props) {
|
|||
<div
|
||||
className={classnames('channel-staked__wrapper', {
|
||||
'channel-staked__wrapper--large': large,
|
||||
'channel-staked__wrapper--inline': inline,
|
||||
})}
|
||||
>
|
||||
<LevelIcon icon={icon} large={large} isControlling={isControlling} />
|
||||
|
|
|
@ -32,12 +32,12 @@ type Props = {
|
|||
showUnresolvedClaims?: boolean,
|
||||
renderProperties: ?(Claim) => Node,
|
||||
includeSupportAction?: boolean,
|
||||
hideBlock: boolean,
|
||||
injectedItem: ?Node,
|
||||
timedOutMessage?: Node,
|
||||
tileLayout?: boolean,
|
||||
renderActions?: (Claim) => ?Node,
|
||||
searchInLanguage: boolean,
|
||||
hideMenu?: boolean,
|
||||
};
|
||||
|
||||
export default function ClaimList(props: Props) {
|
||||
|
@ -57,12 +57,12 @@ export default function ClaimList(props: Props) {
|
|||
showUnresolvedClaims,
|
||||
renderProperties,
|
||||
includeSupportAction,
|
||||
hideBlock,
|
||||
injectedItem,
|
||||
timedOutMessage,
|
||||
tileLayout = false,
|
||||
renderActions,
|
||||
searchInLanguage,
|
||||
hideMenu,
|
||||
} = props;
|
||||
|
||||
const [currentSort, setCurrentSort] = usePersistedState(persistedStorageKey, SORT_NEW);
|
||||
|
@ -149,12 +149,12 @@ export default function ClaimList(props: Props) {
|
|||
<ClaimPreview
|
||||
uri={uri}
|
||||
type={type}
|
||||
hideMenu={hideMenu}
|
||||
includeSupportAction={includeSupportAction}
|
||||
showUnresolvedClaim={showUnresolvedClaims}
|
||||
properties={renderProperties || (type !== 'small' ? undefined : false)}
|
||||
renderActions={renderActions}
|
||||
showUserBlocked={showHiddenByUser}
|
||||
hideBlock={hideBlock}
|
||||
customShouldHide={(claim: StreamClaim) => {
|
||||
// Hack to hide spee.ch thumbnail publishes
|
||||
// If it meets these requirements, it was probably uploaded here:
|
||||
|
|
|
@ -7,12 +7,12 @@ import {
|
|||
SETTINGS,
|
||||
} from 'lbry-redux';
|
||||
import { selectFollowedTags } from 'redux/selectors/tags';
|
||||
import { selectBlockedChannels } from 'redux/selectors/blocked';
|
||||
import { selectMutedChannels } from 'redux/selectors/blocked';
|
||||
import { doToggleTagFollowDesktop } from 'redux/actions/tags';
|
||||
import { makeSelectClientSetting, selectLanguage } from 'redux/selectors/settings';
|
||||
import ClaimListDiscover from './view';
|
||||
|
||||
const select = state => ({
|
||||
const select = (state) => ({
|
||||
followedTags: selectFollowedTags(state),
|
||||
claimSearchByQuery: selectClaimSearchByQuery(state),
|
||||
claimSearchByQueryLastPageReached: selectClaimSearchByQueryLastPageReached(state),
|
||||
|
@ -20,7 +20,7 @@ const select = state => ({
|
|||
showNsfw: makeSelectClientSetting(SETTINGS.SHOW_MATURE)(state),
|
||||
hideReposts: makeSelectClientSetting(SETTINGS.HIDE_REPOSTS)(state),
|
||||
languageSetting: selectLanguage(state),
|
||||
hiddenUris: selectBlockedChannels(state),
|
||||
hiddenUris: selectMutedChannels(state),
|
||||
searchInLanguage: makeSelectClientSetting(SETTINGS.SEARCH_IN_LANGUAGE)(state),
|
||||
});
|
||||
|
||||
|
|
|
@ -20,11 +20,11 @@ type Props = {
|
|||
doClaimSearch: ({}) => void,
|
||||
loading: boolean,
|
||||
personalView: boolean,
|
||||
doToggleTagFollowDesktop: string => void,
|
||||
doToggleTagFollowDesktop: (string) => void,
|
||||
meta?: Node,
|
||||
showNsfw: boolean,
|
||||
hideReposts: boolean,
|
||||
history: { action: string, push: string => void, replace: string => void },
|
||||
history: { action: string, push: (string) => void, replace: (string) => void },
|
||||
location: { search: string, pathname: string },
|
||||
claimSearchByQuery: {
|
||||
[string]: Array<string>,
|
||||
|
@ -43,13 +43,12 @@ type Props = {
|
|||
header?: Node,
|
||||
headerLabel?: string | Node,
|
||||
name?: string,
|
||||
hideBlock?: boolean,
|
||||
hideAdvancedFilter?: boolean,
|
||||
claimType?: Array<string>,
|
||||
defaultClaimType?: Array<string>,
|
||||
streamType?: string | Array<string>,
|
||||
defaultStreamType?: string | Array<string>,
|
||||
renderProperties?: Claim => Node,
|
||||
renderProperties?: (Claim) => Node,
|
||||
includeSupportAction?: boolean,
|
||||
repostedClaimId?: string,
|
||||
pageSize?: number,
|
||||
|
@ -89,7 +88,6 @@ function ClaimListDiscover(props: Props) {
|
|||
name,
|
||||
claimType,
|
||||
pageSize,
|
||||
hideBlock,
|
||||
defaultClaimType,
|
||||
streamType,
|
||||
defaultStreamType,
|
||||
|
@ -120,7 +118,7 @@ function ClaimListDiscover(props: Props) {
|
|||
const isLargeScreen = useIsLargeScreen();
|
||||
const [orderParamEntry, setOrderParamEntry] = usePersistedState(`entry-${location.pathname}`, CS.ORDER_BY_TRENDING);
|
||||
const [orderParamUser, setOrderParamUser] = usePersistedState(`orderUser-${location.pathname}`, CS.ORDER_BY_TRENDING);
|
||||
const followed = (followedTags && followedTags.map(t => t.name)) || [];
|
||||
const followed = (followedTags && followedTags.map((t) => t.name)) || [];
|
||||
const urlParams = new URLSearchParams(search);
|
||||
const tagsParam = // can be 'x,y,z' or 'x' or ['x','y'] or CS.CONSTANT
|
||||
(tags && getParamFromTags(tags)) ||
|
||||
|
@ -206,7 +204,7 @@ function ClaimListDiscover(props: Props) {
|
|||
no_totals: true,
|
||||
not_channel_ids:
|
||||
// If channelIdsParam were passed in, we don't need not_channel_ids
|
||||
!channelIdsParam && hiddenUris && hiddenUris.length ? hiddenUris.map(hiddenUri => hiddenUri.split('#')[1]) : [],
|
||||
!channelIdsParam && hiddenUris && hiddenUris.length ? hiddenUris.map((hiddenUri) => hiddenUri.split('#')[1]) : [],
|
||||
not_tags: !showNsfw ? MATURE_TAGS : [],
|
||||
order_by:
|
||||
orderParam === CS.ORDER_BY_TRENDING
|
||||
|
@ -247,12 +245,7 @@ function ClaimListDiscover(props: Props) {
|
|||
|
||||
if (claimType !== CS.CLAIM_CHANNEL) {
|
||||
if (orderParam === CS.ORDER_BY_TOP && freshnessParam !== CS.FRESH_ALL) {
|
||||
options.release_time = `>${Math.floor(
|
||||
moment()
|
||||
.subtract(1, freshnessParam)
|
||||
.startOf('hour')
|
||||
.unix()
|
||||
)}`;
|
||||
options.release_time = `>${Math.floor(moment().subtract(1, freshnessParam).startOf('hour').unix())}`;
|
||||
} else if (orderParam === CS.ORDER_BY_NEW || orderParam === CS.ORDER_BY_TRENDING) {
|
||||
// Warning - hack below
|
||||
// If users are following more than 10 channels or tags, limit results to stuff less than a year old
|
||||
|
@ -263,29 +256,15 @@ function ClaimListDiscover(props: Props) {
|
|||
(options.channel_ids && options.channel_ids.length > 20) ||
|
||||
(options.any_tags && options.any_tags.length > 20)
|
||||
) {
|
||||
options.release_time = `>${Math.floor(
|
||||
moment()
|
||||
.subtract(3, CS.FRESH_MONTH)
|
||||
.startOf('week')
|
||||
.unix()
|
||||
)}`;
|
||||
options.release_time = `>${Math.floor(moment().subtract(3, CS.FRESH_MONTH).startOf('week').unix())}`;
|
||||
} else if (
|
||||
(options.channel_ids && options.channel_ids.length > 10) ||
|
||||
(options.any_tags && options.any_tags.length > 10)
|
||||
) {
|
||||
options.release_time = `>${Math.floor(
|
||||
moment()
|
||||
.subtract(1, CS.FRESH_YEAR)
|
||||
.startOf('week')
|
||||
.unix()
|
||||
)}`;
|
||||
options.release_time = `>${Math.floor(moment().subtract(1, CS.FRESH_YEAR).startOf('week').unix())}`;
|
||||
} else {
|
||||
// Hack for at least the New page until https://github.com/lbryio/lbry-sdk/issues/2591 is fixed
|
||||
options.release_time = `<${Math.floor(
|
||||
moment()
|
||||
.startOf('minute')
|
||||
.unix()
|
||||
)}`;
|
||||
options.release_time = `<${Math.floor(moment().startOf('minute').unix())}`;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -333,14 +312,14 @@ function ClaimListDiscover(props: Props) {
|
|||
if (hideReposts && !options.reposted_claim_id && !forceShowReposts) {
|
||||
if (Array.isArray(options.claim_type)) {
|
||||
if (options.claim_type.length > 1) {
|
||||
options.claim_type = options.claim_type.filter(claimType => claimType !== 'repost');
|
||||
options.claim_type = options.claim_type.filter((claimType) => claimType !== 'repost');
|
||||
}
|
||||
} else {
|
||||
options.claim_type = ['stream', 'channel'];
|
||||
}
|
||||
}
|
||||
|
||||
const hasMatureTags = tagsParam && tagsParam.split(',').some(t => MATURE_TAGS.includes(t));
|
||||
const hasMatureTags = tagsParam && tagsParam.split(',').some((t) => MATURE_TAGS.includes(t));
|
||||
const claimSearchCacheQuery = createNormalizedClaimSearchKey(options);
|
||||
const claimSearchResult = claimSearchByQuery[claimSearchCacheQuery];
|
||||
const claimSearchResultLastPageReached = claimSearchByQueryLastPageReached[claimSearchCacheQuery];
|
||||
|
@ -499,7 +478,6 @@ function ClaimListDiscover(props: Props) {
|
|||
timedOutMessage={timedOutMessage}
|
||||
renderProperties={renderProperties}
|
||||
includeSupportAction={includeSupportAction}
|
||||
hideBlock={hideBlock}
|
||||
injectedItem={injectedItem}
|
||||
/>
|
||||
{loading && (
|
||||
|
@ -527,7 +505,6 @@ function ClaimListDiscover(props: Props) {
|
|||
timedOutMessage={timedOutMessage}
|
||||
renderProperties={renderProperties}
|
||||
includeSupportAction={includeSupportAction}
|
||||
hideBlock={hideBlock}
|
||||
injectedItem={injectedItem}
|
||||
/>
|
||||
{loading && new Array(dynamicPageSize).fill(1).map((x, i) => <ClaimPreview key={i} placeholder="loading" />)}
|
||||
|
|
30
ui/component/claimMenuList/claim-preview-loading.jsx
Normal file
30
ui/component/claimMenuList/claim-preview-loading.jsx
Normal file
|
@ -0,0 +1,30 @@
|
|||
// @flow
|
||||
import classnames from 'classnames';
|
||||
import React from 'react';
|
||||
|
||||
type Props = {
|
||||
isChannel: boolean,
|
||||
type: string,
|
||||
};
|
||||
|
||||
function ClaimPreviewLoading(props: Props) {
|
||||
const { isChannel, type } = props;
|
||||
return (
|
||||
<li
|
||||
className={classnames('claim-preview__wrapper', {
|
||||
'claim-preview__wrapper--channel': isChannel && type !== 'inline',
|
||||
'claim-preview__wrapper--inline': type === 'inline',
|
||||
})}
|
||||
>
|
||||
<div className={classnames('claim-preview', { 'claim-preview--large': type === 'large' })}>
|
||||
<div className="placeholder media__thumb" />
|
||||
<div className="placeholder__wrapper">
|
||||
<div className="placeholder claim-preview__title" />
|
||||
<div className="placeholder media__subtitle" />
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
);
|
||||
}
|
||||
|
||||
export default ClaimPreviewLoading;
|
32
ui/component/claimMenuList/claim-preview-no-content.jsx
Normal file
32
ui/component/claimMenuList/claim-preview-no-content.jsx
Normal file
|
@ -0,0 +1,32 @@
|
|||
// @flow
|
||||
import classnames from 'classnames';
|
||||
import React from 'react';
|
||||
import Empty from 'component/common/empty';
|
||||
|
||||
type Props = {
|
||||
isChannel: boolean,
|
||||
type: string,
|
||||
};
|
||||
|
||||
function ClaimPreviewNoContent(props: Props) {
|
||||
const { isChannel, type } = props;
|
||||
return (
|
||||
<li
|
||||
className={classnames('claim-preview__wrapper', {
|
||||
'claim-preview__wrapper--channel': isChannel && type !== 'inline',
|
||||
'claim-preview__wrapper--inline': type === 'inline',
|
||||
})}
|
||||
>
|
||||
<div
|
||||
className={classnames('claim-preview claim-preview--inactive', {
|
||||
'claim-preview--large': type === 'large',
|
||||
'claim-preview__empty': true,
|
||||
})}
|
||||
>
|
||||
<Empty text={__('Nothing found here. Like big tech ethics.')} />
|
||||
</div>
|
||||
</li>
|
||||
);
|
||||
}
|
||||
|
||||
export default ClaimPreviewNoContent;
|
33
ui/component/claimMenuList/claim-preview-no-mature.jsx
Normal file
33
ui/component/claimMenuList/claim-preview-no-mature.jsx
Normal file
|
@ -0,0 +1,33 @@
|
|||
// @flow
|
||||
import classnames from 'classnames';
|
||||
import React from 'react';
|
||||
import Empty from 'component/common/empty';
|
||||
|
||||
type Props = {
|
||||
isChannel: boolean,
|
||||
type: string,
|
||||
message: string,
|
||||
};
|
||||
|
||||
function ClaimPreviewHidden(props: Props) {
|
||||
const { isChannel, type, message } = props;
|
||||
return (
|
||||
<li
|
||||
className={classnames('claim-preview__wrapper', {
|
||||
'claim-preview__wrapper--channel': isChannel && type !== 'inline',
|
||||
'claim-preview__wrapper--inline': type === 'inline',
|
||||
})}
|
||||
>
|
||||
<div
|
||||
className={classnames('claim-preview claim-preview--inactive claim-preview--empty', {
|
||||
'claim-preview--large': type === 'large',
|
||||
})}
|
||||
>
|
||||
<div className="media__thumb" />
|
||||
<Empty text={message} />
|
||||
</div>
|
||||
</li>
|
||||
);
|
||||
}
|
||||
|
||||
export default ClaimPreviewHidden;
|
20
ui/component/claimMenuList/index.js
Normal file
20
ui/component/claimMenuList/index.js
Normal file
|
@ -0,0 +1,20 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { makeSelectClaimForUri, makeSelectClaimIsMine } from 'lbry-redux';
|
||||
import { makeSelectChannelIsMuted } from 'redux/selectors/blocked';
|
||||
import { doToggleMuteChannel } from 'redux/actions/blocked';
|
||||
import { doCommentModBlock, doCommentModUnBlock } from 'redux/actions/comments';
|
||||
import { makeSelectChannelIsBlocked } from 'redux/selectors/comments';
|
||||
import ClaimPreview from './view';
|
||||
|
||||
const select = (state, props) => ({
|
||||
claim: makeSelectClaimForUri(props.uri)(state),
|
||||
claimIsMine: makeSelectClaimIsMine(props.uri)(state),
|
||||
channelIsMuted: makeSelectChannelIsMuted(props.uri)(state),
|
||||
channelIsBlocked: makeSelectChannelIsBlocked(props.uri)(state),
|
||||
});
|
||||
|
||||
export default connect(select, {
|
||||
doToggleMuteChannel,
|
||||
doCommentModBlock,
|
||||
doCommentModUnBlock,
|
||||
})(ClaimPreview);
|
86
ui/component/claimMenuList/view.jsx
Normal file
86
ui/component/claimMenuList/view.jsx
Normal file
|
@ -0,0 +1,86 @@
|
|||
// @flow
|
||||
import * as ICONS from 'constants/icons';
|
||||
import React from 'react';
|
||||
import classnames from 'classnames';
|
||||
import { Menu, MenuButton, MenuList, MenuItem } from '@reach/menu-button';
|
||||
import Icon from 'component/common/icon';
|
||||
|
||||
type Props = {
|
||||
claim: ?Claim,
|
||||
inline?: boolean,
|
||||
claimIsMine: boolean,
|
||||
channelIsMuted: boolean,
|
||||
channelIsBlocked: boolean,
|
||||
doToggleMuteChannel: (string) => void,
|
||||
doCommentModBlock: (string) => void,
|
||||
doCommentModUnBlock: (string) => void,
|
||||
};
|
||||
|
||||
function ClaimMenuList(props: Props) {
|
||||
const {
|
||||
claim,
|
||||
inline = false,
|
||||
claimIsMine,
|
||||
doToggleMuteChannel,
|
||||
channelIsMuted,
|
||||
channelIsBlocked,
|
||||
doCommentModBlock,
|
||||
doCommentModUnBlock,
|
||||
} = props;
|
||||
const channelUri =
|
||||
claim &&
|
||||
(claim.value_type === 'channel'
|
||||
? claim.permanent_url
|
||||
: claim.signing_channel && claim.signing_channel.permanent_url);
|
||||
|
||||
if (!channelUri) {
|
||||
return null;
|
||||
}
|
||||
|
||||
function handleToggleMute() {
|
||||
doToggleMuteChannel(channelUri);
|
||||
}
|
||||
|
||||
function handleToggleBlock() {
|
||||
if (channelIsBlocked) {
|
||||
doCommentModUnBlock(channelUri);
|
||||
} else {
|
||||
doCommentModBlock(channelUri);
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<Menu>
|
||||
<MenuButton
|
||||
className={classnames('menu__button', { 'claim__menu-button': !inline, 'claim__menu-button--inline': inline })}
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
}}
|
||||
>
|
||||
<Icon size={20} icon={ICONS.MORE_VERTICAL} />
|
||||
</MenuButton>
|
||||
<MenuList className="menu__list">
|
||||
{!claimIsMine && (
|
||||
<>
|
||||
<MenuItem className="comment__menu-option" onSelect={handleToggleBlock}>
|
||||
<div className="menu__link">
|
||||
<Icon aria-hidden icon={ICONS.BLOCK} />
|
||||
{channelIsBlocked ? __('Unblock Channel') : __('Block Channel')}
|
||||
</div>
|
||||
</MenuItem>
|
||||
|
||||
<MenuItem className="comment__menu-option" onSelect={handleToggleMute}>
|
||||
<div className="menu__link">
|
||||
<Icon aria-hidden icon={ICONS.MUTE} />
|
||||
{channelIsMuted ? __('Unmute Channel') : __('Mute Channel')}
|
||||
</div>
|
||||
</MenuItem>
|
||||
</>
|
||||
)}
|
||||
</MenuList>
|
||||
</Menu>
|
||||
);
|
||||
}
|
||||
|
||||
export default ClaimMenuList;
|
|
@ -11,7 +11,7 @@ import {
|
|||
makeSelectClaimWasPurchased,
|
||||
makeSelectStreamingUrlForUri,
|
||||
} from 'lbry-redux';
|
||||
import { selectBlockedChannels, selectChannelIsBlocked } from 'redux/selectors/blocked';
|
||||
import { selectMutedChannels, makeSelectChannelIsMuted } from 'redux/selectors/blocked';
|
||||
import { selectBlackListedOutpoints, selectFilteredOutpoints } from 'lbryinc';
|
||||
import { selectShowMatureContent } from 'redux/selectors/settings';
|
||||
import { makeSelectHasVisitedUri } from 'redux/selectors/content';
|
||||
|
@ -30,17 +30,17 @@ const select = (state, props) => ({
|
|||
nsfw: props.uri && makeSelectClaimIsNsfw(props.uri)(state),
|
||||
blackListedOutpoints: selectBlackListedOutpoints(state),
|
||||
filteredOutpoints: selectFilteredOutpoints(state),
|
||||
blockedChannelUris: selectBlockedChannels(state),
|
||||
blockedChannelUris: selectMutedChannels(state),
|
||||
hasVisitedUri: props.uri && makeSelectHasVisitedUri(props.uri)(state),
|
||||
channelIsBlocked: props.uri && selectChannelIsBlocked(props.uri)(state),
|
||||
channelIsBlocked: props.uri && makeSelectChannelIsMuted(props.uri)(state),
|
||||
isSubscribed: props.uri && makeSelectIsSubscribed(props.uri, true)(state),
|
||||
streamingUrl: props.uri && makeSelectStreamingUrlForUri(props.uri)(state),
|
||||
wasPurchased: props.uri && makeSelectClaimWasPurchased(props.uri)(state),
|
||||
});
|
||||
|
||||
const perform = dispatch => ({
|
||||
resolveUri: uri => dispatch(doResolveUri(uri)),
|
||||
getFile: uri => dispatch(doFileGet(uri, false)),
|
||||
const perform = (dispatch) => ({
|
||||
resolveUri: (uri) => dispatch(doResolveUri(uri)),
|
||||
getFile: (uri) => dispatch(doFileGet(uri, false)),
|
||||
});
|
||||
|
||||
export default connect(select, perform)(ClaimPreview);
|
||||
|
|
|
@ -3,7 +3,6 @@ import type { Node } from 'react';
|
|||
import React, { useEffect, forwardRef } from 'react';
|
||||
import { NavLink, withRouter } from 'react-router-dom';
|
||||
import classnames from 'classnames';
|
||||
import { SIMPLE_SITE } from 'config';
|
||||
import { parseURI } from 'lbry-redux';
|
||||
// @if TARGET='app'
|
||||
import { openClaimPreviewMenu } from 'util/context-menu';
|
||||
|
@ -16,7 +15,6 @@ import FileProperties from 'component/fileProperties';
|
|||
import ClaimTags from 'component/claimTags';
|
||||
import SubscribeButton from 'component/subscribeButton';
|
||||
import ChannelThumbnail from 'component/channelThumbnail';
|
||||
import BlockButton from 'component/blockButton';
|
||||
import ClaimSupportButton from 'component/claimSupportButton';
|
||||
import useGetThumbnail from 'effects/use-get-thumbnail';
|
||||
import ClaimPreviewTitle from 'component/claimPreviewTitle';
|
||||
|
@ -25,6 +23,8 @@ import ClaimRepostAuthor from 'component/claimRepostAuthor';
|
|||
import FileDownloadLink from 'component/fileDownloadLink';
|
||||
import AbandonedChannelPreview from 'component/abandonedChannelPreview';
|
||||
import PublishPending from 'component/publishPending';
|
||||
import ClaimMenuList from 'component/claimMenuList';
|
||||
import ChannelStakedIndicator from 'component/channelStakedIndicator';
|
||||
import ClaimPreviewLoading from './claim-preview-loading';
|
||||
import ClaimPreviewHidden from './claim-preview-no-mature';
|
||||
import ClaimPreviewNoContent from './claim-preview-no-content';
|
||||
|
@ -55,12 +55,10 @@ type Props = {
|
|||
}>,
|
||||
blockedChannelUris: Array<string>,
|
||||
channelIsBlocked: boolean,
|
||||
isSubscribed: boolean,
|
||||
actions: boolean | Node | string | number,
|
||||
properties: boolean | Node | string | number | ((Claim) => Node),
|
||||
empty?: Node,
|
||||
onClick?: (any) => any,
|
||||
hideBlock?: boolean,
|
||||
streamingUrl: ?string,
|
||||
getFile: (string) => void,
|
||||
customShouldHide?: (Claim) => boolean,
|
||||
|
@ -72,6 +70,7 @@ type Props = {
|
|||
wrapperElement?: string,
|
||||
hideRepostLabel?: boolean,
|
||||
repostUrl?: string,
|
||||
hideMenu?: boolean,
|
||||
};
|
||||
|
||||
const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
|
||||
|
@ -87,7 +86,6 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
|
|||
// is the claim consider nsfw?
|
||||
nsfw,
|
||||
claimIsMine,
|
||||
isSubscribed,
|
||||
streamingUrl,
|
||||
// user properties
|
||||
channelIsBlocked,
|
||||
|
@ -113,13 +111,13 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
|
|||
hideActions = false,
|
||||
properties,
|
||||
onClick,
|
||||
hideBlock,
|
||||
actions,
|
||||
blockedChannelUris,
|
||||
blackListedOutpoints,
|
||||
filteredOutpoints,
|
||||
includeSupportAction,
|
||||
renderActions,
|
||||
hideMenu = false,
|
||||
// repostUrl,
|
||||
} = props;
|
||||
const WrapperElement = wrapperElement || 'li';
|
||||
|
@ -275,7 +273,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
|
|||
>
|
||||
{isChannelUri && claim ? (
|
||||
<UriIndicator uri={contentUri} link>
|
||||
<ChannelThumbnail uri={contentUri} obscure={channelIsBlocked} />
|
||||
<ChannelThumbnail uri={contentUri} />
|
||||
</UriIndicator>
|
||||
) : (
|
||||
<>
|
||||
|
@ -313,9 +311,9 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
|
|||
</NavLink>
|
||||
)}
|
||||
|
||||
{type !== 'small' && !isChannelUri && signingChannel && SIMPLE_SITE && (
|
||||
{/* {type !== 'small' && !isChannelUri && signingChannel && SIMPLE_SITE && (
|
||||
<ChannelThumbnail uri={signingChannel.permanent_url} />
|
||||
)}
|
||||
)} */}
|
||||
</div>
|
||||
<ClaimPreviewSubtitle uri={uri} type={type} />
|
||||
{(pending || !!reflectingProgress) && <PublishPending uri={uri} />}
|
||||
|
@ -329,12 +327,17 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
|
|||
actions
|
||||
) : (
|
||||
<div className="claim-preview__primary-actions">
|
||||
{!isChannelUri && signingChannel && (
|
||||
<div className="claim-preview__channel-staked">
|
||||
<ChannelThumbnail uri={signingChannel.permanent_url} hideStakedIndicator />
|
||||
<ChannelStakedIndicator uri={signingChannel.permanent_url} inline />
|
||||
</div>
|
||||
)}
|
||||
|
||||
{isChannelUri && !channelIsBlocked && !claimIsMine && (
|
||||
<SubscribeButton uri={contentUri.startsWith('lbry://') ? contentUri : `lbry://${contentUri}`} />
|
||||
)}
|
||||
{!hideBlock && isChannelUri && !isSubscribed && (!claimIsMine || channelIsBlocked) && (
|
||||
<BlockButton uri={contentUri.startsWith('lbry://') ? contentUri : `lbry://${contentUri}`} />
|
||||
)}
|
||||
|
||||
{includeSupportAction && <ClaimSupportButton uri={uri} />}
|
||||
</div>
|
||||
)}
|
||||
|
@ -355,6 +358,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
|
|||
)}
|
||||
</div>
|
||||
</div>
|
||||
{!hideMenu && <ClaimMenuList uri={uri} />}
|
||||
</WrapperElement>
|
||||
);
|
||||
});
|
||||
|
|
|
@ -9,7 +9,7 @@ import {
|
|||
makeSelectChannelForClaimUri,
|
||||
makeSelectClaimIsNsfw,
|
||||
} from 'lbry-redux';
|
||||
import { selectBlockedChannels } from 'redux/selectors/blocked';
|
||||
import { selectMutedChannels } from 'redux/selectors/blocked';
|
||||
import { selectBlackListedOutpoints, selectFilteredOutpoints } from 'lbryinc';
|
||||
import { selectShowMatureContent } from 'redux/selectors/settings';
|
||||
import ClaimPreviewTile from './view';
|
||||
|
@ -22,14 +22,14 @@ const select = (state, props) => ({
|
|||
title: props.uri && makeSelectTitleForUri(props.uri)(state),
|
||||
blackListedOutpoints: selectBlackListedOutpoints(state),
|
||||
filteredOutpoints: selectFilteredOutpoints(state),
|
||||
blockedChannelUris: selectBlockedChannels(state),
|
||||
blockedChannelUris: selectMutedChannels(state),
|
||||
showMature: selectShowMatureContent(state),
|
||||
isMature: makeSelectClaimIsNsfw(props.uri)(state),
|
||||
});
|
||||
|
||||
const perform = dispatch => ({
|
||||
resolveUri: uri => dispatch(doResolveUri(uri)),
|
||||
getFile: uri => dispatch(doFileGet(uri, false)),
|
||||
const perform = (dispatch) => ({
|
||||
resolveUri: (uri) => dispatch(doResolveUri(uri)),
|
||||
getFile: (uri) => dispatch(doFileGet(uri, false)),
|
||||
});
|
||||
|
||||
export default connect(select, perform)(ClaimPreviewTile);
|
||||
|
|
|
@ -14,6 +14,8 @@ import { parseURI } from 'lbry-redux';
|
|||
import FileProperties from 'component/fileProperties';
|
||||
import FileDownloadLink from 'component/fileDownloadLink';
|
||||
import ClaimRepostAuthor from 'component/claimRepostAuthor';
|
||||
import ClaimMenuList from 'component/claimMenuList';
|
||||
|
||||
// @if TARGET='app'
|
||||
import { openClaimPreviewMenu } from 'util/context-menu';
|
||||
// @endif
|
||||
|
@ -194,6 +196,7 @@ function ClaimPreviewTile(props: Props) {
|
|||
<UriIndicator uri={uri} link />
|
||||
</div>
|
||||
)}
|
||||
<ClaimMenuList uri={uri} />
|
||||
</h2>
|
||||
</NavLink>
|
||||
<div>
|
||||
|
|
|
@ -1,16 +1,16 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { doClaimSearch, selectClaimSearchByQuery, selectFetchingClaimSearchByQuery, SETTINGS } from 'lbry-redux';
|
||||
import { selectBlockedChannels } from 'redux/selectors/blocked';
|
||||
import { selectMutedChannels } from 'redux/selectors/blocked';
|
||||
import { doToggleTagFollowDesktop } from 'redux/actions/tags';
|
||||
import { makeSelectClientSetting } from 'redux/selectors/settings';
|
||||
import ClaimListDiscover from './view';
|
||||
|
||||
const select = state => ({
|
||||
const select = (state) => ({
|
||||
claimSearchByQuery: selectClaimSearchByQuery(state),
|
||||
fetchingClaimSearchByQuery: selectFetchingClaimSearchByQuery(state),
|
||||
showNsfw: makeSelectClientSetting(SETTINGS.SHOW_MATURE)(state),
|
||||
hideReposts: makeSelectClientSetting(SETTINGS.HIDE_REPOSTS)(state),
|
||||
hiddenUris: selectBlockedChannels(state),
|
||||
hiddenUris: selectMutedChannels(state),
|
||||
});
|
||||
|
||||
const perform = {
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { makeSelectThumbnailForUri, selectMyChannelClaims } from 'lbry-redux';
|
||||
import { doCommentUpdate } from 'redux/actions/comments';
|
||||
import { selectChannelIsBlocked } from 'redux/selectors/blocked';
|
||||
import { makeSelectChannelIsMuted } from 'redux/selectors/blocked';
|
||||
import { doToast } from 'redux/actions/notifications';
|
||||
import { doSetPlayingUri } from 'redux/actions/content';
|
||||
import { selectUserVerifiedEmail } from 'redux/selectors/user';
|
||||
|
@ -11,7 +11,7 @@ import Comment from './view';
|
|||
|
||||
const select = (state, props) => ({
|
||||
thumbnail: props.authorUri && makeSelectThumbnailForUri(props.authorUri)(state),
|
||||
channelIsBlocked: props.authorUri && selectChannelIsBlocked(props.authorUri)(state),
|
||||
channelIsBlocked: props.authorUri && makeSelectChannelIsMuted(props.authorUri)(state),
|
||||
commentingEnabled: IS_WEB ? Boolean(selectUserVerifiedEmail(state)) : true,
|
||||
othersReacts: makeSelectOthersReactionsForComment(props.commentId)(state),
|
||||
activeChannelClaim: selectActiveChannelClaim(state),
|
||||
|
|
|
@ -200,7 +200,7 @@ function Comment(props: Props) {
|
|||
</div>
|
||||
<div className="comment__menu">
|
||||
<Menu>
|
||||
<MenuButton>
|
||||
<MenuButton className="menu__button">
|
||||
<Icon
|
||||
size={18}
|
||||
className={mouseIsHovering ? 'comment__menu-icon--hovering' : 'comment__menu-icon'}
|
||||
|
|
|
@ -1,12 +1,7 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { makeSelectChannelPermUrlForClaimUri, makeSelectClaimIsMine, makeSelectClaimForUri } from 'lbry-redux';
|
||||
import {
|
||||
doCommentAbandon,
|
||||
doCommentPin,
|
||||
doCommentList,
|
||||
// doCommentModBlock,
|
||||
} from 'redux/actions/comments';
|
||||
import { doToggleBlockChannel } from 'redux/actions/blocked';
|
||||
import { doCommentAbandon, doCommentPin, doCommentList, doCommentModBlock } from 'redux/actions/comments';
|
||||
import { doToggleMuteChannel } from 'redux/actions/blocked';
|
||||
// import { doSetActiveChannel } from 'redux/actions/app';
|
||||
import { doSetPlayingUri } from 'redux/actions/content';
|
||||
import { selectActiveChannelClaim } from 'redux/selectors/app';
|
||||
|
@ -19,14 +14,14 @@ const select = (state, props) => ({
|
|||
activeChannelClaim: selectActiveChannelClaim(state),
|
||||
});
|
||||
|
||||
const perform = dispatch => ({
|
||||
const perform = (dispatch) => ({
|
||||
closeInlinePlayer: () => dispatch(doSetPlayingUri({ uri: null })),
|
||||
deleteComment: (commentId, creatorChannelUrl) => dispatch(doCommentAbandon(commentId, creatorChannelUrl)),
|
||||
blockChannel: channelUri => dispatch(doToggleBlockChannel(channelUri)),
|
||||
blockChannel: (channelUri) => dispatch(doToggleMuteChannel(channelUri)),
|
||||
pinComment: (commentId, remove) => dispatch(doCommentPin(commentId, remove)),
|
||||
fetchComments: uri => dispatch(doCommentList(uri)),
|
||||
fetchComments: (uri) => dispatch(doCommentList(uri)),
|
||||
// setActiveChannel: channelId => dispatch(doSetActiveChannel(channelId)),
|
||||
// commentModBlock: commentAuthor => dispatch(doCommentModBlock(commentAuthor)),
|
||||
commentModBlock: (commentAuthor) => dispatch(doCommentModBlock(commentAuthor)),
|
||||
});
|
||||
|
||||
export default connect(select, perform)(CommentMenuList);
|
||||
|
|
|
@ -23,7 +23,7 @@ type Props = {
|
|||
activeChannelClaim: ?ChannelClaim,
|
||||
claimIsMine: boolean,
|
||||
isTopLevel: boolean,
|
||||
// commentModBlock: string => void,
|
||||
commentModBlock: (string) => void,
|
||||
};
|
||||
|
||||
function CommentMenuList(props: Props) {
|
||||
|
@ -43,17 +43,10 @@ function CommentMenuList(props: Props) {
|
|||
isPinned,
|
||||
handleEditComment,
|
||||
fetchComments,
|
||||
// commentModBlock,
|
||||
// setActiveChannel,
|
||||
commentModBlock,
|
||||
} = props;
|
||||
const activeChannelIsCreator = activeChannelClaim && activeChannelClaim.permanent_url === contentChannelPermanentUrl;
|
||||
|
||||
// let authorChannel;
|
||||
// try {
|
||||
// const { claimName } = parseURI(authorUri);
|
||||
// authorChannel = claimName;
|
||||
// } catch (e) {}
|
||||
|
||||
function handlePinComment(commentId, remove) {
|
||||
pinComment(commentId, remove).then(() => fetchComments(uri));
|
||||
}
|
||||
|
@ -65,32 +58,16 @@ function CommentMenuList(props: Props) {
|
|||
|
||||
function handleCommentBlock() {
|
||||
if (claimIsMine) {
|
||||
// Block them from commenting on future content
|
||||
// commentModBlock(authorUri);
|
||||
commentModBlock(authorUri);
|
||||
}
|
||||
}
|
||||
|
||||
function handleCommentMute() {
|
||||
blockChannel(authorUri);
|
||||
}
|
||||
|
||||
// function handleChooseChannel() {
|
||||
// const { channelClaimId } = parseURI(authorUri);
|
||||
// setActiveChannel(channelClaimId);
|
||||
// }
|
||||
|
||||
return (
|
||||
<MenuList className="menu__list--comments">
|
||||
{/* {commentIsMine && activeChannelClaim && activeChannelClaim.permanent_url !== authorUri && (
|
||||
<MenuItem className="comment__menu-option" onSelect={handleChooseChannel}>
|
||||
<div className="menu__link">
|
||||
<Icon aria-hidden icon={ICONS.CHANNEL} />
|
||||
{__('Use this channel')}
|
||||
</div>
|
||||
<span className="comment__menu-help">
|
||||
{__('Switch to %channel_name% to interact with this comment', { channel_name: authorChannel })}.
|
||||
</span>
|
||||
</MenuItem>
|
||||
)} */}
|
||||
|
||||
<MenuList className="menu__list">
|
||||
{activeChannelIsCreator && <div className="comment__menu-title">{__('Creator tools')}</div>}
|
||||
|
||||
{activeChannelIsCreator && isTopLevel && (
|
||||
|
@ -123,16 +100,25 @@ function CommentMenuList(props: Props) {
|
|||
</MenuItem>
|
||||
)}
|
||||
|
||||
{/* Disabled until we deal with current app blocklist parity */}
|
||||
{!commentIsMine && (
|
||||
<MenuItem className="comment__menu-option" onSelect={handleCommentBlock}>
|
||||
<div className="menu__link">
|
||||
<Icon aria-hidden icon={ICONS.BLOCK} />
|
||||
{__('Block')}
|
||||
</div>
|
||||
{/* {activeChannelIsCreator && (
|
||||
<span className="comment__menu-help">Hide this channel's comments and block them from commenting.</span>
|
||||
)} */}
|
||||
{activeChannelIsCreator && (
|
||||
<span className="comment__menu-help">Prevent this channel from interacting with you.</span>
|
||||
)}
|
||||
</MenuItem>
|
||||
)}
|
||||
|
||||
{!commentIsMine && (
|
||||
<MenuItem className="comment__menu-option" onSelect={handleCommentMute}>
|
||||
<div className="menu__link">
|
||||
<Icon aria-hidden icon={ICONS.MUTE} />
|
||||
{__('Mute')}
|
||||
</div>
|
||||
{activeChannelIsCreator && <span className="comment__menu-help">Hide this channel for you only.</span>}
|
||||
</MenuItem>
|
||||
)}
|
||||
|
||||
|
|
|
@ -238,6 +238,13 @@ export const icons = {
|
|||
<circle cx="12" cy="12" r="10" />
|
||||
</g>
|
||||
),
|
||||
[ICONS.MUTE]: buildIcon(
|
||||
<g>
|
||||
<polygon points="11 5 6 9 2 9 2 15 6 15 11 19 11 5" />
|
||||
<line x1="23" y1="9" x2="17" y2="15" />
|
||||
<line x1="17" y1="9" x2="23" y2="15" />
|
||||
</g>
|
||||
),
|
||||
[ICONS.LIGHT]: buildIcon(
|
||||
<g>
|
||||
<circle cx="12" cy="12" r="5" />
|
||||
|
|
|
@ -10,7 +10,7 @@ function FileAuthor(props: Props) {
|
|||
const { channelUri } = props;
|
||||
|
||||
return channelUri ? (
|
||||
<ClaimPreview uri={channelUri} type="inline" properties={false} hideBlock />
|
||||
<ClaimPreview uri={channelUri} type="inline" properties={false} />
|
||||
) : (
|
||||
<div className="claim-preview--inline claim-preview__title">{__('Anonymous')}</div>
|
||||
);
|
||||
|
|
|
@ -22,7 +22,7 @@ type Props = {
|
|||
menuButton: boolean,
|
||||
children: any,
|
||||
doReadNotifications: ([number]) => void,
|
||||
doDeleteNotification: number => void,
|
||||
doDeleteNotification: (number) => void,
|
||||
};
|
||||
|
||||
export default function Notification(props: Props) {
|
||||
|
@ -166,10 +166,10 @@ export default function Notification(props: Props) {
|
|||
|
||||
<div className="notification__menu">
|
||||
<Menu>
|
||||
<MenuButton onClick={e => e.stopPropagation()}>
|
||||
<MenuButton onClick={(e) => e.stopPropagation()}>
|
||||
<Icon size={18} icon={ICONS.MORE_VERTICAL} />
|
||||
</MenuButton>
|
||||
<MenuList className="menu__list--comments">
|
||||
<MenuList className="menu__list">
|
||||
<MenuItem className="menu__link" onSelect={() => doDeleteNotification(id)}>
|
||||
<Icon aria-hidden icon={ICONS.DELETE} />
|
||||
{__('Delete')}
|
||||
|
|
|
@ -272,7 +272,7 @@ function AppRouter(props: Props) {
|
|||
<PrivateRoute {...props} path={`/$/${PAGES.REWARDS_VERIFY}`} component={RewardsVerifyPage} />
|
||||
<PrivateRoute {...props} path={`/$/${PAGES.LIBRARY}`} component={LibraryPage} />
|
||||
<PrivateRoute {...props} path={`/$/${PAGES.TAGS_FOLLOWING_MANAGE}`} component={TagsFollowingManagePage} />
|
||||
<PrivateRoute {...props} path={`/$/${PAGES.BLOCKED}`} component={ListBlockedPage} />
|
||||
<PrivateRoute {...props} path={`/$/${PAGES.SETTINGS_BLOCKED_MUTED}`} component={ListBlockedPage} />
|
||||
<PrivateRoute {...props} path={`/$/${PAGES.WALLET}`} exact component={WalletPage} />
|
||||
<PrivateRoute {...props} path={`/$/${PAGES.CHANNELS}`} component={ChannelsPage} />
|
||||
<PrivateRoute {...props} path={`/$/${PAGES.BUY}`} component={BuyPage} />
|
||||
|
|
|
@ -268,6 +268,15 @@ export const COMMENT_REACT_FAILED = 'COMMENT_REACT_FAILED';
|
|||
export const COMMENT_PIN_STARTED = 'COMMENT_PIN_STARTED';
|
||||
export const COMMENT_PIN_COMPLETED = 'COMMENT_PIN_COMPLETED';
|
||||
export const COMMENT_PIN_FAILED = 'COMMENT_PIN_FAILED';
|
||||
export const COMMENT_MODERATION_BLOCK_LIST_STARTED = 'COMMENT_MODERATION_BLOCK_LIST_STARTED';
|
||||
export const COMMENT_MODERATION_BLOCK_LIST_COMPLETED = 'COMMENT_MODERATION_BLOCK_LIST_COMPLETED';
|
||||
export const COMMENT_MODERATION_BLOCK_LIST_FAILED = 'COMMENT_MODERATION_BLOCK_LIST_FAILED';
|
||||
export const COMMENT_MODERATION_BLOCK_STARTED = 'COMMENT_MODERATION_BLOCK_STARTED';
|
||||
export const COMMENT_MODERATION_BLOCK_COMPLETE = 'COMMENT_MODERATION_BLOCK_COMPLETE';
|
||||
export const COMMENT_MODERATION_BLOCK_FAILED = 'COMMENT_MODERATION_BLOCK_FAILED';
|
||||
export const COMMENT_MODERATION_UN_BLOCK_STARTED = 'COMMENT_MODERATION_UN_BLOCK_STARTED';
|
||||
export const COMMENT_MODERATION_UN_BLOCK_COMPLETE = 'COMMENT_MODERATION_UN_BLOCK_COMPLETE';
|
||||
export const COMMENT_MODERATION_UN_BLOCK_FAILED = 'COMMENT_MODERATION_UN_BLOCK_FAILED';
|
||||
|
||||
// Blocked channels
|
||||
export const TOGGLE_BLOCK_CHANNEL = 'TOGGLE_BLOCK_CHANNEL';
|
||||
|
|
|
@ -82,6 +82,7 @@ export const LIBRARY = 'Folder';
|
|||
export const TAG = 'Tag';
|
||||
export const SUPPORT = 'TrendingUp';
|
||||
export const BLOCK = 'Slash';
|
||||
export const MUTE = 'VolumeX';
|
||||
export const UNBLOCK = 'Circle';
|
||||
export const VIEW = 'View';
|
||||
export const EYE = 'Eye';
|
||||
|
|
|
@ -41,7 +41,6 @@ export const LIQUIDATE_SUPPORTS = 'liquidate_supports';
|
|||
export const MASS_TIP_UNLOCK = 'mass_tip_unlock';
|
||||
export const CONFIRM_AGE = 'confirm_age';
|
||||
export const SYNC_ENABLE = 'SYNC_ENABLE';
|
||||
export const REMOVE_BLOCKED = 'remove_blocked';
|
||||
export const IMAGE_UPLOAD = 'image_upload';
|
||||
export const MOBILE_SEARCH = 'mobile_search';
|
||||
export const VIEW_IMAGE = 'view_image';
|
||||
|
|
|
@ -24,6 +24,7 @@ exports.SEND = 'send';
|
|||
exports.SETTINGS = 'settings';
|
||||
exports.SETTINGS_NOTIFICATIONS = 'settings/notifications';
|
||||
exports.SETTINGS_ADVANCED = 'settings/advanced';
|
||||
exports.SETTINGS_BLOCKED_MUTED = 'settings/block_and_mute';
|
||||
exports.SHOW = 'show';
|
||||
exports.ACCOUNT = 'account';
|
||||
exports.SEARCH = 'search';
|
||||
|
@ -36,7 +37,6 @@ exports.CHANNELS_FOLLOWING = 'following';
|
|||
exports.DEPRECATED__CHANNELS_FOLLOWING_MANAGE = 'following/channels/manage';
|
||||
exports.CHANNELS_FOLLOWING_DISCOVER = 'following/discover';
|
||||
exports.WALLET = 'wallet';
|
||||
exports.BLOCKED = 'blocked';
|
||||
exports.CHANNELS = 'channels';
|
||||
exports.EMBED = 'embed';
|
||||
exports.TOP = 'top';
|
||||
|
|
|
@ -1,16 +0,0 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { doHideModal } from 'redux/actions/app';
|
||||
import { doToggleBlockChannel } from 'redux/actions/blocked';
|
||||
import { selectBlockedChannels } from 'redux/selectors/blocked';
|
||||
import ModalRemoveBlocked from './view';
|
||||
|
||||
const select = (state, props) => ({
|
||||
blockedChannels: selectBlockedChannels(state),
|
||||
});
|
||||
|
||||
const perform = dispatch => ({
|
||||
closeModal: () => dispatch(doHideModal()),
|
||||
toggleBlockChannel: uri => dispatch(doToggleBlockChannel(uri)),
|
||||
});
|
||||
|
||||
export default connect(select, perform)(ModalRemoveBlocked);
|
|
@ -1,46 +0,0 @@
|
|||
// @flow
|
||||
import React from 'react';
|
||||
import { Modal } from 'modal/modal';
|
||||
import I18nMessage from 'component/i18nMessage';
|
||||
|
||||
type Props = {
|
||||
blockedUri: string,
|
||||
closeModal: () => void,
|
||||
blockedChannels: Array<string>,
|
||||
toggleBlockChannel: (uri: string) => void,
|
||||
};
|
||||
|
||||
function ModalRemoveBlocked(props: Props) {
|
||||
const { blockedUri, closeModal, blockedChannels, toggleBlockChannel } = props;
|
||||
|
||||
function handleConfirm() {
|
||||
if (blockedUri && blockedChannels.includes(blockedUri)) {
|
||||
// DANGER: Always ensure the uri is actually in the list since we are using a
|
||||
// toggle function. If 'null' is accidentally toggled INTO the list, the app
|
||||
// won't start. Ideally, we should add a "removeBlockedChannel()", but with
|
||||
// the gating above, it should be safe/good enough.
|
||||
toggleBlockChannel(blockedUri);
|
||||
}
|
||||
|
||||
closeModal();
|
||||
}
|
||||
|
||||
return (
|
||||
<Modal
|
||||
isOpen
|
||||
type="confirm"
|
||||
title={__('Remove from blocked list')}
|
||||
confirmButtonLabel={__('Remove')}
|
||||
onConfirmed={handleConfirm}
|
||||
onAborted={() => closeModal()}
|
||||
>
|
||||
<em>{blockedUri}</em>
|
||||
<p />
|
||||
<p>
|
||||
<I18nMessage>Are you sure you want to remove this from the list?</I18nMessage>
|
||||
</p>
|
||||
</Modal>
|
||||
);
|
||||
}
|
||||
|
||||
export default ModalRemoveBlocked;
|
|
@ -16,7 +16,6 @@ import ModalRevokeClaim from 'modal/modalRevokeClaim';
|
|||
import ModalPhoneCollection from 'modal/modalPhoneCollection';
|
||||
import ModalFirstSubscription from 'modal/modalFirstSubscription';
|
||||
import ModalConfirmTransaction from 'modal/modalConfirmTransaction';
|
||||
import ModalRemoveBlocked from 'modal/modalRemoveBlocked';
|
||||
import ModalSocialShare from 'modal/modalSocialShare';
|
||||
import ModalSendTip from 'modal/modalSendTip';
|
||||
import ModalPublish from 'modal/modalPublish';
|
||||
|
@ -142,8 +141,6 @@ function ModalRouter(props: Props) {
|
|||
return <ModalFileSelection {...modalProps} />;
|
||||
case MODALS.LIQUIDATE_SUPPORTS:
|
||||
return <ModalSupportsLiquidate {...modalProps} />;
|
||||
case MODALS.REMOVE_BLOCKED:
|
||||
return <ModalRemoveBlocked {...modalProps} />;
|
||||
case MODALS.IMAGE_UPLOAD:
|
||||
return <ModalImageUpload {...modalProps} />;
|
||||
case MODALS.SYNC_ENABLE:
|
||||
|
|
|
@ -8,7 +8,7 @@ import {
|
|||
makeSelectClaimForUri,
|
||||
makeSelectClaimIsPending,
|
||||
} from 'lbry-redux';
|
||||
import { selectChannelIsBlocked } from 'redux/selectors/blocked';
|
||||
import { makeSelectChannelIsMuted } from 'redux/selectors/blocked';
|
||||
import { selectBlackListedOutpoints, doFetchSubCount, makeSelectSubCountForUri } from 'lbryinc';
|
||||
import { selectYoutubeChannels } from 'redux/selectors/user';
|
||||
import { makeSelectIsSubscribed } from 'redux/selectors/subscriptions';
|
||||
|
@ -23,16 +23,16 @@ const select = (state, props) => ({
|
|||
page: selectCurrentChannelPage(state),
|
||||
claim: makeSelectClaimForUri(props.uri)(state),
|
||||
isSubscribed: makeSelectIsSubscribed(props.uri, true)(state),
|
||||
channelIsBlocked: selectChannelIsBlocked(props.uri)(state),
|
||||
channelIsBlocked: makeSelectChannelIsMuted(props.uri)(state),
|
||||
blackListedOutpoints: selectBlackListedOutpoints(state),
|
||||
subCount: makeSelectSubCountForUri(props.uri)(state),
|
||||
pending: makeSelectClaimIsPending(props.uri)(state),
|
||||
youtubeChannels: selectYoutubeChannels(state),
|
||||
});
|
||||
|
||||
const perform = dispatch => ({
|
||||
const perform = (dispatch) => ({
|
||||
openModal: (modal, props) => dispatch(doOpenModal(modal, props)),
|
||||
fetchSubCount: claimId => dispatch(doFetchSubCount(claimId)),
|
||||
fetchSubCount: (claimId) => dispatch(doFetchSubCount(claimId)),
|
||||
});
|
||||
|
||||
export default connect(select, perform)(ChannelPage);
|
||||
|
|
|
@ -6,7 +6,6 @@ import { parseURI } from 'lbry-redux';
|
|||
import { YOUTUBE_STATUSES } from 'lbryinc';
|
||||
import Page from 'component/page';
|
||||
import SubscribeButton from 'component/subscribeButton';
|
||||
import BlockButton from 'component/blockButton';
|
||||
import ShareButton from 'component/shareButton';
|
||||
import { Tabs, TabList, Tab, TabPanels, TabPanel } from 'component/common/tabs';
|
||||
import { useHistory } from 'react-router';
|
||||
|
@ -21,6 +20,7 @@ import classnames from 'classnames';
|
|||
import HelpLink from 'component/common/help-link';
|
||||
import ClaimSupportButton from 'component/claimSupportButton';
|
||||
import ChannelStakedIndicator from 'component/channelStakedIndicator';
|
||||
import ClaimMenuList from 'component/claimMenuList';
|
||||
|
||||
export const PAGE_VIEW_QUERY = `view`;
|
||||
const ABOUT_PAGE = `about`;
|
||||
|
@ -157,7 +157,7 @@ function ChannelPage(props: Props) {
|
|||
{!channelIsBlocked && !channelIsBlackListed && <ShareButton uri={uri} />}
|
||||
{!channelIsBlocked && <ClaimSupportButton uri={uri} />}
|
||||
{!channelIsBlocked && (!channelIsBlackListed || isSubscribed) && <SubscribeButton uri={permanentUrl} />}
|
||||
{!isSubscribed && <BlockButton uri={permanentUrl} />}
|
||||
<ClaimMenuList uri={claim.permanent_url} inline />
|
||||
</div>
|
||||
{cover && (
|
||||
<img
|
||||
|
|
|
@ -1,14 +1,14 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { selectFollowedTags } from 'redux/selectors/tags';
|
||||
import { selectBlockedChannels } from 'redux/selectors/blocked';
|
||||
import { selectMutedChannels } from 'redux/selectors/blocked';
|
||||
import { selectSubscriptions } from 'redux/selectors/subscriptions';
|
||||
import { selectHomepageData } from 'redux/selectors/settings';
|
||||
import ChannelsFollowingManagePage from './view';
|
||||
|
||||
const select = state => ({
|
||||
const select = (state) => ({
|
||||
followedTags: selectFollowedTags(state),
|
||||
subscribedChannels: selectSubscriptions(state),
|
||||
blockedChannels: selectBlockedChannels(state),
|
||||
blockedChannels: selectMutedChannels(state),
|
||||
homepageData: selectHomepageData(state),
|
||||
});
|
||||
|
||||
|
|
|
@ -1,9 +1,12 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { selectBlockedChannels } from 'redux/selectors/blocked';
|
||||
import { selectMutedChannels } from 'redux/selectors/blocked';
|
||||
import { selectModerationBlockList, selectFetchingModerationBlockList } from 'redux/selectors/comments';
|
||||
import ListBlocked from './view';
|
||||
|
||||
const select = state => ({
|
||||
uris: selectBlockedChannels(state),
|
||||
const select = (state) => ({
|
||||
mutedUris: selectMutedChannels(state),
|
||||
blockedUris: selectModerationBlockList(state),
|
||||
fetchingModerationBlockList: selectFetchingModerationBlockList(state),
|
||||
});
|
||||
|
||||
export default connect(select, null)(ListBlocked);
|
||||
export default connect(select)(ListBlocked);
|
||||
|
|
|
@ -1,34 +1,125 @@
|
|||
// @flow
|
||||
import * as ICONS from 'constants/icons';
|
||||
import React from 'react';
|
||||
import classnames from 'classnames';
|
||||
import ClaimList from 'component/claimList';
|
||||
import Page from 'component/page';
|
||||
import Card from 'component/common/card';
|
||||
import Spinner from 'component/spinner';
|
||||
import Button from 'component/button';
|
||||
import usePrevious from 'effects/use-previous';
|
||||
import usePersistedState from 'effects/use-persisted-state';
|
||||
import ChannelBlockButton from 'component/channelBlockButton';
|
||||
import ChannelMuteButton from 'component/channelMuteButton';
|
||||
|
||||
type Props = {
|
||||
uris: Array<string>,
|
||||
mutedUris: ?Array<string>,
|
||||
blockedUris: ?Array<string>,
|
||||
fetchingModerationBlockList: boolean,
|
||||
};
|
||||
|
||||
const VIEW_BLOCKED = 'blocked';
|
||||
const VIEW_MUTED = 'muted';
|
||||
|
||||
function ListBlocked(props: Props) {
|
||||
const { uris } = props;
|
||||
const { mutedUris, blockedUris, fetchingModerationBlockList } = props;
|
||||
|
||||
const [viewMode, setViewMode] = usePersistedState('blocked-muted:display', VIEW_BLOCKED);
|
||||
const [loading, setLoading] = React.useState(!blockedUris || !blockedUris.length);
|
||||
|
||||
// Keep a local list to allow for undoing actions in this component
|
||||
const [localBlockedList, setLocalBlockedList] = React.useState(undefined);
|
||||
const [localMutedList, setLocalMutedList] = React.useState(undefined);
|
||||
|
||||
const previousFetchingModBlockList = usePrevious(fetchingModerationBlockList);
|
||||
const hasLocalMuteList = localMutedList && localMutedList.length > 0;
|
||||
const hasLocalBlockList = localBlockedList && localBlockedList.length > 0;
|
||||
const stringifiedMutedChannels = JSON.stringify(mutedUris);
|
||||
const justMuted = localMutedList && mutedUris && localMutedList.length < mutedUris.length;
|
||||
const justBlocked = localBlockedList && blockedUris && localBlockedList.length < blockedUris.length;
|
||||
const stringifiedBlockedChannels = JSON.stringify(blockedUris);
|
||||
|
||||
React.useEffect(() => {
|
||||
if (previousFetchingModBlockList && !fetchingModerationBlockList) {
|
||||
setLoading(false);
|
||||
}
|
||||
}, [setLoading, previousFetchingModBlockList, fetchingModerationBlockList]);
|
||||
|
||||
React.useEffect(() => {
|
||||
const jsonMutedChannels = stringifiedMutedChannels && JSON.parse(stringifiedMutedChannels);
|
||||
if (!hasLocalMuteList && jsonMutedChannels && jsonMutedChannels.length > 0) {
|
||||
setLocalMutedList(jsonMutedChannels);
|
||||
}
|
||||
}, [stringifiedMutedChannels, hasLocalMuteList]);
|
||||
|
||||
React.useEffect(() => {
|
||||
const jsonBlockedChannels = stringifiedBlockedChannels && JSON.parse(stringifiedBlockedChannels);
|
||||
if (!hasLocalBlockList && jsonBlockedChannels && jsonBlockedChannels.length > 0) {
|
||||
setLocalBlockedList(jsonBlockedChannels);
|
||||
}
|
||||
}, [stringifiedBlockedChannels, hasLocalBlockList]);
|
||||
|
||||
React.useEffect(() => {
|
||||
if (justMuted && stringifiedMutedChannels) {
|
||||
setLocalMutedList(JSON.parse(stringifiedMutedChannels));
|
||||
}
|
||||
}, [stringifiedMutedChannels, justMuted, setLocalMutedList]);
|
||||
|
||||
React.useEffect(() => {
|
||||
if (justBlocked && stringifiedBlockedChannels) {
|
||||
setLocalBlockedList(JSON.parse(stringifiedBlockedChannels));
|
||||
}
|
||||
}, [stringifiedBlockedChannels, justBlocked, setLocalBlockedList]);
|
||||
|
||||
return (
|
||||
<Page>
|
||||
{uris && uris.length ? (
|
||||
<Card
|
||||
isBodyList
|
||||
title={__('Your blocked channels')}
|
||||
body={<ClaimList uris={uris} showUnresolvedClaims showHiddenByUser />}
|
||||
/>
|
||||
) : (
|
||||
{loading && (
|
||||
<div className="main--empty">
|
||||
<section className="card card--section">
|
||||
<h2 className="card__title card__title--deprecated">{__('You aren’t blocking any channels')}</h2>
|
||||
<p className="section__subtitle">
|
||||
{__('When you block a channel, all content from that channel will be hidden.')}
|
||||
</p>
|
||||
</section>
|
||||
<Spinner />
|
||||
</div>
|
||||
)}
|
||||
|
||||
{!loading && (
|
||||
<>
|
||||
<div className="section__header--actions">
|
||||
<div className="section__actions--inline">
|
||||
<Button
|
||||
icon={ICONS.BLOCK}
|
||||
button="alt"
|
||||
label={__('Blocked')}
|
||||
className={classnames(`button-toggle`, {
|
||||
'button-toggle--active': viewMode === VIEW_BLOCKED,
|
||||
})}
|
||||
onClick={() => setViewMode(VIEW_BLOCKED)}
|
||||
/>
|
||||
<Button
|
||||
icon={ICONS.MUTE}
|
||||
button="alt"
|
||||
label={__('Muted')}
|
||||
className={classnames(`button-toggle`, {
|
||||
'button-toggle--active': viewMode === VIEW_MUTED,
|
||||
})}
|
||||
onClick={() => setViewMode(VIEW_MUTED)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
{
|
||||
<ClaimList
|
||||
uris={viewMode === VIEW_MUTED ? localMutedList : localBlockedList}
|
||||
showUnresolvedClaims
|
||||
showHiddenByUser
|
||||
hideMenu
|
||||
renderActions={(claim) => {
|
||||
return (
|
||||
<div className="section__actions">
|
||||
<ChannelBlockButton uri={claim.permanent_url} />
|
||||
<ChannelMuteButton uri={claim.permanent_url} />
|
||||
</div>
|
||||
);
|
||||
}}
|
||||
/>
|
||||
}
|
||||
</>
|
||||
)}
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -12,11 +12,10 @@ import {
|
|||
import { doSetPlayingUri } from 'redux/actions/content';
|
||||
import { makeSelectClientSetting, selectDaemonSettings, selectLanguage } from 'redux/selectors/settings';
|
||||
import { doWalletStatus, selectWalletIsEncrypted, SETTINGS } from 'lbry-redux';
|
||||
import { selectBlockedChannelsCount } from 'redux/selectors/blocked';
|
||||
import SettingsPage from './view';
|
||||
import { selectUserVerifiedEmail } from 'redux/selectors/user';
|
||||
|
||||
const select = state => ({
|
||||
const select = (state) => ({
|
||||
daemonSettings: selectDaemonSettings(state),
|
||||
allowAnalytics: selectAllowAnalytics(state),
|
||||
isAuthenticated: selectUserVerifiedEmail(state),
|
||||
|
@ -27,7 +26,6 @@ const select = state => ({
|
|||
autoplay: makeSelectClientSetting(SETTINGS.AUTOPLAY)(state),
|
||||
walletEncrypted: selectWalletIsEncrypted(state),
|
||||
autoDownload: makeSelectClientSetting(SETTINGS.AUTO_DOWNLOAD)(state),
|
||||
userBlockedChannelsCount: selectBlockedChannelsCount(state),
|
||||
hideBalance: makeSelectClientSetting(SETTINGS.HIDE_BALANCE)(state),
|
||||
floatingPlayer: makeSelectClientSetting(SETTINGS.FLOATING_PLAYER)(state),
|
||||
hideReposts: makeSelectClientSetting(SETTINGS.HIDE_REPOSTS)(state),
|
||||
|
@ -35,14 +33,14 @@ const select = state => ({
|
|||
language: selectLanguage(state),
|
||||
});
|
||||
|
||||
const perform = dispatch => ({
|
||||
const perform = (dispatch) => ({
|
||||
setDaemonSetting: (key, value) => dispatch(doSetDaemonSetting(key, value)),
|
||||
clearDaemonSetting: key => dispatch(doClearDaemonSetting(key)),
|
||||
toggle3PAnalytics: allow => dispatch(doToggle3PAnalytics(allow)),
|
||||
clearDaemonSetting: (key) => dispatch(doClearDaemonSetting(key)),
|
||||
toggle3PAnalytics: (allow) => dispatch(doToggle3PAnalytics(allow)),
|
||||
clearCache: () => dispatch(doClearCache()),
|
||||
setClientSetting: (key, value) => dispatch(doSetClientSetting(key, value)),
|
||||
updateWalletStatus: () => dispatch(doWalletStatus()),
|
||||
confirmForgetPassword: modalProps => dispatch(doNotifyForgetPassword(modalProps)),
|
||||
confirmForgetPassword: (modalProps) => dispatch(doNotifyForgetPassword(modalProps)),
|
||||
clearPlayingUri: () => dispatch(doSetPlayingUri({ uri: null })),
|
||||
setDarkTime: (time, options) => dispatch(doSetDarkTime(time, options)),
|
||||
openModal: (id, params) => dispatch(doOpenModal(id, params)),
|
||||
|
|
|
@ -44,9 +44,9 @@ type DaemonSettings = {
|
|||
|
||||
type Props = {
|
||||
setDaemonSetting: (string, ?SetDaemonSettingArg) => void,
|
||||
clearDaemonSetting: string => void,
|
||||
clearDaemonSetting: (string) => void,
|
||||
setClientSetting: (string, SetDaemonSettingArg) => void,
|
||||
toggle3PAnalytics: boolean => void,
|
||||
toggle3PAnalytics: (boolean) => void,
|
||||
clearCache: () => Promise<any>,
|
||||
daemonSettings: DaemonSettings,
|
||||
allowAnalytics: boolean,
|
||||
|
@ -60,14 +60,13 @@ type Props = {
|
|||
autoplay: boolean,
|
||||
updateWalletStatus: () => void,
|
||||
walletEncrypted: boolean,
|
||||
userBlockedChannelsCount?: number,
|
||||
confirmForgetPassword: ({}) => void,
|
||||
floatingPlayer: boolean,
|
||||
hideReposts: ?boolean,
|
||||
clearPlayingUri: () => void,
|
||||
darkModeTimes: DarkModeTimes,
|
||||
setDarkTime: (string, {}) => void,
|
||||
openModal: string => void,
|
||||
openModal: (string) => void,
|
||||
language?: string,
|
||||
enterSettings: () => void,
|
||||
exitSettings: () => void,
|
||||
|
@ -98,7 +97,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
|
|||
|
||||
if (isAuthenticated || !IS_WEB) {
|
||||
this.props.updateWalletStatus();
|
||||
getPasswordFromCookie().then(p => {
|
||||
getPasswordFromCookie().then((p) => {
|
||||
if (typeof p === 'string') {
|
||||
this.setState({ storedPassword: true });
|
||||
}
|
||||
|
@ -172,7 +171,6 @@ class SettingsPage extends React.PureComponent<Props, State> {
|
|||
setDaemonSetting,
|
||||
setClientSetting,
|
||||
toggle3PAnalytics,
|
||||
userBlockedChannelsCount,
|
||||
floatingPlayer,
|
||||
hideReposts,
|
||||
clearPlayingUri,
|
||||
|
@ -262,7 +260,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
|
|||
value={currentTheme}
|
||||
disabled={automaticDarkModeEnabled}
|
||||
>
|
||||
{themes.map(theme => (
|
||||
{themes.map((theme) => (
|
||||
<option key={theme} value={theme}>
|
||||
{theme === 'light' ? __('Light') : __('Dark')}
|
||||
</option>
|
||||
|
@ -282,11 +280,11 @@ class SettingsPage extends React.PureComponent<Props, State> {
|
|||
<FormField
|
||||
type="select"
|
||||
name="automatic_dark_mode_range"
|
||||
onChange={value => this.onChangeTime(value, { fromTo: 'from', time: 'hour' })}
|
||||
onChange={(value) => this.onChangeTime(value, { fromTo: 'from', time: 'hour' })}
|
||||
value={darkModeTimes.from.hour}
|
||||
label={__('From --[initial time]--')}
|
||||
>
|
||||
{startHours.map(time => (
|
||||
{startHours.map((time) => (
|
||||
<option key={time} value={time}>
|
||||
{this.to12Hour(time)}
|
||||
</option>
|
||||
|
@ -296,10 +294,10 @@ class SettingsPage extends React.PureComponent<Props, State> {
|
|||
type="select"
|
||||
name="automatic_dark_mode_range"
|
||||
label={__('To --[final time]--')}
|
||||
onChange={value => this.onChangeTime(value, { fromTo: 'to', time: 'hour' })}
|
||||
onChange={(value) => this.onChangeTime(value, { fromTo: 'to', time: 'hour' })}
|
||||
value={darkModeTimes.to.hour}
|
||||
>
|
||||
{endHours.map(time => (
|
||||
{endHours.map((time) => (
|
||||
<option key={time} value={time}>
|
||||
{this.to12Hour(time)}
|
||||
</option>
|
||||
|
@ -342,7 +340,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
|
|||
<FormField
|
||||
type="checkbox"
|
||||
name="hide_reposts"
|
||||
onChange={e => {
|
||||
onChange={(e) => {
|
||||
if (isAuthenticated) {
|
||||
let param = e.target.checked ? { add: 'noreposts' } : { remove: 'noreposts' };
|
||||
Lbryio.call('user_tag', 'edit', param);
|
||||
|
@ -411,7 +409,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
|
|||
<FormField
|
||||
type="checkbox"
|
||||
name="share_third_party"
|
||||
onChange={e => toggle3PAnalytics(e.target.checked)}
|
||||
onChange={(e) => toggle3PAnalytics(e.target.checked)}
|
||||
checked={allowAnalytics}
|
||||
label={__('Allow the app to access third party analytics platforms')}
|
||||
helper={__('We use detailed analytics to improve all aspects of the LBRY experience.')}
|
||||
|
@ -438,21 +436,14 @@ class SettingsPage extends React.PureComponent<Props, State> {
|
|||
/>
|
||||
|
||||
<Card
|
||||
title={__('Blocked channels')}
|
||||
subtitle={
|
||||
userBlockedChannelsCount === 0
|
||||
? __("You don't have blocked channels.")
|
||||
: userBlockedChannelsCount === 1
|
||||
? __('You have one blocked channel.')
|
||||
: __('You have %channels% blocked channels.', { channels: userBlockedChannelsCount })
|
||||
}
|
||||
title={__('Blocked and muted channels')}
|
||||
actions={
|
||||
<div className="section__actions">
|
||||
<Button
|
||||
button="secondary"
|
||||
label={__('Manage')}
|
||||
icon={ICONS.SETTINGS}
|
||||
navigate={`/$/${PAGES.BLOCKED}`}
|
||||
navigate={`/$/${PAGES.SETTINGS_BLOCKED_MUTED}`}
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
|
|
|
@ -3,7 +3,7 @@ import * as ACTIONS from 'constants/action_types';
|
|||
import { selectPrefsReady } from 'redux/selectors/sync';
|
||||
import { doAlertWaitingForSync } from 'redux/actions/app';
|
||||
|
||||
export const doToggleBlockChannel = (uri: string) => (dispatch: Dispatch, getState: GetState) => {
|
||||
export const doToggleMuteChannel = (uri: string) => (dispatch: Dispatch, getState: GetState) => {
|
||||
const state = getState();
|
||||
const ready = selectPrefsReady(state);
|
||||
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
// @flow
|
||||
import * as ACTIONS from 'constants/action_types';
|
||||
import * as REACTION_TYPES from 'constants/reactions';
|
||||
import { Lbry, selectClaimsByUri } from 'lbry-redux';
|
||||
import { Lbry, buildURI, selectClaimsByUri, selectMyChannelClaims } from 'lbry-redux';
|
||||
import { doToast, doSeeNotifications } from 'redux/actions/notifications';
|
||||
import {
|
||||
makeSelectCommentIdsForUri,
|
||||
|
@ -50,7 +50,7 @@ export function doCommentList(uri: string, page: number = 1, pageSize: number =
|
|||
});
|
||||
return result;
|
||||
})
|
||||
.catch(error => {
|
||||
.catch((error) => {
|
||||
dispatch({
|
||||
type: ACTIONS.COMMENT_LIST_FAILED,
|
||||
data: error,
|
||||
|
@ -89,7 +89,7 @@ export function doCommentReactList(uri: string | null, commentId?: string) {
|
|||
},
|
||||
});
|
||||
})
|
||||
.catch(error => {
|
||||
.catch((error) => {
|
||||
dispatch({
|
||||
type: ACTIONS.COMMENT_REACTION_LIST_FAILED,
|
||||
data: error,
|
||||
|
@ -171,14 +171,14 @@ export function doCommentReact(commentId: string, type: string) {
|
|||
data: commentId + type,
|
||||
});
|
||||
})
|
||||
.catch(error => {
|
||||
.catch((error) => {
|
||||
dispatch({
|
||||
type: ACTIONS.COMMENT_REACT_FAILED,
|
||||
data: commentId + type,
|
||||
});
|
||||
|
||||
const myRevertedReactsObj = myReacts
|
||||
.filter(el => el !== type)
|
||||
.filter((el) => el !== type)
|
||||
.reduce((acc, el) => {
|
||||
acc[el] = 1;
|
||||
return acc;
|
||||
|
@ -233,7 +233,7 @@ export function doCommentCreate(comment: string = '', claim_id: string = '', par
|
|||
});
|
||||
return result;
|
||||
})
|
||||
.catch(error => {
|
||||
.catch((error) => {
|
||||
dispatch({
|
||||
type: ACTIONS.COMMENT_CREATE_FAILED,
|
||||
data: error,
|
||||
|
@ -274,7 +274,7 @@ export function doCommentPin(commentId: string, remove: boolean) {
|
|||
data: result,
|
||||
});
|
||||
})
|
||||
.catch(error => {
|
||||
.catch((error) => {
|
||||
dispatch({
|
||||
type: ACTIONS.COMMENT_PIN_FAILED,
|
||||
data: error,
|
||||
|
@ -339,7 +339,7 @@ export function doCommentAbandon(commentId: string, creatorChannelUri?: string)
|
|||
);
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
.catch((error) => {
|
||||
dispatch({
|
||||
type: ACTIONS.COMMENT_ABANDON_FAILED,
|
||||
data: error,
|
||||
|
@ -389,7 +389,7 @@ export function doCommentUpdate(comment_id: string, comment: string) {
|
|||
);
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
.catch((error) => {
|
||||
dispatch({
|
||||
type: ACTIONS.COMMENT_UPDATE_FAILED,
|
||||
data: error,
|
||||
|
@ -406,38 +406,157 @@ export function doCommentUpdate(comment_id: string, comment: string) {
|
|||
}
|
||||
|
||||
// Hides a users comments from all creator's claims and prevent them from commenting in the future
|
||||
export function doCommentModBlock(commentAuthor: string) {
|
||||
export function doCommentModToggleBlock(channelUri: string, unblock: boolean = false) {
|
||||
return async (dispatch: Dispatch, getState: GetState) => {
|
||||
const state = getState();
|
||||
const claim = selectClaimsByUri(state)[commentAuthor];
|
||||
const myChannels = selectMyChannelClaims(state);
|
||||
guess I removed it but didn't remove the comment guess I removed it but didn't remove the comment
|
||||
const claim = selectClaimsByUri(state)[channelUri];
|
||||
|
||||
if (!claim) {
|
||||
console.error("Can't find claim to block"); // eslint-disable-line
|
||||
return;
|
||||
}
|
||||
|
||||
const creatorIdToBan = claim ? claim.claim_id : null;
|
||||
const creatorNameToBan = claim ? claim.name : null;
|
||||
const activeChannelClaim = selectActiveChannelClaim(state);
|
||||
dispatch({
|
||||
type: unblock ? ACTIONS.COMMENT_MODERATION_UN_BLOCK_STARTED : ACTIONS.COMMENT_MODERATION_BLOCK_STARTED,
|
||||
data: {
|
||||
uri: channelUri,
|
||||
},
|
||||
});
|
||||
|
||||
let channelSignature = {};
|
||||
if (activeChannelClaim) {
|
||||
try {
|
||||
channelSignature = await Lbry.channel_sign({
|
||||
channel_id: activeChannelClaim.claim_id,
|
||||
hexdata: toHex(activeChannelClaim.name),
|
||||
});
|
||||
} catch (e) {}
|
||||
const creatorIdForAction = claim ? claim.claim_id : null;
|
||||
const creatorNameForAction = claim ? claim.name : null;
|
||||
|
||||
let channelSignatures = [];
|
||||
if (myChannels) {
|
||||
for (const channelClaim of myChannels) {
|
||||
try {
|
||||
const channelSignature = await Lbry.channel_sign({
|
||||
channel_id: channelClaim.claim_id,
|
||||
hexdata: toHex(channelClaim.name),
|
||||
});
|
||||
|
||||
channelSignatures.push({ ...channelSignature, claim_id: channelClaim.claim_id, name: channelClaim.name });
|
||||
} catch (e) {}
|
||||
}
|
||||
}
|
||||
|
||||
return Comments.moderation_block({
|
||||
mod_channel_id: activeChannelClaim.claim_id,
|
||||
mod_channel_name: activeChannelClaim.name,
|
||||
signature: channelSignature.signature,
|
||||
signing_ts: channelSignature.signing_ts,
|
||||
banned_channel_id: creatorIdToBan,
|
||||
banned_channel_name: creatorNameToBan,
|
||||
delete_all: true,
|
||||
});
|
||||
const sharedModBlockParams = unblock
|
||||
? {
|
||||
un_blocked_channel_id: creatorIdForAction,
|
||||
un_blocked_channel_name: creatorNameForAction,
|
||||
}
|
||||
: {
|
||||
blocked_channel_id: creatorIdForAction,
|
||||
blocked_channel_name: creatorNameForAction,
|
||||
};
|
||||
|
||||
const commentAction = unblock ? Comments.moderation_unblock : Comments.moderation_block;
|
||||
|
||||
return Promise.all(
|
||||
channelSignatures.map((signatureData) =>
|
||||
commentAction({
|
||||
mod_channel_id: signatureData.claim_id,
|
||||
mod_channel_name: signatureData.name,
|
||||
signature: signatureData.signature,
|
||||
signing_ts: signatureData.signing_ts,
|
||||
...sharedModBlockParams,
|
||||
})
|
||||
)
|
||||
)
|
||||
.then(() => {
|
||||
dispatch({
|
||||
type: unblock ? ACTIONS.COMMENT_MODERATION_UN_BLOCK_COMPLETE : ACTIONS.COMMENT_MODERATION_BLOCK_COMPLETE,
|
||||
data: { channelUri },
|
||||
});
|
||||
|
||||
if (!unblock) {
|
||||
dispatch(doToast({ message: __('Channel blocked. You will not see them again.') }));
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
dispatch({
|
||||
type: unblock ? ACTIONS.COMMENT_MODERATION_UN_BLOCK_FAILED : ACTIONS.COMMENT_MODERATION_BLOCK_FAILED,
|
||||
});
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
export function doCommentModBlock(commentAuthor: string) {
|
||||
return (dispatch: Dispatch) => {
|
||||
return dispatch(doCommentModToggleBlock(commentAuthor));
|
||||
};
|
||||
}
|
||||
|
||||
export function doCommentModUnBlock(commentAuthor: string) {
|
||||
return (dispatch: Dispatch) => {
|
||||
return dispatch(doCommentModToggleBlock(commentAuthor, true));
|
||||
};
|
||||
}
|
||||
|
||||
export function doFetchModBlockedList() {
|
||||
return async (dispatch: Dispatch, getState: GetState) => {
|
||||
const state = getState();
|
||||
const myChannels = selectMyChannelClaims(state);
|
||||
|
||||
dispatch({
|
||||
type: ACTIONS.COMMENT_MODERATION_BLOCK_LIST_STARTED,
|
||||
});
|
||||
|
||||
let channelSignatures = [];
|
||||
if (myChannels) {
|
||||
for (const channelClaim of myChannels) {
|
||||
try {
|
||||
const channelSignature = await Lbry.channel_sign({
|
||||
channel_id: channelClaim.claim_id,
|
||||
hexdata: toHex(channelClaim.name),
|
||||
});
|
||||
|
||||
channelSignatures.push({ ...channelSignature, claim_id: channelClaim.claim_id, name: channelClaim.name });
|
||||
} catch (e) {}
|
||||
}
|
||||
}
|
||||
|
||||
return Promise.all(
|
||||
channelSignatures.map((signatureData) =>
|
||||
Comments.moderation_block_list({
|
||||
mod_channel_id: signatureData.claim_id,
|
||||
mod_channel_name: signatureData.name,
|
||||
signature: signatureData.signature,
|
||||
signing_ts: signatureData.signing_ts,
|
||||
})
|
||||
)
|
||||
)
|
||||
.then((blockLists) => {
|
||||
let globalBlockList = new Set();
|
||||
blockLists.forEach((channelBlockListData) => {
|
||||
const blockListForChannel = channelBlockListData && channelBlockListData.blocked_channels;
|
||||
if (blockListForChannel) {
|
||||
blockListForChannel.forEach((blockedChannel) => {
|
||||
// REMOVE THIS
|
||||
if (blockedChannel.blocked_channel_name) {
|
||||
const channelUri = buildURI({
|
||||
channelName: blockedChannel.blocked_channel_name,
|
||||
claimId: blockedChannel.blocked_channel_id,
|
||||
});
|
||||
|
||||
globalBlockList.add(channelUri);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
dispatch({
|
||||
type: ACTIONS.COMMENT_MODERATION_BLOCK_LIST_COMPLETED,
|
||||
data: {
|
||||
blockList: Array.from(globalBlockList).reverse(),
|
||||
},
|
||||
});
|
||||
})
|
||||
.catch((err) => {
|
||||
dispatch({
|
||||
type: ACTIONS.COMMENT_MODERATION_BLOCK_LIST_FAILED,
|
||||
});
|
||||
});
|
||||
};
|
||||
}
|
||||
|
|
|
@ -15,9 +15,9 @@ export default handleActions(
|
|||
let newBlockedChannels = blockedChannels.slice();
|
||||
|
||||
if (newBlockedChannels.includes(uri)) {
|
||||
newBlockedChannels = newBlockedChannels.filter(id => id !== uri);
|
||||
newBlockedChannels = newBlockedChannels.filter((id) => id !== uri);
|
||||
} else {
|
||||
newBlockedChannels.push(uri);
|
||||
newBlockedChannels.unshift(uri);
|
||||
}
|
||||
|
||||
return {
|
||||
|
@ -29,7 +29,7 @@ export default handleActions(
|
|||
action: { data: { blocked: ?Array<string> } }
|
||||
) => {
|
||||
const { blocked } = action.data;
|
||||
const sanitizedBlocked = blocked && blocked.filter(e => typeof e === 'string');
|
||||
const sanitizedBlocked = blocked && blocked.filter((e) => typeof e === 'string');
|
||||
return {
|
||||
...state,
|
||||
blockedChannels: sanitizedBlocked && sanitizedBlocked.length ? sanitizedBlocked : state.blockedChannels,
|
||||
|
|
|
@ -16,6 +16,10 @@ const defaultState: CommentsState = {
|
|||
typesReacting: [],
|
||||
myReactsByCommentId: undefined,
|
||||
othersReactsByCommentId: undefined,
|
||||
moderationBlockList: undefined,
|
||||
fetchingModerationBlockList: false,
|
||||
blockingByUri: {},
|
||||
unBlockingByUri: {},
|
||||
};
|
||||
|
||||
export default handleActions(
|
||||
|
@ -144,7 +148,7 @@ export default handleActions(
|
|||
};
|
||||
},
|
||||
|
||||
[ACTIONS.COMMENT_LIST_STARTED]: state => ({ ...state, isLoading: true }),
|
||||
[ACTIONS.COMMENT_LIST_STARTED]: (state) => ({ ...state, isLoading: true }),
|
||||
|
||||
[ACTIONS.COMMENT_LIST_COMPLETED]: (state: CommentsState, action: any) => {
|
||||
const { comments, claimId, uri } = action.data;
|
||||
|
@ -227,17 +231,15 @@ export default handleActions(
|
|||
isLoading: false,
|
||||
};
|
||||
},
|
||||
// do nothing
|
||||
|
||||
[ACTIONS.COMMENT_ABANDON_FAILED]: (state: CommentsState, action: any) => ({
|
||||
...state,
|
||||
isCommenting: false,
|
||||
}),
|
||||
// do nothing
|
||||
[ACTIONS.COMMENT_UPDATE_STARTED]: (state: CommentsState, action: any) => ({
|
||||
...state,
|
||||
isCommenting: true,
|
||||
}),
|
||||
// replace existing comment with comment returned here under its comment_id
|
||||
[ACTIONS.COMMENT_UPDATE_COMPLETED]: (state: CommentsState, action: any) => {
|
||||
const { comment } = action.data;
|
||||
const commentById = Object.assign({}, state.commentById);
|
||||
|
@ -249,25 +251,100 @@ export default handleActions(
|
|||
isCommenting: false,
|
||||
};
|
||||
},
|
||||
// nothing can be done here
|
||||
|
||||
[ACTIONS.COMMENT_UPDATE_FAILED]: (state: CommentsState, action: any) => ({
|
||||
...state,
|
||||
isCmmenting: false,
|
||||
}),
|
||||
// nothing can really be done here
|
||||
[ACTIONS.COMMENT_HIDE_STARTED]: (state: CommentsState, action: any) => ({
|
||||
[ACTIONS.COMMENT_MODERATION_BLOCK_LIST_STARTED]: (state: CommentsState, action: any) => ({
|
||||
...state,
|
||||
isLoading: true,
|
||||
fetchingModerationBlockList: true,
|
||||
}),
|
||||
[ACTIONS.COMMENT_HIDE_COMPLETED]: (state: CommentsState, action: any) => ({
|
||||
...state, // todo: add HiddenComments state & create selectors
|
||||
isLoading: false,
|
||||
}),
|
||||
// nothing can be done here
|
||||
[ACTIONS.COMMENT_HIDE_FAILED]: (state: CommentsState, action: any) => ({
|
||||
[ACTIONS.COMMENT_MODERATION_BLOCK_LIST_COMPLETED]: (state: CommentsState, action: any) => {
|
||||
const { blockList } = action.data;
|
||||
|
||||
return {
|
||||
...state,
|
||||
moderationBlockList: blockList,
|
||||
fetchingModerationBlockList: false,
|
||||
};
|
||||
},
|
||||
[ACTIONS.COMMENT_MODERATION_BLOCK_LIST_FAILED]: (state: CommentsState, action: any) => ({
|
||||
...state,
|
||||
isLoading: false,
|
||||
fetchingModerationBlockList: false,
|
||||
}),
|
||||
|
||||
[ACTIONS.COMMENT_MODERATION_BLOCK_STARTED]: (state: CommentsState, action: any) => ({
|
||||
...state,
|
||||
blockingByUri: {
|
||||
...state.blockingByUri,
|
||||
[action.data.uri]: true,
|
||||
},
|
||||
}),
|
||||
|
||||
[ACTIONS.COMMENT_MODERATION_UN_BLOCK_STARTED]: (state: CommentsState, action: any) => ({
|
||||
...state,
|
||||
unBlockingByUri: {
|
||||
...state.unBlockingByUri,
|
||||
[action.data.uri]: true,
|
||||
},
|
||||
}),
|
||||
[ACTIONS.COMMENT_MODERATION_BLOCK_FAILED]: (state: CommentsState, action: any) => ({
|
||||
...state,
|
||||
blockingByUri: {
|
||||
...state.blockingByUri,
|
||||
[action.data.uri]: false,
|
||||
},
|
||||
}),
|
||||
|
||||
[ACTIONS.COMMENT_MODERATION_UN_BLOCK_FAILED]: (state: CommentsState, action: any) => ({
|
||||
...state,
|
||||
unBlockingByUri: {
|
||||
...state.unBlockingByUri,
|
||||
[action.data.uri]: false,
|
||||
},
|
||||
}),
|
||||
|
||||
[ACTIONS.COMMENT_MODERATION_BLOCK_COMPLETE]: (state: CommentsState, action: any) => {
|
||||
const { channelUri } = action.data;
|
||||
const commentById = Object.assign({}, state.commentById);
|
||||
const blockingByUri = Object.assign({}, state.blockingByUri);
|
||||
const moderationBlockList = state.moderationBlockList || [];
|
||||
const newModerationBlockList = moderationBlockList.slice();
|
||||
|
||||
for (const commentId in commentById) {
|
||||
const comment = commentById[commentId];
|
||||
|
||||
if (channelUri === comment.channel_url) {
|
||||
delete commentById[comment.comment_id];
|
||||
}
|
||||
}
|
||||
|
||||
delete blockingByUri[channelUri];
|
||||
|
||||
newModerationBlockList.push(channelUri);
|
||||
|
||||
return {
|
||||
...state,
|
||||
commentById,
|
||||
blockingByUri,
|
||||
moderationBlockList: newModerationBlockList,
|
||||
};
|
||||
},
|
||||
[ACTIONS.COMMENT_MODERATION_UN_BLOCK_COMPLETE]: (state: CommentsState, action: any) => {
|
||||
const { channelUri } = action.data;
|
||||
const unBlockingByUri = Object.assign(state.unBlockingByUri, {});
|
||||
const moderationBlockList = state.moderationBlockList || [];
|
||||
const newModerationBlockList = moderationBlockList.slice().filter((uri) => uri !== channelUri);
|
||||
|
||||
delete unBlockingByUri[channelUri];
|
||||
|
||||
return {
|
||||
...state,
|
||||
unBlockingByUri,
|
||||
moderationBlockList: newModerationBlockList,
|
||||
};
|
||||
},
|
||||
},
|
||||
defaultState
|
||||
);
|
||||
|
|
|
@ -3,23 +3,11 @@ import { createSelector } from 'reselect';
|
|||
|
||||
const selectState = (state: { blocked: BlocklistState }) => state.blocked || {};
|
||||
|
||||
export const selectBlockedChannels = createSelector(selectState, (state: BlocklistState) => {
|
||||
return state.blockedChannels.filter(e => typeof e === 'string');
|
||||
export const selectMutedChannels = createSelector(selectState, (state: BlocklistState) => {
|
||||
return state.blockedChannels.filter((e) => typeof e === 'string');
|
||||
});
|
||||
|
||||
export const selectBlockedChannelsCount = createSelector(selectBlockedChannels, (state: Array<string>) => state.length);
|
||||
|
||||
export const selectBlockedChannelsObj = createSelector(selectState, (state: BlocklistState) => {
|
||||
return state.blockedChannels.reduce((acc: any, val: any) => {
|
||||
const outpoint = `${val.txid}:${String(val.nout)}`;
|
||||
return {
|
||||
...acc,
|
||||
[outpoint]: 1,
|
||||
};
|
||||
}, {});
|
||||
});
|
||||
|
||||
export const selectChannelIsBlocked = (uri: string) =>
|
||||
createSelector(selectBlockedChannels, (state: Array<string>) => {
|
||||
export const makeSelectChannelIsMuted = (uri: string) =>
|
||||
createSelector(selectMutedChannels, (state: Array<string>) => {
|
||||
return state.includes(uri);
|
||||
});
|
||||
|
|
|
@ -1,22 +1,28 @@
|
|||
// @flow
|
||||
import * as SETTINGS from 'constants/settings';
|
||||
import { createSelector } from 'reselect';
|
||||
import { selectBlockedChannels } from 'redux/selectors/blocked';
|
||||
import { selectMutedChannels } from 'redux/selectors/blocked';
|
||||
import { makeSelectClientSetting } from 'redux/selectors/settings';
|
||||
import { selectBlacklistedOutpointMap, selectFilteredOutpointMap } from 'lbryinc';
|
||||
import { selectClaimsById, isClaimNsfw, selectMyActiveClaims } from 'lbry-redux';
|
||||
|
||||
const selectState = state => state.comments || {};
|
||||
const selectState = (state) => state.comments || {};
|
||||
|
||||
export const selectCommentsById = createSelector(selectState, state => state.commentById || {});
|
||||
|
||||
export const selectIsFetchingComments = createSelector(selectState, state => state.isLoading);
|
||||
|
||||
export const selectIsPostingComment = createSelector(selectState, state => state.isCommenting);
|
||||
|
||||
export const selectIsFetchingReacts = createSelector(selectState, state => state.isFetchingReacts);
|
||||
|
||||
export const selectOthersReactsById = createSelector(selectState, state => state.othersReactsByCommentId);
|
||||
export const selectCommentsById = createSelector(selectState, (state) => state.commentById || {});
|
||||
export const selectIsFetchingComments = createSelector(selectState, (state) => state.isLoading);
|
||||
export const selectIsPostingComment = createSelector(selectState, (state) => state.isCommenting);
|
||||
export const selectIsFetchingReacts = createSelector(selectState, (state) => state.isFetchingReacts);
|
||||
export const selectOthersReactsById = createSelector(selectState, (state) => state.othersReactsByCommentId);
|
||||
export const selectModerationBlockList = createSelector(
|
||||
selectState,
|
||||
(state) => state.moderationBlockList && state.moderationBlockList.reverse()
|
||||
);
|
||||
export const selectBlockingByUri = createSelector(selectState, (state) => state.blockingByUri);
|
||||
export const selectUnBlockingByUri = createSelector(selectState, (state) => state.unBlockingByUri);
|
||||
export const selectFetchingModerationBlockList = createSelector(
|
||||
selectState,
|
||||
(state) => state.fetchingModerationBlockList
|
||||
);
|
||||
|
||||
export const selectCommentsByClaimId = createSelector(selectState, selectCommentsById, (state, byId) => {
|
||||
const byClaimId = state.byId || {};
|
||||
|
@ -40,7 +46,7 @@ export const selectTopLevelCommentsByClaimId = createSelector(selectState, selec
|
|||
const comments = {};
|
||||
|
||||
// replace every comment_id in the list with the actual comment object
|
||||
Object.keys(byClaimId).forEach(claimId => {
|
||||
Object.keys(byClaimId).forEach((claimId) => {
|
||||
const commentIds = byClaimId[claimId];
|
||||
|
||||
comments[claimId] = Array(commentIds === null ? 0 : commentIds.length);
|
||||
|
@ -53,14 +59,14 @@ export const selectTopLevelCommentsByClaimId = createSelector(selectState, selec
|
|||
});
|
||||
|
||||
export const makeSelectCommentForCommentId = (commentId: string) =>
|
||||
createSelector(selectCommentsById, comments => comments[commentId]);
|
||||
createSelector(selectCommentsById, (comments) => comments[commentId]);
|
||||
|
||||
export const selectRepliesByParentId = createSelector(selectState, selectCommentsById, (state, byId) => {
|
||||
const byParentId = state.repliesByParentId || {};
|
||||
const comments = {};
|
||||
|
||||
// replace every comment_id in the list with the actual comment object
|
||||
Object.keys(byParentId).forEach(id => {
|
||||
Object.keys(byParentId).forEach((id) => {
|
||||
const commentIds = byParentId[id];
|
||||
|
||||
comments[id] = Array(commentIds === null ? 0 : commentIds.length);
|
||||
|
@ -77,10 +83,10 @@ export const selectRepliesByParentId = createSelector(selectState, selectComment
|
|||
selectState,
|
||||
state => state.byId || {}
|
||||
); */
|
||||
export const selectCommentsByUri = createSelector(selectState, state => {
|
||||
export const selectCommentsByUri = createSelector(selectState, (state) => {
|
||||
const byUri = state.commentsByUri || {};
|
||||
const comments = {};
|
||||
Object.keys(byUri).forEach(uri => {
|
||||
Object.keys(byUri).forEach((uri) => {
|
||||
const claimId = byUri[uri];
|
||||
if (claimId === null) {
|
||||
comments[uri] = null;
|
||||
|
@ -99,16 +105,16 @@ export const makeSelectCommentIdsForUri = (uri: string) =>
|
|||
});
|
||||
|
||||
export const makeSelectMyReactionsForComment = (commentId: string) =>
|
||||
createSelector(selectState, state => {
|
||||
createSelector(selectState, (state) => {
|
||||
return state.myReactsByCommentId[commentId] || [];
|
||||
});
|
||||
|
||||
export const makeSelectOthersReactionsForComment = (commentId: string) =>
|
||||
createSelector(selectState, state => {
|
||||
createSelector(selectState, (state) => {
|
||||
return state.othersReactsByCommentId[commentId];
|
||||
});
|
||||
|
||||
export const selectPendingCommentReacts = createSelector(selectState, state => state.pendingCommentReactions);
|
||||
export const selectPendingCommentReacts = createSelector(selectState, (state) => state.pendingCommentReactions);
|
||||
|
||||
export const makeSelectCommentsForUri = (uri: string) =>
|
||||
createSelector(
|
||||
|
@ -116,7 +122,7 @@ export const makeSelectCommentsForUri = (uri: string) =>
|
|||
selectCommentsByUri,
|
||||
selectClaimsById,
|
||||
selectMyActiveClaims,
|
||||
selectBlockedChannels,
|
||||
selectMutedChannels,
|
||||
selectBlacklistedOutpointMap,
|
||||
selectFilteredOutpointMap,
|
||||
makeSelectClientSetting(SETTINGS.SHOW_MATURE),
|
||||
|
@ -125,7 +131,12 @@ export const makeSelectCommentsForUri = (uri: string) =>
|
|||
const comments = byClaimId && byClaimId[claimId];
|
||||
|
||||
return comments
|
||||
? comments.filter(comment => {
|
||||
? comments.filter((comment) => {
|
||||
if (!comment) {
|
||||
// It may have been recently deleted after being blocked
|
||||
return false;
|
||||
}
|
||||
|
||||
const channelClaim = claimsById[comment.channel_id];
|
||||
|
||||
// Return comment if `channelClaim` doesn't exist so the component knows to resolve the author
|
||||
|
@ -162,7 +173,7 @@ export const makeSelectTopLevelCommentsForUri = (uri: string) =>
|
|||
selectCommentsByUri,
|
||||
selectClaimsById,
|
||||
selectMyActiveClaims,
|
||||
selectBlockedChannels,
|
||||
selectMutedChannels,
|
||||
selectBlacklistedOutpointMap,
|
||||
selectFilteredOutpointMap,
|
||||
makeSelectClientSetting(SETTINGS.SHOW_MATURE),
|
||||
|
@ -171,7 +182,7 @@ export const makeSelectTopLevelCommentsForUri = (uri: string) =>
|
|||
const comments = byClaimId && byClaimId[claimId];
|
||||
|
||||
return comments
|
||||
? comments.filter(comment => {
|
||||
? comments.filter((comment) => {
|
||||
if (!comment) {
|
||||
return false;
|
||||
}
|
||||
|
@ -212,7 +223,7 @@ export const makeSelectRepliesForParentId = (id: string) =>
|
|||
selectCommentsById,
|
||||
selectClaimsById,
|
||||
selectMyActiveClaims,
|
||||
selectBlockedChannels,
|
||||
selectMutedChannels,
|
||||
selectBlacklistedOutpointMap,
|
||||
selectFilteredOutpointMap,
|
||||
makeSelectClientSetting(SETTINGS.SHOW_MATURE),
|
||||
|
@ -223,13 +234,13 @@ export const makeSelectRepliesForParentId = (id: string) =>
|
|||
if (!replyIdsForParent.length) return null;
|
||||
|
||||
const comments = [];
|
||||
replyIdsForParent.forEach(cid => {
|
||||
replyIdsForParent.forEach((cid) => {
|
||||
comments.push(commentsById[cid]);
|
||||
});
|
||||
// const comments = byParentId && byParentId[id];
|
||||
|
||||
return comments
|
||||
? comments.filter(comment => {
|
||||
? comments.filter((comment) => {
|
||||
if (!comment) {
|
||||
return false;
|
||||
}
|
||||
|
@ -265,6 +276,20 @@ export const makeSelectRepliesForParentId = (id: string) =>
|
|||
);
|
||||
|
||||
export const makeSelectTotalCommentsCountForUri = (uri: string) =>
|
||||
createSelector(makeSelectCommentsForUri(uri), comments => {
|
||||
createSelector(makeSelectCommentsForUri(uri), (comments) => {
|
||||
return comments ? comments.length : 0;
|
||||
});
|
||||
|
||||
export const makeSelectChannelIsBlocked = (uri: string) =>
|
||||
createSelector(selectModerationBlockList, (blockedChannelUris) => {
|
||||
if (!blockedChannelUris || !blockedChannelUris) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return blockedChannelUris.includes(uri);
|
||||
});
|
||||
|
||||
export const makeSelectUriIsBlockingOrUnBlocking = (uri: string) =>
|
||||
createSelector(selectBlockingByUri, selectUnBlockingByUri, (blockingByUri, unBlockingByUri) => {
|
||||
return blockingByUri[uri] || unBlockingByUri[uri];
|
||||
});
|
||||
|
|
|
@ -13,7 +13,7 @@ import {
|
|||
makeSelectFileNameForUri,
|
||||
} from 'lbry-redux';
|
||||
import { makeSelectRecommendedContentForUri } from 'redux/selectors/search';
|
||||
import { selectBlockedChannels } from 'redux/selectors/blocked';
|
||||
import { selectMutedChannels } from 'redux/selectors/blocked';
|
||||
import { selectAllCostInfoByUri, makeSelectCostInfoForUri } from 'lbryinc';
|
||||
import { selectShowMatureContent } from 'redux/selectors/settings';
|
||||
import * as RENDER_MODES from 'constants/file_render_modes';
|
||||
|
@ -81,7 +81,7 @@ export const makeSelectNextUnplayedRecommended = (uri: string) =>
|
|||
selectHistory,
|
||||
selectClaimsByUri,
|
||||
selectAllCostInfoByUri,
|
||||
selectBlockedChannels,
|
||||
selectMutedChannels,
|
||||
(
|
||||
recommendedForUri: Array<string>,
|
||||
history: Array<{ uri: string }>,
|
||||
|
|
|
@ -390,6 +390,16 @@ $metadata-z-index: 1;
|
|||
padding: 0;
|
||||
}
|
||||
|
||||
.channel-staked__wrapper--inline {
|
||||
position: relative;
|
||||
background-color: transparent;
|
||||
display: inline-block;
|
||||
bottom: auto;
|
||||
left: auto;
|
||||
top: var(--spacing-xs);
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.channel-staked__indicator {
|
||||
margin-left: 2px;
|
||||
z-index: 3;
|
||||
|
|
|
@ -64,6 +64,12 @@
|
|||
.claim-preview__wrapper {
|
||||
padding: var(--spacing-m);
|
||||
list-style: none;
|
||||
|
||||
&:hover {
|
||||
.claim__menu-button {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.claim-preview__wrapper--notice {
|
||||
|
@ -247,17 +253,6 @@
|
|||
|
||||
.claim-preview-info {
|
||||
align-items: flex-start;
|
||||
|
||||
.channel-thumbnail {
|
||||
display: none;
|
||||
@include handleChannelGif(1.4rem);
|
||||
margin-right: 0;
|
||||
margin-left: var(--spacing-s);
|
||||
|
||||
@media (min-width: $breakpoint-small) {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.claim-preview-info,
|
||||
|
@ -408,6 +403,10 @@
|
|||
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
|
||||
.claim__menu-button {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: $breakpoint-large) {
|
||||
|
@ -456,12 +455,23 @@
|
|||
}
|
||||
|
||||
.claim-tile__title {
|
||||
margin: var(--spacing-s);
|
||||
position: relative;
|
||||
|
||||
padding: var(--spacing-s);
|
||||
padding-right: var(--spacing-m);
|
||||
padding-bottom: 0;
|
||||
margin-bottom: var(--spacing-s);
|
||||
|
||||
font-weight: 600;
|
||||
color: var(--color-text);
|
||||
font-size: var(--font-small);
|
||||
min-height: 2rem;
|
||||
|
||||
.claim__menu-button {
|
||||
right: 0.2rem;
|
||||
top: var(--spacing-s);
|
||||
}
|
||||
|
||||
@media (min-width: $breakpoint-small) {
|
||||
min-height: 2.5rem;
|
||||
}
|
||||
|
@ -571,3 +581,36 @@
|
|||
.claim-preview__null-label {
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.claim-preview__channel-staked {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.channel-thumbnail {
|
||||
@include handleChannelGif(1.4rem);
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.claim__menu-button {
|
||||
position: absolute;
|
||||
top: var(--spacing-xs);
|
||||
right: var(--spacing-xs);
|
||||
|
||||
.icon {
|
||||
stroke: var(--color-text);
|
||||
}
|
||||
|
||||
&:not([aria-expanded='true']) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.claim__menu-button--inline {
|
||||
position: relative;
|
||||
display: block;
|
||||
right: auto;
|
||||
top: auto;
|
||||
@extend .button--alt;
|
||||
padding: 0 var(--spacing-xxs);
|
||||
}
|
||||
|
|
|
@ -43,6 +43,15 @@
|
|||
box-shadow: none;
|
||||
}
|
||||
|
||||
.menu__button {
|
||||
&:hover {
|
||||
.icon {
|
||||
border-radius: var(--border-radius);
|
||||
background-color: var(--color-card-background-highlighted);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.menu__title {
|
||||
&[aria-expanded='true'] {
|
||||
background-color: var(--color-primary-alt);
|
||||
|
@ -54,16 +63,7 @@
|
|||
animation: menu-animate-in var(--animation-duration) var(--animation-style);
|
||||
border-bottom-left-radius: var(--border-radius);
|
||||
border-bottom-right-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.menu__list--header {
|
||||
@extend .menu__list;
|
||||
padding: var(--spacing-xs);
|
||||
margin-top: 19px;
|
||||
}
|
||||
|
||||
.menu__list--comments {
|
||||
@extend .menu__list;
|
||||
border: 1px solid var(--color-border);
|
||||
border-radius: var(--border-radius);
|
||||
padding: var(--spacing-xs) 0;
|
||||
|
@ -73,6 +73,15 @@
|
|||
}
|
||||
}
|
||||
|
||||
.menu__list--header {
|
||||
@extend .menu__list;
|
||||
margin-top: 19px;
|
||||
}
|
||||
|
||||
.menu__list--comments {
|
||||
@extend .menu__list;
|
||||
}
|
||||
|
||||
.menu__link {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
|
@ -36,7 +36,7 @@
|
|||
--color-button-primary-bg-hover: var(--color-primary-alt-2);
|
||||
--color-button-primary-hover-text: var(--color-primary-alt);
|
||||
--color-button-secondary-bg: var(--color-secondary-alt);
|
||||
--color-button-secondary-border: #c5d7ed;
|
||||
--color-button-secondary-border: var(--color-secondary-alt);
|
||||
--color-button-secondary-text: var(--color-secondary);
|
||||
--color-button-secondary-bg-hover: #b9d0e9;
|
||||
--color-button-alt-bg: var(--color-gray-1);
|
||||
|
|
|
@ -24,9 +24,9 @@ function isNotFunction(object) {
|
|||
}
|
||||
|
||||
function createBulkThunkMiddleware() {
|
||||
return ({ dispatch, getState }) => next => action => {
|
||||
return ({ dispatch, getState }) => (next) => (action) => {
|
||||
if (action.type === 'BATCH_ACTIONS') {
|
||||
action.actions.filter(isFunction).map(actionFn => actionFn(dispatch, getState));
|
||||
action.actions.filter(isFunction).map((actionFn) => actionFn(dispatch, getState));
|
||||
}
|
||||
return next(action);
|
||||
};
|
||||
|
@ -68,7 +68,6 @@ const subscriptionsFilter = createFilter('subscriptions', ['subscriptions']);
|
|||
const blockedFilter = createFilter('blocked', ['blockedChannels']);
|
||||
const settingsFilter = createBlacklistFilter('settings', ['loadedLanguages', 'language']);
|
||||
const whiteListedReducers = [
|
||||
'comments',
|
||||
'fileInfo',
|
||||
'publish',
|
||||
'wallet',
|
||||
|
@ -143,7 +142,7 @@ const sharedStateFilters = {
|
|||
subscriptions: {
|
||||
source: 'subscriptions',
|
||||
property: 'subscriptions',
|
||||
transform: function(value) {
|
||||
transform: (value) => {
|
||||
return value.map(({ uri }) => uri);
|
||||
},
|
||||
},
|
||||
|
@ -162,7 +161,7 @@ const sharedStateCb = ({ dispatch, getState }) => {
|
|||
};
|
||||
|
||||
const populateAuthTokenHeader = () => {
|
||||
return next => action => {
|
||||
return (next) => (action) => {
|
||||
if (
|
||||
(action.type === ACTIONS.USER_FETCH_SUCCESS || action.type === ACTIONS.AUTHENTICATION_SUCCESS) &&
|
||||
action.data.user.has_verified_email === true
|
||||
|
|
|
@ -1,8 +1,50 @@
|
|||
// @flow
|
||||
|
||||
const EMOJI_REGEX = /(?:[\u2700-\u27bf]|(?:\ud83c[\udde6-\uddff]){2}|[\ud800-\udbff][\udc00-\udfff])[\ufe0e\ufe0f]?(?:[\u0300-\u036f\ufe20-\ufe23\u20d0-\u20f0]|\ud83c[\udffb-\udfff])?(?:\u200d(?:[^\ud800-\udfff]|(?:\ud83c[\udde6-\uddff]){2}|[\ud800-\udbff][\udc00-\udfff])[\ufe0e\ufe0f]?(?:[\u0300-\u036f\ufe20-\ufe23\u20d0-\u20f0]|\ud83c[\udffb-\udfff])?)*/g;
|
||||
|
||||
export function toHex(str: string): string {
|
||||
var result = '';
|
||||
for (var i = 0; i < str.length; i++) {
|
||||
result += str.charCodeAt(i).toString(16);
|
||||
const array = Array.from(str);
|
||||
|
||||
let result = '';
|
||||
|
||||
for (var i = 0; i < array.length; i++) {
|
||||
const val = array[i];
|
||||
|
||||
const isEmoji = EMOJI_REGEX.test(val);
|
||||
|
||||
const utf = isEmoji
|
||||
? toUTF8Array(val)
|
||||
.map((num) => num.toString(16))
|
||||
.join('')
|
||||
: val.charCodeAt(0).toString(16);
|
||||
|
||||
result += utf;
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
function toUTF8Array(str) {
|
||||
var utf8 = [];
|
||||
for (var i = 0; i < str.length; i++) {
|
||||
var charcode = str.charCodeAt(i);
|
||||
if (charcode < 0x80) utf8.push(charcode);
|
||||
else if (charcode < 0x800) {
|
||||
utf8.push(0xc0 | (charcode >> 6), 0x80 | (charcode & 0x3f));
|
||||
} else if (charcode < 0xd800 || charcode >= 0xe000) {
|
||||
utf8.push(0xe0 | (charcode >> 12), 0x80 | ((charcode >> 6) & 0x3f), 0x80 | (charcode & 0x3f));
|
||||
}
|
||||
// surrogate pair
|
||||
else {
|
||||
i++;
|
||||
charcode = (((charcode & 0x3ff) << 10) | (str.charCodeAt(i) & 0x3ff)) + 0x010000;
|
||||
utf8.push(
|
||||
0xf0 | (charcode >> 18),
|
||||
0x80 | ((charcode >> 12) & 0x3f),
|
||||
0x80 | ((charcode >> 6) & 0x3f),
|
||||
0x80 | (charcode & 0x3f)
|
||||
);
|
||||
}
|
||||
}
|
||||
return utf8;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue
remove what?
do something with this later, maybe, I suppose.