Skip to content
This repository has been archived by the owner on Jun 7, 2024. It is now read-only.

Commit

Permalink
Features/eth hooks#125 (#53)
Browse files Browse the repository at this point in the history
* scaffold-eth/eth-ui#125 updates to types

* scaffold-eth/eth-ui#125 updates to types

* scaffold-eth/eth-ui#125 updates to type simplicity

* update packages

* #125 update eth-sdk scaffold-eth/eth-ui#125
  • Loading branch information
ShravanSunder authored Jan 16, 2022
1 parent e571cba commit 48075a1
Show file tree
Hide file tree
Showing 9 changed files with 157 additions and 226 deletions.
12 changes: 6 additions & 6 deletions packages/hardhat-ts/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,23 +23,23 @@
"@ethersproject/providers": "^5.5.2",
"@nomiclabs/hardhat-ethers": "npm:hardhat-deploy-ethers@^0.3.0-beta.10",
"@nomiclabs/hardhat-waffle": "^2.0.1",
"@openzeppelin/contracts": "^4.4.1",
"@openzeppelin/contracts": "^4.4.2",
"@tenderly/hardhat-tenderly": "^1.0.13",
"@typechain/ethers-v5": "^7.2.0",
"@typechain/hardhat": "^2.3.1",
"@typechain/ethers-v5": "^9.0.0",
"@typechain/hardhat": "^4.0.0",
"chalk": "^4.1.2",
"ethereum-waffle": "^3.4.0",
"ethers": "^5.5.3",
"hardhat": "^2.8.2",
"hardhat-deploy": "^0.9.24",
"hardhat-deploy-ethers": "^0.3.0-beta.10",
"hardhat-deploy-ethers": "^0.3.0-beta.13",
"ipfs-http-client": "^54.0.2",
"qrcode-terminal": "^0.12.0",
"typechain": "^5.2.0"
"typechain": "^7.0.0"
},
"devDependencies": {
"@types/jest": "^27.4.0",
"@types/node": "^16.11.19",
"@types/node": "^17.0.8",
"eslint": "^8.6.0",
"eslint-config-airbnb": "^19.0.4",
"eslint-config-airbnb-typescript": "^16.1.0",
Expand Down
2 changes: 1 addition & 1 deletion packages/subgraph/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
"deploy-local": "graph deploy --node http://localhost:8020/ --ipfs http://localhost:5001 scaffold-eth/your-contract"
},
"dependencies": {
"@graphprotocol/graph-cli": "^0.25.2",
"@graphprotocol/graph-cli": "^0.25.3",
"@graphprotocol/graph-ts": "^0.24.1"
},
"devDependencies": {
Expand Down
26 changes: 13 additions & 13 deletions packages/vite-app-ts/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -30,16 +30,16 @@
"@ethersproject/solidity": "^5.5.0",
"@ethersproject/units": "^5.5.0",
"@maticnetwork/maticjs": "^3.1.0",
"@portis/web3": "^4.0.6",
"@portis/web3": "^4.1.0",
"@ramp-network/ramp-instant-sdk": "^3.0.0",
"@uniswap/sdk": "^3.0.3",
"@uniswap/token-lists": "^1.0.0-beta.24",
"antd": "^4.18.3",
"authereum": "^0.1.14",
"axios": "^0.24.0",
"buffer": "^6.0.3",
"eth-components": "3.0.10",
"eth-hooks": "4.0.9",
"eth-components": "3.0.12",
"eth-hooks": "4.0.10",
"ethereum-cryptography": "^0.1.3",
"ethers": "^5.5.3",
"fortmatic": "^2.2.1",
Expand All @@ -57,36 +57,36 @@
"react-dom": "^17.0.2",
"react-error-boundary": "^3.1.4",
"react-qr-reader": "^2.2.1",
"react-query": "^3.34.7",
"react-query": "^3.34.8",
"react-router-dom": "^5.3.0",
"react-stack-grid": "^0.7.1",
"request": "^2.88.2",
"stream": "^0.0.2",
"stream-browserify": "^3.0.0",
"tailwindcss": "^3.0.13",
"tailwindcss": "^3.0.15",
"timers-browserify": "^2.0.12",
"ts-invariant": "^0.9.4",
"use-debounce": "^7.0.1",
"util": "^0.12.4",
"walletlink": "^2.4.1",
"walletlink": "^2.4.3",
"web3modal": "^1.9.5"
},
"devDependencies": {
"@dethcrypto/eth-sdk": "^0.2.4",
"@dethcrypto/eth-sdk": "^0.3.0",
"@emotion/types": "^0.7.0",
"@nomiclabs/hardhat-ethers": "^2.0.4",
"@nomiclabs/hardhat-waffle": "^2.0.1",
"@tailwindcss/aspect-ratio": "^0.4.0",
"@tailwindcss/forms": "^0.4.0",
"@tailwindcss/line-clamp": "^0.3.0",
"@tailwindcss/line-clamp": "^0.3.1",
"@tailwindcss/typography": "^0.5.0",
"@testing-library/jest-dom": "^5.16.1",
"@testing-library/react": "^12.1.2",
"@testing-library/user-event": "^13.5.0",
"@typechain/hardhat": "^2.3.1",
"@typechain/hardhat": "^4.0.0",
"@types/isomorphic-fetch": "^0.0.35",
"@types/jest": "^27.4.0",
"@types/node": "^16.11.19",
"@types/node": "^17.0.8",
"@types/pretty-time": "^1.1.2",
"@types/qrcode.react": "^1.0.2",
"@types/react": "^17.0.38",
Expand Down Expand Up @@ -121,15 +121,15 @@
"shx": "^0.3.4",
"stylelint": "^14.2.0",
"stylelint-config-recommended": "^6.0.0",
"tailwindcss": "^3.0.13",
"tailwindcss": "^3.0.15",
"tailwindcss-elevation": "^1.0.1",
"ts-node": "^10.4.0",
"twin.macro": "^2.8.2",
"typescript": "^4.5.4",
"vite": "^2.7.10",
"vite": "^2.7.12",
"vite-plugin-babel-macros": "^1.0.5",
"vite-plugin-externals": "^0.3.2",
"vite-plugin-imp": "^2.1.2",
"vite-plugin-imp": "^2.1.3",
"vite-tsconfig-paths": "^3.3.17"
},
"browserslist": {
Expand Down
14 changes: 11 additions & 3 deletions packages/vite-app-ts/src/MainPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import React, { FC, useEffect, useState } from 'react';
import { BrowserRouter, Route, Switch } from 'react-router-dom';

import '~~/styles/main-page.css';
import { useContractReader, useBalance, useEthersAdaptorFromProviderOrSigners } from 'eth-hooks';
import { useContractReader, useBalance, useEthersAdaptorFromProviderOrSigners, useGasPrice } from 'eth-hooks';
import { useDexEthPrice } from 'eth-hooks/dapps';

import { GenericContract } from 'eth-components/ant/generic-contract';
Expand Down Expand Up @@ -50,15 +50,23 @@ export const Main: FC = () => {
// 🏭 connec to contracts for current network & signer
useConnectAppContracts(asEthersAdaptor(ethersContext));

const yourContract = useAppContracts('YourContract', ethersContext.chainId);
const daiContract = useAppContracts('DAI', NETWORKS.mainnet.chainId);

// -----------------------------
// examples on how to get contracts
// -----------------------------
// init contracts
const yourContract = useAppContracts('YourContract', ethersContext.chainId);
//const yourContract = useAppContracts('YourContract', ethersContext.chainId);
const mainnetDai = useAppContracts('DAI', NETWORKS.mainnet.chainId);

// keep track of a variable from the contract in the local React state:
const purpose = useContractReader(yourContract, yourContract?.purpose, [], yourContract?.filters.SetPurpose());
const [purpose, update] = useContractReader(
yourContract,
yourContract?.purpose,
[],
yourContract?.filters.SetPurpose()
);

// 📟 Listen for broadcast events
const [setPurposeEvents] = useEventListener(yourContract, 'SetPurpose', 0);
Expand Down

This file was deleted.

Original file line number Diff line number Diff line change
@@ -1,7 +1,14 @@
import { useContext, useEffect } from 'react';
import { ethers } from 'ethers';
import { IScaffoldAppProviders } from '~~/components/main/hooks/useScaffoldAppProviders';
import { useBalance, useBlockNumber, useContractReader, useGasPrice, useSignerAddress } from 'eth-hooks';
import {
useBalance,
useBlockNumber,
useContractReader,
useEthersAdaptorFromProviderOrSigners,
useGasPrice,
useSignerAddress,
} from 'eth-hooks';

import { useEthersContext } from 'eth-hooks/context';
import { transactor } from 'eth-components/functions';
Expand All @@ -27,6 +34,8 @@ export const useScaffoldHooksExamples = (scaffoldAppProviders: IScaffoldAppProvi
const ethersContext = useEthersContext();
const mainnetDai = useAppContracts('DAI', NETWORKS.mainnet.chainId);

const exampleMainnetProvider = scaffoldAppProviders.mainnetAdaptor?.provider;

let currentChainId: number | undefined = ethersContext.chainId;

// ---------------------
Expand All @@ -35,11 +44,16 @@ export const useScaffoldHooksExamples = (scaffoldAppProviders: IScaffoldAppProvi
// 🏗 scaffold-eth is full of handy hooks like this one to get your balance:
const [yourLocalBalance] = useBalance(ethersContext.account ?? '');

// Just plug in different 🛰 providers to get your balance on different chains:
const [mainnetAdaptor] = useEthersAdaptorFromProviderOrSigners(exampleMainnetProvider);
const [yourMainnetBalance] = useBalance(ethersContext.account ?? '', {
adaptorEnabled: true,
adaptor: mainnetAdaptor,
});

// ---------------------
// 🤙🏽 calling an external function
// ---------------------
// Just plug in different 🛰 providers to get your balance on different chains:
// const yourMainnetBalance = useBalance(scaffoldAppProviders.mainnetProvider, currentEthersUser.address ?? '');

// 💰 Then read your DAI balance like:
const [myAddress] = useSignerAddress(ethersContext.signer);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ import { StaticJsonRpcProvider } from '@ethersproject/providers';
import { useEthersContext } from 'eth-hooks/context';
import { useContractLoader, useContractReader, useEventListener, useGasPrice } from 'eth-hooks';
import { EthComponentsSettingsContext } from 'eth-components/models';
import { useAppContracts, useAppContractsContext } from '~~/config/contractContext';
import { useAppContracts } from '~~/config/contractContext';
import { SetPurposeEvent, YourContract } from '~~/generated/contract-types/YourContract';

export interface IExampleUIProps {
Expand Down
41 changes: 11 additions & 30 deletions packages/vite-app-ts/src/config/contractContext.ts
Original file line number Diff line number Diff line change
@@ -1,44 +1,25 @@
import { contractConnectorConfig, TAppConnectorList } from '~~/config/contractConnectorConfig';
import { TTypedContract } from 'eth-hooks/models';
import { TAppContractsContext, TTypedContract } from 'eth-hooks/models';
import { contractsContextFactory, useEthersContext } from 'eth-hooks/context';

/**
* This file initalises the contractContextFactory and exports the types
* You don't need to change this file.
* 🙅🏽‍♂️ You don't need to change this file.
*/

/**
* A type which is composed of contracts (contractNames) in your app
* #### Summary
* Call contractContextFactory with the contractConnectorConfig.
* This will create your Context and hooks.
*/
export type TAppContractNames = keyof TAppConnectorList;
/**
* A generic with 'contractName' that provides the appropriate type for your contract
*/
export type TAppContractTypes<GContractName extends TAppContractNames> = TTypedContract<
GContractName,
TAppConnectorList
>;

export const {
ContractsAppContext,
useAppContractsActions,
useAppContractsContext,
useAppContracts,
useLoadAppContracts,
useConnectAppContracts,
} = contractsContextFactory<TAppContractNames, TAppConnectorList, TAppContractTypes<TAppContractNames>>(
contractConnectorConfig
);

/**
* Wraps useAppContractsContext to provide narrowly typed contracts for app contracts
* @param contractName
* @param chainId
* @returns
*/
export const useAppContracts = <GContractName extends TAppContractNames>(
contractName: GContractName,
chainId: number | undefined
): TAppContractTypes<GContractName> | undefined => {
const result = useAppContractsContext(contractName, chainId);
return result as TAppContractTypes<GContractName>;
};
} = contractsContextFactory<
keyof TAppConnectorList,
TAppConnectorList,
TTypedContract<keyof TAppConnectorList, TAppConnectorList>
>(contractConnectorConfig);
Loading

0 comments on commit 48075a1

Please sign in to comment.