Skip to main content

useSignalStrength

This hook returns the device's current signal strength, in bars from 0 (no signal) to 4 (full).

Import​

import { useSignalStrength } from "~lib/device-information";

It is also published on its own, as ~lib/device-information/use-signal-strength.

API​

const signalStrength = useSignalStrength();

Parameters​

This hook takes no parameters.

Return Value​

NameTypeDescription
signalStrengthnumberThe device's signal, from 0 (none) to 4 (full)

Example​

signalIconName turns the strength into the matching bars, so a widget never chooses the steps itself.

import { useSignalStrength } from "~lib/device-information";
import { Icon, signalIconName } from "~lib/icon";
import { Paragraph } from "~lib/typography";

const Widget = () => {
  const signalStrength = useSignalStrength();

  return (
    <div className="flex size-full items-center justify-center gap-2">
      <Icon name={signalIconName(signalStrength)} size={32} />
      <Paragraph size="lg">{signalStrength} of 4 bars</Paragraph>
    </div>
  );
};

See Also​