From 4cd4a7759b28990d6b10212075cc8ad4913eb7b6 Mon Sep 17 00:00:00 2001
From: Gabriel Hernandez <ghernandez345@gmail.com>
Date: Mon, 8 Aug 2022 15:17:52 +0100
Subject: [PATCH] fix for expiry message message (#7093)

this fixes the expiry message label and also makes the whole message a link
---
 .../issue-7074-fix-sandbox-expiration-message |  1 +
 .../SandboxExpiryMessage.tsx                  | 23 +++++++++----------
 .../Sandbox/SandboxExpiryMessage/_styles.scss |  9 +++++++-
 frontend/services/entities/config.ts          |  1 -
 4 files changed, 20 insertions(+), 14 deletions(-)
 create mode 100644 changes/issue-7074-fix-sandbox-expiration-message

diff --git a/changes/issue-7074-fix-sandbox-expiration-message b/changes/issue-7074-fix-sandbox-expiration-message
new file mode 100644
index 0000000000..a912fa92f2
--- /dev/null
+++ b/changes/issue-7074-fix-sandbox-expiration-message
@@ -0,0 +1 @@
+* fix for the sandbox expiration message
diff --git a/frontend/components/Sandbox/SandboxExpiryMessage/SandboxExpiryMessage.tsx b/frontend/components/Sandbox/SandboxExpiryMessage/SandboxExpiryMessage.tsx
index 48c7364915..50928ed2fe 100644
--- a/frontend/components/Sandbox/SandboxExpiryMessage/SandboxExpiryMessage.tsx
+++ b/frontend/components/Sandbox/SandboxExpiryMessage/SandboxExpiryMessage.tsx
@@ -8,25 +8,24 @@ interface ISandboxExpiryMessageProps {
   expiry: string;
 }
 
-const SandboxExpiryMessage = ({
-  expiry,
-}: ISandboxExpiryMessageProps): JSX.Element => {
+const SandboxExpiryMessage = ({ expiry }: ISandboxExpiryMessageProps) => {
   return (
-    <div className={baseClass}>
+    <a
+      href="https://fleetdm.com/docs/deploying"
+      target="_blank"
+      rel="noreferrer"
+      className={baseClass}
+    >
       <p>Your Fleet Sandbox expires in {expiry}.</p>
-      <a
-        href="https://fleetdm.com/docs/deploying"
-        target="_blank"
-        rel="noreferrer"
-      >
-        Learn how to renew or downgrade
+      <span>
+        Learn how to deploy Fleet
         <img
           alt="Open external link"
           className="icon-external"
           src={ExternalURLIcon}
         />
-      </a>
-    </div>
+      </span>
+    </a>
   );
 };
 
diff --git a/frontend/components/Sandbox/SandboxExpiryMessage/_styles.scss b/frontend/components/Sandbox/SandboxExpiryMessage/_styles.scss
index 24a1e4104f..f4cff7a480 100644
--- a/frontend/components/Sandbox/SandboxExpiryMessage/_styles.scss
+++ b/frontend/components/Sandbox/SandboxExpiryMessage/_styles.scss
@@ -9,11 +9,18 @@
   border-radius: $border-radius;
   font-size: $xx-small;
 
+  color: $core-fleet-black;
+  font-weight: $regular;
+
+  &:hover {
+    cursor: pointer;
+  }
+
   p {
     margin: 0;
   }
 
-  a {
+  span {
     display: flex;
     align-items: center;
     color: $core-fleet-black;
diff --git a/frontend/services/entities/config.ts b/frontend/services/entities/config.ts
index d01ab0ff74..b018bbb31a 100644
--- a/frontend/services/entities/config.ts
+++ b/frontend/services/entities/config.ts
@@ -48,7 +48,6 @@ export default {
   loadSandboxExpiry: async () => {
     const instanceId = window.location.host.split(".")[0];
     const url = "https://sandbox.fleetdm.com/expires";
-    const token = local.getItem("auth_token");
 
     try {
       const { data } = await axios.get<{ timestamp: string }>(url, {