celo-org / react-celo

Connect your react dApp to Celo
https://react-celo.vercel.app
MIT License
59 stars 42 forks source link

Error Property 'openModal' does not exist on type #4

Closed lucasespinosa28 closed 3 years ago

lucasespinosa28 commented 3 years ago

I'm tried the tutorial , but have an error

Error TS2339 (TS) Property 'openModal' does not exist on type '{ network: Network; updateNetwork: Dispatch<SetStateAction>; address: string; dappName: string; kit: ContractKit; ... 6 more ...; connectionCallback: (x: false | ConnectionResult) => void; }

dhruv10 commented 3 years ago

I encountered this error yesterday and checked the docs by navigating into the node_modules of this library. I found that the methods have been updated. It looks like:

export declare const useContractKit: () => {
    network: Network;
    updateNetwork: React.Dispatch<React.SetStateAction<Network>>;
    address: string;
    dappName: string;
    kit: ContractKit;
    walletType: WalletTypes;
    performActions: (...operations: ((kit: ContractKit) => any | Promise<any>)[]) => Promise<any[]>;
    connect: () => Promise<Connector>;
    destroy: () => void;
    getConnectedKit: () => Promise<ContractKit>;
    pendingActionCount: number;
    connectionCallback: ((x: ConnectionResult | false) => void) | null;
};
export declare function ContractKitProvider({ children, connectModal, actionModal, dappName, networks, }: {
    children: ReactNode;
    dappName: string;
    networks?: Network[];
    connectModal?: {
        renderProvider?: (p: Provider & {
            onClick: () => void;
        }) => ReactNode;
        reactModalProps?: Partial<ReactModal.Props>;
    };
    actionModal?: {
        reactModalProps?: Partial<ReactModal.Props>;
        render?: (props: ActionModalProps) => ReactNode;
    };
}): JSX.Element;

As you can see, you have to call the connect function now to open the modal. I tried and it works like charm.

AlexBHarley commented 3 years ago

Hey, this library is under a little bit of flux at the moment. I've started deploying beta tags as to not break existing code.

Make sure you're on one of the 0.0.XXX versions https://www.npmjs.com/package/@celo-tools/use-contractkit.

For a current look at the API, check the example application https://github.com/celo-tools/use-contractkit/blob/master/packages/example/pages/index.tsx.

Hopefully it's much more straight forward and intuitive to use.

lucasespinosa28 commented 3 years ago

I downloaded the old version and now it works

npm install @celo-tools/use-contractkit@0.0.31