mirrors
/
mastodon-glitch
mirror of https://github.com/glitch-soc/mastodon
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

[Glitch] Add link from Web UI for Hashtags to the Moderation UI 

Port eef8d2c855 to glitch-soc

Co-authored-by: Eugen Rochko <eugen@zeonfederated.com>
Signed-off-by: Claire <claire.github-309c@sitedethib.com>
pull/2910/head
Emelia Smith 2024-11-29 08:36:17 +01:00 committed by Claire
parent f441e3db4e
commit 170f76c82c
3 changed files with 44 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
app/javascript/flavours/glitch/features/hashtag_timeline/components/hashtag_header.jsx
View File

@ -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 = <span aria-hidden>{' · '}</span>;
@ -57,7 +69,10 @@ export const HashtagHeader = injectIntl(({ tag, intl, disabled, onClick }) => {
<div className='hashtag-header'>
<div className='hashtag-header__header'>
<h1>#{tag.get('name')}</h1>
<Button onClick={onClick} text={intl.formatMessage(tag.get('following') ? messages.unfollowHashtag : messages.followHashtag)} disabled={disabled} />
<div className='hashtag-header__header__buttons'>
{ menu.length > 0 && <DropdownMenuContainer disabled={menu.length === 0} items={menu} icon='ellipsis-v' iconComponent={MoreHorizIcon} size={24} direction='right' /> }
<Button onClick={onClick} text={intl.formatMessage(tag.get('following') ? messages.unfollowHashtag : messages.followHashtag)} disabled={disabled} />
</div>
</div>
<div>
@ -69,7 +84,7 @@ export const HashtagHeader = injectIntl(({ tag, intl, disabled, onClick }) => {
</div>
</div>
);
});
}));
HashtagHeader.propTypes = {
tag: ImmutablePropTypes.map,

1
app/javascript/flavours/glitch/permissions.ts
View File

@ -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;

26
app/javascript/flavours/glitch/styles/components.scss
View File

@ -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;
}
}
}
}
}