Fix missing icon props (mastodon#27539)

michiru-me · Oct 24, 2023 · f08ca3f · f08ca3f
1 parent bc3afb6
commit f08ca3f
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 4 deletions.
diff --git a/app/javascript/mastodon/components/icon.tsx b/app/javascript/mastodon/components/icon.tsx
@@ -25,7 +25,9 @@ export const Icon: React.FC<Props> = ({
   // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
   if (!IconComponent) {
     if (process.env.NODE_ENV !== 'production') {
-      throw new Error(`<Icon id="${id}"> is missing an "icon" prop.`);
+      throw new Error(
+        `<Icon id="${id}" className="${className}"> is missing an "icon" prop.`,
+      );
     }
 
     IconComponent = CheckBoxOutlineBlankIcon;

diff --git a/app/javascript/mastodon/features/follow_requests/index.jsx b/app/javascript/mastodon/features/follow_requests/index.jsx
@@ -8,6 +8,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import { connect } from 'react-redux';
 
+import { ReactComponent as PersonAddIcon } from '@material-symbols/svg-600/outlined/person_add.svg';
 import { debounce } from 'lodash';
 
 import { fetchFollowRequests, expandFollowRequests } from '../../actions/accounts';
@@ -67,7 +68,7 @@ class FollowRequests extends ImmutablePureComponent {
     );
 
     return (
-      <Column bindToDocument={!multiColumn} icon='user-plus' heading={intl.formatMessage(messages.heading)}>
+      <Column bindToDocument={!multiColumn} icon='user-plus' iconComponent={PersonAddIcon} heading={intl.formatMessage(messages.heading)}>
         <ColumnBackButtonSlim />
         <ScrollableList
           scrollKey='follow_requests'

diff --git a/app/javascript/mastodon/features/ui/components/column_header.jsx b/app/javascript/mastodon/features/ui/components/column_header.jsx
@@ -9,6 +9,7 @@ export default class ColumnHeader extends PureComponent {
 
   static propTypes = {
     icon: PropTypes.string,
+    iconComponent: PropTypes.func,
     type: PropTypes.string,
     active: PropTypes.bool,
     onClick: PropTypes.func,
@@ -20,11 +21,11 @@ export default class ColumnHeader extends PureComponent {
   };
 
   render () {
-    const { icon, type, active, columnHeaderId } = this.props;
+    const { icon, iconComponent, type, active, columnHeaderId } = this.props;
     let iconElement = '';
 
     if (icon) {
-      iconElement = <Icon id={icon} className='column-header__icon' />;
+      iconElement = <Icon id={icon} icon={iconComponent} className='column-header__icon' />;
     }
 
     return (