TypeScript Error on Example @drizzle/store : payable interface ABI

[Arzemn]

React 17 Node 14.18.2 Truffle v5.4.26 Solidity 0.8.10

I am just trying to setup a simple Drizzle Example with my own simple contract and i am running into typescript errors,

i have replaced SimpleStorage with my truffle compiled contract

import { Drizzle } from "@drizzle/store";
Create an options object and pass in the desired contract artifacts for Drizzle to instantiate. Other options are available, see the Options section below.

// Import contracts
import SimpleStorage from "./../build/contracts/SimpleStorage.json";

const options = {
  contracts: [SimpleStorage]
};

const drizzle = new Drizzle(options);

doing this i get this typescript error

TS2345: Argument of type '{ contracts: { contractName: string; abi: ({ inputs: never[]; stateMutability: string; type: string; anonymous?: undefined; name?: undefined; outputs?: undefined; constant?: undefined; } | { anonymous: boolean; ... 5 more ...; constant?: undefined; } | { ...; } | { ...; })[]; ... 18 more ...; userdoc: { ...; }; }[]; }' is not assignable to parameter of type 'IDrizzleOptions'.   Types of property 'contracts' are incompatible.     Type '{ contractName: string; abi: ({ inputs: never[]; stateMutability: string; type: string; anonymous?: undefined; name?: undefined; outputs?: undefined; constant?: undefined; } | { anonymous: boolean; inputs: { ...; }[]; ... 4 more ...; constant?: undefined; } | { ...; } | { ...; })[]; ... 18 more ...; userdoc: { ...; ...' is not assignable to type 'IContract[]'.       Type '{ contractName: string; abi: ({ inputs: never[]; stateMutability: string; type: string; anonymous?: undefined; name?: undefined; outputs?: undefined; constant?: undefined; } | { anonymous: boolean; inputs: { ...; }[]; ... 4 more ...; constant?: undefined; } | { ...; } | { ...; })[]; ... 18 more ...; userdoc: { ...; ...' is not assignable to type 'IContract'.         Types of property 'abi' are incompatible.           Type '({ inputs: never[]; stateMutability: string; type: string; anonymous?: undefined; name?: undefined; outputs?: undefined; constant?: undefined; } | { anonymous: boolean; inputs: { indexed: boolean; internalType: string; name: string; type: string; }[]; ... 4 more ...; constant?: undefined; } | { ...; } | { ...; })[]' is not assignable to type 'ABI[]'.             Type '{ inputs: never[]; stateMutability: string; type: string; anonymous?: undefined; name?: undefined; outputs?: undefined; constant?: undefined; } | { anonymous: boolean; inputs: { indexed: boolean; internalType: string; name: string; type: string; }[]; ... 4 more ...; constant?: undefined; } | { ...; } | { ...; }' is not assignable to type 'ABI'.               Property 'payable' is missing in type '{ inputs: never[]; stateMutability: string; type: string; anonymous?: undefined; name?: undefined; outputs?: undefined; constant?: undefined; }' but required in type 'ABI'.

essentially i can see that the IContract through the ABI Interface is requiring payable: but my contract doesn't have these in the ABI output

export interface ABI {
  constant?: boolean;
  inputs: {
    name: string;
    type: string;
    indexed?: boolean;
  }[];
  name?: string;
  outputs?: {
    name: string;
    type: string;
  }[];
  payable: boolean;
  stateMutability: string;
  type: string;
  anonymous?: boolean;
}

In my contract the abi: [] has entrires that look like

  {
      "inputs": [
        {
          "internalType": "uint256",
          "name": "tokenId",
          "type": "uint256"
        },
        {
          "internalType": "string",
          "name": "newFirstName",
          "type": "string"
        }
      ],
      "name": "changeFirstName",
      "outputs": [],
      "stateMutability": "nonpayable",
      "type": "function"
    }

should payable to be an optional payable?: boolean

[mhdmazaz]

Change this: const options = { contracts: [SimpleStorage] };

to

const options = { contracts: [SimpleStorage as any] };