Merge pull request #63 from ar-io/develop

Releaes to Production
ar-io · Aug 1, 2024 · c17f1e5 · c17f1e5
2 parents 2666bb6 + 7761d8a
commit c17f1e5
Show file tree

Hide file tree

Showing 13 changed files with 136 additions and 60 deletions.
diff --git a/.github/workflows/build_and_test.yml b/.github/workflows/build_and_test.yml
@@ -22,7 +22,7 @@ jobs:
           node-version-file: '.nvmrc'
           cache: 'yarn'
 
-      - run: yarn install --frozen-lockfile
+      - run: yarn install --frozen-lockfile --ignore-engines
       - run: yarn ${{ matrix.step }}
 
   deploy-to-github:
@@ -40,7 +40,7 @@ jobs:
 
       - name: Install and Build 🔧
         run: |
-          yarn install --frozen-lockfile
+          yarn install --frozen-lockfile --ignore-engines
           yarn build
         env:
           # FOR BUILD

diff --git a/.github/workflows/pr.yml b/.github/workflows/pr.yml
@@ -13,7 +13,7 @@ jobs:
           ]
     steps:
       - uses: actions/checkout@v3
-      - run: yarn install --frozen-lockfile
+      - run: yarn install --frozen-lockfile --ignore-engines
       - run: yarn ${{ matrix.step }}
 
   deploy-to-firebase:
@@ -29,7 +29,7 @@ jobs:
           cache: 'yarn'
       - name: Install and Build 🔧
         run: |
-          yarn install --frozen-lockfile
+          yarn install --frozen-lockfile --ignore-engines
           yarn build
         env:
           # FOR BUILD

diff --git a/.github/workflows/production.yml b/.github/workflows/production.yml
@@ -20,7 +20,7 @@ jobs:
         with:
           node-version-file: '.nvmrc'
           cache: 'yarn'
-      - run: yarn install --frozen-lockfile
+      - run: yarn install --frozen-lockfile --ignore-engines
       - run: yarn ${{ matrix.step }}
 
   deploy-to-firebase:
@@ -37,7 +37,7 @@ jobs:
 
       - name: Install and Build 🔧
         run: |
-          yarn install --frozen-lockfile
+          yarn install --frozen-lockfile --ignore-engines
           yarn build
         env:
           # FOR BUILD
@@ -74,7 +74,7 @@ jobs:
 
       - name: Install, Build, and Deploy 🔧
         run: |
-          yarn install --frozen-lockfile
+          yarn install --frozen-lockfile --ignore-engines
           yarn deploy 
         env:
           # FOR BUILD

