From c20a882b5925392d906a2e8a9a74af9a0d1ee544 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?KMY=EF=BC=88=E9=9B=AA=E3=81=82=E3=81=99=E3=81=8B=EF=BC=89?=
 <tt@kmycode.net>
Date: Fri, 27 Oct 2023 10:31:36 +0900
Subject: [PATCH] =?UTF-8?q?Fix:=20#184=20=E3=82=A2=E3=83=B3=E3=83=86?=
 =?UTF-8?q?=E3=83=8A=E7=B7=A8=E9=9B=86=E7=94=BB=E9=9D=A2=E3=81=AE=E3=82=A2?=
 =?UTF-8?q?=E3=82=A4=E3=82=B3=E3=83=B3=20(#187)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../antenna_setting/components/text_list.jsx       | 14 +++++++++-----
 .../mastodon/features/antenna_setting/index.jsx    |  9 +++++++++
 2 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/app/javascript/mastodon/features/antenna_setting/components/text_list.jsx b/app/javascript/mastodon/features/antenna_setting/components/text_list.jsx
index 25574a3b0d8c2e..0f27a9ac057b6a 100644
--- a/app/javascript/mastodon/features/antenna_setting/components/text_list.jsx
+++ b/app/javascript/mastodon/features/antenna_setting/components/text_list.jsx
@@ -6,6 +6,8 @@ import { injectIntl } from 'react-intl';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import { connect } from 'react-redux';
 
+import { ReactComponent as DeleteIcon } from '@material-symbols/svg-600/outlined/delete.svg';
+
 import { Button } from 'mastodon/components/button';
 import { Icon } from 'mastodon/components/icon';
 import { IconButton } from 'mastodon/components/icon_button';
@@ -14,6 +16,7 @@ class TextListItem extends PureComponent {
 
   static propTypes = {
     icon: PropTypes.string.isRequired,
+    iconComponent: PropTypes.object.isRequired,
     value: PropTypes.string.isRequired,
     onRemove: PropTypes.func.isRequired,
   };
@@ -23,13 +26,13 @@ class TextListItem extends PureComponent {
   };
 
   render () {
-    const { icon, value } = this.props;
+    const { icon, iconComponent, value } = this.props;
 
     return (
       <div className='setting-text-list-item'>
-        <Icon id={icon} />
+        <Icon id={icon} icon={iconComponent} />
         <span className='label'>{value}</span>
-        <IconButton icon='trash' onClick={this.handleRemove} />
+        <IconButton icon='trash' iconComponent={DeleteIcon} onClick={this.handleRemove} />
       </div>
     );
   }
@@ -44,6 +47,7 @@ class TextList extends PureComponent {
     disabled: PropTypes.bool,
     intl: PropTypes.object.isRequired,
     icon: PropTypes.string.isRequired,
+    iconComponent: PropTypes.object.isRequired,
     label: PropTypes.string.isRequired,
     title: PropTypes.string.isRequired,
     onChange: PropTypes.func.isRequired,
@@ -65,12 +69,12 @@ class TextList extends PureComponent {
   };
 
   render () {
-    const { icon, value, values, disabled, label, title } = this.props;
+    const { icon, iconComponent, value, values, disabled, label, title } = this.props;
 
     return (
       <div className='setting-text-list'>
         {values.map((val) => (
-          <TextListItem key={val} value={val} icon={icon} onRemove={this.props.onRemove} />
+          <TextListItem key={val} value={val} icon={icon} iconComponent={iconComponent} onRemove={this.props.onRemove} />
         ))}
 
         <form className='add-text-form' onSubmit={this.handleSubmit}>
diff --git a/app/javascript/mastodon/features/antenna_setting/index.jsx b/app/javascript/mastodon/features/antenna_setting/index.jsx
index 2863cba92114a7..5bdc8430185b39 100644
--- a/app/javascript/mastodon/features/antenna_setting/index.jsx
+++ b/app/javascript/mastodon/features/antenna_setting/index.jsx
@@ -12,7 +12,10 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 import { connect } from 'react-redux';
 
 import { ReactComponent as DeleteIcon } from '@material-symbols/svg-600/outlined/delete.svg';
+import { ReactComponent as DomainIcon } from '@material-symbols/svg-600/outlined/dns.svg';
 import { ReactComponent as EditIcon } from '@material-symbols/svg-600/outlined/edit.svg';
+import { ReactComponent as HashtagIcon } from '@material-symbols/svg-600/outlined/tag.svg';
+import { ReactComponent as KeywordIcon } from '@material-symbols/svg-600/outlined/title.svg';
 import { ReactComponent as AntennaIcon } from '@material-symbols/svg-600/outlined/wifi.svg';
 import Select, { NonceProvider } from 'react-select';
 import Toggle from 'react-toggle';
@@ -473,6 +476,7 @@ class AntennaSetting extends PureComponent {
                   value={this.state.domainName}
                   values={domains.get('domains') || ImmutableList()}
                   icon='sitemap'
+                  iconComponent={DomainIcon}
                   label={intl.formatMessage(messages.addDomainLabel)}
                   title={intl.formatMessage(messages.addDomainTitle)}
                 />
@@ -490,6 +494,7 @@ class AntennaSetting extends PureComponent {
                   value={this.state.tagName}
                   values={tags.get('tags') || ImmutableList()}
                   icon='hashtag'
+                  iconComponent={HashtagIcon}
                   label={intl.formatMessage(messages.addTagLabel)}
                   title={intl.formatMessage(messages.addTagTitle)}
                 />
@@ -503,6 +508,7 @@ class AntennaSetting extends PureComponent {
                   value={this.state.keywordName}
                   values={keywords.get('keywords') || ImmutableList()}
                   icon='paragraph'
+                  iconComponent={KeywordIcon}
                   label={intl.formatMessage(messages.addKeywordLabel)}
                   title={intl.formatMessage(messages.addKeywordTitle)}
                 />
@@ -521,6 +527,7 @@ class AntennaSetting extends PureComponent {
                 value={this.state.excludeDomainName}
                 values={domains.get('exclude_domains') || ImmutableList()}
                 icon='sitemap'
+                iconComponent={DomainIcon}
                 label={intl.formatMessage(messages.addDomainLabel)}
                 title={intl.formatMessage(messages.addDomainTitle)}
               />
@@ -532,6 +539,7 @@ class AntennaSetting extends PureComponent {
                 value={this.state.excludeKeywordName}
                 values={keywords.get('exclude_keywords') || ImmutableList()}
                 icon='paragraph'
+                iconComponent={KeywordIcon}
                 label={intl.formatMessage(messages.addKeywordLabel)}
                 title={intl.formatMessage(messages.addKeywordTitle)}
               />
@@ -543,6 +551,7 @@ class AntennaSetting extends PureComponent {
                 value={this.state.excludeTagName}
                 values={tags.get('exclude_tags') || ImmutableList()}
                 icon='hashtag'
+                iconComponent={HashtagIcon}
                 label={intl.formatMessage(messages.addTagLabel)}
                 title={intl.formatMessage(messages.addTagTitle)}
               />