From 078bf1e1a8002b9c5142c866804c89df006ffaef Mon Sep 17 00:00:00 2001
From: Novak Zaballa <41410593+novakzaballa@users.noreply.github.com>
Date: Wed, 3 Jul 2024 09:07:09 -0400
Subject: [PATCH] feat: Announcement per page FF accept params (#4275)

---
 .../web/components/AnnouncementPerPage.tsx    | 31 +++++++++++++++++--
 frontend/web/components/InfoMessage.js        |  2 +-
 2 files changed, 30 insertions(+), 3 deletions(-)

diff --git a/frontend/web/components/AnnouncementPerPage.tsx b/frontend/web/components/AnnouncementPerPage.tsx
index 4d357df81758..9c1ebd87043f 100644
--- a/frontend/web/components/AnnouncementPerPage.tsx
+++ b/frontend/web/components/AnnouncementPerPage.tsx
@@ -1,3 +1,4 @@
+import { get } from 'lodash'
 import React, { FC } from 'react'
 import InfoMessage from './InfoMessage'
 import flagsmith from 'flagsmith'
@@ -8,9 +9,13 @@ import { routes } from 'web/routes'
 
 type AnnouncementPerPageValueType = AnnouncementValueType & {
   pages: string[]
+  projectId: number
+  params: { [key: string]: string }
 }
 
-type AnnouncementPerPageType = { pathname: string }
+type AnnouncementPerPageType = {
+  pathname: string
+}
 
 const AnnouncementPerPage: FC<AnnouncementPerPageType> = ({ pathname }) => {
   const closeAnnouncement = (id: string) => {
@@ -33,14 +38,36 @@ const AnnouncementPerPage: FC<AnnouncementPerPageType> = ({ pathname }) => {
 
   const announcementInPage = announcementPerPageValue?.pages?.some((page) => {
     if (Object.keys(routes).includes(page)) {
-      return !!matchPath(pathname, {
+      const match = matchPath(pathname, {
         exact: false,
         path: routes[page],
         strict: false,
       })
+
+      if (match) {
+        const annParams = announcementPerPageValue?.params || {}
+        const matchParams = match?.params || {}
+        const objectsMatch = (
+          obj1: AnnouncementPerPageValueType['params'],
+          obj2: AnnouncementPerPageValueType['params'],
+        ) => {
+          return Object.keys(obj1).every((key) => {
+            return `${obj1[key]}` === `${obj2[key]}`
+          })
+        }
+        const annParamsMatch = objectsMatch(annParams, matchParams)
+        const matchParamsMatch = objectsMatch(matchParams, annParams)
+        if (annParamsMatch || matchParamsMatch) {
+          return true
+        }
+
+        return false
+      }
     }
+
     return false
   })
+
   return (
     <>
       {showAnnouncementPerPage && announcementInPage && (
diff --git a/frontend/web/components/InfoMessage.js b/frontend/web/components/InfoMessage.js
index 4031424f8f61..53e6fd94554e 100644
--- a/frontend/web/components/InfoMessage.js
+++ b/frontend/web/components/InfoMessage.js
@@ -21,7 +21,7 @@ export default class InfoMessage extends PureComponent {
           <div className='title'>{this.props.title || 'NOTE'}</div>
           <div className='flex-fill'>{this.props.children}</div>
         </div>
-        {this.props.url && (
+        {this.props.url && this.props.buttonText && (
           <Button
             size='small'
             className='btn my-2 ml-2'