From 4a49cd5c74529edc9a0971cddaaa5078f35aaa33 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nuno=20G=C3=B3is?= <github@nunogois.com>
Date: Wed, 18 Oct 2023 20:00:45 +0100
Subject: [PATCH] feat: display internal message banners (#5079)

https://linear.app/unleash/issue/2-1511/adapt-internalmessagebanners-to-use-the-new-hooks-and-display-the

Adapts the `InternalMessageBanners` component to use the new hook and
display the internal message banners.
---
 .../InternalMessageBanners.tsx                | 24 ++++---------------
 1 file changed, 4 insertions(+), 20 deletions(-)

diff --git a/frontend/src/component/messageBanners/internalMessageBanners/InternalMessageBanners.tsx b/frontend/src/component/messageBanners/internalMessageBanners/InternalMessageBanners.tsx
index 4418ce0c0765..f84d17c597fa 100644
--- a/frontend/src/component/messageBanners/internalMessageBanners/InternalMessageBanners.tsx
+++ b/frontend/src/component/messageBanners/internalMessageBanners/InternalMessageBanners.tsx
@@ -1,30 +1,14 @@
 import { MessageBanner } from 'component/messageBanners/MessageBanner/MessageBanner';
-import { useUiFlag } from 'hooks/useUiFlag';
+import { useMessageBanners } from 'hooks/api/getters/useMessageBanners/useMessageBanners';
 
 export const InternalMessageBanners = () => {
-    const internalMessageBanners = useUiFlag('internalMessageBanners');
-
-    if (!internalMessageBanners) return null;
-
-    // TODO: Implement. `messageBanners` should come from a `useMessageBanners()` hook.
-
-    const mockMessageBanners = [
-        {
-            message: 'Test 1',
-        },
-        {
-            message: 'Test 2',
-        },
-        {
-            message: 'Test 3',
-        },
-    ];
+    const { messageBanners } = useMessageBanners();
 
     return (
         <>
-            {mockMessageBanners.map((messageBanner) => (
+            {messageBanners.map((messageBanner) => (
                 <MessageBanner
-                    key={messageBanner.message}
+                    key={messageBanner.id}
                     messageBanner={messageBanner}
                 />
             ))}