fix account-gallery & notification filter icon

2023-11-01 04:19:39 +09:00 · 2023-11-01 04:19:39 +09:00 · a49db09f11
commit a49db09f11
parent dea09a221e
9 changed files with 55 additions and 23 deletions
--- a/app/javascript/mastodon/features/account/components/header.jsx
+++ b/app/javascript/mastodon/features/account/components/header.jsx
@ -303,9 +303,9 @@ class Header extends ImmutablePureComponent {
      menu.push({ text: intl.formatMessage(messages.edit_profile), href: '/settings/profile' });
      menu.push({ text: intl.formatMessage(messages.preferences), href: '/settings/preferences' });
      menu.push({ text: intl.formatMessage(messages.pins), to: '/pinned' });
-      menu.push({ text: intl.formatMessage(messages.directMessages), to: '/direct_messages' });
      menu.push(null);
      menu.push({ text: intl.formatMessage(messages.follow_requests), to: '/follow_requests' });
+      menu.push({ text: intl.formatMessage(messages.directMessages), to: '/direct_messages' });
      menu.push({ text: intl.formatMessage(messages.favourites), to: '/favourites' });
      menu.push({ text: intl.formatMessage(messages.lists), to: '/lists' });
      menu.push({ text: intl.formatMessage(messages.followed_tags), to: '/followed_tags' });
--- a/app/javascript/mastodon/features/account_gallery/components/media_item.jsx
+++ b/app/javascript/mastodon/features/account_gallery/components/media_item.jsx
@ -1,16 +1,22 @@
 import PropTypes from 'prop-types';

 import classNames from 'classnames';
+import { withRouter } from "react-router-dom";

 import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';

 import { Blurhash } from 'mastodon/components/blurhash';
-import { Icon }  from 'mastodon/components/icon';
+import { Icon } from 'mastodon/components/icon';
 import { autoPlayGif, displayMedia, useBlurhash } from 'mastodon/initial_state';

 export default class MediaItem extends ImmutablePureComponent {

+  static contextTypes = {
+    identity: PropTypes.object,
+    router: PropTypes.object,
+  };
+
  static propTypes = {
    attachment: ImmutablePropTypes.map.isRequired,
    displayWidth: PropTypes.number.isRequired,
@ -39,30 +45,44 @@ export default class MediaItem extends ImmutablePureComponent {
    }
  };

-  hoverToPlay () {
+  hoverToPlay() {
    return !autoPlayGif && ['gifv', 'video'].indexOf(this.props.attachment.get('type')) !== -1;
  }

  handleClick = e => {
    if (e.button === 0 && !(e.ctrlKey || e.metaKey)) {
-      e.preventDefault();
-
-      if (this.state.visible) {
-        this.props.onOpenMedia(this.props.attachment);
-      } else {
-        this.setState({ visible: true });
-      }
+      this.handleHotkeyOpen();
    }
+    if (e) {
+      e.preventDefault();
+    }
+    return;
  };

-  render () {
+  handleHotkeyOpen = () => {
+    if (this.props.onClick) {
+      this.props.onClick();
+      return;
+    }
+
+    const { router } = this.context;
+    const status = this.props.attachment.get('status');
+
+    if (!router) {
+      return;
+    }
+
+    router.history.push(`/@${status.getIn(['account', 'acct'])}/${status.get('id')}`);
+  };
+
+  render() {
    const { attachment, displayWidth } = this.props;
    const { visible, loaded } = this.state;

-    const width  = `${Math.floor((displayWidth - 4) / 3) - 4}px`;
+    const width = `${Math.floor((displayWidth - 4) / 3) - 4}px`;
    const height = width;
    const status = attachment.get('status');
-    const title  = status.get('spoiler_text') || attachment.get('description');
+    const title = status.get('spoiler_text') || attachment.get('description');

    let thumbnail, label, icon, content;

@ -91,8 +111,8 @@ export default class MediaItem extends ImmutablePureComponent {
      } else if (attachment.get('type') === 'image') {
        const focusX = attachment.getIn(['meta', 'focus', 'x']) || 0;
        const focusY = attachment.getIn(['meta', 'focus', 'y']) || 0;
-        const x      = ((focusX /  2) + .5) * 100;
-        const y      = ((focusY / -2) + .5) * 100;
+        const x = ((focusX / 2) + .5) * 100;
+        const y = ((focusY / -2) + .5) * 100;

        content = (
          <img
@ -139,7 +159,7 @@ export default class MediaItem extends ImmutablePureComponent {

    return (
      <div className='account-gallery__item' style={{ width, height }}>
-        <a className='media-gallery__item-thumbnail' href={`/@${status.getIn(['account', 'acct'])}/${status.get('id')}`} onClick={this.handleClick} title={title} target='_blank' rel='noopener noreferrer'>
+        <a className='media-gallery__item-thumbnail' onClick={this.handleClick} title={title} target='_blank' rel='noopener noreferrer'>
          <Blurhash
            hash={attachment.get('blurhash')}
            className={classNames('media-gallery__preview', { 'media-gallery__preview--hidden': visible && loaded })}
--- a/app/javascript/mastodon/features/compose/components/action_bar.jsx
+++ b/app/javascript/mastodon/features/compose/components/action_bar.jsx
@ -44,9 +44,9 @@ class ActionBar extends PureComponent {
    menu.push({ text: intl.formatMessage(messages.edit_profile), href: '/settings/profile' });
    menu.push({ text: intl.formatMessage(messages.preferences), href: '/settings/preferences' });
    menu.push({ text: intl.formatMessage(messages.pins), to: '/pinned' });
-    menu.push({ text: intl.formatMessage(messages.directMessages), to: '/direct_messages' });
    menu.push(null);
    menu.push({ text: intl.formatMessage(messages.follow_requests), to: '/follow_requests' });
+    menu.push({ text: intl.formatMessage(messages.directMessages), to: '/direct_messages' });
    menu.push({ text: intl.formatMessage(messages.favourites), to: '/favourites' });
    menu.push({ text: intl.formatMessage(messages.bookmarks), to: '/bookmarks' });
    menu.push({ text: intl.formatMessage(messages.lists), to: '/lists' });
--- a/app/javascript/mastodon/features/notifications/components/filter_bar.jsx
+++ b/app/javascript/mastodon/features/notifications/components/filter_bar.jsx
@ -7,6 +7,7 @@ import { Icon }  from 'mastodon/components/icon';

 const tooltips = defineMessages({
  mentions: { id: 'notifications.filter.mentions', defaultMessage: 'Mentions' },
+  direcmessages: { id: 'notifications.filter.directmessages', defaultMessage: 'DM' },
  favourites: { id: 'notifications.filter.favourites', defaultMessage: 'Favorites' },
  boosts: { id: 'notifications.filter.boosts', defaultMessage: 'Boosts' },
  polls: { id: 'notifications.filter.polls', defaultMessage: 'Poll results' },
@ -68,6 +69,13 @@ class FilterBar extends PureComponent {
        >
          <Icon id='reply-all' fixedWidth />
        </button>
+        <button
+          className={selectedFilter === 'directmessages' ? 'active' : ''}
+          onClick={this.onClick('directmessages')}
+          title={intl.formatMessage(tooltips.mentions)}
+        >
+          <Icon id='envelope-o' fixedWidth />
+        </button>
        <button
          className={selectedFilter === 'favourite' ? 'active' : ''}
          onClick={this.onClick('favourite')}
--- a/app/javascript/mastodon/features/ui/index.jsx
+++ b/app/javascript/mastodon/features/ui/index.jsx
@ -172,9 +172,11 @@ class SwitchingColumnsArea extends PureComponent {
      }
    } else if (singleUserMode && owner && initialState?.accounts[owner]) {
      redirect = <Redirect from='/' to={`/@${initialState.accounts[owner].username}`} exact />;
-    } else if (trendsEnabled && trendsAsLanding) {
-      redirect = <Redirect from='/' to='/explore' exact />;
-    } else {
+    } 
+    // else if (trendsEnabled && trendsAsLanding) {
+    //   redirect = <Redirect from='/' to='/explore' exact />;
+    // } 
+    else {
      redirect = <Redirect from='/' to='/about' exact />;
    }

@ -210,7 +212,7 @@ class SwitchingColumnsArea extends PureComponent {

          <WrappedRoute path='/start' exact component={Onboarding} content={children} />
          <WrappedRoute path='/directory' component={Directory} content={children} />
-          <WrappedRoute path={['/explore', '/search']} component={Explore} content={children} />
+          {/* <WrappedRoute path={['/explore', '/search']} component={Explore} content={children} /> */}
          <WrappedRoute path={['/publish', '/statuses/new']} component={Compose} content={children} />

          <WrappedRoute path={['/@:acct', '/accounts/:id']} exact component={AccountTimeline} content={children} />
--- a/app/javascript/mastodon/locales/en.json
+++ b/app/javascript/mastodon/locales/en.json
@ -459,6 +459,7 @@
  "notifications.column_settings.update": "Edits:",
  "notifications.filter.all": "All",
  "notifications.filter.boosts": "Boosts",
+  "notifications.filter.directmessages": "Direct Messages",
  "notifications.filter.favourites": "Favorites",
  "notifications.filter.follows": "Follows",
  "notifications.filter.mentions": "Mentions",
--- a/app/javascript/mastodon/locales/ko.json
+++ b/app/javascript/mastodon/locales/ko.json
@ -460,6 +460,7 @@
  "notifications.filter.all": "모두",
  "notifications.filter.boosts": "부스트",
  "notifications.filter.favourites": "좋아요",
+  "notifications.filter.directmessages": "다이렉트 메시지",
  "notifications.filter.follows": "팔로우",
  "notifications.filter.mentions": "멘션",
  "notifications.filter.polls": "설문 결과",
--- a/app/javascript/styles/mastodon-bird-ui/layout-single-column.scss
+++ b/app/javascript/styles/mastodon-bird-ui/layout-single-column.scss
@ -17,7 +17,7 @@
  --color-brand-twitter-threaded-line: #425364;
  --color-brand-mastodon: #ebaf48;
  --color-brand-mastodon-links: #ecce9a;
-  --color-brand-mastodon-bg: #e4e5e9;
+  --color-brand-mastodon-bg: #1e2028;
  --color-brand-mastodon-dim: #717c9b;
  --color-brand-mastodon-mud: rgb(39 44 64 / .5);
  --color-brand-mastodon-dark: #232543;
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@ -6324,7 +6324,7 @@ a.status-card {
 }

 .media-gallery__item-thumbnail {
-  cursor: zoom-in;
+  cursor: pointer;
  display: block;
  text-decoration: none;
  color: $secondary-text-color;