import React from 'react'
import { VroomUIBase } from '@/types/VroomUIBase'
import { VroomUIProvider } from "./VroomUI"
import {SdkStateGlobalContextProvider} from './SdkStateGlobal'

export type RootContext = VroomUIBase & {
  children: React.ReactNode;
};

export function RootProvider(props: RootContext): JSX.Element {
  const { children, ...initialProps } = props

  return (
    <VroomUIProvider initialProps={initialProps}>
      <SdkStateGlobalContextProvider
        initialProps={{
          stateAll: undefined,
          setStateAll: () => {},
          cameraList: [],
          setCameraList: () => [],
          currentCamera: undefined,
          setCurrentCamera: () => [],
          participants: [],
          setParticipants: () => [],
          attendees: [],
          setAttendees: () => [],
          publisherVideos: '',
          setPublisherVideos: () => {},
          publisherAudios: '',
          setPublisherAudios: () => {},
      }}
      >
        {children}
      </SdkStateGlobalContextProvider>
    </VroomUIProvider>
  );
}