treehouse
/
mastodon
21
8
Fork 5
Code Issues 32 Pull Requests Projects 1 Releases Wiki Activity

Merge pull request #474 from ThibG/glitch-soc/fixes/html-ified-tooltip 

[Glitch] Use plaintext value for field value tooltips in web UI
lolsob-rspec
ThibG 2018-05-11 16:26:23 +02:00 committed by GitHub
parent 8a5f111c00 3c7d7ec228
commit 21021ce7d2
4 changed files with 10 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/javascript/flavours/glitch/actions/notifications.js
View File

@ -3,6 +3,7 @@ import { List as ImmutableList } from 'immutable';
import IntlMessageFormat from 'intl-messageformat'; import IntlMessageFormat from 'intl-messageformat';
import { fetchRelationships } from './accounts'; import { fetchRelationships } from './accounts';
import { defineMessages } from 'react-intl'; import { defineMessages } from 'react-intl';
import { unescapeHTML } from 'flavours/glitch/util/html';
export const NOTIFICATIONS_UPDATE = 'NOTIFICATIONS_UPDATE'; export const NOTIFICATIONS_UPDATE = 'NOTIFICATIONS_UPDATE';
@ -40,13 +41,6 @@ const fetchRelatedRelationships = (dispatch, notifications) => {
} }
}; };
const unescapeHTML = (html) => {
const wrapper = document.createElement('div');
html = html.replace(/<br \/>|<br>|\n/g, ' ');
wrapper.innerHTML = html;
return wrapper.textContent;
};
export function updateNotifications(notification, intlMessages, intlLocale) { export function updateNotifications(notification, intlMessages, intlLocale) {
return (dispatch, getState) => { return (dispatch, getState) => {
const showAlert = getState().getIn(['settings', 'notifications', 'alerts', notification.type], true); const showAlert = getState().getIn(['settings', 'notifications', 'alerts', notification.type], true);

2
app/javascript/flavours/glitch/features/account/components/header.js
View File

@ -111,7 +111,7 @@ export default class Header extends ImmutablePureComponent {
{fields.map((pair, i) => ( {fields.map((pair, i) => (
<dl key={i}> <dl key={i}>
<dt dangerouslySetInnerHTML={{ __html: pair.get('name_emojified') }} title={pair.get('name')} /> <dt dangerouslySetInnerHTML={{ __html: pair.get('name_emojified') }} title={pair.get('name')} />
<dd dangerouslySetInnerHTML={{ __html: pair.get('value_emojified') }} title={pair.get('value')} /> <dd dangerouslySetInnerHTML={{ __html: pair.get('value_emojified') }} title={pair.get('value_plain')} />
</dl> </dl>
))} ))}
</div> </div>

2
app/javascript/flavours/glitch/reducers/accounts.js
View File

@ -57,6 +57,7 @@ import { STORE_HYDRATE } from 'flavours/glitch/actions/store';
import emojify from 'flavours/glitch/util/emoji'; import emojify from 'flavours/glitch/util/emoji';
import { Map as ImmutableMap, fromJS } from 'immutable'; import { Map as ImmutableMap, fromJS } from 'immutable';
import escapeTextContentForBrowser from 'escape-html'; import escapeTextContentForBrowser from 'escape-html';
import { unescapeHTML } from 'flavours/glitch/util/html';
const normalizeAccount = (state, account) => { const normalizeAccount = (state, account) => {
account = { ...account }; account = { ...account };
@ -74,6 +75,7 @@ const normalizeAccount = (state, account) => {
...pair, ...pair,
name_emojified: emojify(escapeTextContentForBrowser(pair.name)), name_emojified: emojify(escapeTextContentForBrowser(pair.name)),
value_emojified: emojify(pair.value), value_emojified: emojify(pair.value),
value_plain: unescapeHTML(pair.value),
})); }));
} }

6
app/javascript/flavours/glitch/util/html.js Normal file
View File

@ -0,0 +1,6 @@
export const unescapeHTML = (html) => {
const wrapper = document.createElement('div');
html = html.replace(/<br \/>|<br>|\n/g, ' ');
wrapper.innerHTML = html;
return wrapper.textContent;
};