From 3ef5fa78f8486b1b62ea0786dc85dade297fd3ff Mon Sep 17 00:00:00 2001
From: Joshen Lim <joshenlimek@gmail.com>
Date: Tue, 1 Mar 2022 14:37:21 +0800
Subject: [PATCH] Enable links in help popover to be able to open in new tab

---
 .../Organization/BillingSettings/TaxID.tsx       |  2 +-
 .../ProjectLayout/LayoutHeader/HelpPopover.tsx   | 16 ++++++++++------
 2 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/studio/components/interfaces/Organization/BillingSettings/TaxID.tsx b/studio/components/interfaces/Organization/BillingSettings/TaxID.tsx
index 2cf367bc91d..29f42357b27 100644
--- a/studio/components/interfaces/Organization/BillingSettings/TaxID.tsx
+++ b/studio/components/interfaces/Organization/BillingSettings/TaxID.tsx
@@ -47,7 +47,7 @@ const TaxID: FC<Props> = ({ loading, taxIds, redirectToPortal }) => {
             </div>
           ) : (
             <div>
-              <p className="flex items-center space-x-2 opacity-50">No tax IDs</p>
+              <p className="flex items-center space-x-2 text-sm text-scale-900">No tax IDs</p>
             </div>
           )}
         </Panel.Content>
diff --git a/studio/components/layouts/ProjectLayout/LayoutHeader/HelpPopover.tsx b/studio/components/layouts/ProjectLayout/LayoutHeader/HelpPopover.tsx
index bf4f31b5961..fc06202088f 100644
--- a/studio/components/layouts/ProjectLayout/LayoutHeader/HelpPopover.tsx
+++ b/studio/components/layouts/ProjectLayout/LayoutHeader/HelpPopover.tsx
@@ -36,14 +36,18 @@ const HelpPopover: FC<Props> = () => {
             </p>
             <div className="space-x-2">
               <Link href={supportUrl}>
-                <Button type="default" icon={<IconMail />}>
-                  Contact support team
-                </Button>
+                <a>
+                  <Button type="default" icon={<IconMail />}>
+                    Contact support team
+                  </Button>
+                </a>
               </Link>
               <Link href="https://supabase.com/docs/">
-                <Button type="secondary" size="tiny" icon={<IconBookOpen />}>
-                  Docs
-                </Button>
+                <a>
+                  <Button type="secondary" size="tiny" icon={<IconBookOpen />}>
+                    Docs
+                  </Button>
+                </a>
               </Link>
             </div>
             <p className="text-sm text-scale-900">