Use icon helpers for notification dropdown

This commit is contained in:
Robin Ward 2017-09-14 11:14:43 -04:00
parent f3d3129113
commit b2ffaf93a3
4 changed files with 51 additions and 26 deletions

View File

@ -9,8 +9,28 @@ const REPLACEMENTS = {
'd-watching-first': 'dot-circle-o', 'd-watching-first': 'dot-circle-o',
'd-drop-expanded': 'caret-down', 'd-drop-expanded': 'caret-down',
'd-drop-collapsed': 'caret-right', 'd-drop-collapsed': 'caret-right',
'notification.mentioned': "at",
'notification.group_mentioned': "at",
'notification.quoted': "quote-right",
'notification.replied': "reply",
'notification.posted': "reply",
'notification.edited': "pencil",
'notification.liked': "heart",
'notification.liked_2': "heart",
'notification.liked_many': "heart",
'notification.private_message': "envelope-o",
'notification.invited_to_private_message': "envelope-o",
'notification.invited_to_topic': "hand-o-right",
'notification.invitee_accepted': "user",
'notification.moved_post': "sign-out",
'notification.linked': "link",
'notification.granted_badge': "certificate",
'notification.topic_reminder': "hand-o-right",
'notification.watching_first_post': "dot-circle-o",
'notification.group_message_summary': "group"
}; };
export function renderIcon(renderType, id, params) { export function renderIcon(renderType, id, params) {
for (let i=0; i<_renderers.length; i++) { for (let i=0; i<_renderers.length; i++) {
let renderer = _renderers[i]; let renderer = _renderers[i];

View File

@ -7,6 +7,7 @@ import { emojiUnescape } from 'discourse/lib/text';
import { postUrl, escapeExpression } from 'discourse/lib/utilities'; import { postUrl, escapeExpression } from 'discourse/lib/utilities';
import { setTransientHeader } from 'discourse/lib/ajax'; import { setTransientHeader } from 'discourse/lib/ajax';
import { userPath } from 'discourse/lib/url'; import { userPath } from 'discourse/lib/url';
import { iconNode } from 'discourse-common/lib/icon-library';
const LIKED_TYPE = 5; const LIKED_TYPE = 5;
const INVITED_TYPE = 8; const INVITED_TYPE = 8;
@ -98,10 +99,14 @@ createWidget('notification-item', {
const lookup = this.site.get('notificationLookup'); const lookup = this.site.get('notificationLookup');
const notName = lookup[notificationType]; const notName = lookup[notificationType];
const contents = new RawHtml({ html: `<div>${emojiUnescape(this.text(notificationType, notName))}</div>` }); let title = I18n.t(`notifications.alt.${notName}`);
let icon = iconNode(`notification.${notName}`, { title });
let text = emojiUnescape(this.text(notificationType, notName));
let html = new RawHtml({ html: `<p>${text}</p>` });
let contents = [ icon, html ];
const href = this.url(); const href = this.url();
const alt = I18n.t(`notifications.alt.${notName}`); return href ? h('a', { attributes: { href, title, 'data-auto-route': true } }, contents) : contents;
return href ? h('a', { attributes: { href, alt, 'data-auto-route': true } }, contents) : contents;
}, },
click(e) { click(e) {

View File

@ -74,7 +74,8 @@ export default createWidget('user-notifications', {
const href = `${attrs.path}/notifications`; const href = `${attrs.path}/notifications`;
items.push( items.push(
h('li.read.last.heading', h('a', { attributes: { href } }, [I18n.t('notifications.more'), '...'])), h('li.read.last.heading',
h('a', { attributes: { href } }, [I18n.t('notifications.more'), '...'])),
h('hr') h('hr')
); );
} }

View File

@ -1270,31 +1270,30 @@ en:
empty: "No notifications found." empty: "No notifications found."
more: "view older notifications" more: "view older notifications"
total_flagged: "total flagged posts" total_flagged: "total flagged posts"
mentioned: "<i title='mentioned' class='fa fa-at'></i><p><span>{{username}}</span> {{description}}</p>" mentioned: "<span>{{username}}</span> {{description}}"
group_mentioned: "<i title='group mentioned' class='fa fa-at'></i><p><span>{{username}}</span> {{description}}</p>" group_mentioned: "<span>{{username}}</span> {{description}}"
quoted: "<i title='quoted' class='fa fa-quote-right'></i><p><span>{{username}}</span> {{description}}</p>" quoted: "<span>{{username}}</span> {{description}}"
replied: "<i title='replied' class='fa fa-reply'></i><p><span>{{username}}</span> {{description}}</p>" replied: "<span>{{username}}</span> {{description}}"
posted: "<i title='posted' class='fa fa-reply'></i><p><span>{{username}}</span> {{description}}</p>" posted: "<span>{{username}}</span> {{description}}"
edited: "<i title='edited' class='fa fa-pencil'></i><p><span>{{username}}</span> {{description}}</p>" edited: "<span>{{username}}</span> {{description}}"
liked: "<i title='liked' class='fa fa-heart'></i><p><span>{{username}}</span> {{description}}</p>" liked: "<span>{{username}}</span> {{description}}"
liked_2: "<i title='liked' class='fa fa-heart'></i><p><span>{{username}}, {{username2}}</span> {{description}}</p>" liked_2: "<span>{{username}}, {{username2}}</span> {{description}}"
liked_many: liked_many:
one: "<i title='liked' class='fa fa-heart'></i><p><span>{{username}}, {{username2}} and 1 other</span> {{description}}</p>" one: "<span>{{username}}, {{username2}} and 1 other</span> {{description}}"
other: "<i title='liked' class='fa fa-heart'></i><p><span>{{username}}, {{username2}} and {{count}} others</span> {{description}}</p>" other: "<span>{{username}}, {{username2}} and {{count}} others</span> {{description}}"
private_message: "<i title='private message' class='fa fa-envelope-o'></i><p><span>{{username}}</span> {{description}}</p>" private_message: "<span>{{username}}</span> {{description}}"
invited_to_private_message: "<i title='private message' class='fa fa-envelope-o'></i><p><span>{{username}}</span> {{description}}</p>" invited_to_private_message: "<p><span>{{username}}</span> {{description}}"
invited_to_topic: "<i title='invited to topic' class='fa fa-hand-o-right'></i><p><span>{{username}}</span> {{description}}</p>" invited_to_topic: "<span>{{username}}</span> {{description}}"
invitee_accepted: "<i title='accepted your invitation' class='fa fa-user'></i><p><span>{{username}}</span> accepted your invitation</p>" invitee_accepted: "<span>{{username}}</span> accepted your invitation"
moved_post: "<i title='moved post' class='fa fa-sign-out'></i><p><span>{{username}}</span> moved {{description}}</p>" moved_post: "<span>{{username}}</span> moved {{description}}"
linked: "<i title='linked post' class='fa fa-link'></i><p><span>{{username}}</span> {{description}}</p>" linked: "<span>{{username}}</span> {{description}}"
granted_badge: "<i title='badge granted' class='fa fa-certificate'></i><p>Earned '{{description}}'</p>" granted_badge: "Earned '{{description}}'"
topic_reminder: "<i title='topic reminder' class='fa fa-hand-o-right'></i><p><span>{{username}}</span> {{description}}</p>" topic_reminder: "<span>{{username}}</span> {{description}}"
watching_first_post: "<span>New Topic</span> {{description}}"
watching_first_post: "<i title='new topic' class='fa fa-dot-circle-o'></i><p><span>New Topic</span> {{description}}</p>"
group_message_summary: group_message_summary:
one: "<i title='messages in group inbox' class='fa fa-group'></i><p> {{count}} message in your {{group_name}} inbox</p>" one: "{{count}} message in your {{group_name}} inbox"
other: "<i title='messages in group inbox' class='fa fa-group'></i><p> {{count}} messages in your {{group_name}} inbox</p>" other: "{{count}} messages in your {{group_name}} inbox"
alt: alt:
mentioned: "Mentioned by" mentioned: "Mentioned by"