From 266b818f5903d952c28e20b77888e3eb357e64e4 Mon Sep 17 00:00:00 2001
From: starknetdev <starknetdev@gmail.com>
Date: Thu, 12 Oct 2023 20:50:53 +0100
Subject: [PATCH] add viewer button

---
 ui/src/app/components/notifications/SpecialBeast.tsx | 6 +++++-
 ui/src/app/lib/constants.ts                          | 9 +++++++++
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/ui/src/app/components/notifications/SpecialBeast.tsx b/ui/src/app/components/notifications/SpecialBeast.tsx
index d670de2b9..86fbe56de 100644
--- a/ui/src/app/components/notifications/SpecialBeast.tsx
+++ b/ui/src/app/components/notifications/SpecialBeast.tsx
@@ -8,6 +8,7 @@ import TwitterShareButton from "../buttons/TwitterShareButtons";
 import { getAppUrl } from "@/app/lib/constants";
 import useAdventurerStore from "@/app/hooks/useAdventurerStore";
 import { Button } from "../buttons/Button";
+import { getTokenViewerUrl } from "@/app/lib/constants";
 
 export const SpecialBeast = () => {
   const adventurer = useAdventurerStore((state) => state.adventurer);
@@ -63,12 +64,15 @@ export const SpecialBeast = () => {
               />
             </div>
           )}
-          <div className="flex flex-col gap-20 items-center justify-center w-1/6">
+          <div className="flex flex-col gap-5 items-center justify-center w-1/6">
             <TwitterShareButton
               text={`${
                 adventurer?.name
               } just defeated the first ${beastName} and collects the 1:1 Beast #LootSurvivor.\n\nSee the token here: ${getAppUrl()}👹\n\nEnter here and try to survive: ${getAppUrl()}\n\n@lootrealms #Starknet #Play2Die #LootSurvivor`}
             />
+            <a href={getTokenViewerUrl()} target="_blank">
+              <Button>View Token</Button>
+            </a>
             <Button onClick={() => resetBeast()}>Continue</Button>
           </div>
         </div>
diff --git a/ui/src/app/lib/constants.ts b/ui/src/app/lib/constants.ts
index 887031968..3e4427aa7 100644
--- a/ui/src/app/lib/constants.ts
+++ b/ui/src/app/lib/constants.ts
@@ -74,6 +74,15 @@ export function getAppUrl() {
   }
 }
 
+export function getTokenViewerUrl() {
+  switch (NETWORK) {
+    case "goerli":
+      return "https://goerli-realms.world/token-viewer/";
+    case "mainnet":
+      return "https://realms.world/token-viewer/";
+  }
+}
+
 export const notificationAnimations = [
   { name: "idle", startFrame: 0, frameCount: 4 },
   { name: "run", startFrame: 9, frameCount: 5 },