import React, { ReactNode } from 'react';
import { CallProvider, useCallService } from './useCall';
import { CallOverlay } from './CallOverlay';
import { IncomingCallNotification } from './IncomingCallNotification';

interface CallProviderWrapperProps {
  children: ReactNode;
}

/**
 * Wrapper component that initializes the call service and provides it to children
 * Also renders the CallOverlay for active call controls and monitors incoming calls
 */
export function CallProviderWrapper({ children }: CallProviderWrapperProps) {
  const callContextValue = useCallService();

  return (
    <CallProvider value={callContextValue}>
      {children}
      <CallOverlay />
      <IncomingCallNotification />
    </CallProvider>
  );
}
