sforkowany z mirror/soapbox
Remove BirthdayReminders component
Alex Gleason
rodzic
67b0b6a317
commit
6968c6bf40
|
|
@ -1,161 +0,0 @@
|
|||
|
||||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
import { HotKeys } from 'react-hotkeys';
|
||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||
import ImmutablePureComponent from 'react-immutable-pure-component';
|
||||
import { injectIntl, FormattedMessage } from 'react-intl';
|
||||
import { connect } from 'react-redux';
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
import { fetchBirthdayReminders } from 'soapbox/actions/accounts';
|
||||
import { openModal } from 'soapbox/actions/modals';
|
||||
import Icon from 'soapbox/components/icon';
|
||||
import { HStack, Text } from 'soapbox/components/ui';
|
||||
import { makeGetAccount } from 'soapbox/selectors';
|
||||
|
||||
const mapStateToProps = (state, props) => {
|
||||
const me = state.get('me');
|
||||
const getAccount = makeGetAccount();
|
||||
|
||||
const birthdays = state.getIn(['user_lists', 'birthday_reminders', me]);
|
||||
|
||||
if (birthdays?.size > 0) {
|
||||
return {
|
||||
birthdays,
|
||||
account: getAccount(state, birthdays.first()),
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
birthdays,
|
||||
};
|
||||
};
|
||||
|
||||
export default @connect(mapStateToProps)
|
||||
@injectIntl
|
||||
class BirthdayReminders extends ImmutablePureComponent {
|
||||
|
||||
static propTypes = {
|
||||
birthdays: ImmutablePropTypes.orderedSet,
|
||||
intl: PropTypes.object.isRequired,
|
||||
dispatch: PropTypes.func.isRequired,
|
||||
onMoveDown: PropTypes.func,
|
||||
};
|
||||
|
||||
componentDidMount() {
|
||||
const { dispatch } = this.props;
|
||||
|
||||
const date = new Date();
|
||||
|
||||
const day = date.getDate();
|
||||
const month = date.getMonth() + 1;
|
||||
|
||||
dispatch(fetchBirthdayReminders(month, day));
|
||||
}
|
||||
|
||||
getHandlers() {
|
||||
return {
|
||||
open: this.handleOpenBirthdaysModal,
|
||||
moveDown: this.props.onMoveDown,
|
||||
};
|
||||
}
|
||||
|
||||
handleOpenBirthdaysModal = () => {
|
||||
const { dispatch } = this.props;
|
||||
|
||||
dispatch(openModal('BIRTHDAYS'));
|
||||
}
|
||||
|
||||
renderMessage() {
|
||||
const { birthdays, account } = this.props;
|
||||
|
||||
const link = (
|
||||
<bdi>
|
||||
<Link
|
||||
className='text-gray-800 dark:text-gray-200 font-bold hover:underline'
|
||||
title={account.get('acct')}
|
||||
to={`/@${account.get('acct')}`}
|
||||
dangerouslySetInnerHTML={{ __html: account.get('display_name_html') }}
|
||||
/>
|
||||
</bdi>
|
||||
);
|
||||
|
||||
if (birthdays.size === 1) {
|
||||
return <FormattedMessage id='notification.birthday' defaultMessage='{name} has a birthday today' values={{ name: link }} />;
|
||||
}
|
||||
|
||||
return (
|
||||
<FormattedMessage
|
||||
id='notification.birthday_plural'
|
||||
defaultMessage='{name} and {more} have birthday today'
|
||||
values={{
|
||||
name: link,
|
||||
more: (
|
||||
<span type='button' role='presentation' onClick={this.handleOpenBirthdaysModal}>
|
||||
<FormattedMessage
|
||||
id='notification.birthday.more'
|
||||
defaultMessage='{count} more {count, plural, one {friend} other {friends}}'
|
||||
values={{ count: birthdays.size - 1 }}
|
||||
/>
|
||||
</span>
|
||||
),
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
renderMessageForScreenReader = () => {
|
||||
const { intl, birthdays, account } = this.props;
|
||||
|
||||
if (birthdays.size === 1) {
|
||||
return intl.formatMessage({ id: 'notification.birthday', defaultMessage: '{name} has a birthday today' }, { name: account.get('display_name') });
|
||||
}
|
||||
|
||||
return intl.formatMessage(
|
||||
{
|
||||
id: 'notification.birthday_plural',
|
||||
defaultMessage: '{name} and {more} have birthday today',
|
||||
},
|
||||
{
|
||||
name: account.get('display_name'),
|
||||
more: intl.formatMessage(
|
||||
{
|
||||
id: 'notification.birthday.more',
|
||||
defaultMessage: '{count} more {count, plural, one {friend} other {friends}}',
|
||||
},
|
||||
{ count: birthdays.size - 1 },
|
||||
),
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
render() {
|
||||
const { birthdays } = this.props;
|
||||
|
||||
if (!birthdays || birthdays.size === 0) return null;
|
||||
|
||||
return (
|
||||
<HotKeys handlers={this.getHandlers()}>
|
||||
<div className='notification notification-birthday focusable' tabIndex='0' title={this.renderMessageForScreenReader()}>
|
||||
<div className='p-4 focusable'>
|
||||
<HStack alignItems='center' space={1.5}>
|
||||
<Icon
|
||||
src={require('@tabler/icons/icons/ballon.svg')}
|
||||
className='text-primary-600'
|
||||
/>
|
||||
|
||||
<Text
|
||||
theme='muted'
|
||||
size='sm'
|
||||
>
|
||||
{this.renderMessage()}
|
||||
</Text>
|
||||
</HStack>
|
||||
</div>
|
||||
</div>
|
||||
</HotKeys>
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -9,10 +9,8 @@ import { Virtuoso } from 'react-virtuoso';
|
|||
import { createSelector } from 'reselect';
|
||||
|
||||
import { getSettings } from 'soapbox/actions/settings';
|
||||
import BirthdayReminders from 'soapbox/components/birthday_reminders';
|
||||
import PullToRefresh from 'soapbox/components/pull-to-refresh';
|
||||
import PlaceholderNotification from 'soapbox/features/placeholder/components/placeholder_notification';
|
||||
import { getFeatures } from 'soapbox/utils/features';
|
||||
|
||||
import {
|
||||
expandNotifications,
|
||||
|
|
@ -30,12 +28,6 @@ const messages = defineMessages({
|
|||
queue: { id: 'notifications.queue_label', defaultMessage: 'Click to see {count} new {count, plural, one {notification} other {notifications}}' },
|
||||
});
|
||||
|
||||
const Header = ({ context }) => (
|
||||
context.showBirthdayReminders ? (
|
||||
<BirthdayReminders onMoveDown={context.handleMoveBelowBirthdays} />
|
||||
) : null
|
||||
);
|
||||
|
||||
const Footer = ({ context }) => (
|
||||
context.hasMore ? (
|
||||
<PlaceholderNotification />
|
||||
|
|
@ -71,10 +63,6 @@ const getNotifications = createSelector([
|
|||
|
||||
const mapStateToProps = state => {
|
||||
const settings = getSettings(state);
|
||||
const instance = state.get('instance');
|
||||
const features = getFeatures(instance);
|
||||
const showBirthdayReminders = settings.getIn(['notifications', 'birthdays', 'show']) && settings.getIn(['notifications', 'quickFilter', 'active']) === 'all' && features.birthdays;
|
||||
const birthdays = showBirthdayReminders && state.getIn(['user_lists', 'birthday_reminders', state.get('me')]);
|
||||
|
||||
return {
|
||||
showFilterBar: settings.getIn(['notifications', 'quickFilter', 'show']),
|
||||
|
|
@ -83,8 +71,6 @@ const mapStateToProps = state => {
|
|||
isUnread: state.getIn(['notifications', 'unread']) > 0,
|
||||
hasMore: state.getIn(['notifications', 'hasMore']),
|
||||
totalQueuedNotificationsCount: state.getIn(['notifications', 'totalQueuedNotificationsCount'], 0),
|
||||
showBirthdayReminders,
|
||||
hasBirthdays: !!birthdays,
|
||||
};
|
||||
};
|
||||
|
||||
|
|
@ -102,8 +88,6 @@ class Notifications extends React.PureComponent {
|
|||
hasMore: PropTypes.bool,
|
||||
dequeueNotifications: PropTypes.func,
|
||||
totalQueuedNotificationsCount: PropTypes.number,
|
||||
showBirthdayReminders: PropTypes.bool,
|
||||
hasBirthdays: PropTypes.bool,
|
||||
};
|
||||
|
||||
componentWillUnmount() {
|
||||
|
|
@ -140,25 +124,15 @@ class Notifications extends React.PureComponent {
|
|||
}
|
||||
|
||||
handleMoveUp = id => {
|
||||
const { hasBirthdays } = this.props;
|
||||
|
||||
let elementIndex = this.props.notifications.findIndex(item => item !== null && item.get('id') === id) - 1;
|
||||
if (hasBirthdays) elementIndex++;
|
||||
const elementIndex = this.props.notifications.findIndex(item => item !== null && item.get('id') === id) - 1;
|
||||
this._selectChild(elementIndex, true);
|
||||
}
|
||||
|
||||
handleMoveDown = id => {
|
||||
const { hasBirthdays } = this.props;
|
||||
|
||||
let elementIndex = this.props.notifications.findIndex(item => item !== null && item.get('id') === id) + 1;
|
||||
if (hasBirthdays) elementIndex++;
|
||||
const elementIndex = this.props.notifications.findIndex(item => item !== null && item.get('id') === id) + 1;
|
||||
this._selectChild(elementIndex, false);
|
||||
}
|
||||
|
||||
handleMoveBelowBirthdays = () => {
|
||||
this._selectChild(1, false);
|
||||
}
|
||||
|
||||
_selectChild(index, align_top) {
|
||||
const container = this.column;
|
||||
const element = container.querySelector(`article:nth-of-type(${index + 1}) .focusable`);
|
||||
|
|
@ -183,7 +157,7 @@ class Notifications extends React.PureComponent {
|
|||
}
|
||||
|
||||
render() {
|
||||
const { intl, notifications, isLoading, hasMore, showFilterBar, totalQueuedNotificationsCount, showBirthdayReminders } = this.props;
|
||||
const { intl, notifications, isLoading, hasMore, showFilterBar, totalQueuedNotificationsCount } = this.props;
|
||||
const emptyMessage = <FormattedMessage id='empty_column.notifications' defaultMessage="You don't have any notifications yet. Interact with others to start the conversation." />;
|
||||
|
||||
const filterBarContainer = showFilterBar
|
||||
|
|
@ -208,13 +182,10 @@ class Notifications extends React.PureComponent {
|
|||
)}
|
||||
context={{
|
||||
hasMore,
|
||||
showBirthdayReminders,
|
||||
handleMoveBelowBirthdays: this.handleMoveBelowBirthdays,
|
||||
isLoading,
|
||||
emptyMessage,
|
||||
}}
|
||||
components={{
|
||||
Header,
|
||||
ScrollSeekPlaceholder: PlaceholderNotification,
|
||||
Footer,
|
||||
EmptyPlaceholder,
|
||||
|
|
|
|||
Ładowanie…
Reference in New Issue