diff --git a/app/javascript/flavours/glitch/features/hashtag_timeline/components/hashtag_header.jsx b/app/javascript/flavours/glitch/features/hashtag_timeline/components/hashtag_header.jsx index 47854d72be6c86..96dda2531856e7 100644 --- a/app/javascript/flavours/glitch/features/hashtag_timeline/components/hashtag_header.jsx +++ b/app/javascript/flavours/glitch/features/hashtag_timeline/components/hashtag_header.jsx @@ -4,12 +4,17 @@ import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; import ImmutablePropTypes from 'react-immutable-proptypes'; +import MoreHorizIcon from '@/material-icons/400-24px/more_horiz.svg?react'; import { Button } from 'flavours/glitch/components/button'; import { ShortNumber } from 'flavours/glitch/components/short_number'; +import DropdownMenuContainer from 'flavours/glitch/containers/dropdown_menu_container'; +import { withIdentity } from 'flavours/glitch/identity_context'; +import { PERMISSION_MANAGE_TAXONOMIES } from 'flavours/glitch/permissions'; const messages = defineMessages({ followHashtag: { id: 'hashtag.follow', defaultMessage: 'Follow hashtag' }, unfollowHashtag: { id: 'hashtag.unfollow', defaultMessage: 'Unfollow hashtag' }, + adminModeration: { id: 'hashtag.admin_moderation', defaultMessage: 'Open moderation interface for #{name}' }, }); const usesRenderer = (displayNumber, pluralReady) => ( @@ -45,11 +50,18 @@ const usesTodayRenderer = (displayNumber, pluralReady) => ( /> ); -export const HashtagHeader = injectIntl(({ tag, intl, disabled, onClick }) => { +export const HashtagHeader = withIdentity(injectIntl(({ tag, intl, disabled, onClick, identity }) => { if (!tag) { return null; } + const { signedIn, permissions } = identity; + const menu = []; + + if (signedIn && (permissions & PERMISSION_MANAGE_TAXONOMIES) === PERMISSION_MANAGE_TAXONOMIES ) { + menu.push({ text: intl.formatMessage(messages.adminModeration, { name: tag.get("name") }), href: `/admin/tags/${tag.get('id')}` }); + } + const [uses, people] = tag.get('history').reduce((arr, day) => [arr[0] + day.get('uses') * 1, arr[1] + day.get('accounts') * 1], [0, 0]); const dividingCircle = {' ยท '}; @@ -57,7 +69,10 @@ export const HashtagHeader = injectIntl(({ tag, intl, disabled, onClick }) => {

#{tag.get('name')}

-
@@ -69,7 +84,7 @@ export const HashtagHeader = injectIntl(({ tag, intl, disabled, onClick }) => {
); -}); +})); HashtagHeader.propTypes = { tag: ImmutablePropTypes.map, diff --git a/app/javascript/flavours/glitch/permissions.ts b/app/javascript/flavours/glitch/permissions.ts index 8f015610ea08e7..d7695d2f5c7e02 100644 --- a/app/javascript/flavours/glitch/permissions.ts +++ b/app/javascript/flavours/glitch/permissions.ts @@ -1,5 +1,6 @@ export const PERMISSION_INVITE_USERS = 0x0000000000010000; export const PERMISSION_MANAGE_USERS = 0x0000000000000400; +export const PERMISSION_MANAGE_TAXONOMIES = 0x0000000000000100; export const PERMISSION_MANAGE_FEDERATION = 0x0000000000000020; export const PERMISSION_MANAGE_REPORTS = 0x0000000000000010; diff --git a/app/javascript/flavours/glitch/styles/components.scss b/app/javascript/flavours/glitch/styles/components.scss index dd24167daa66ad..34354ee1d60544 100644 --- a/app/javascript/flavours/glitch/styles/components.scss +++ b/app/javascript/flavours/glitch/styles/components.scss @@ -8529,7 +8529,7 @@ noscript { } .icon-button { - border: 1px solid lighten($ui-base-color, 12%); + border: 1px solid var(--background-border-color); border-radius: 4px; box-sizing: content-box; padding: 5px; @@ -10487,6 +10487,30 @@ noscript { line-height: 33px; font-weight: 700; } + + &__buttons { + display: flex; + align-items: center; + gap: 8px; + + .button { + flex-shrink: 1; + white-space: nowrap; + min-width: 80px; + } + + .icon-button { + border: 1px solid var(--background-border-color); + border-radius: 4px; + box-sizing: content-box; + padding: 5px; + + .icon { + width: 24px; + height: 24px; + } + } + } } }