diff --git a/package.json b/package.json
@@ -20,7 +20,7 @@
     "deploy": "yarn build && permaweb-deploy --ant-process ${DEPLOY_ANT_PROCESS_ID}"
   },
   "dependencies": {
-    "@ar.io/sdk": "2.0.2",
+    "@ar.io/sdk": "2.1.0-alpha.6",
     "@fontsource/rubik": "^5.0.19",
     "@headlessui/react": "^1.7.19",
     "@radix-ui/react-tooltip": "^1.0.7",

diff --git a/src/components/Tooltip.tsx b/src/components/Tooltip.tsx
@@ -23,7 +23,7 @@ const Tooltip = ({
               {/* <ReactTooltip.Arrow className={`${marginBottom}`} /> */}
               <div className="text-sm text-low">{message}</div>
               <div
-                className={`absolute bottom-0 left-[48.8%] size-[0.625rem] rotate-45 border border-grey-500 bg-containerL0 [clip-path:polygon(0%_100%,100%_0,100%_100%)]    `}
+                className={`absolute bottom-0 left-[48.8%] size-2.5 rotate-45 border border-grey-500 bg-containerL0 [clip-path:polygon(0%_100%,100%_0,100%_100%)]    `}
               />
             </ReactTooltip.Content>
           </ReactTooltip.Portal>

diff --git a/src/components/modals/StakingModal.tsx b/src/components/modals/StakingModal.tsx
@@ -54,7 +54,7 @@ const DisplayRow = ({
           {value}
         </a>
       ) : (
-        <div className="flex gap-1 text-left text-low items-center">
+        <div className="flex items-center gap-1 text-left text-low">
           {value}
           {rightIcon}
         </div>

diff --git a/src/pages/Gateway/index.tsx b/src/pages/Gateway/index.tsx
@@ -104,6 +104,15 @@ const Gateway = () => {
     ? new mIOToken(gateway.operatorStake).toIO().valueOf() + (balances?.io || 0)
     : undefined;
 
+  const weightFields: Array<[string, number | undefined]> = [
+    ['Stake', gateway?.weights?.stakeWeight],
+    ['Tenure', gateway?.weights?.tenureWeight],
+    ['Gateway Reward Ratio', gateway?.weights?.gatewayRewardRatioWeight],
+    ['Observer Reward Ratio', gateway?.weights?.observerRewardRatioWeight],
+    ['Composite', gateway?.weights?.compositeWeight],
+    ['Normalized', gateway?.weights?.normalizedCompositeWeight],
+  ];
+
   useEffect(() => {
     setInitialState((currentState) => {
       return {
@@ -381,39 +390,61 @@ const Gateway = () => {
     <div className="flex h-screen max-w-full flex-col overflow-y-auto pr-6 scrollbar">
       <GatewayHeader gateway={gateway} />
       <div className="my-6 flex gap-6">
-        <div className="size-fit rounded-xl border border-transparent-100-16 text-sm">
-          <div className="px-6 py-4">
-            <div className="text-high">Stats</div>
+        <div className="flex flex-col gap-6">
+          <div className="size-fit rounded-xl border border-transparent-100-16 text-sm">
+            <div className="px-6 py-4">
+              <div className="text-high">Stats</div>
+            </div>
+            <StatsBox
+              title="Join Date"
+              value={
+                gateway?.startTimestamp
+                  ? formatDate(new Date(gateway?.startTimestamp))
+                  : undefined
+              }
+            />
+            <StatsBox
+              title="Uptime"
+              value={
+                healthCheckRes.isError
+                  ? 'N/A'
+                  : healthCheckRes.isLoading
+                    ? undefined
+                    : formatUptime(healthCheckRes.data?.uptime)
+              }
+            />
+            <StatsBox
+              title="Delegates"
+              value={
+                gateway?.delegates
+                  ? Object.keys(gateway.delegates).length
+                  : undefined
+              }
+            />
+            {/* <StatsBox title="Rewards Distributed" value={gateway?} /> */}
           </div>
-          <StatsBox
-            title="Join Date"
-            value={
-              gateway?.startTimestamp
-                ? formatDate(new Date(gateway?.startTimestamp))
-                : undefined
-            }
-          />
-          <StatsBox
-            title="Uptime"
-            value={
-              healthCheckRes.isError
-                ? 'N/A'
-                : healthCheckRes.isLoading
-                  ? undefined
-                  : formatUptime(healthCheckRes.data?.uptime)
-            }
-          />
-          <StatsBox
-            title="Delegates"
-            value={
-              gateway?.delegates
-                ? Object.keys(gateway.delegates).length
-                : undefined
-            }
-          />
-          {/* <StatsBox title="Rewards Distributed" value={gateway?} /> */}
+
+          {gateway?.weights && (
+            <div className="w-full rounded-xl border border-transparent-100-16 text-sm">
+              <div className="px-6 py-4">
+                <div className="text-high">Weights</div>
+              </div>
+
+              {weightFields.map(([title, value], index) => (
+                <div
+                  key={`weights${index}`}
+                  className="flex items-center border-t border-transparent-100-16 px-6 py-4"
+                >
+                  <div className="grow text-xs text-low">{title}:</div>
+                  <div className="text-right text-sm">
+                    {value ? value.toFixed(3) : <Placeholder />}
+                  </div>
+                </div>
+              ))}
+            </div>
+          )}
         </div>
-        <div className="size-full grow overflow-hidden rounded-xl border border-transparent-100-16">
+        <div className="h-fit w-full grow overflow-hidden rounded-xl border border-transparent-100-16">
           <div className="flex items-center py-4 pl-6 pr-3">
             <div className="text-sm text-high">General Information</div>
             <div className="flex grow gap-6" />

diff --git a/src/pages/Observers/ObserversTable.tsx b/src/pages/Observers/ObserversTable.tsx
@@ -22,7 +22,6 @@ interface TableData {
 const columnHelper = createColumnHelper<TableData>();
 
 const ObserversTable = () => {
-
   const navigate = useNavigate();
 
   const { isLoading, data: observers } = useObservers();
@@ -92,6 +91,7 @@ const ObserversTable = () => {
             href={`https://${row.getValue('domain')}`}
             target="_blank"
             rel="noreferrer"
+            onClick={(e) => e.stopPropagation()}
           >
             {row.getValue('domain')}
           </a>{' '}
@@ -137,7 +137,7 @@ const ObserversTable = () => {
       id: 'failedGateways',
       header: 'Failed Gateways',
       sortDescFirst: true,
-      cell: ({ row }) => row.original.failedGateways || "Pending",
+      cell: ({ row }) => row.original.failedGateways || 'Pending',
     }),
   ];
 

diff --git a/src/pages/Staking/ActiveStakes.tsx b/src/pages/Staking/ActiveStakes.tsx
@@ -9,6 +9,7 @@ import useGateways from '@src/hooks/useGateways';
 import { useGlobalState } from '@src/store';
 import { ColumnDef, createColumnHelper } from '@tanstack/react-table';
 import { useEffect, useState } from 'react';
+import { useNavigate } from 'react-router-dom';
 
 interface TableData {
   owner: string;
@@ -30,6 +31,8 @@ const ActiveStakes = () => {
   const [stakingModalWalletAddress, setStakingModalWalletAddress] =
     useState<string>();
 
+  const navigate = useNavigate();
+
   useEffect(() => {
     const activeStakes: Array<TableData> =
       !walletAddress || !gateways
@@ -71,6 +74,7 @@ const ActiveStakes = () => {
             href={`https://${row.getValue('domain')}`}
             target="_blank"
             rel="noreferrer"
+            onClick={(e) => e.stopPropagation()} 
           >
             {row.getValue('domain')}
           </a>{' '}
@@ -116,7 +120,8 @@ const ActiveStakes = () => {
             title="Manage Stake"
             text=" "
             rightIcon={<GearIcon className="size-4" />}
-            onClick={() => {
+            onClick={(e) => {
+              e.stopPropagation();
               setStakingModalWalletAddress(row.original.owner);
             }}
           />
@@ -152,6 +157,9 @@ const ActiveStakes = () => {
           id: 'delegatedStake',
           desc: true,
         }}
+        onRowClick={(row) => {
+          navigate(`/gateways/${row.owner}`);
+        }}
       />
       {showUnstakeAllModal && (
         <UnstakeAllModal

diff --git a/src/pages/Staking/DelegateStakeTable.tsx b/src/pages/Staking/DelegateStakeTable.tsx
@@ -18,6 +18,7 @@ import { calculateGatewayRewards } from '@src/utils/rewards';
 import { ColumnDef, createColumnHelper } from '@tanstack/react-table';
 import { MathJax } from 'better-react-mathjax';
 import { useEffect, useState } from 'react';
+import { useNavigate } from 'react-router-dom';
 
 interface TableData {
   label: string;
@@ -52,6 +53,8 @@ const DelegateStake = () => {
 
   const { data: protocolBalance } = useProtocolBalance();
 
+  const navigate = useNavigate();
+
   useEffect(() => {
     const stakeableGateways: Array<TableData> =
       !gateways || !protocolBalance
@@ -118,6 +121,7 @@ const DelegateStake = () => {
             href={`https://${row.getValue('domain')}`}
             target="_blank"
             rel="noreferrer"
+            onClick={(e) => e.stopPropagation()} 
           >
             {row.getValue('domain')}
           </a>{' '}
@@ -227,7 +231,8 @@ const DelegateStake = () => {
               active={true}
               title="Manage Stake"
               text="Stake"
-              onClick={() => {
+              onClick={(e) => {
+                e.stopPropagation();
                 if (walletAddress) {
                   setStakingModalWalletAddress(row.getValue('owner') as string);
                 } else {
@@ -252,6 +257,9 @@ const DelegateStake = () => {
         isLoading={isLoading}
         noDataFoundText="No stakeable gateways found."
         defaultSortingState={{ id: 'totalStake', desc: true }}
+        onRowClick={(row) => {
+          navigate(`/gateways/${row.owner}`);
+        }}
       />
       {stakingModalWalletAddress && (
         <StakingModal

diff --git a/src/services/wallets/ArConnectWalletConnector.ts b/src/services/wallets/ArConnectWalletConnector.ts
@@ -2,12 +2,11 @@ import { ArconnectError, WalletNotInstalledError } from '@src/utils/errors';
 import { PermissionType } from 'arconnect';
 import { ApiConfig } from 'arweave/web/lib/api';
 
-import { ArconnectSigner } from '@ar.io/sdk/web';
+import { log } from '@src/constants';
+import { KEY_WALLET_TYPE } from '@src/store/persistent';
 import { executeWithTimeout } from '@src/utils';
 import { ArweaveTransactionID } from '@src/utils/ArweaveTransactionId';
 import { ArweaveWalletConnector, WALLET_TYPES } from '../../types';
-import { KEY_WALLET_TYPE } from '@src/store/persistent';
-import { log } from '@src/constants';
 
 export const ARCONNECT_WALLET_PERMISSIONS: PermissionType[] = [
   'ACCESS_ADDRESS',
@@ -22,11 +21,11 @@ export const ARCONNECT_UNRESPONSIVE_ERROR =
 
 export class ArConnectWalletConnector implements ArweaveWalletConnector {
   private _wallet: Window['arweaveWallet'];
-  signer?: ArconnectSigner;
+  signer?: Window['arweaveWallet'];
 
   constructor() {
     this._wallet = window?.arweaveWallet;
-    this.signer = new ArconnectSigner(this._wallet, null as any);
+    this.signer = this._wallet;
   }
 
   // The API has been shown to be unreliable, so we call each function with a timeout

diff --git a/src/types.ts b/src/types.ts
@@ -1,4 +1,3 @@
-import { ArconnectSigner } from '@ar.io/sdk/web';
 import { ArweaveTransactionID } from './utils/ArweaveTransactionId';
 
 export interface Equatable<T> {
@@ -10,7 +9,7 @@ export interface ArweaveWalletConnector {
   disconnect(): Promise<void>;
   getWalletAddress(): Promise<ArweaveTransactionID>;
   // getGatewayConfig(): Promise<ApiConfig>;
-  signer?: ArconnectSigner;
+  signer?: Window['arweaveWallet'];
 }
 
 export enum WALLET_TYPES {
@@ -45,7 +44,8 @@ export interface OwnershipAssessment {
   pass: boolean;
 }
 
-export interface ArNSAssessmentTimings extends Record<string, number | undefined> {
+export interface ArNSAssessmentTimings
+  extends Record<string, number | undefined> {
   dns: number | undefined;
   download: number | undefined;
   firstByte: number | undefined;