it doesn't work when afferent a object

[Zertu]

import React, { useState } from "react";
import ReactDOM from "react-dom";
import { useObservable } from "rxjs-hooks";
import { timer } from "rxjs";
import { map, combineLatest } from "rxjs/operators";

import "./styles.css";

function Timer({ a }) {
  const [b, setB] = useState(0);
  const val = useObservable(
    (inputs$, state$) =>
      timer(1000).pipe(
        combineLatest(inputs$),
        map(([_index, [c]]) => {
          console.log(c)
          const { a, b } = c;
          return a + b;
        })
      ),
    0,
    [
      {
        a: a,
        b: b
      }
    ]
  );

  return (
    <div>
      <h1>{val}</h1>
      <button onClick={() => setB(b + 10)}>b: +10</button>
    </div>
  );
}

function App() {
  const [a, setA] = useState(100);

  return (
    <div>
      <Timer a={a} />
      <button onClick={() => setA(a + 100)}>a: +100</button>
    </div>
  );
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

[Brooooooklyn]

What behavior is your expected?
I click a & b buttons, the number changed.

[Zertu]

What behavior is your expected?
I click a & b buttons, the number changed.

only first time

[Brooooooklyn]

rxjs-hooks behavior is correct.
Timer component create a new { a: a, b: b } object in every render. So state changed in times.