Merge pull request #12 from Synthetixio/subgraph

Subgraph
Synthetixio · Sep 23, 2024 · 461544b · 461544b
2 parents 8373b78 + 89c351c
commit 461544b
Show file tree

Hide file tree

Showing 25 changed files with 19,843 additions and 46,147 deletions.
diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml
@@ -10,10 +10,9 @@ jobs:
   build:
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v2
-    - uses: actions/setup-node@v2
-      with:
-        node-version: '12.x'
-        registry-url: 'https://registry.npmjs.org'
-    - run: npm install
-    - run: npm run test
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v2
+        with:
+          node-version: "12.x"
+          registry-url: "https://registry.npmjs.org"
+      - run: npm install
diff --git a/frontend/components/Admin/AdminPanel/Grants/GrantModal.js b/frontend/components/Admin/AdminPanel/Grants/GrantModal.js
@@ -27,7 +27,7 @@ import { useEthersSigner } from "../../../../utils/ethers";
 
 export default function GrantModal({ grant }) {
   const { chain } = useAccount();
-  const signer = useEthersSigner({ chainId: chain.id });
+  const signer = useEthersSigner({ chainId: chain?.id || "10" });
   const { isOpen, onOpen, onClose } = useDisclosure();
   const toast = useToast();
 

diff --git a/frontend/components/Admin/AdminPanel/Grants/index.js b/frontend/components/Admin/AdminPanel/Grants/index.js
@@ -1,32 +1,45 @@
-import { useState } from 'react'
-import { Heading, Box, Table, Thead, Tbody, Tr, Th, Td, Link, Text, Flex, Checkbox } from '@chakra-ui/react'
-import { Icon } from '@chakra-ui/icons'
-import { ethers } from 'ethers'
-import { format, formatDistance } from 'date-fns'
-import { BsAward } from 'react-icons/bs'
-import { accountDisplay } from '../../../../lib/utils/helpers'
-import { useRecoilState } from 'recoil'
-import { getGrants } from '../../../../lib/store/grants'
-import EtherscanLink from '../../../shared/EtherscanLink'
-import GrantModal from './GrantModal'
-import CancelButton from './CancelButton'
+import { useState } from "react";
+import {
+  Heading,
+  Box,
+  Table,
+  Thead,
+  Tbody,
+  Tr,
+  Th,
+  Td,
+  Link,
+  Text,
+  Flex,
+  Checkbox,
+} from "@chakra-ui/react";
+import { Icon } from "@chakra-ui/icons";
+import { ethers } from "ethers";
+import { format, formatDistance } from "date-fns";
+import { BsAward } from "react-icons/bs";
+import { accountDisplay } from "../../../../lib/utils/helpers";
+import EtherscanLink from "../../../shared/EtherscanLink";
+import GrantModal from "./GrantModal";
+import CancelButton from "./CancelButton";
+import { useRecoilState } from "recoil";
+import { grantsState } from "../../../../lib/store/grants";
 
 export default function Grants() {
-  const [grants, setGrants] = useRecoilState(getGrants());
-  const [showCancelled, setShowCancelled] = useState(false)
+  const [grants] = useRecoilState(grantsState);
+  const [showCancelled, setShowCancelled] = useState(false);
+
+  if (Object.keys(grants).length === 0) return "no grants";
 
   return (
-    <Box
-      mb={8}
-      borderRadius="md"
-      background="gray.900"
-      py={5}
-      px={6}>
+    <Box mb={8} borderRadius="md" background="gray.900" py={5} px={6}>
       <Flex w="100%" align="center" mb={4}>
-        <Heading d="inline-block" size="lg" fontWeight="light"><Icon as={BsAward} boxSize={5} mr={2} />Grants</Heading>
+        <Heading d="inline-block" size="lg" fontWeight="light">
+          <Icon as={BsAward} boxSize={5} mr={2} />
+          Grants
+        </Heading>
         <GrantModal />
       </Flex>
-      <Table variant='simple' size='sm'>
+      <Table variant="simple" size="sm">
         <Thead>
           <Tr>
             <Th />
@@ -40,7 +53,7 @@ export default function Grants() {
         <Tbody>
           {grants.map((grant, ind) => {
             return (
-              <Tr key={ind} d={!showCancelled && grant.cancelled && 'none'}>
+              <Tr key={ind} d={!showCancelled && grant.cancelled && "none"}>
                 <Td>#{grant.tokenId}</Td>
                 <Td>
                   <EtherscanLink
@@ -50,37 +63,84 @@ export default function Grants() {
                     _hover={{
                       textDecoration: "none",
                       borderBottom: "1px rgba(255,255,255,0.9) dotted",
-                    }} isExternal path={`/address/${grant.owner}`}>{accountDisplay(grant.owner)}</EtherscanLink>
+                    }}
+                    isExternal
+                    path={`/address/${grant.owner}`}
+                  >
+                    {accountDisplay(grant.owner)}
+                  </EtherscanLink>
                 </Td>
                 <Td>
-                  <Text>{format(new Date(grant.startTimestamp.toNumber() * 1000), 'MMM. d ’yy')} start</Text>
-                  <Text fontSize="xs" opacity={0.8}> {format(new Date(grant.cliffTimestamp.toNumber() * 1000), 'MMM. d ’yy')} cliff</Text>
+                  <Text>
+                    {format(
+                      new Date(grant.startTimestamp.toNumber() * 1000),
+                      "MMM. d ’yy"
+                    )}{" "}
+                    start
+                  </Text>
+                  <Text fontSize="xs" opacity={0.8}>
+                    {" "}
+                    {format(
+                      new Date(grant.cliffTimestamp.toNumber() * 1000),
+                      "MMM. d ’yy"
+                    )}{" "}
+                    cliff
+                  </Text>
                 </Td>
                 <Td>
-                  <Text>{parseInt(ethers.utils.formatUnits(grant.vestAmount, 18)).toLocaleString()} {grant.tokenSymbol}</Text>
-                  <Text fontSize="xs" opacity={0.8}>every {formatDistance(new Date(0), new Date(grant.vestInterval * 1000))}</Text>
+                  <Text>
+                    {parseInt(
+                      ethers.utils.formatUnits(grant.vestAmount, 18)
+                    ).toLocaleString()}{" "}
+                    {grant.tokenSymbol}
+                  </Text>
+                  <Text fontSize="xs" opacity={0.8}>
+                    every{" "}
+                    {formatDistance(
+                      new Date(0),
+                      new Date(grant.vestInterval * 1000)
+                    )}
+                  </Text>
                 </Td>
                 <Td>
-                  <Text>{parseInt(ethers.utils.formatUnits(grant.amountRedeemed, 18)).toLocaleString()} {grant.tokenSymbol} redeemed</Text>
-                  <Text fontSize="xs" opacity={0.8}>of {parseInt(ethers.utils.formatUnits(grant.totalAmount, 18)).toLocaleString()} {grant.tokenSymbol} total</Text>
+                  <Text>
+                    {parseInt(
+                      ethers.utils.formatUnits(grant.amountRedeemed, 18)
+                    ).toLocaleString()}{" "}
+                    {grant.tokenSymbol} redeemed
+                  </Text>
+                  <Text fontSize="xs" opacity={0.8}>
+                    of{" "}
+                    {parseInt(
+                      ethers.utils.formatUnits(grant.totalAmount, 18)
+                    ).toLocaleString()}{" "}
+                    {grant.tokenSymbol} total
+                  </Text>
                 </Td>
                 <Td>
-                  {grant.cancelled ? <Text fontSize="xs" opacity={0.8}>Cancelled</Text> :
+                  {grant.cancelled ? (
+                    <Text fontSize="xs" opacity={0.8}>
+                      Cancelled
+                    </Text>
+                  ) : (
                     <div>
                       <GrantModal grant={grant} />
                       <CancelButton tokenId={grant.tokenId} />
                     </div>
-                  }
+                  )}
                 </Td>
               </Tr>
-            )
+            );
           })}
         </Tbody>
       </Table>
       <Checkbox
         mt="3"
         isChecked={showCancelled}
-        onChange={(e) => setShowCancelled(!showCancelled)}>Show cancelled grants</Checkbox>
-    </Box >
-  )
+        onChange={(e) => setShowCancelled(!showCancelled)}
+      >
+        Show cancelled grants
+      </Checkbox>
+    </Box>
+  );
 }