change api (#6)

darwinia-network · Sep 25, 2024 · bf369f5 · bf369f5
1 parent 25cab65
commit bf369f5
Show file tree

Hide file tree

Showing 26 changed files with 769 additions and 435 deletions.
diff --git a/.env b/.env
@@ -2,4 +2,7 @@ VITE_PROJECT_ID = 2719448e2ce94fdd269a3c8587123bcc
 VITE_DEPLOYMENT_MODE = testnet
 VITE_APP_NAME = "Collator Staking - RingDAO"
 VITE_APP_DESCRIPTION = "Elevate your earnings and effortlessly manage your staking positions with the RingDAO collator staking page."
-VITE_GRAPHQL_API_URL = "https://indexer.bigdevenergy.link/a15d18a/v1/graphql"
+VITE_KOI_GRAPHQL_API_URL = "https://thegraph-g2.darwinia.network/training/subgraphs/name/dip7index-koi-kv"
+VITE_CRAB_GRAPHQL_API_URL = "https://thegraph-g2.darwinia.network/training/subgraphs/name/dip7index-crab"
+VITE_DARWINIA_GRAPHQL_API_URL = "https://thegraph-g2.darwinia.network/training/subgraphs/name/dip7index-darwinia"
+
diff --git a/src/App.tsx b/src/App.tsx
@@ -1,6 +1,7 @@
 import { RouterProvider, createRouter } from '@tanstack/react-router';
 import { DAppProvider } from './providers/dapp-provider';
 import { routeTree } from './routeTree.gen';
+import { WaitingIndexingProvider } from './components/waiting-indexing/context';
 
 const router = createRouter({ routeTree });
 
@@ -12,7 +13,9 @@ declare module '@tanstack/react-router' {
 function App() {
   return (
     <DAppProvider>
-      <RouterProvider router={router} />
+      <WaitingIndexingProvider>
+        <RouterProvider router={router} />
+      </WaitingIndexingProvider>
     </DAppProvider>
   );
 }

diff --git a/src/components/collator/_hooks/collator.ts b/src/components/collator/_hooks/collator.ts
@@ -1,47 +1,45 @@
 import { address as hubAddress, abi as hubAbi } from '@/config/abi/hub';
-import { useCollatorSetPrev } from '@/hooks/useService';
+import { fetchCollatorSetPrev } from '@/hooks/useService';
 import useWalletStatus from '@/hooks/useWalletStatus';
 import { genKey } from '@/utils';
 import { DEFAULT_PREV } from '@/utils/getPrevNew';
-import { useCallback } from 'react';
+import { useCallback, useState } from 'react';
 import { useReadContract, useWriteContract } from 'wagmi';
 
 type CreateAndCollatorProps = {
   commission: bigint;
 };
 export const useCreateAndCollator = ({ enabled }: { enabled: boolean }) => {
-  const { address, isEnabled } = useWalletStatus();
+  const { address, isEnabled, currentChainId } = useWalletStatus();
   const { writeContractAsync, ...rest } = useWriteContract();
+  const [isLoadingPrev, setIsLoadingPrev] = useState(false);
   const oldKey = genKey({ address: address as `0x${string}`, votes: 0n });
-  const {
-    data: collatorSetPrev,
-    isLoading: isLoadingPrev,
-    isRefetching: isRefetchingPrev
-  } = useCollatorSetPrev({
-    key: oldKey,
-    enabled: isEnabled && !!oldKey && enabled
-  });
-
-  const prev = (
-    collatorSetPrev?.[0] ? collatorSetPrev?.[0]?.address : DEFAULT_PREV
-  ) as `0x${string}`;
 
   const createAndCollator = useCallback(
     async ({ commission }: CreateAndCollatorProps) => {
+      if (!isEnabled || !oldKey || !enabled) return;
+      setIsLoadingPrev(true);
+      const data = await fetchCollatorSetPrev({
+        key: oldKey,
+        collatorAddress: address as `0x${string}`,
+        currentChainId: currentChainId!
+      });
+      setIsLoadingPrev(false);
+      const prev = data && data?.[0] ? (data[0]?.address as `0x${string}`) : DEFAULT_PREV;
       return await writeContractAsync({
         address: hubAddress,
         abi: hubAbi,
         functionName: 'createAndCollate',
         args: [prev, commission]
       });
     },
-    [writeContractAsync, prev]
+    [writeContractAsync, isEnabled, oldKey, enabled, currentChainId, address]
   );
 
   return {
     createAndCollator,
     ...rest,
-    isLoading: isLoadingPrev || isRefetchingPrev || rest.isPending
+    isLoading: isLoadingPrev || rest.isPending
   };
 };
 
@@ -52,7 +50,9 @@ export const useCreateCollator = ({
   commission: bigint;
   enabled: boolean;
 }) => {
-  const { address, isEnabled } = useWalletStatus();
+  const { address, isEnabled, currentChainId } = useWalletStatus();
+  const [isLoadingPrev, setIsLoadingPrev] = useState(false);
+
   const {
     data: stakedOf,
     isLoading: isLoadingStakedOf,
@@ -85,29 +85,26 @@ export const useCreateCollator = ({
 
   const oldKey = genKey({ address: address as `0x${string}`, votes: votes ?? 0n });
 
-  const {
-    data: collatorSetPrev,
-    isLoading: isLoadingPrev,
-    isRefetching: isRefetchingPrev
-  } = useCollatorSetPrev({
-    key: oldKey,
-    enabled: isEnabled && !!oldKey && enabled
-  });
-
-  const prev = (
-    collatorSetPrev?.[0] ? collatorSetPrev?.[0]?.address : DEFAULT_PREV
-  ) as `0x${string}`;
-
   const createCollator = useCallback(
     async ({ commission }: CreateAndCollatorProps) => {
+      if (!isEnabled || !oldKey || !enabled) return;
+      setIsLoadingPrev(true);
+      const data = await fetchCollatorSetPrev({
+        key: oldKey,
+        collatorAddress: address as `0x${string}`,
+        currentChainId: currentChainId!
+      });
+      setIsLoadingPrev(false);
+      const prev = data && data?.[0] ? (data[0]?.address as `0x${string}`) : DEFAULT_PREV;
+
       return await writeContractAsync({
         address: hubAddress,
         abi: hubAbi,
         functionName: 'collate',
         args: [prev, commission]
       });
     },
-    [writeContractAsync, prev]
+    [writeContractAsync, isEnabled, oldKey, enabled, currentChainId, address]
   );
 
   return {
@@ -119,7 +116,6 @@ export const useCreateCollator = ({
       isLoadingVotes ||
       isRefetchingVotes ||
       isLoadingPrev ||
-      isRefetchingPrev ||
       rest.isPending
   };
 };
diff --git a/src/components/collator/_hooks/update-commission.ts b/src/components/collator/_hooks/update-commission.ts
@@ -1,26 +1,27 @@
 import { abi as hubAbi, address as hubAddress } from '@/config/abi/hub';
 import { useReadContract, useWriteContract } from 'wagmi';
 import { isNil } from 'lodash-es';
-import { useCallback } from 'react';
+import { useCallback, useState } from 'react';
 import { DEFAULT_PREV } from '@/utils/getPrevNew';
-import { useCollatorSetNewPrev } from '@/hooks/useService';
+import { fetchCollatorSetNewPrev } from '@/hooks/useService';
 import { genKey } from '@/utils';
+import useWalletStatus from '@/hooks/useWalletStatus';
 
 type UpdateCommissionProps = {
   newCommission: bigint;
   oldKey: string;
-  oldPrev: `0x${string}`;
   collatorAddress: `0x${string}`;
   totalAssets: bigint;
 };
 
 const useUpdateCommission = ({
   newCommission,
   oldKey,
-  oldPrev,
   collatorAddress,
   totalAssets
 }: UpdateCommissionProps) => {
+  const { currentChainId } = useWalletStatus();
+  const [isLoadingNewPrev, setIsLoadingNewPrev] = useState(false);
   const { data: votes, isLoading: isLoadingVotes } = useReadContract({
     abi: hubAbi,
     address: hubAddress,
@@ -33,36 +34,38 @@ const useUpdateCommission = ({
 
   const newKey = genKey({ address: collatorAddress, votes: votes ?? 0n });
 
-  const {
-    data: collatorSetNewPrev,
-    isLoading: isLoadingNewPrev,
-    isRefetching: isRefetchingNewPrev
-  } = useCollatorSetNewPrev({
-    key: newKey,
-    newKey,
-    enabled: !!collatorAddress && !!newKey && !!oldKey
-  });
-
-  const newPrev = (
-    collatorSetNewPrev?.[0] ? collatorSetNewPrev?.[0]?.address : DEFAULT_PREV
-  ) as `0x${string}`;
-
   const { writeContractAsync, isPending } = useWriteContract();
 
-  const updateCommission = useCallback(async () => {
-    return writeContractAsync({
-      abi: hubAbi,
-      address: hubAddress,
-      functionName: 'updateCommission',
-      args: [newCommission, oldPrev, newPrev]
-    });
-  }, [newCommission, oldPrev, newPrev, writeContractAsync]);
+  const updateCommission = useCallback(
+    async ({ oldPrev }) => {
+      if (!collatorAddress || !newKey || !oldKey) {
+        return;
+      }
+      setIsLoadingNewPrev(true);
+      const data = await fetchCollatorSetNewPrev({
+        collatorAddress,
+        newKey,
+        currentChainId: currentChainId!
+      });
+      setIsLoadingNewPrev(false);
+      const newPrev =
+        data && data?.[0]?.address ? (data?.[0]?.address as `0x${string}`) : DEFAULT_PREV;
+
+      return writeContractAsync({
+        abi: hubAbi,
+        address: hubAddress,
+        functionName: 'updateCommission',
+        args: [newCommission, oldPrev, newPrev]
+      });
+    },
+    [newCommission, writeContractAsync, collatorAddress, newKey, oldKey, currentChainId]
+  );
 
   return {
     updateCommission,
     isPending,
     votes,
-    isLoading: isLoadingVotes || isLoadingNewPrev || isRefetchingNewPrev
+    isLoading: isLoadingVotes || isLoadingNewPrev
   };
 };
 

diff --git a/src/components/collator/join.tsx b/src/components/collator/join.tsx
@@ -1,4 +1,3 @@
-import { Link } from '@tanstack/react-router';
 import { Button, Tooltip } from '@nextui-org/react';
 import { CircleHelp } from 'lucide-react';
 import { useCallback, useEffect, useMemo, useState } from 'react';
@@ -140,14 +139,14 @@ const CollatorJoin = ({ hasSessionKey, sessionKey, hasPool, refetch }: CollatorJ
       <p className="text-[0.75rem] font-normal text-foreground/50">
         Note that you need to complete two steps in sequence, setup [Session Key] and setup
         [Commission] before becoming a collator. Please{' '}
-        <Link
-          href="https://docs.darwinia.network/node-operators/run-collator-node/#set-session-key-and-commission-rate"
+        <a
+          href="https://docs.darwinia.network/node-operators/run-collator-node"
           className="text-[#0094FF]"
           target="_blank"
           rel="noopener noreferrer"
         >
           Run A Node
-        </Link>{' '}
+        </a>{' '}
         first and get the session key of your running node.
       </p>
       <div className="space-y-[0.62rem]">