Using Iotex rpc readstate with iotex-antenna

gistfile1.js

import React, { useEffect } from 'react';
import { observer } from 'mobx-react-lite';
import RpcMethod from 'iotex-antenna/lib/rpc-method';

import { IReadStakingDataMethodToBuffer, IReadStakingDataMethodName, IReadStakingDataRequestToBuffer } from 'iotex-antenna/lib/rpc-method/types';
import { VoteBucketList } from 'iotex-antenna/protogen/proto/types/state_data_pb';
import { from } from '@iotexproject/iotex-address-ts';
import { Container } from '@chakra-ui/react';
import { ToolConfig } from '../../config/ToolConfig';
import { Badge, Flex, Text } from '@chakra-ui/layout';

import { useStore } from '@/store/index';
import { _fetchData } from '@ethersproject/web';
export const Home = observer(() => {
  const { lang, god } = useStore();
  const provider = new RpcMethod('https://api.testnet.iotex.one:443');

  useEffect(() => {
    const _fetchData = async () => {
      const ioAddress = from(god.currentNetwork.account)?.string();
      const state = await provider.readState({
        protocolID: Buffer.from('staking'),
        methodName: IReadStakingDataMethodToBuffer({
          method: IReadStakingDataMethodName.BUCKETS_BY_VOTER
        }),
        arguments: [
          IReadStakingDataRequestToBuffer({
            bucketsByVoter: {
              voterAddress: ioAddress,
              pagination: {
                offset: 0,
                limit: 1000
              }
            }
          })
        ],
        height: undefined
      });
      let voteBucketList = VoteBucketList.deserializeBinary(state.data);
      const voteBucketListObj = VoteBucketList.toObject(false, voteBucketList);
      console.log(voteBucketListObj)
      // const enc = new TextDecoder();
      // console.log(enc.decode(state.data));
    };
    _fetchData();
  }, [god.currentNetwork.account]);
  return (
    <Container maxW="7xl">
      <Flex mt={10} flexDirection={'column'}>
        Test
      </Flex>
    </Container>
  );
});