add ability to mark all subscriptions as read
This commit is contained in:
parent
0562ed866b
commit
c07214ef7a
7 changed files with 108 additions and 21 deletions
|
@ -1,7 +1,7 @@
|
|||
// @flow
|
||||
import type { Claim } from 'types/claim';
|
||||
import * as ICONS from 'constants/icons';
|
||||
import * as React from 'react';
|
||||
import React, { PureComponent } from 'react';
|
||||
import { normalizeURI } from 'lbry-redux';
|
||||
import ToolTip from 'component/common/tooltip';
|
||||
import FileCard from 'component/fileCard';
|
||||
|
|
10
src/renderer/component/subscribeMarkAsRead/index.js
Normal file
10
src/renderer/component/subscribeMarkAsRead/index.js
Normal file
|
@ -0,0 +1,10 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { doRemoveUnreadSubscriptions } from 'redux/actions/subscriptions';
|
||||
import MarkAsRead from './view';
|
||||
|
||||
export default connect(
|
||||
null,
|
||||
{
|
||||
doRemoveUnreadSubscriptions,
|
||||
}
|
||||
)(MarkAsRead);
|
40
src/renderer/component/subscribeMarkAsRead/view.jsx
Normal file
40
src/renderer/component/subscribeMarkAsRead/view.jsx
Normal file
|
@ -0,0 +1,40 @@
|
|||
// @flow
|
||||
import * as ICONS from 'constants/icons';
|
||||
import React, { PureComponent } from 'react';
|
||||
import Button from 'component/button';
|
||||
|
||||
type Props = {
|
||||
channel: ?string,
|
||||
doRemoveUnreadSubscriptions: (?string) => void,
|
||||
};
|
||||
|
||||
export default class MarkAsRead extends PureComponent<Props> {
|
||||
constructor() {
|
||||
super();
|
||||
(this: any).handleClick = this.handleClick.bind(this);
|
||||
}
|
||||
|
||||
handleClick() {
|
||||
const { channel, doRemoveUnreadSubscriptions } = this.props;
|
||||
|
||||
// If there is no channel, mark all as read
|
||||
// If there is a channel, only mark that channel as read
|
||||
if (channel) {
|
||||
doRemoveUnreadSubscriptions(channel);
|
||||
} else {
|
||||
doRemoveUnreadSubscriptions();
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Button
|
||||
noPadding
|
||||
button="inverse"
|
||||
icon={ICONS.CHECK_SIMPLE}
|
||||
label={__('Mark as read')}
|
||||
onClick={this.handleClick}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
|
@ -11,6 +11,7 @@ import FileCard from 'component/fileCard';
|
|||
import { parseURI } from 'lbry-redux';
|
||||
import Native from 'native';
|
||||
import SuggestedSubscriptions from 'component/subscribeSuggested';
|
||||
import MarkAsRead from 'component/subscribeMarkAsRead';
|
||||
|
||||
type Props = {
|
||||
viewMode: ViewMode,
|
||||
|
@ -90,7 +91,10 @@ export default (props: Props) => {
|
|||
<div className="card__content">
|
||||
{viewMode === VIEW_ALL && (
|
||||
<Fragment>
|
||||
<div className="card__title">{__('Your subscriptions')}</div>
|
||||
<div className="card__title card__actions card__actions--no-margin">
|
||||
{__('Your subscriptions')}
|
||||
{unreadSubscriptions.length > 0 && <MarkAsRead />}
|
||||
</div>
|
||||
<FileList hideFilter sortByHeight fileInfos={subscriptions} />
|
||||
</Fragment>
|
||||
)}
|
||||
|
@ -102,13 +106,14 @@ export default (props: Props) => {
|
|||
const { claimName } = parseURI(channel);
|
||||
return (
|
||||
<section key={channel}>
|
||||
<div className="card__title">
|
||||
<div className="card__title card__actions card__actions--no-margin">
|
||||
<Button
|
||||
button="link"
|
||||
navigate="/show"
|
||||
navigateParams={{ uri: channel }}
|
||||
label={claimName}
|
||||
/>
|
||||
<MarkAsRead channel={channel} />
|
||||
</div>
|
||||
<div className="card__list card__content">
|
||||
{uris.map(uri => <FileCard key={uri} uri={uri} />)}
|
||||
|
|
|
@ -167,28 +167,44 @@ export const doUpdateUnreadSubscriptions = (
|
|||
};
|
||||
|
||||
// Remove multiple files (or all) from a channels unread subscriptions
|
||||
export const doRemoveUnreadSubscriptions = (channelUri: string, readUris: Array<string>) => (
|
||||
export const doRemoveUnreadSubscriptions = (channelUri: ?string, readUris: ?Array<string>) => (
|
||||
dispatch: ReduxDispatch,
|
||||
getState: GetState
|
||||
) => {
|
||||
const state = getState();
|
||||
const unreadByChannel = selectUnreadByChannel(state);
|
||||
|
||||
// If no channel is passed in, remove all unread subscriptions from all channels
|
||||
if (!channelUri) {
|
||||
return dispatch({
|
||||
type: ACTIONS.REMOVE_SUBSCRIPTION_UNREADS,
|
||||
data: { channel: null },
|
||||
});
|
||||
}
|
||||
|
||||
const currentChannelUnread = unreadByChannel[channelUri];
|
||||
if (!currentChannelUnread || !currentChannelUnread.uris) {
|
||||
// Channel passed in doesn't have any unreads
|
||||
return;
|
||||
}
|
||||
|
||||
// For each uri passed in, remove it from the list of unread uris
|
||||
const urisToRemoveMap = readUris.reduce(
|
||||
(acc, val) => ({
|
||||
...acc,
|
||||
[val]: true,
|
||||
}),
|
||||
{}
|
||||
);
|
||||
// If no uris are passed in, remove them all
|
||||
let newUris;
|
||||
if (readUris) {
|
||||
const urisToRemoveMap = readUris.reduce(
|
||||
(acc, val) => ({
|
||||
...acc,
|
||||
[val]: true,
|
||||
}),
|
||||
{}
|
||||
);
|
||||
|
||||
const filteredUris = currentChannelUnread.uris.filter(uri => !urisToRemoveMap[uri]);
|
||||
const newUris = filteredUris.length ? filteredUris : null;
|
||||
const filteredUris = currentChannelUnread.uris.filter(uri => !urisToRemoveMap[uri]);
|
||||
newUris = filteredUris.length ? filteredUris : null;
|
||||
} else {
|
||||
newUris = null;
|
||||
}
|
||||
|
||||
dispatch({
|
||||
type: ACTIONS.REMOVE_SUBSCRIPTION_UNREADS,
|
||||
|
|
|
@ -66,10 +66,11 @@ export default handleActions(
|
|||
action: SetSubscriptionLatest
|
||||
): SubscriptionState => ({
|
||||
...state,
|
||||
subscriptions: state.subscriptions.map(subscription =>
|
||||
subscription.channelName === action.data.subscription.channelName
|
||||
? { ...subscription, latest: action.data.uri }
|
||||
: subscription
|
||||
subscriptions: state.subscriptions.map(
|
||||
subscription =>
|
||||
subscription.channelName === action.data.subscription.channelName
|
||||
? { ...subscription, latest: action.data.uri }
|
||||
: subscription
|
||||
),
|
||||
}),
|
||||
[ACTIONS.UPDATE_SUBSCRIPTION_UNREADS]: (
|
||||
|
@ -94,12 +95,19 @@ export default handleActions(
|
|||
action: DoRemoveSubscriptionUnreads
|
||||
): SubscriptionState => {
|
||||
const { channel, uris } = action.data;
|
||||
const newUnread = { ...state.unread };
|
||||
|
||||
if (!uris) {
|
||||
delete newUnread[channel];
|
||||
// If no channel is passed in, remove all unreads
|
||||
let newUnread;
|
||||
if (channel) {
|
||||
newUnread = { ...state.unread };
|
||||
|
||||
if (!uris) {
|
||||
delete newUnread[channel];
|
||||
} else {
|
||||
newUnread[channel].uris = uris;
|
||||
}
|
||||
} else {
|
||||
newUnread[channel].uris = uris;
|
||||
newUnread = {};
|
||||
}
|
||||
|
||||
return {
|
||||
|
|
|
@ -32,6 +32,14 @@
|
|||
}
|
||||
}
|
||||
|
||||
&.btn--no-padding {
|
||||
.btn__content {
|
||||
padding: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
&.btn--alt {
|
||||
&:not(:disabled) {
|
||||
background-color: $lbry-white;
|
||||
|
|
Loading…
Reference in a new issue