From f1189f34d88c1c2a3d1bc7b1b7d961510a07e88d Mon Sep 17 00:00:00 2001
From: Charly Nguyen <charly.nguyen@nordeck.net>
Date: Wed, 8 Nov 2023 12:30:33 +0100
Subject: [PATCH] Adapt the rendering of extra icons in the room header

Signed-off-by: Charly Nguyen <charly.nguyen@nordeck.net>
---
 package.json                                          | 2 +-
 src/components/views/rooms/LegacyRoomHeader.tsx       | 2 +-
 src/components/views/rooms/RoomHeader.tsx             | 2 +-
 test/components/views/rooms/LegacyRoomHeader-test.tsx | 4 ++--
 test/components/views/rooms/RoomHeader-test.tsx       | 4 ++--
 yarn.lock                                             | 8 ++++----
 6 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/package.json b/package.json
index 33232f1d827..c59b7490f66 100644
--- a/package.json
+++ b/package.json
@@ -64,7 +64,7 @@
         "@matrix-org/analytics-events": "^0.8.0",
         "@matrix-org/emojibase-bindings": "^1.1.2",
         "@matrix-org/matrix-wysiwyg": "2.4.1",
-        "@matrix-org/react-sdk-module-api": "^2.2.0",
+        "@matrix-org/react-sdk-module-api": "^2.2.1",
         "@matrix-org/spec": "^1.7.0",
         "@sentry/browser": "^7.0.0",
         "@sentry/tracing": "^7.0.0",
diff --git a/src/components/views/rooms/LegacyRoomHeader.tsx b/src/components/views/rooms/LegacyRoomHeader.tsx
index ab910744690..e968e26f38e 100644
--- a/src/components/views/rooms/LegacyRoomHeader.tsx
+++ b/src/components/views/rooms/LegacyRoomHeader.tsx
@@ -684,7 +684,7 @@ export default class RoomHeader extends React.Component<IProps, IState> {
                                 }}
                                 title={label}
                             >
-                                {props.icon}
+                                {typeof props.icon === "function" ? props.icon() : props.icon}
                             </IconButton>
                         </Tooltip>
                     );
diff --git a/src/components/views/rooms/RoomHeader.tsx b/src/components/views/rooms/RoomHeader.tsx
index 3fc0998ccaf..1e0bef8f2a4 100644
--- a/src/components/views/rooms/RoomHeader.tsx
+++ b/src/components/views/rooms/RoomHeader.tsx
@@ -188,7 +188,7 @@ export default function RoomHeader({
                                     props.onClick();
                                 }}
                             >
-                                {props.icon}
+                                {typeof props.icon === "function" ? props.icon() : props.icon}
                             </IconButton>
                         </Tooltip>
                     );
diff --git a/test/components/views/rooms/LegacyRoomHeader-test.tsx b/test/components/views/rooms/LegacyRoomHeader-test.tsx
index 3038fa0d499..69c7ba910fc 100644
--- a/test/components/views/rooms/LegacyRoomHeader-test.tsx
+++ b/test/components/views/rooms/LegacyRoomHeader-test.tsx
@@ -743,7 +743,7 @@ describe("LegacyRoomHeader", () => {
     it("renders additionalButtons", async () => {
         const additionalButtons: ViewRoomOpts["buttons"] = [
             {
-                icon: <>test-icon</>,
+                icon: () => <>test-icon</>,
                 id: "test-id",
                 label: () => "test-label",
                 onClick: () => {},
@@ -757,7 +757,7 @@ describe("LegacyRoomHeader", () => {
         const callback = jest.fn();
         const additionalButtons: ViewRoomOpts["buttons"] = [
             {
-                icon: <>test-icon</>,
+                icon: () => <>test-icon</>,
                 id: "test-id",
                 label: () => "test-label",
                 onClick: callback,
diff --git a/test/components/views/rooms/RoomHeader-test.tsx b/test/components/views/rooms/RoomHeader-test.tsx
index f354ae934a2..43505c5af38 100644
--- a/test/components/views/rooms/RoomHeader-test.tsx
+++ b/test/components/views/rooms/RoomHeader-test.tsx
@@ -522,7 +522,7 @@ describe("RoomHeader", () => {
     it("renders additionalButtons", async () => {
         const additionalButtons: ViewRoomOpts["buttons"] = [
             {
-                icon: <>test-icon</>,
+                icon: () => <>test-icon</>,
                 id: "test-id",
                 label: () => "test-label",
                 onClick: () => {},
@@ -539,7 +539,7 @@ describe("RoomHeader", () => {
         const callback = jest.fn();
         const additionalButtons: ViewRoomOpts["buttons"] = [
             {
-                icon: <>test-icon</>,
+                icon: () => <>test-icon</>,
                 id: "test-id",
                 label: () => "test-label",
                 onClick: callback,
diff --git a/yarn.lock b/yarn.lock
index 5d58a125e83..8a0a8b03660 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1833,10 +1833,10 @@
   resolved "https://registry.yarnpkg.com/@matrix-org/olm/-/olm-3.2.15.tgz#55f3c1b70a21bbee3f9195cecd6846b1083451ec"
   integrity sha512-S7lOrndAK9/8qOtaTq/WhttJC/o4GAzdfK0MUPpo8ApzsJEC0QjtwrkC3KBXdFP1cD1MXi/mlKR7aaoVMKgs6Q==
 
-"@matrix-org/react-sdk-module-api@^2.2.0":
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/@matrix-org/react-sdk-module-api/-/react-sdk-module-api-2.2.0.tgz#cb284601a82448dc23fac31949c466eb34ec64b4"
-  integrity sha512-HSicxLdagZRbQp35d3t2SeDFTiT4GmEQDQGih8dWSKRHXK4krVQjb6Kf1NkwweiFDAeU0qgbz2pP4RZqbv0XIg==
+"@matrix-org/react-sdk-module-api@^2.2.1":
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/@matrix-org/react-sdk-module-api/-/react-sdk-module-api-2.2.1.tgz#308bcb42a780200d3e7994235376784b51819379"
+  integrity sha512-+MXTMEapzGmhArUt86GYDQirOvm19+wvQLDApmHpUQvSZvYm7wOo1EwR9FFvSKve53fu+v6gI1grnj7YLzGQ9Q==
   dependencies:
     "@babel/runtime" "^7.17.9"