React-krpano-hooks - use hooks in multiple components

Question

I'm trying to use React-krpano-hooks. i use https://github.com/shinenic/react-krpano-hooks

Everithing work well. I have a krpano.jsx component created where everything works correctly. after changing the isLoaded variable, everything responds correctly.

But i need use krpano hooks (callKrpano function) in many others components.

component : useDemoKrpano.jsx

import { useEffect, useState } from 'react'
import useKrpano from 'react-krpano-hooks'

const useDemoKrpano = () => {
  const [showLoadingPage, setShowLoadingPage] = useState(true)
  const [isLocked, setLockView] = useState(false)
  const [isHideSpots, setHideSpots] = useState(false)
  const [currentScene, setCurrentScene] = useState('')
  const {
    containerRef,
    krpanoState: { isLoaded },
    lockView,
    unlockView,
    callKrpano,
  } = useKrpano({
    globalFunctions: {
      logScene: (scene) => {
        setCurrentScene(scene)
      },
      logXmlComplette: (info) => {
        //console.log('New info: ', info)
      }
    },
  })

  // Debounce hide loading page
  useEffect(() => {
    if (isLoaded) {
      setTimeout(() => {
        setShowLoadingPage(false)
        // callKrpano('lookto(150,0)')
      }, 1000)
    }
  }, [isLoaded])

  useEffect(() => {
    if (!isLoaded) return

    if (isLocked) {
      lockView()
    } else {
      unlockView()
    }
  }, [isLocked]) // eslint-disable-line

  useEffect(() => {
    if (!isLoaded) return

    if (isHideSpots) {
      callKrpano('toggleHotspotVisibility(0)')
    } else {
      callKrpano('toggleHotspotVisibility(1)')
    }
  }, [isHideSpots]) // eslint-disable-line
  
  const toggleLockView = () => setLockView(prev => !prev);
  const toggleHideSpots = () => setHideSpots(prev => !prev);

  return {
    showLoadingPage,
    isLoaded,
    containerRef,
    toggleLockView,
    isLocked,
    toggleHideSpots,
    isHideSpots,
    currentScene,
    callKrpano
  }
}

export default useDemoKrpano

Working krpano.jsx code :

import React from 'react'
import Preloader from '../images/preloader.svg'
import classNames from 'classnames'
import useDemoKrpano from '../hooks/useDemoKrpano'
import { useEffect, useState } from 'react'

const LoadingPage = ({ isFadingout = false }) => {
  const wrapperClasses = classNames('loading-page', {
    'loading-page--fade-out': isFadingout,
  })
  return (
    <div className={wrapperClasses}>
      <img className="preloader" src={Preloader} />
    </div>
  )
}

const Krpano = () => {
  const {
    showLoadingPage,
    isLoaded,
    containerRef,
    toggleLockView,
    isLocked,
    toggleHideSpots,
    isHideSpots,
    currentScene,
    callKrpano
  } = useDemoKrpano()

  useEffect(() => {
    console.log(currentScene)
  }, [currentScene])

  useEffect(() => {
    console.log(isLoaded)
}, [isLoaded])

  return (
    <>
        <div ref={containerRef} />
        <button id="toggleHotspots" onClick={toggleLockView}>Toggle</button>
        {showLoadingPage && <LoadingPage isFadingout={isLoaded} />}
    </>
  )
}

export default Krpano

not working other component:

import React from 'react'
import Preloader from '../images/preloader.svg'
import classNames from 'classnames'
import useDemoKrpano from '../hooks/useDemoKrpano'
import { useEffect, useState } from 'react'

const Krpano1 = () => {
  const {
    showLoadingPage,
    isLoaded,
    containerRef,
    toggleLockView,
    isLocked,
    toggleHideSpots,
    isHideSpots,
    currentScene,
    callKrpano
  } = useDemoKrpano()

  useEffect(() => {
    console.log(currentScene)
  }, [currentScene])

  useEffect(() => {
    console.log(isLoaded)
}, [isLoaded])


  return (
    <>
    </>
  )
}

export default Krpano1

through hooks I can use e.g. callKrpano function that changes the background scene. but I need to call this function in other components and I don't understand why it doesn't work. in the second copied component, it's as if react doesn't catch the information about variable changes in ../hooks/useDemoKrpano.

Can anyone give me advice?

thank you very much for your time and advice