How to use the @polkadot/util-crypto.xxhashAsHex function in @polkadot/util-crypto

export default async function createExports (bytecode: Uint8Array, imports?: WasmExtraImports, memory?: WebAssembly.Memory | null, forceCreate = false): Promise {
  // FIXME This should be the full hash, however it takes 35-65ms - this is a danger area
  const codeHash = xxhashAsHex(bytecode.subarray(0, 2048));
  const lookup = `${codeHash}_${bytecode.length}`;
  let instance = cache.get(lookup);
  const isNewHash = !instance;

  // NOTE compilation is quite resource intensive, here we bypass the actual Uint8Array -> Module compilation when we already have this module bytecode in our cache
  if (!instance || forceCreate) {
    const table = new WebAssembly.Table(DEFAULT_TABLE);

    const wasm = await WebAssembly.instantiate(
      bytecode,
      createImports(memory, table, imports)
    );

    instance = wasm.instance;
    cache.set(lookup, instance);
  }

public static getDerivedStateFromProps ({ value, skipEncoding = false }: Props, prevState: State): Pick | null {
    const valueHash = xxhashAsHex(value);

    if (valueHash === prevState.valueHash) {
      return null;
    }

    const frames: Uint8Array[] = skipEncoding
      ? [value]
      : createFrames(value);

    // encode on demand
    return {
      frames,
      frameIdx: 0,
      image: getDataUrl(frames[0]),
      valueHash
    };

api.query.system.events((records: EventRecord[] & Codec): void => {
        const newEvents = records
          .filter(({ event }): boolean => event.section !== 'system')
          .map((record, index): KeyedEvent => ({ key: `${Date.now()}-${index}`, record }));
        const newEventHash = xxhashAsHex(stringToU8a(JSON.stringify(newEvents)));

        if (newEventHash !== prevEventHash) {
          events = [...newEvents, ...events].slice(0, MAX_EVENTS);
          setState(events);
        }
      });
    });

static getDerivedStateFromProps ({ system_events = [] }: Props, prevState: State): State | null {
    const prevEventHash = xxhashAsHex(stringToU8a(JSON.stringify(system_events)));

    if (prevEventHash === prevState.prevEventHash) {
      return null;
    }

    const recentEvents = system_events
      .filter(({ event }) => event.section !== 'system')
      .concat(prevState.recentEvents)
      .filter((_, index) => index < MAX_ITEMS);

    return {
      prevEventHash,
      recentEvents
    };
  }

componentDidUpdate ({ optionsAll = { account: [] as any } as KeyringOptions, queueAction, system_events, t }: Props) {
    const eventHash = xxhashAsHex(stringToU8a(JSON.stringify(system_events || [])));

    if (eventHash === prevEventHash) {
      return;
    }

    prevEventHash = eventHash;

    const addresses = optionsAll.account.map((account) => account.value);

    (system_events || []).forEach(({ event: { data, method, section } }) => {
      if (section === 'balances' && method === 'Transfer') {
        const account = data[1].toString();

        if (addresses.includes(account)) {
          queueAction({
            account,

public static getDerivedStateFromProps ({ address, genesisHash }: Props, prevState: State): State | null {
    const data = createAddressPayload(address, genesisHash);
    const dataHash = xxhashAsHex(data);

    if (dataHash === prevState.dataHash) {
      return null;
    }

    return { data, dataHash };
  }

useEffect((): void => {
    const eventHash = xxhashAsHex(stringToU8a(JSON.stringify(events)));

    if (!optionsAll || eventHash === prevEventHash) {
      return;
    }

    prevEventHash = eventHash;

    const statusses = events && events
      .map(({ event: { data, method, section } }): ActionStatus | null => {
        if (section === 'balances' && method === 'Transfer') {
          const account = data[1].toString();

          if (allAccounts.includes(account)) {
            return {
              account,
              action: `${section}.${method}`,

public static getDerivedStateFromProps ({ address, cmd, payload }: Props, prevState: State): State | null {
    const data = createSignPayload(address, cmd, payload);
    const dataHash = xxhashAsHex(data);

    if (dataHash === prevState.dataHash) {
      return null;
    }

    return { data, dataHash };
  }