`useMetricsIds`

The useMetricsIds hook is used to retrieve the Ids of all the named Metrics objects present in the current Provider component context.

useMetricsIds(): Ids

returns

returns	`Ids`	A list of the `Ids` in the context.

Ids

A list of the Ids in the context.

Example

This example adds two named Metrics objects to a Provider context and an inner component accesses their Ids.

import React from 'react';
import {createRoot} from 'react-dom/client';
import {createMetrics, createStore} from 'tinybase';
import {
  Provider,
  useCreateMetrics,
  useCreateStore,
  useMetricsIds,
} from 'tinybase/ui-react';

const App = () => {
  const store1 = useCreateStore(createStore);
  const metrics1 = useCreateMetrics(store1, createMetrics);
  const store2 = useCreateStore(createStore);
  const metrics2 = useCreateMetrics(store2, createMetrics);
  return (
    <Provider metricsById={{metrics1, metrics2}}>
      <Pane />
    </Provider>
  );
};
const Pane = () => <span>{JSON.stringify(useMetricsIds())}</span>;

const app = document.createElement('div');
createRoot(app).render(<App />);
console.log(app.innerHTML);
// -> '<span>["metrics1","metrics2"]</span>'

Since

v4.1.0