Update VaultEntry Fetching

src/components/vaults/VaultEntry.tsx

@@ -36,7 +36,7 @@ export const VaultEntry: FC<{ vault: bigint }> = ({ vault }) => {
                     </div>
                 </div>
                 <div className="text-right">
-                    <div>{names.length} names</div>
+                    <div>{names?.length} names</div>
                     <div>{formatEther(balance || 0n)} ETH</div>
                 </div>
             </div>

src/hooks/useExpiryNames.tsx

@@ -34,7 +34,7 @@ export const useExpiryNames = () => {
     const { data: block } = useBlockNumber({ chainId });
 
     return useSWR(
-        "/subgrpah/" + block,
+        "/subgraph/all/" + block,
         async (): Promise<{ name: string; vault: string }[]> => {
             const x = await axios.post(
                 // Yes, this uses a cors-anywhere bypass. This is a demo.

src/hooks/useVaultNames.tsx

@@ -1,8 +1,51 @@
-import { useChainId } from "wagmi";
+import axios from "axios";
+import { gql } from "graphql-request";
+import useSWR from "swr";
+import { useBlockNumber, useChainId } from "wagmi";
 
+const query = gql`
+    query byVault($vaultId: BigFloat) {
+        allRescuenameNameAddeds(condition: { vault: $vaultId }) {
+            nodes {
+                name
+            }
+        }
+    }
+`;
+
+export type ExpiryNames = {
+    data: {
+        allRescuenameNameAddeds: {
+            nodes: {
+                name: string;
+            }[];
+        };
+    };
+};
 export const useVaultNames = (vaultId: bigint) => {
     const chainId = useChainId();
+    const { data: block } = useBlockNumber({ chainId });
+
+    return useSWR(
+        "/subgraph/" + vaultId + "/" + block,
+        async (): Promise<string[]> => {
+            const x = await axios.post(
+                // Yes, this uses a cors-anywhere bypass. This is a demo.
+                // The streamingfast entrypoint doesnt output the right cors headers
+                "https://cors-anywhere.herokuapp.com/https://srv.streamingfast.io/01bfe668/graphql",
+                {
+                    query,
+                    variables: { vaultId: vaultId.toString() }
+                }
+            );
+
+            const xy = x.data as ExpiryNames;
+
+            console.log({ xy });
 
-    // TODO: hook up to substream
-    return { data: ["lucemans", "nevvdevv"] };
+            return xy.data.allRescuenameNameAddeds.nodes
+                .filter((node) => node.name.length >= 5)
+                .map((node) => node.name);
+        }
+    );
 };