import React, { Suspense, useEffect, useMemo, useState } from 'react';
import GlobeScene from './GlobeScene';
import { GestureHandlerRootView } from '../../modules/gesture';
export default function GlobeView({ currentLocation, locations, type, isVisible, showBeams, theme, }) {
    const offsetView = useMemo(() => [0, 0, -1.3], // [0.3, -0.0, 0]
    []);
    const [beams, setBeams] = useState([]);
    useEffect(() => {
        const isSender = type === 'send';
        if (locations) {
            const beamsEls = locations.map(destination => ({
                start: isSender ? currentLocation : destination,
                end: isSender ? destination : currentLocation,
            }));
            setBeams(beamsEls);
        }
        return () => {
            setBeams([]);
        };
    }, [currentLocation, locations, type]);
    return (
    // eslint-disable-next-line react-native/no-inline-styles
    React.createElement(GestureHandlerRootView, { style: { flex: 1 } },
        React.createElement(Suspense, { fallback: null },
            React.createElement(GlobeScene, { locations: locations, currentLocation: currentLocation, offsetView: offsetView, beams: beams, showBeams: showBeams, isSender: type === 'send', isVisible: isVisible, theme: theme }))));
}
