From 6620ccceaf5003458fc11a4be351a3129d5f9780 Mon Sep 17 00:00:00 2001
From: Ryan Liu <ryan@supaglue.com>
Date: Thu, 15 Feb 2024 12:35:36 -0800
Subject: [PATCH] chore: remove banner (#2081)

---
 apps/mgmt-ui/src/components/Banner/index.tsx | 60 --------------------
 apps/mgmt-ui/src/layout/Header.tsx           |  4 --
 2 files changed, 64 deletions(-)
 delete mode 100644 apps/mgmt-ui/src/components/Banner/index.tsx

diff --git a/apps/mgmt-ui/src/components/Banner/index.tsx b/apps/mgmt-ui/src/components/Banner/index.tsx
deleted file mode 100644
index 2ca0e5b01..000000000
--- a/apps/mgmt-ui/src/components/Banner/index.tsx
+++ /dev/null
@@ -1,60 +0,0 @@
-import { useActiveApplication } from '@/hooks/useActiveApplication';
-import { theme } from '@/pages/_app';
-import { useMediaQuery } from '@mui/material';
-import { DateTime } from 'luxon';
-
-export function Banner() {
-  const { activeApplication } = useActiveApplication();
-  const isSmUp = useMediaQuery(theme.breakpoints.up('sm'));
-
-  const createdAt = activeApplication?.createdAt ?? Date.now();
-  const createdAtDate = DateTime.fromJSDate(new Date(createdAt));
-  const nowDate = DateTime.fromJSDate(new Date());
-
-  const dateDiff = nowDate.diff(createdAtDate, ['days']).toObject();
-  const daysRemaining = Math.max(0, 30 - Math.floor(dateDiff.days ?? 30));
-
-  return (
-    <div className="relative isolate flex items-center gap-x-6 overflow-hidden bg-gray-50 px-6 py-2.5 sm:px-3.5 sm:before:flex-1 z-[1300]">
-      <div
-        className="absolute left-[max(-7rem,calc(50%-52rem))] top-1/2 -z-10 -translate-y-1/2 transform-gpu blur-2xl"
-        aria-hidden="true"
-      >
-        <div
-          className="aspect-[577/310] w-[36.0625rem] bg-gradient-to-r from-[#ff80b5] to-[#9089fc] opacity-30"
-          style={{
-            clipPath:
-              'polygon(74.8% 41.9%, 97.2% 73.2%, 100% 34.9%, 92.5% 0.4%, 87.5% 0%, 75% 28.6%, 58.5% 54.6%, 50.1% 56.8%, 46.9% 44%, 48.3% 17.4%, 24.7% 53.9%, 0% 27.9%, 11.9% 74.2%, 24.9% 54.1%, 68.6% 100%, 74.8% 41.9%)',
-          }}
-        />
-      </div>
-      <div
-        className="absolute left-[max(45rem,calc(50%+8rem))] top-1/2 -z-10 -translate-y-1/2 transform-gpu blur-2xl"
-        aria-hidden="true"
-      >
-        <div
-          className="aspect-[577/310] w-[36.0625rem] bg-gradient-to-r from-[#ff80b5] to-[#9089fc] opacity-30"
-          style={{
-            clipPath:
-              'polygon(74.8% 41.9%, 97.2% 73.2%, 100% 34.9%, 92.5% 0.4%, 87.5% 0%, 75% 28.6%, 58.5% 54.6%, 50.1% 56.8%, 46.9% 44%, 48.3% 17.4%, 24.7% 53.9%, 0% 27.9%, 11.9% 74.2%, 24.9% 54.1%, 68.6% 100%, 74.8% 41.9%)',
-          }}
-        />
-      </div>
-      <div className="flex flex-wrap items-center gap-x-4 gap-y-2">
-        <p className="text-sm leading-6 text-gray-900">
-          <strong className="font-semibold">Free 30 day trial</strong>
-          <svg viewBox="0 0 2 2" className="mx-2 inline h-0.5 w-0.5 fill-current" aria-hidden="true">
-            <circle cx={1} cy={1} r={1} />
-          </svg>
-          There are <span className="font-semibold">{daysRemaining}</span> days remaining in your free Supaglue trial.
-        </p>
-        <a
-          href="mailto:support@supaglue.com"
-          className="flex-none rounded-full bg-gray-900 px-3.5 py-1 text-sm font-semibold text-white shadow-sm hover:bg-gray-700 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-900"
-        >
-          Upgrade now<span aria-hidden="true">&rarr;</span>
-        </a>
-      </div>
-    </div>
-  );
-}
diff --git a/apps/mgmt-ui/src/layout/Header.tsx b/apps/mgmt-ui/src/layout/Header.tsx
index f7931eeb8..0d4118cfd 100644
--- a/apps/mgmt-ui/src/layout/Header.tsx
+++ b/apps/mgmt-ui/src/layout/Header.tsx
@@ -1,6 +1,4 @@
 import AccountMenu from '@/components/AccountMenu';
-import { Banner } from '@/components/Banner';
-import { useActiveApplication } from '@/hooks/useActiveApplication';
 import type { SupaglueProps } from '@/pages/applications/[applicationId]';
 import MenuIcon from '@mui/icons-material/Menu';
 import AppBar from '@mui/material/AppBar';
@@ -21,12 +19,10 @@ interface HeaderProps {
 
 export default function Header(props: HeaderProps & SupaglueProps) {
   const { onDrawerToggle, title, tabs } = props;
-  const { activeApplication } = useActiveApplication();
 
   return (
     <React.Fragment>
       <AppBar color="primary" position="sticky" elevation={0}>
-        {activeApplication && !activeApplication.isPaid && <Banner />}
         <Toolbar>
           <Grid container spacing={1} alignItems="center">
             <Grid sx={{ display: { sm: 'none', xs: 'block' } }} item>