diff --git a/app/gabsocial/features/status/components/status_interaction_bar.js b/app/gabsocial/features/status/components/status_interaction_bar.js new file mode 100644 index 000000000..9ce614253 --- /dev/null +++ b/app/gabsocial/features/status/components/status_interaction_bar.js @@ -0,0 +1,47 @@ +import React from 'react'; +import ImmutablePropTypes from 'react-immutable-proptypes'; +import emojify from 'gabsocial/features/emoji/emoji'; + +// https://emojipedia.org/facebook/ +const ALLOWED_EMOJI = [ + '👍', + '❤️', + '😂', + '😯', + '😢', + '😡', +]; + +export class StatusInteractionBar extends React.Component { + + propTypes = { + status: ImmutablePropTypes.map, + } + + sortEmoji = emojiReacts => ( + emojiReacts // TODO: Sort + ); + + mergeEmoji = emojiReacts => ( + emojiReacts // TODO: Merge similar emoji + ); + + filterEmoji = emojiReacts => ( + emojiReacts.filter(emojiReact => ( + ALLOWED_EMOJI.includes(emojiReact.get('name')) + ))) + + render() { + const { status } = this.props; + const emojiReacts = status.getIn(['pleroma', 'emoji_reactions']); + + return ( + <> + {this.filterEmoji(emojiReacts).map(e => + + )} + + ); + } + +} diff --git a/app/gabsocial/features/status/index.js b/app/gabsocial/features/status/index.js index 4b9fc2436..424dda420 100644 --- a/app/gabsocial/features/status/index.js +++ b/app/gabsocial/features/status/index.js @@ -43,6 +43,7 @@ import { attachFullscreenListener, detachFullscreenListener, isFullscreen } from import { textForScreenReader, defaultMediaVisibility } from '../../components/status'; import Icon from 'gabsocial/components/icon'; import { getSettings } from 'gabsocial/actions/settings'; +import { StatusInteractionBar } from './components/status_interaction_bar'; const messages = defineMessages({ deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' }, @@ -492,6 +493,8 @@ class Status extends ImmutablePureComponent { onToggleMediaVisibility={this.handleToggleMediaVisibility} /> + +