Merge pull request #31 from Access-Labs-Inc/fix/change-claim-button-t…

…o-go-to-hub Change the Claim button to be View on HUB and redirect to HUB
Access-Labs-Inc · Sep 12, 2024 · 125a6f0 · 125a6f0
2 parents 2649761 + e114516
commit 125a6f0
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 236 deletions.
diff --git a/src/layout/Main.tsx b/src/layout/Main.tsx
@@ -11,7 +11,6 @@ import { Router, RouteComponent } from '../layout/Router';
 import { Actions } from '../routes/Actions';
 import { Stake } from '../routes/Stake';
 import { Unstake } from '../routes/Unstake';
-import { Claim } from '../routes/Claim';
 import { Button } from '../components/wallet-adapter/ui/Button';
 import { WalletConnectButton } from '../components/wallet-adapter/ui/WalletConnectButton';
 import { WalletModalButton } from '../components/wallet-adapter/ui/WalletModalButton';
@@ -25,11 +24,7 @@ const Main = () => {
   const { publicKey, wallet, connected } = useWallet();
   const [active, setActive] = useState(false);
   const ref = useRef<HTMLUListElement>(null);
-  const {
-    element,
-    poolId,
-    classPrefix,
-  } = useContext(ConfigContext);
+  const { element, poolId, classPrefix } = useContext(ConfigContext);
   const base58 = useMemo(() => publicKey?.toBase58(), [publicKey]);
   const content = useMemo(() => {
     if (!wallet || !base58) {
@@ -49,7 +44,9 @@ const Main = () => {
   useEffect(() => {
     if (connected && element && publicKey && poolId) {
       (async () => {
-        const response = await fetch(`${env.GO_API_URL}/subscriptions/${publicKey.toBase58()}`);
+        const response = await fetch(
+          `${env.GO_API_URL}/subscriptions/${publicKey.toBase58()}`
+        );
         if (!response.ok) {
           console.log('ERROR: ', response.statusText);
           return;
@@ -58,29 +55,32 @@ const Main = () => {
         const json = await response.json();
         const data = offchainBasicSubscriptionsSchema.parse(json);
 
-        const { staked, bonds, forever } = data.reduce((acc, item) => {
-          if (item.pool === poolId) {
-            return {
-              staked: acc.staked + (item?.locked ?? 0),
-              bonds: acc.bonds + (item?.bonds ?? 0),
-              forever: acc.forever + (item?.forever ?? 0),
-            };
-          } else {
-            return acc;
+        const { staked, bonds, forever } = data.reduce(
+          (acc, item) => {
+            if (item.pool === poolId) {
+              return {
+                staked: acc.staked + (item?.locked ?? 0),
+                bonds: acc.bonds + (item?.bonds ?? 0),
+                forever: acc.forever + (item?.forever ?? 0),
+              };
+            } else {
+              return acc;
+            }
+          },
+          {
+            staked: 0,
+            bonds: 0,
+            forever: 0,
           }
-        }, {
-          staked: 0,
-          bonds: 0,
-          forever: 0
-        });
+        );
 
         const connectedEvent = new CustomEvent('connected', {
           detail: {
             address: base58,
             locked: staked + bonds + forever,
             staked,
             bonds,
-            forever
+            forever,
           },
           bubbles: true,
           cancelable: true,
@@ -154,7 +154,6 @@ const Main = () => {
             '/': <RouteComponent component={Actions} />,
             '/stake': <RouteComponent component={Stake} />,
             '/unstake': <RouteComponent component={Unstake} />,
-            '/claim': <RouteComponent component={Claim} />,
           }}
         />
       </div>

diff --git a/src/routes/Actions.tsx b/src/routes/Actions.tsx
@@ -91,6 +91,10 @@ export const Actions = () => {
     return (stakedAmount ?? 0) + (bondsAmount ?? 0) > 0;
   }, [stakedAmount, bondsAmount]);
 
+  const openClaimPage = useCallback(() => {
+    window.open('https://hub.accessprotocol.co', '_blank');
+  }, []);
+
   return (
     <div className={clsxp(classPrefix, 'actions_root')}>
       {connected && disconnecting && (
@@ -165,12 +169,12 @@ export const Actions = () => {
             Unlock ACS
           </span>
         )}
-        <RouteLink
+        <button
           className={clsxp(classPrefix, 'actions_button')}
-          href='/claim'
+          onClick={openClaimPage}
         >
-          Claim
-        </RouteLink>
+          View on HUB
+        </button>
       </div>
     </div>
   );

diff --git a/src/routes/Claim.tsx b/src/routes/Claim.tsx
diff --git a/tsconfig.json b/tsconfig.json
@@ -15,7 +15,6 @@
     "strictNullChecks": true,
     "noImplicitReturns": true,
     "preserveConstEnums": true,
-    "suppressImplicitAnyIndexErrors": true,
     "forceConsistentCasingInFileNames": true,
     "outDir": ".build",
     "jsx": "preserve",