From 9b32a37b6f358522cc224965a0cce5b012d1a7dc Mon Sep 17 00:00:00 2001
From: Renaud Chaput <renchap@gmail.com>
Date: Tue, 24 Oct 2023 22:43:06 +0200
Subject: [PATCH] [Glitch] Fix missing icon props

Port f08ca3f04289e3a258e8bff772177c20906930c3 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
---
 app/javascript/flavours/glitch/components/icon.tsx           | 4 +++-
 .../flavours/glitch/features/follow_requests/index.jsx       | 3 ++-
 .../flavours/glitch/features/ui/components/column_header.jsx | 5 +++--
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/app/javascript/flavours/glitch/components/icon.tsx b/app/javascript/flavours/glitch/components/icon.tsx
index d53675e419..dbf5839606 100644
--- a/app/javascript/flavours/glitch/components/icon.tsx
+++ b/app/javascript/flavours/glitch/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/flavours/glitch/features/follow_requests/index.jsx b/app/javascript/flavours/glitch/features/follow_requests/index.jsx
index 796254e0ec..8e17607fd9 100644
--- a/app/javascript/flavours/glitch/features/follow_requests/index.jsx
+++ b/app/javascript/flavours/glitch/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/flavours/glitch/features/ui/components/column_header.jsx b/app/javascript/flavours/glitch/features/ui/components/column_header.jsx
index 3d49319f87..04fe975dbc 100644
--- a/app/javascript/flavours/glitch/features/ui/components/column_header.jsx
+++ b/app/javascript/flavours/glitch/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 (