From af5703fb43f238e6e2d5fd390ce88d97216dcb1e Mon Sep 17 00:00:00 2001
From: Quentin Burg <quentin@marigold.dev>
Date: Fri, 3 May 2024 10:48:51 +0200
Subject: [PATCH] :fire: remove banner

---
 components/Banner.tsx       | 23 -----------------------
 components/Sidebar.tsx      |  4 +---
 components/modal.tsx        |  4 +---
 components/navbar.tsx       |  6 +++---
 components/transferForm.tsx |  4 +---
 context/state.ts            | 12 +-----------
 pages/_app.tsx              | 15 +--------------
 7 files changed, 8 insertions(+), 60 deletions(-)
 delete mode 100644 components/Banner.tsx

diff --git a/components/Banner.tsx b/components/Banner.tsx
deleted file mode 100644
index b03c5d87..00000000
--- a/components/Banner.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { Cross1Icon } from "@radix-ui/react-icons";
-import { useContext } from "react";
-import { AppDispatchContext, AppStateContext } from "../context/state";
-
-type props = {
-  children: React.ReactNode;
-};
-
-const Banner = ({ children }: props) => {
-  const state = useContext(AppStateContext)!;
-  const dispatch = useContext(AppDispatchContext)!;
-
-  return state.hasBanner ? (
-    <div className="fixed top-0 z-50 flex h-12 w-full items-center justify-between bg-primary px-4 text-xs text-white md:text-base">
-      <div>{children}</div>
-      <button onClick={() => dispatch({ type: "setBanner", payload: false })}>
-        <Cross1Icon className="h-full" />
-      </button>
-    </div>
-  ) : null;
-};
-
-export default Banner;
diff --git a/components/Sidebar.tsx b/components/Sidebar.tsx
index 15bb55b3..4c922c81 100644
--- a/components/Sidebar.tsx
+++ b/components/Sidebar.tsx
@@ -190,9 +190,7 @@ const Sidebar = ({
 
   return (
     <aside
-      className={`fixed bottom-0 left-0 ${
-        state.hasBanner ? "top-32" : "top-20"
-      } z-10 w-72 bg-zinc-700 px-4 py-4 md:py-8 ${
+      className={`fixed bottom-0 left-0 top-20 z-10 w-72 bg-zinc-700 px-4 py-4 md:py-8 ${
         isOpen ? "translate-x-0" : "-translate-x-full"
       } overflow-y-auto md:-translate-x-0`}
     >
diff --git a/components/modal.tsx b/components/modal.tsx
index 91c6f082..bc51f581 100644
--- a/components/modal.tsx
+++ b/components/modal.tsx
@@ -11,9 +11,7 @@ function Modal(props: React.PropsWithChildren<{ opened: boolean }>) {
   return props.opened
     ? ReactDOM.createPortal(
         <div
-          className={`${
-            state.hasBanner ? "top-12 md:top-32" : "top-0 md:top-20"
-          } fixed bottom-0 left-0 right-0 z-50 flex grow items-center justify-center bg-black bg-slate-800 bg-opacity-70 md:left-72`}
+          className={`fixed bottom-0 left-0 right-0 top-0 z-50 flex grow items-center justify-center bg-black bg-slate-800 bg-opacity-70 md:left-72 md:top-20`}
         >
           <div
             className={
diff --git a/components/navbar.tsx b/components/navbar.tsx
index a8f8e856..458b5784 100644
--- a/components/navbar.tsx
+++ b/components/navbar.tsx
@@ -30,9 +30,9 @@ const NavBar = (_: React.PropsWithChildren) => {
 
   return (
     <nav
-      className={`${menuOpen ? "h-auto" : "h-20"} fixed ${
-        state?.hasBanner ? "top-12" : "top-0"
-      } left-0 right-0 z-40 flex w-full flex-col items-center border-b-4 border-zinc-500 bg-graybg md:flex-row`}
+      className={`${
+        menuOpen ? "h-auto" : "h-20"
+      } fixed left-0 right-0 top-0 z-40 flex w-full flex-col items-center border-b-4 border-zinc-500 bg-graybg md:flex-row`}
     >
       <div className="mx-auto w-full px-4">
         <div className="flex h-16 items-center justify-between">
diff --git a/components/transferForm.tsx b/components/transferForm.tsx
index ffbf7135..320a1609 100644
--- a/components/transferForm.tsx
+++ b/components/transferForm.tsx
@@ -546,9 +546,7 @@ function TransferForm(
                   id="top"
                 >
                   <div
-                    className={`sticky z-[5] ${
-                      state.hasBanner ? "top-36" : "top-24"
-                    } ${
+                    className={`sticky top-24 z-[5] ${
                       isMenuOpen
                         ? "w-full"
                         : "ml-auto h-12 w-full overflow-hidden"
diff --git a/context/state.ts b/context/state.ts
index c0616a5b..8ed5b7c3 100644
--- a/context/state.ts
+++ b/context/state.ts
@@ -30,7 +30,6 @@ type tezosState = {
   contracts: { [address: string]: contractStorage };
   aliases: { [address: string]: string };
   aliasTrie: Trie<string>;
-  hasBanner: boolean;
   delegatorAddresses: string[] | undefined;
   connectedDapps: {
     [address: string]: {
@@ -77,7 +76,6 @@ let emptyState = (): tezosState => {
     accountInfo: null,
     connection,
     aliasTrie: new Trie<string>(),
-    hasBanner: true,
     delegatorAddresses: undefined,
     connectedDapps: {},
     proposalRefresher: 0,
@@ -127,10 +125,6 @@ type action =
         keepOld: boolean;
       };
     }
-  | {
-      type: "setBanner";
-      payload: boolean;
-    }
   | {
       type: "addDapp";
       payload: {
@@ -356,11 +350,7 @@ function reducer(state: tezosState, action: action): tezosState {
 
       return newState;
     }
-    case "setBanner":
-      return {
-        ...state,
-        hasBanner: action.payload,
-      };
+
     case "setDelegatorAddresses":
       return { ...state, delegatorAddresses: action.payload };
     case "refreshProposals":
diff --git a/pages/_app.tsx b/pages/_app.tsx
index 326049fa..d912aeb0 100644
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -6,7 +6,6 @@ import type { AppProps } from "next/app";
 import { usePathname } from "next/navigation";
 import { useRouter } from "next/router";
 import { useReducer, useEffect, useState } from "react";
-import Banner from "../components/Banner";
 import LoginModal from "../components/LoginModal";
 import PoeModal from "../components/PoeModal";
 import Sidebar from "../components/Sidebar";
@@ -241,14 +240,6 @@ export default function App({ Component, pageProps }: AppProps) {
               />
             )}
             <PoeModal />
-            <Banner>
-              <span className="font-light">Make sure the URL is </span>
-              {PREFERED_NETWORK === NetworkType.MAINNET
-                ? "tzsafe.marigold.dev"
-                : PREFERED_NETWORK === NetworkType.GHOSTNET
-                ? "ghostnet.tzsafe.marigold.dev"
-                : "a valid URL"}
-            </Banner>
             <NavBar />
 
             {isSidebarHidden ? null : (
@@ -259,11 +250,7 @@ export default function App({ Component, pageProps }: AppProps) {
               />
             )}
 
-            <div
-              className={`pb-28 pt-20 ${isSidebarHidden ? "" : "md:pl-72"} ${
-                state.hasBanner ? "mt-12" : ""
-              }`}
-            >
+            <div className={`pb-28 pt-20 ${isSidebarHidden ? "" : "md:pl-72"}`}>
               <button
                 className="ml-4 mt-4 flex items-center space-x-2 text-zinc-300 md:hidden"
                 onClick={() => {