feat: banner display with page map

web/src/components/Banners/BottomBanner.tsx

@@ -3,22 +3,33 @@ import { graphql, useFragment } from "@/gql";
 import { useFeatureFlag } from "@/hooks/useFeatureFlag";
 import { useGraphqlUser } from "@/hooks/useGraphql";
 import { cn } from "@/lib/utils";
+import { useWelcomeStore } from "@/stores/useWelcomeStore";
+import { usePathname } from "next/navigation";
 import { useState } from "react";
 const NotesFragment = graphql(`
   fragment NotesFragment on Note {
     content
     placement
   }
 `);
-
+const pagesWithBanner = ["/", "/stake/pool", "/swap/confirm"];
 export default function BottomBanner() {
+  const pathname = usePathname();
+  const renderBanner = pagesWithBanner.includes(pathname);
   const { data } = useGraphqlUser();
   const notes = useFragment(NotesFragment, data?.notes);
   const bottomNote = notes?.find((item) => item.placement.includes("bottom"));
-  const showBanners = useFeatureFlag("ui show banners");
+  const featureEnabled = useFeatureFlag("ui show banners");
   const [isBannerClosed, setIsBannerClosed] = useState(false);
+  const welcome = useWelcomeStore((state) => state.welcome);
+  const dontRenderBanner =
+    !bottomNote ||
+    !featureEnabled ||
+    isBannerClosed ||
+    !renderBanner ||
+    welcome;
 
-  if (!bottomNote || !showBanners || isBannerClosed) return null;
+  if (dontRenderBanner) return null;
 
   const isLeftBanner = bottomNote.placement.includes("left");
   return (