"use client"
 
import { useBattery } from "@/hooks/use-battery"
 
import Battery from "./Battery"
 
export function Component() {
  const { loading, level, charging, chargingTime, dischargingTime } =
    useBattery()
 
  return (
    <div>
      <h1>useBattery</h1>
      {loading ? (
        <p>Loading...</p>
      ) : (
        <div>
          <h2>Level: {level}</h2>
          <h2>Charging: {charging ? "Yes" : "No"}</h2>
          <h2>Charging time: {chargingTime}</h2>
          <h2>Discharging time: {dischargingTime}</h2>
        </div>
      )}
    </div>
  )
}