diff --git a/app/soapbox/features/account/components/header.js b/app/soapbox/features/account/components/header.js
index 93b75108d..c443e3716 100644
--- a/app/soapbox/features/account/components/header.js
+++ b/app/soapbox/features/account/components/header.js
@@ -182,61 +182,141 @@ class Header extends ImmutablePureComponent {
}
if (account.get('id') === me) {
- menu.push({ text: intl.formatMessage(messages.edit_profile), to: '/settings/profile' });
- menu.push({ text: intl.formatMessage(messages.preferences), to: '/settings/preferences' });
+ menu.push({
+ text: intl.formatMessage(messages.edit_profile),
+ to: '/settings/profile',
+ icon: require('@tabler/icons/icons/user.svg'),
+ });
+ menu.push({
+ text: intl.formatMessage(messages.preferences),
+ to: '/settings/preferences',
+ icon: require('@tabler/icons/icons/settings.svg'),
+ });
menu.push(null);
- menu.push({ text: intl.formatMessage(messages.follow_requests), to: '/follow_requests' });
+ menu.push({
+ text: intl.formatMessage(messages.follow_requests),
+ to: '/follow_requests',
+ icon: require('@tabler/icons/icons/user-plus.svg'),
+ });
menu.push(null);
- menu.push({ text: intl.formatMessage(messages.mutes), to: '/mutes' });
- menu.push({ text: intl.formatMessage(messages.blocks), to: '/blocks' });
- menu.push({ text: intl.formatMessage(messages.domain_blocks), to: '/domain_blocks' });
+ menu.push({
+ text: intl.formatMessage(messages.mutes),
+ to: '/mutes',
+ icon: require('@tabler/icons/icons/circle-x.svg'),
+ });
+ menu.push({
+ text: intl.formatMessage(messages.blocks),
+ to: '/blocks',
+ icon: require('@tabler/icons/icons/ban.svg'),
+ });
+ menu.push({
+ text: intl.formatMessage(messages.domain_blocks),
+ to: '/domain_blocks',
+ icon: require('@tabler/icons/icons/ban.svg'),
+ });
} else {
- menu.push({ text: intl.formatMessage(messages.mention, { name: account.get('username') }), action: this.props.onMention });
+ menu.push({
+ text: intl.formatMessage(messages.mention, { name: account.get('username') }),
+ action: this.props.onMention,
+ icon: require('feather-icons/dist/icons/at-sign.svg'),
+ });
if (account.getIn(['pleroma', 'accepts_chat_messages'], false) === true) {
- menu.push({ text: intl.formatMessage(messages.chat, { name: account.get('username') }), action: this.props.onChat });
+ menu.push({
+ text: intl.formatMessage(messages.chat, { name: account.get('username') }),
+ action: this.props.onChat,
+ icon: require('@tabler/icons/icons/messages.svg'),
+ });
} else {
- menu.push({ text: intl.formatMessage(messages.direct, { name: account.get('username') }), action: this.props.onDirect });
+ menu.push({
+ text: intl.formatMessage(messages.direct, { name: account.get('username') }),
+ action: this.props.onDirect,
+ icon:require('@tabler/icons/icons/mail.svg'),
+ });
}
if (account.getIn(['relationship', 'following'])) {
if (account.getIn(['relationship', 'showing_reblogs'])) {
- menu.push({ text: intl.formatMessage(messages.hideReblogs, { name: account.get('username') }), action: this.props.onReblogToggle });
+ menu.push({
+ text: intl.formatMessage(messages.hideReblogs, { name: account.get('username') }),
+ action: this.props.onReblogToggle,
+ icon: require('@tabler/icons/icons/repeat.svg'),
+ });
} else {
- menu.push({ text: intl.formatMessage(messages.showReblogs, { name: account.get('username') }), action: this.props.onReblogToggle });
+ menu.push({
+ text: intl.formatMessage(messages.showReblogs, { name: account.get('username') }),
+ action: this.props.onReblogToggle,
+ icon: require('@tabler/icons/icons/repeat.svg'),
+ });
}
if (features.accountSubscriptions) {
if (account.getIn(['relationship', 'subscribing'])) {
- menu.push({ text: intl.formatMessage(messages.unsubscribe, { name: account.get('username') }), action: this.props.onSubscriptionToggle });
+ menu.push({
+ text: intl.formatMessage(messages.unsubscribe, { name: account.get('username') }),
+ action: this.props.onSubscriptionToggle,
+ icon: require('@tabler/icons/icons/bell.svg'),
+ });
} else {
- menu.push({ text: intl.formatMessage(messages.subscribe, { name: account.get('username') }), action: this.props.onSubscriptionToggle });
+ menu.push({
+ text: intl.formatMessage(messages.subscribe, { name: account.get('username') }),
+ action: this.props.onSubscriptionToggle,
+ icon: require('@tabler/icons/icons/bell-off.svg'),
+ });
}
}
if (features.lists) {
- menu.push({ text: intl.formatMessage(messages.add_or_remove_from_list), action: this.props.onAddToList });
+ menu.push({
+ text: intl.formatMessage(messages.add_or_remove_from_list),
+ action: this.props.onAddToList,
+ icon: require('@tabler/icons/icons/list.svg'),
+ });
}
// menu.push({ text: intl.formatMessage(account.getIn(['relationship', 'endorsed']) ? messages.unendorse : messages.endorse), action: this.props.onEndorseToggle });
menu.push(null);
} else if (features.lists && features.unrestrictedLists) {
- menu.push({ text: intl.formatMessage(messages.add_or_remove_from_list), action: this.props.onAddToList });
+ menu.push({
+ text: intl.formatMessage(messages.add_or_remove_from_list),
+ action: this.props.onAddToList,
+ icon: require('@tabler/icons/icons/list.svg'),
+ });
}
if (account.getIn(['relationship', 'muting'])) {
- menu.push({ text: intl.formatMessage(messages.unmute, { name: account.get('username') }), action: this.props.onMute });
+ menu.push({
+ text: intl.formatMessage(messages.unmute, { name: account.get('username') }),
+ action: this.props.onMute,
+ icon: require('@tabler/icons/icons/circle-x.svg'),
+ });
} else {
- menu.push({ text: intl.formatMessage(messages.mute, { name: account.get('username') }), action: this.props.onMute });
+ menu.push({
+ text: intl.formatMessage(messages.mute, { name: account.get('username') }),
+ action: this.props.onMute,
+ icon: require('@tabler/icons/icons/circle-x.svg'),
+ });
}
if (account.getIn(['relationship', 'blocking'])) {
- menu.push({ text: intl.formatMessage(messages.unblock, { name: account.get('username') }), action: this.props.onBlock });
+ menu.push({
+ text: intl.formatMessage(messages.unblock, { name: account.get('username') }),
+ action: this.props.onBlock,
+ icon: require('@tabler/icons/icons/ban.svg'),
+ });
} else {
- menu.push({ text: intl.formatMessage(messages.block, { name: account.get('username') }), action: this.props.onBlock });
+ menu.push({
+ text: intl.formatMessage(messages.block, { name: account.get('username') }),
+ action: this.props.onBlock,
+ icon: require('@tabler/icons/icons/ban.svg'),
+ });
}
- menu.push({ text: intl.formatMessage(messages.report, { name: account.get('username') }), action: this.props.onReport });
+ menu.push({
+ text: intl.formatMessage(messages.report, { name: account.get('username') }),
+ action: this.props.onReport,
+ icon: require('@tabler/icons/icons/flag.svg'),
+ });
}
if (isRemote(account)) {
@@ -245,9 +325,17 @@ class Header extends ImmutablePureComponent {
menu.push(null);
if (account.getIn(['relationship', 'domain_blocking'])) {
- menu.push({ text: intl.formatMessage(messages.unblockDomain, { domain }), action: this.props.onUnblockDomain });
+ menu.push({
+ text: intl.formatMessage(messages.unblockDomain, { domain }),
+ action: this.props.onUnblockDomain,
+ icon: require('@tabler/icons/icons/ban.svg'),
+ });
} else {
- menu.push({ text: intl.formatMessage(messages.blockDomain, { domain }), action: this.props.onBlockDomain });
+ menu.push({
+ text: intl.formatMessage(messages.blockDomain, { domain }),
+ action: this.props.onBlockDomain,
+ icon: require('@tabler/icons/icons/ban.svg'),
+ });
}
}
@@ -255,31 +343,74 @@ class Header extends ImmutablePureComponent {
menu.push(null);
if (isAdmin(meAccount)) {
- menu.push({ text: intl.formatMessage(messages.admin_account, { name: account.get('username') }), href: `/pleroma/admin/#/users/${account.get('id')}/`, newTab: true });
+ menu.push({
+ text: intl.formatMessage(messages.admin_account, { name: account.get('username') }),
+ href: `/pleroma/admin/#/users/${account.get('id')}/`, newTab: true,
+ icon: require('icons/gavel.svg'),
+ });
}
if (account.get('id') !== me && isLocal(account)) {
if (isAdmin(account)) {
- menu.push({ text: intl.formatMessage(messages.demoteToModerator, { name: account.get('username') }), action: this.props.onPromoteToModerator });
- menu.push({ text: intl.formatMessage(messages.demoteToUser, { name: account.get('username') }), action: this.props.onDemoteToUser });
+ menu.push({
+ text: intl.formatMessage(messages.demoteToModerator, { name: account.get('username') }),
+ action: this.props.onPromoteToModerator,
+ icon: require('@tabler/icons/icons/arrow-up-circle.svg'),
+ });
+ menu.push({
+ text: intl.formatMessage(messages.demoteToUser, { name: account.get('username') }),
+ action: this.props.onDemoteToUser,
+ icon: require('@tabler/icons/icons/arrow-down-circle.svg'),
+ });
} else if (isModerator(account)) {
- menu.push({ text: intl.formatMessage(messages.promoteToAdmin, { name: account.get('username') }), action: this.props.onPromoteToAdmin });
- menu.push({ text: intl.formatMessage(messages.demoteToUser, { name: account.get('username') }), action: this.props.onDemoteToUser });
+ menu.push({
+ text: intl.formatMessage(messages.promoteToAdmin, { name: account.get('username') }),
+ action: this.props.onPromoteToAdmin,
+ icon: require('@tabler/icons/icons/arrow-up-circle.svg'),
+ });
+ menu.push({
+ text: intl.formatMessage(messages.demoteToUser, { name: account.get('username') }),
+ action: this.props.onDemoteToUser,
+ icon: require('@tabler/icons/icons/arrow-down-circle.svg'),
+ });
} else {
- menu.push({ text: intl.formatMessage(messages.promoteToAdmin, { name: account.get('username') }), action: this.props.onPromoteToAdmin });
- menu.push({ text: intl.formatMessage(messages.promoteToModerator, { name: account.get('username') }), action: this.props.onPromoteToModerator });
+ menu.push({
+ text: intl.formatMessage(messages.promoteToAdmin, { name: account.get('username') }),
+ action: this.props.onPromoteToAdmin,
+ icon: require('@tabler/icons/icons/arrow-up-circle.svg'),
+ });
+ menu.push({
+ text: intl.formatMessage(messages.promoteToModerator, { name: account.get('username') }),
+ action: this.props.onPromoteToModerator,
+ icon: require('@tabler/icons/icons/arrow-up-circle.svg'),
+ });
}
}
if (isVerified(account)) {
- menu.push({ text: intl.formatMessage(messages.unverifyUser, { name: account.get('username') }), action: this.props.onUnverifyUser });
+ menu.push({
+ text: intl.formatMessage(messages.unverifyUser, { name: account.get('username') }),
+ action: this.props.onUnverifyUser,
+ icon: require('@tabler/icons/icons/check.svg'),
+ });
} else {
- menu.push({ text: intl.formatMessage(messages.verifyUser, { name: account.get('username') }), action: this.props.onVerifyUser });
+ menu.push({
+ text: intl.formatMessage(messages.verifyUser, { name: account.get('username') }),
+ action: this.props.onVerifyUser,
+ icon: require('@tabler/icons/icons/check.svg'),
+ });
}
if (account.get('id') !== me) {
- menu.push({ text: intl.formatMessage(messages.deactivateUser, { name: account.get('username') }), action: this.props.onDeactivateUser });
- menu.push({ text: intl.formatMessage(messages.deleteUser, { name: account.get('username') }), action: this.props.onDeleteUser });
+ menu.push({
+ text: intl.formatMessage(messages.deactivateUser, { name: account.get('username') }),
+ action: this.props.onDeactivateUser,
+ icon: require('@tabler/icons/icons/user-off.svg'),
+ });
+ menu.push({
+ text: intl.formatMessage(messages.deleteUser, { name: account.get('username') }),
+ icon: require('@tabler/icons/icons/user-minus.svg'),
+ });
}
}
diff --git a/app/soapbox/features/admin/components/report.js b/app/soapbox/features/admin/components/report.js
index 297b0d55d..8ef9a3172 100644
--- a/app/soapbox/features/admin/components/report.js
+++ b/app/soapbox/features/admin/components/report.js
@@ -37,9 +37,11 @@ class Report extends ImmutablePureComponent {
return [{
text: intl.formatMessage(messages.deactivateUser, { name: report.getIn(['account', 'username']) }),
action: this.handleDeactivateUser,
+ icon: require('@tabler/icons/icons/user-off.svg'),
}, {
text: intl.formatMessage(messages.deleteUser, { name: report.getIn(['account', 'username']) }),
action: this.handleDeleteUser,
+ icon: require('@tabler/icons/icons/user-minus.svg'),
}];
}
diff --git a/app/soapbox/features/admin/components/report_status.js b/app/soapbox/features/admin/components/report_status.js
index 11110adb8..83bb4ef46 100644
--- a/app/soapbox/features/admin/components/report_status.js
+++ b/app/soapbox/features/admin/components/report_status.js
@@ -32,9 +32,11 @@ class ReportStatus extends ImmutablePureComponent {
return [{
text: intl.formatMessage(messages.viewStatus, { acct: `@${acct}` }),
to: `/@${acct}/posts/${status.get('id')}`,
+ icon: require('@tabler/icons/icons/pencil.svg'),
}, {
text: intl.formatMessage(messages.deleteStatus, { acct: `@${acct}` }),
action: this.handleDeleteStatus,
+ icon: require('@tabler/icons/icons/trash.svg'),
}];
}
diff --git a/app/soapbox/features/admin/reports.js b/app/soapbox/features/admin/reports.js
index 141db1d45..ac34352c6 100644
--- a/app/soapbox/features/admin/reports.js
+++ b/app/soapbox/features/admin/reports.js
@@ -44,6 +44,7 @@ class Reports extends ImmutablePureComponent {
return [{
text: intl.formatMessage(messages.modlog),
to: '/admin/log',
+ icon: require('@tabler/icons/icons/list.svg'),
}];
}
diff --git a/app/soapbox/features/backups/index.js b/app/soapbox/features/backups/index.js
index 7b161cc35..a247db302 100644
--- a/app/soapbox/features/backups/index.js
+++ b/app/soapbox/features/backups/index.js
@@ -52,6 +52,7 @@ class Backups extends ImmutablePureComponent {
return [{
text: intl.formatMessage(messages.create),
action: this.handleCreateBackup,
+ icon: require('@tabler/icons/icons/plus.svg'),
}];
}
diff --git a/app/soapbox/features/chats/components/chat_message_list.js b/app/soapbox/features/chats/components/chat_message_list.js
index 6e570e06c..7689bb4f9 100644
--- a/app/soapbox/features/chats/components/chat_message_list.js
+++ b/app/soapbox/features/chats/components/chat_message_list.js
@@ -261,8 +261,16 @@ class ChatMessageList extends ImmutablePureComponent {
renderMessage = (chatMessage) => {
const { me, intl } = this.props;
const menu = [
- { text: intl.formatMessage(messages.delete), action: this.handleDeleteMessage(chatMessage.get('chat_id'), chatMessage.get('id')) },
- { text: intl.formatMessage(messages.report), action: this.handleReportUser(chatMessage.get('account_id')) },
+ {
+ text: intl.formatMessage(messages.delete),
+ action: this.handleDeleteMessage(chatMessage.get('chat_id'), chatMessage.get('id')),
+ icon: require('@tabler/icons/icons/trash.svg'),
+ },
+ {
+ text: intl.formatMessage(messages.report),
+ action: this.handleReportUser(chatMessage.get('account_id')),
+ icon: require('@tabler/icons/icons/flag.svg'),
+ },
];
return (
diff --git a/app/soapbox/features/groups/timeline/components/header.js b/app/soapbox/features/groups/timeline/components/header.js
index 34d0bb2c5..0355a1c4a 100644
--- a/app/soapbox/features/groups/timeline/components/header.js
+++ b/app/soapbox/features/groups/timeline/components/header.js
@@ -50,8 +50,16 @@ class Header extends ImmutablePureComponent {
const { group, intl } = this.props;
const menu = [
- { text: intl.formatMessage(messages.edit), to: `/groups/${group.get('id')}/edit` },
- { text: intl.formatMessage(messages.removed_accounts), to: `/groups/${group.get('id')}/removed_accounts` },
+ {
+ text: intl.formatMessage(messages.edit),
+ to: `/groups/${group.get('id')}/edit`,
+ icon: require('@tabler/icons/icons/edit.svg'),
+ },
+ {
+ text: intl.formatMessage(messages.removed_accounts),
+ to: `/groups/${group.get('id')}/removed_accounts`,
+ icon: require('@tabler/icons/icons/trash.svg'),
+ },
];
return ;
diff --git a/app/soapbox/features/ui/components/instance_info_panel.js b/app/soapbox/features/ui/components/instance_info_panel.js
index 57c1bdabd..6d6356871 100644
--- a/app/soapbox/features/ui/components/instance_info_panel.js
+++ b/app/soapbox/features/ui/components/instance_info_panel.js
@@ -56,6 +56,7 @@ class InstanceInfoPanel extends ImmutablePureComponent {
return [{
text: intl.formatMessage(pinned ? messages.unpinHost : messages.pinHost, { host }),
action: this.handlePinHost,
+ icon: require(pinned ? '@tabler/icons/icons/pinned-off.svg' : '@tabler/icons/icons/pin.svg'),
}];
}
diff --git a/app/soapbox/features/ui/components/instance_moderation_panel.js b/app/soapbox/features/ui/components/instance_moderation_panel.js
index 693940540..c52950457 100644
--- a/app/soapbox/features/ui/components/instance_moderation_panel.js
+++ b/app/soapbox/features/ui/components/instance_moderation_panel.js
@@ -52,6 +52,7 @@ class InstanceModerationPanel extends ImmutablePureComponent {
return [{
text: intl.formatMessage(messages.editFederation),
action: this.handleEditFederation,
+ icon: require('@tabler/icons/icons/edit.svg'),
}];
}
diff --git a/app/soapbox/features/ui/components/profile_dropdown.js b/app/soapbox/features/ui/components/profile_dropdown.js
index 565be4e10..7ec2c4ea3 100644
--- a/app/soapbox/features/ui/components/profile_dropdown.js
+++ b/app/soapbox/features/ui/components/profile_dropdown.js
@@ -113,8 +113,17 @@ class ProfileDropdown extends React.PureComponent {
menu.push(null);
- menu.push({ text: intl.formatMessage(messages.add), to: '/auth/sign_in' });
- menu.push({ text: intl.formatMessage(messages.logout, { acct: account.get('acct') }), to: '/auth/sign_out', action: this.handleLogOut });
+ menu.push({
+ text: intl.formatMessage(messages.add),
+ to: '/auth/sign_in',
+ icon: require('@tabler/icons/icons/plus.svg'),
+ });
+ menu.push({
+ text: intl.formatMessage(messages.logout, { acct: account.get('acct') }),
+ to: '/auth/sign_out',
+ action: this.handleLogOut,
+ icon: require('@tabler/icons/icons/logout.svg'),
+ });
return (