Demo on ingesting data from an API using a hooks-like API

ingest_using_hooks.ts

import * as config from "../config";

import { Refract, elem } from "./refract";
import {
  useFetchJson,
  useWeb3,
  useCompoundContract,
  useBlockHeader,
  useBorrowAndSupplyRate,
  useKnex,
  usePersist
} from "./hooks";

/******* components *******/

export const ApyIngestor = props => {
  let { providerUri, tokenListPath, mainnetPath, mainnetAbiPath } = props;

  let web3 = useWeb3(providerUri);

  let [tokenList, setTokenList] = useFetchJson(tokenListPath);

  let [mainnet, setMainnet] = useFetchJson(mainnetPath);
  let [mainnetAbi, setMainnetAbi] = useFetchJson(mainnetAbiPath);

  let contractGenerator = useCompoundContract(web3, mainnetAbi, mainnet);

  let blockHeader = useBlockHeader(web3);

  let filteredTokens =
    tokenList?.tokens
      ?.filter(tokenRecord => tokenRecord.chainId === 1)
      ?.filter(tokenRecord => tokenRecord.symbol.match(/c.*/)) || [];

  return elem(
    Div,
    {
      filteredTokens: filteredTokens?.length,
      blockHeader: blockHeader?.number
    },
    () => {
      return filteredTokens.map((tokenRecord, i) => {
        return elem(TokenRates, {
          key: i,
          tokenRecord,
          contract: contractGenerator(tokenRecord.symbol),
          blockHeader
        });
      });
    }
  );
};

const TokenRates = props => {
  let { tokenRecord, contract, blockHeader } = props;

  const knex = useKnex(config.dev.db);

  const [borrowRate, supplyRate] = useBorrowAndSupplyRate(contract, blockHeader);

  // TODO it'd help to have declarative guards. Use Typescript?
  let record: AnnualPercentageYieldRecord | null = null;
  if (blockHeader && tokenRecord && borrowRate && supplyRate) {
    record = {
      project_name: "compound",
      blocknumber: blockHeader.number,
      market_name: tokenRecord.symbol,
      data: {
        borrow_rate: borrowRate,
        supply_rate: supplyRate
      },
      block_at: new Date(blockHeader.timestamp * 1000),
      created_at: new Date(),
      updated_at: new Date()
    };
  }

  usePersist(knex, record, ["project_name", "blocknumber", "market_name"]);

  return elem(Div, record);
};

const Div = props => {
  return {
    props
  };
};

export type AnnualPercentageYieldRecord = {
  project_name: string;
  blocknumber: number;
  market_name: string;
  data: {
    borrow_rate: string;
    supply_rate: string;
  };
  block_at: Date;
  created_at: Date;
  updated_at: Date;
};