useBattery

Track the battery status of a user’s device with useBattery.

Install:

npm i @uidotdev/usehooks

Description:

The useBattery hook is useful for accessing and monitoring the battery status of the user’s device in a React application. By using this hook, you can easily retrieve information such as the battery level, charging status, and estimated charging and discharging times. It provides a state object that includes properties like supported, loading, level, charging, chargingTime, and dischargingTime.

Return Values

The hook returns an object containing the following properties:

NameTypeDescription
supportedbooleanIndicates whether the Battery Status API is supported in the user’s browser.
loadingbooleanIndicates if the battery information is still loading.
levelnumberRepresents the level of the system’s battery. 0.0 means that the system’s battery is completely discharged, and 1.0 means the battery is completely charged.
chargingbooleanRepresents whether the system’s battery is charging. true means the battery is charging, false means it’s not.
chargingTimenumberRepresents the time remaining in seconds until the system’s battery is fully charged.
dischargingTimenumberRepresents the time remaining in seconds until the system’s battery is completely discharged and the system is about to be suspended.

Demo:

Example:

More Hooks:

Sort: