variable populated through useSelector (redux) displaying null instead of actual value when accessing through Sencha button handler

Question

variable populated through useSelector (redux) displaying null instead of actual value when accessing through button handler. when using the class-based approach it works fine:

import React from "react";

import { useSelector } from "react-redux";
import { Button } from "@sencha/ext-react-modern";

const LoadButton = () => {
  const viewer = useSelector((state) => state.bim._viewer);

  const handleSenchaBtn = () => {
    console.log("sencha button", viewer);
  };
  const handleHtmlBtn = () => {
    console.log("html button", viewer);
  };
  return (
    <>
      <button onClick={handleHtmlBtn}>Normal Button</button>
      <Button text="Sencha Button" ui="action" handler={handleSenchaBtn} />
    </>
  );
};

export default LoadButton;

Console logs of button actions: