random-mirrors/gab-social
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Updated Toast alerts, progress mvp

Browse Source 
• Updated:
- Toast alerts
This commit is contained in:
mgabdev
2020-12-07 23:39:13 -05:00
parent 5422c013e1
commit 05c5dcb581
28 changed files with 205 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

129
app/javascript/gabsocial/containers/toasts_container.js
View File

@@ -8,60 +8,63 @@ import Toast from '../components/toast'
class ToastsContainer extends React.PureComponent {
handleOnDismiss = (key) => {
this.props.dispatch(dismissToast(key))
handleOnDismiss = (toastKey) => {
this.props.dispatch(dismissToast(toastKey))
}
render() {
// const { notifications } = this.props
const notifications = [
{
key: '1',
title: 'Error',
to: 'to',
image: 'https://gab.com/media/user/58077e8a49705.jpg',
message: 'Unable to follow @andrew',
date: new Date(),
isImageAccount: true,
},
{
key: '2',
title: 'Success',
to: 'to',
image: 'https://gab.com/media/user/58077e8a49705.jpg',
message: 'Your gab was posted. Click here to view',
date: new Date(),
isImageAccount: false,
},
{
key: '3',
title: '',
to: 'to',
image: 'https://gab.com/media/user/58077e8a49705.jpg',
message: 'Unable to follow @andrew',
date: new Date(),
isImageAccount: true,
},
{
key: '4',
title: '',
to: 'to',
image: 'https://gab.com/media/user/58077e8a49705.jpg',
message: 'Your gab was posted. Click here to view',
date: new Date(),
isImageAccount: false,
},
{
key: '5',
title: '',
to: 'to',
message: 'Your gab was deleted',
date: new Date(),
isImageAccount: false,
},
]
const { notifications } = this.props
const hasNotifications = Array.isArray(notifications) && notifications.length > 0
console.log("notifications:", notifications)
// const notifications = [
// {
// key: '1',
// title: 'Error',
// to: 'to',
// image: 'https://gab.com/media/user/58077e8a49705.jpg',
// message: 'Unable to follow @andrew',
// date: new Date(),
// isImageAccount: true,
// },
// {
// key: '2',
// title: 'Success',
// to: 'to',
// image: 'https://gab.com/media/user/58077e8a49705.jpg',
// message: 'Your gab was posted. Click here to view',
// date: new Date(),
// isImageAccount: false,
// },
// {
// key: '3',
// title: '',
// to: 'to',
// image: 'https://gab.com/media/user/58077e8a49705.jpg',
// message: 'Unable to follow @andrew',
// date: new Date(),
// isImageAccount: true,
// },
// {
// key: '4',
// title: '',
// to: 'to',
// image: 'https://gab.com/media/user/58077e8a49705.jpg',
// message: 'Your gab was posted. Click here to view',
// date: new Date(),
// isImageAccount: false,
// },
// {
// key: '5',
// title: '',
// to: 'to',
// message: 'Your gab was deleted',
// date: new Date(),
// isImageAccount: false,
// },
// ]
const hasNotifications = !!notifications && notifications.size > 0
const containerClasses = CX({
d: 1,
@@ -80,17 +83,17 @@ class ToastsContainer extends React.PureComponent {
return (
<div className={containerClasses}>
{
!hasNotifications && notifications.map((notification) => (
hasNotifications && notifications.map((notification) => (
<Toast
onDismiss={this.handleOnDismiss}
key={notification.key}
id={notification.key}
title={notification.title}
to={notification.to}
image={notification.image}
message={notification.message}
date={notification.date}
isImageAccount={notification.isImageAccount}
id={notification.get('key')}
key={`toast-${notification.get('key')}`}
title={notification.get('title', '')}
to={notification.get('to', null)}
image={notification.get('image', null)}
message={notification.get('message', null)}
date={notification.get('date', null)}
isImageAccount={notification.get('isImageAccount', null)}
/>
))
}
@@ -101,11 +104,9 @@ class ToastsContainer extends React.PureComponent {
}
const mapStateToProps = (state) => {
const notifications = getToasts(state)
if (!notifications) return {}
return { notifications }
}
const mapStateToProps = (state) => ({
notifications: state.get('toasts')
})
ToastsContainer.propTypes = {
notifications: PropTypes.array,