How to use the @polkadot/types.AccountId function in @polkadot/types

const {
    struct
  } = props;

  const [ reactionState, setReactionState ] = useState(undefined as (Reaction | undefined));

  const { state: { address } } = useMyAccount();

  const kind = reactionState ? reactionState && reactionState.kind.toString() : 'None';
  const [ reactionKind, setReactionKind ] = useState(kind);
  const [ state , setState ] = useState(struct);
  const { id } = state;
  const isComment = struct.Type['id'] === CommentId.name;
  const Id = isComment ? CommentId : PostId;

  const dataForQuery = new Tuple([AccountId, Id], [new AccountId(address), id]);

  useEffect(() => {

    const structQuery = isComment ? 'comment' : 'post';

    async function loadStruct (struct: T) {
      const result = await api.query.blogs[`${structQuery}ById`](id) as Option;

      if (result.isNone) return;

      const _struct = result.unwrap();
      setState(_struct);
    }
    loadStruct(state).catch(err => console.log(err));

    // TODO not use callback

// Copyright 2017-2019 @polkadot/ui-api authors & contributors
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.

import { PromiseSubscription } from '@polkadot/api/promise/types';
import { DeriveSubscription, DerivedBalances } from '../types';

import ApiPromise from '@polkadot/api/promise';
import { AccountId, AccountIndex, Balance } from '@polkadot/types';

import accountIdAndIndex from './accountIdAndIndex';

const EMPTY_ACCOUNT = new AccountId(new Uint8Array(32));

export default function votingBalance (api: ApiPromise): DeriveSubscription {
  return async (address: AccountIndex | AccountId | string, cb: (balance: DerivedBalances) => any): PromiseSubscription => {
    let combineDestroy: PromiseSubscription | undefined;
    const idDestory = accountIdAndIndex(api)(address, async ([accountId]: [AccountId | undefined]) => {
      const handler = (freeBalance?: Balance, reservedBalance?: Balance) => {
        cb({
          accountId: accountId || EMPTY_ACCOUNT,
          freeBalance: freeBalance || new Balance(0),
          nominatedBalance: new Balance(0),
          reservedBalance: reservedBalance || new Balance(0),
          stakingBalance: new Balance(0),
          votingBalance: new Balance(
            (freeBalance || new Balance(0)).add(reservedBalance || new Balance(0))
          )
        });

return async (address: AccountId | AccountIndex | string | null | undefined, cb: (idAndIndex: IdAndIndex) => any): PromiseSubscription => {
    try {
      // yes, this can fail, don't care too much, catch will catch it
      const decoded = decodeAddress((address as any).toString());

      if (decoded.length === 32) {
        const accountId = new AccountId(decoded);

        return accountIdToIndex(api)(accountId, (accountIndex?: AccountIndex) =>
          cb([accountId, accountIndex])
        );
      }

      const accountIndex = new AccountIndex(address as string);

      return accountIndexToId(api)(accountIndex, (accountId?: AccountId) =>
        cb([accountId, accountIndex])
      );
    } catch (error) {
      // swallow
    }

    cb([undefined, undefined]);

function InnerFollowAccountButton (props: InnerFollowAccountButtonProps) {
  const { myAddress, address, size = BUTTON_SIZE } = props;

  const accountId = new AccountId(address);
  const dataForQuery = new Tuple([AccountId, AccountId], [new AccountId(myAddress), accountId]);

  const [ isFollow, setIsFollow ] = useState(true);
  const [ triggerReload, setTriggerReload ] = useState(false);

  useEffect(() => {
    const load = async () => {
      const _isFollow = await (api.query.blogs[`accountFollowedByAccount`](dataForQuery)) as Bool;
      setIsFollow(_isFollow.valueOf());
    };
    load().catch(err => console.log(err));

  }, [ triggerReload ]);

  const buildTxParams = () => {
    return [ accountId ];

it('creates a single observable (multiple calls, different arguments that should be cached together)', () => {
    const observable1 = creator(keyring.alice.address);
    const observable2 = creator(new AccountId(keyring.alice.address));

    expect(
      observable2
    ).toBe(observable1);
  });

export function FollowBlogButton (props: FollowBlogButtonProps) {
  const { blogId, size = isMobile ? 'tiny' : 'small' } = props;
  const { state: { address: myAddress } } = useMyAccount();

  const dataForQuery = new Tuple([AccountId, BlogId], [new AccountId(myAddress), blogId]);

  const [ isFollow, setIsFollow ] = useState(false);
  const [ triggerReload, setTriggerReload ] = useState(false);

  useEffect(() => {
    const load = async () => {
      const _isFollow = await (api.query.blogs[`blogFollowedByAccount`](dataForQuery)) as Bool;
      setIsFollow(_isFollow.valueOf());
    };
    load().catch(err => console.log(err));

  }, [ triggerReload ]);

  const buildTxParams = () => {
    return [ blogId ];
  };

private onSave = (): void => {
    const { address, abi, name } = this.state;

    if (!address || !abi || !name) {
      return;
    }

    store.saveContract(new AccountId(address), { abi, name }).catch((error) => {
      console.error('Unable to save contract', error);
    });

    this.redirect();
  }

function InnerFollowAccountButton (props: InnerFollowAccountButtonProps) {
  const { myAddress, address, size = BUTTON_SIZE } = props;

  const accountId = new AccountId(address);
  const dataForQuery = new Tuple([AccountId, AccountId], [new AccountId(myAddress), accountId]);

  const [ isFollow, setIsFollow ] = useState(true);
  const [ triggerReload, setTriggerReload ] = useState(false);

  useEffect(() => {
    const load = async () => {
      const _isFollow = await (api.query.blogs[`accountFollowedByAccount`](dataForQuery)) as Bool;
      setIsFollow(_isFollow.valueOf());
    };
    load().catch(err => console.log(err));

  }, [ triggerReload ]);

  const buildTxParams = () => {
    return [ accountId ];
  };

return function () {
    const { state: { address: myAddress } } = useMyAccount();
    try {
      return ;
    } catch (err) {
      return <em>Invalid Account id</em>;
    }
  };
}

return function (props: ListBlogProps) {
    const { state: { address: myAddress } } = useMyAccount();
    try {
      return ;
    } catch (err) {
      return <em>Invalid Account id</em>;
    }
  };
}