export const LocalCameraSwitcherExample:()

in packages/storybook8/stories/Components/VideoGallery/snippets/LocalCameraSwitcher.snippet.tsx [18:100]
77 lines of code
3 McCabe index (conditional complexity)

export const LocalCameraSwitcherExample: () => JSX.Element = () => {
  registerIcons({
    icons: {
      LocalCameraSwitch: <CameraSwitch24Regular />
    }
  });

  const [cameraState, setCameraState] = useState<number>(0);

  const cameraButtonProps = {
    cameras: [
      {
        id: '1',
        name: 'camera 1'
      },
      {
        id: '2',
        name: 'camera 2'
      }
    ],
    selectedCamera: {
      id: '1',
      name: 'camera 1'
    },
    onSelectCamera: (): Promise<void> => {
      return new Promise(() => {
        console.log('switch Camera');
        if (cameraState === 0) {
          setCameraState(1);
          mockVideoElement.style.background = 'url(https://media.giphy.com/media/mokQK7oyiR8Sk/giphy.gif)';
          mockVideoElement.style.backgroundPosition = 'center';
        } else if (cameraState === 1) {
          setCameraState(0);
          mockVideoElement.style.background = 'url(https://media.giphy.com/media/4Zo41lhzKt6iZ8xff9/giphy.gif)';
        }
      });
    }
  };

  const MockLocalParticipant = {
    userId: 'user1',
    displayName: 'You',
    state: 'Connected',
    isMuted: true,
    videoStream: {
      available: true,
      renderElement: mockVideoElement
    }
  };

  const MockRemoteParticipants = [
    {
      userId: 'user2',
      displayName: 'Peter Parker'
    },
    {
      userId: 'user3',
      displayName: 'Thor'
    },
    {
      userId: 'user4',
      displayName: 'Matthew Murdock'
    },
    {
      userId: 'user5',
      displayName: 'Bruce Wayne'
    }
  ];

  const containerStyle = { height: '50vh' };

  return (
    <Stack style={containerStyle}>
      <VideoGallery
        layout="floatingLocalVideo"
        localParticipant={MockLocalParticipant}
        remoteParticipants={MockRemoteParticipants}
        showCameraSwitcherInLocalPreview={true}
        localVideoCameraCycleButtonProps={cameraButtonProps}
      />
    </Stack>
  );
};