useLastChanged

A hook that tracks when a source Observable last changed. Returns a read-only Observable containing the Date.now() timestamp of the most recent change, or null if the source has not changed yet.

Demo

Text input

—

Type to update the text and track the last change timestamp.

Last changed

Usage

Hook

import { useLastChanged, useObservable } from "@usels/web";

function Component() {
  const count$ = useObservable(0);
  const lastChanged$ = useLastChanged(count$);

  // null before any change, Date.now() timestamp after
  return <div>{lastChanged$.get()}</div>;
}

Scope

import { createLastChanged, observable } from "@usels/web";

function Component() {
  "use scope"
  const count$ = observable(0);
  const { timestamp$ } = createLastChanged(count$);

  return <div>{timestamp$.get()}</div>;
}

initialValue — custom initial timestamp

Hook

import { useLastChanged, useObservable } from "@usels/web";

function Component() {
  const count$ = useObservable(0);
  // Start with a known timestamp instead of null
  const lastChanged$ = useLastChanged(count$, Date.now());
}

Scope

import { createLastChanged, observable } from "@usels/web";

function Component() {
  "use scope"
  const count$ = observable(0);
  const { timestamp$ } = createLastChanged(count$, Date.now());
}

Type

Parameters

Parameter	Type	Description
source$	Observable<T>	- Observable source value to watch.
options	LastChangedOptions (optional)	- Configuration options.

LastChangedOptions

Option	Type	Default	Description
initialValue	number | null	null	Initial timestamp value.

Returns

ReadonlyObservable<number \| null>

Observable reflecting the last-changed timestamp.

Source

View on GitHub