Hiyve Components - v1.0.0
    Preparing search index...

    Function useSavedDevices

    • Hook to load and manage saved device selections.

      Parameters

      • storageKey: string = DEFAULT_DEVICE_STORAGE_KEY

        The localStorage key to use (default: 'hiyve-selected-devices')

      Returns {
          clearDevices: () => void;
          devices: SelectedDevices;
          isLoaded: boolean;
          updateDevices: (devices: SelectedDevices) => void;
      }

      Object containing saved devices and utility functions

      • clearDevices: () => void

        Clear all saved device selections

      • devices: SelectedDevices

        Currently saved device selections

      • isLoaded: boolean

        Whether the hook has finished loading from localStorage

      • updateDevices: (devices: SelectedDevices) => void

        Update and persist device selections

      This hook provides access to persisted device selections without rendering a DeviceSelector or DevicePreview component. It's useful for:

      • Pre-populating device selections when connecting to a room
      • Reading saved preferences in other parts of your application
      • Managing device state at a higher level in your component tree

      Basic usage - load saved devices for HiyveProvider:

      import { useSavedDevices } from '@hiyve/react-ui';
      import { HiyveProvider } from '@hiyve/react';

      function App() {
        const { devices } = useSavedDevices();

        return (
          <HiyveProvider
            initialVideoDeviceId={devices.videoInput}
            initialAudioDeviceId={devices.audioInput}
          >
            <VideoRoom />
          </HiyveProvider>
        );
      }

      With custom storage key:

      const { devices, updateDevices, clearDevices } = useSavedDevices('my-app-devices');

      // Update saved devices programmatically
      updateDevices({ videoInput: 'new-camera-id' });

      // Clear all saved devices
      clearDevices();

    Settings

    Member Visibility