diff --git a/app/soapbox/actions/soapbox.js b/app/soapbox/actions/soapbox.js
index 58a2417c7..ee203dbb1 100644
--- a/app/soapbox/actions/soapbox.js
+++ b/app/soapbox/actions/soapbox.js
@@ -18,10 +18,18 @@ export const defaultConfig = ImmutableMap({
navlinks: ImmutableMap({
homeFooter: ImmutableList(),
}),
+ allowedEmoji: ImmutableList([
+ '👍',
+ '❤️',
+ '😆',
+ '😮',
+ '😢',
+ '😩',
+ ]),
});
export function getSoapboxConfig(state) {
- return defaultConfig.mergeDeep(state.get('soapbox'));
+ return defaultConfig.merge(state.get('soapbox'));
}
export function fetchSoapboxConfig() {
diff --git a/app/soapbox/components/__tests__/__snapshots__/emoji_selector-test.js.snap b/app/soapbox/components/__tests__/__snapshots__/emoji_selector-test.js.snap
index 6b6307012..80bd49f8e 100644
--- a/app/soapbox/components/__tests__/__snapshots__/emoji_selector-test.js.snap
+++ b/app/soapbox/components/__tests__/__snapshots__/emoji_selector-test.js.snap
@@ -16,7 +16,7 @@ exports[` renders correctly 1`] = `
className="emoji-react-selector__emoji"
dangerouslySetInnerHTML={
Object {
- "__html": "",
+ "__html": "",
}
}
/>
diff --git a/app/soapbox/components/__tests__/emoji_selector-test.js b/app/soapbox/components/__tests__/emoji_selector-test.js
index c475aae4b..c8083c3aa 100644
--- a/app/soapbox/components/__tests__/emoji_selector-test.js
+++ b/app/soapbox/components/__tests__/emoji_selector-test.js
@@ -1,10 +1,10 @@
import React from 'react';
-import renderer from 'react-test-renderer';
+import { createComponent } from 'soapbox/test_helpers';
import EmojiSelector from '../emoji_selector';
describe('', () => {
it('renders correctly', () => {
- const component = renderer.create();
+ const component = createComponent();
const tree = component.toJSON();
expect(tree).toMatchSnapshot();
});
diff --git a/app/soapbox/components/emoji_selector.js b/app/soapbox/components/emoji_selector.js
index 7ef0e2b0a..4cd0395e3 100644
--- a/app/soapbox/components/emoji_selector.js
+++ b/app/soapbox/components/emoji_selector.js
@@ -1,10 +1,17 @@
import React from 'react';
import PropTypes from 'prop-types';
-import { ALLOWED_EMOJI } from 'soapbox/utils/emoji_reacts';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import { connect } from 'react-redux';
import emojify from 'soapbox/features/emoji/emoji';
+import { getSoapboxConfig } from 'soapbox/actions/soapbox';
import classNames from 'classnames';
-export default class EmojiSelector extends React.Component {
+const mapStateToProps = state => ({
+ allowedEmoji: getSoapboxConfig(state).get('allowedEmoji'),
+});
+
+export default @connect(mapStateToProps)
+class EmojiSelector extends ImmutablePureComponent {
static propTypes = {
onReact: PropTypes.func.isRequired,
@@ -17,11 +24,11 @@ export default class EmojiSelector extends React.Component {
}
render() {
- const { onReact, visible } = this.props;
+ const { onReact, visible, allowedEmoji } = this.props;
return (
- {ALLOWED_EMOJI.map((emoji, i) => (
+ {allowedEmoji.map((emoji, i) => (
diff --git a/app/soapbox/utils/__tests__/emoji_reacts-test.js b/app/soapbox/utils/__tests__/emoji_reacts-test.js
index 4663304b2..e21dda5e1 100644
--- a/app/soapbox/utils/__tests__/emoji_reacts-test.js
+++ b/app/soapbox/utils/__tests__/emoji_reacts-test.js
@@ -158,7 +158,7 @@ describe('getReactForStatus', () => {
],
},
});
- expect(getReactForStatus(status)).toEqual('❤');
+ expect(getReactForStatus(status, ALLOWED_EMOJI)).toEqual('❤');
});
it('returns a thumbs-up for a favourite', () => {
diff --git a/app/soapbox/utils/emoji_reacts.js b/app/soapbox/utils/emoji_reacts.js
index 03b80a39a..774fdba39 100644
--- a/app/soapbox/utils/emoji_reacts.js
+++ b/app/soapbox/utils/emoji_reacts.js
@@ -7,7 +7,7 @@ import {
// I've customized them.
export const ALLOWED_EMOJI = [
'👍',
- '❤',
+ '❤️',
'😆',
'😮',
'😢',
@@ -75,11 +75,12 @@ export const reduceEmoji = (emojiReacts, favouritesCount, favourited, allowedEmo
emojiReacts, favouritesCount, favourited,
))), allowedEmoji));
-export const getReactForStatus = status => {
+export const getReactForStatus = (status, allowedEmoji=ALLOWED_EMOJI) => {
return reduceEmoji(
status.getIn(['pleroma', 'emoji_reactions'], ImmutableList()),
- status.get('favourites_count'),
+ status.get('favourites_count', 0),
status.get('favourited'),
+ allowedEmoji,
).filter(e => e.get('me') === true)
.getIn([0, 'name']);
};