# Device Disconnection Notification

The SDK emits a `device.disconnected` event when a selected camera or microphone disappears from the browser's device list. Subscribe to this event to show a notification and help users recover quickly, for example by prompting them to reconnect the device or choose another input.

Browser `devicechange` behavior varies across browsers and operating systems, so treat this event as a signal rather than a guaranteed hardware truth.

## Event data

The `device.disconnected` event contains the following properties:

| Property   | Type                | Description                                                                           |
| ---------- | ------------------- | ------------------------------------------------------------------------------------- |
| `deviceId` | `string`            | The disconnected device ID                                                            |
| `label`    | `string?`           | The human-readable label of the disconnected device                                   |
| `kind`     | `MediaDeviceKind`   | The kind of device: `audioinput`, `audiooutput`, or `videoinput`                      |
| `status`   | `InputDeviceStatus` | The device status at the time of disconnection: `enabled`, `disabled`, or `undefined` |
| `call_cid` | `string`            | The call CID associated with the event                                                |

## Custom implementation

Subscribe to `device.disconnected` on the current call and show a warning:

```tsx
import { useEffect, useState } from "react";
import { useCall } from "@stream-io/video-react-sdk";

export const DeviceDisconnectedNotification = () => {
  const call = useCall();
  const [showWarning, setShowWarning] = useState(false);

  useEffect(() => {
    if (!call) return;

    return call.on("device.disconnected", () => {
      setShowWarning(true);
    });
  }, [call]);

  if (!showWarning) return null;

  return (
    <div className="device-warning">
      <span>A device was disconnected. Please check your setup.</span>
      <button onClick={() => setShowWarning(false)}>Dismiss</button>
    </div>
  );
};
```

![Disconnected device](https://getstream.io/docs-assets/images/d883e7fe9ef0.png)

---

For the most recent version of this documentation, visit [https://getstream.io/video/docs/react/v2/ui-cookbook/device-disconnection-notification/](https://getstream.io/video/docs/react/v2/ui-cookbook/device-disconnection-notification/).