Uncaught Error: Missing Subscribe

[SerkanSipahi]

Unfortunately, I don't know what to do because I am very new to the React world and have only worked with Angular until now. Unfortunately, I cannot assign this error. What does "Missing Subscribe" mean? Do I have to subscribe to it myself? If so, what steps are missing here? I have orientated myself on the tests and also on the React page how to build custom hooks.

Sources: https://github.com/re-rxjs/react-rxjs/blob/main/packages/core/src/bind/connectObservable.test.tsx https://react-rxjs.org/docs/api/core/bind https://reactjs.org/docs/hooks-custom.html

Where are my misconceptions of using of react-rxjs?

log://error

Error
Missing Subscribe!
Call Stack
 gv
  vendor.js:1142:15
 mountSyncExternalStore
  vendor.js:23762:20
 Object.useSyncExternalStore
  vendor.js:24701:14
 useSyncExternalStore
  vendor.js:40731:21
 useStateObservable
  vendor.js:1175:101
 useStaticObservable
  vendor.js:1190:37
 App
  main.js:102:30
 renderWithHooks
  vendor.js:23268:18
 mountIndeterminateComponent
  vendor.js:27960:13
 beginWork
  vendor.js:29464:16

file://main.tsx

root.render(
  <StrictMode>
    <App />
  </StrictMode>,
);

file://app.tsx

export function App() {
  const element = useWatchSelector('video', 0, 250);
  return <div>{radarElement ? 'Found' : 'notFound'}</div>;;
}

file:// use-watch-selector.ts

import { bind } from '@react-rxjs/core';
import { watchSelector } from './radar.observable';
import { useEffect, useState } from 'react';

export function useWatchSelector<Element extends HTMLElement>(
  selector: string,
  startWithInterval = 0,
  interval = 250,
  context: Document | HTMLElement = document,
) {
  const [watchElement, setWatchElement] = useState<Element | null>(null);
  const [useBindValue] = bind(
    watchSelector<Element>(selector, context, interval, startWithInterval), // Obervable<HTMLElement>
  );

  const watchSelectorValue = useBindValue();
  useEffect(() => setWatchElement(watchSelectorValue), [watchSelectorValue]);

  return watchElement;
}