/* eslint-disable react/jsx-handler-names */
/* eslint-disable react/no-access-state-in-setstate */
/* eslint-disable camelcase */
/**
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 *   http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on an
 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied.  See the License for the
 * specific language governing permissions and limitations
 * under the License.
 */
import { memo, useCallback, useEffect, useRef, useState } from 'react';
import { isEqual } from 'lodash';
import { SupersetClient, usePrevious, } from '@superset-ui/core';
import { DeckGLContainerStyledWrapper, } from '../DeckGLContainer';
import { getExploreLongUrl } from '../utils/explore';
import layerGenerators from '../layers';
const DeckMulti = (props) => {
    const containerRef = useRef();
    const [viewport, setViewport] = useState();
    const [subSlicesLayers, setSubSlicesLayers] = useState({});
    const setTooltip = useCallback((tooltip) => {
        const { current } = containerRef;
        if (current) {
            current.setTooltip(tooltip);
        }
    }, []);
    const loadLayers = useCallback((formData, payload, viewport) => {
        setViewport(viewport);
        setSubSlicesLayers({});
        payload.data.slices.forEach((subslice) => {
            // Filters applied to multi_deck are passed down to underlying charts
            // note that dashboard contextual information (filter_immune_slices and such) aren't
            // taken into consideration here
            const filters = [
                ...(subslice.form_data.filters || []),
                ...(formData.filters || []),
                ...(formData.extra_filters || []),
            ];
            const subsliceCopy = {
                ...subslice,
                form_data: {
                    ...subslice.form_data,
                    filters,
                },
            };
            const url = getExploreLongUrl(subsliceCopy.form_data, 'json');
            if (url) {
                SupersetClient.get({
                    endpoint: url,
                })
                    .then(({ json }) => {
                    const layer = layerGenerators[subsliceCopy.form_data.viz_type](subsliceCopy.form_data, json, props.onAddFilter, setTooltip, props.datasource, [], props.onSelect);
                    setSubSlicesLayers(subSlicesLayers => ({
                        ...subSlicesLayers,
                        [subsliceCopy.slice_id]: layer,
                    }));
                })
                    .catch(() => { });
            }
        });
    }, [props.datasource, props.onAddFilter, props.onSelect, setTooltip]);
    const prevDeckSlices = usePrevious(props.formData.deck_slices);
    useEffect(() => {
        const { formData, payload } = props;
        const hasChanges = !isEqual(prevDeckSlices, formData.deck_slices);
        if (hasChanges) {
            loadLayers(formData, payload);
        }
    }, [loadLayers, prevDeckSlices, props]);
    const { payload, formData, setControlValue, height, width } = props;
    const layers = Object.values(subSlicesLayers);
    return (<DeckGLContainerStyledWrapper ref={containerRef} mapboxApiAccessToken={payload.data.mapboxApiKey} viewport={viewport || props.viewport} layers={layers} mapStyle={formData.mapbox_style} setControlValue={setControlValue} onViewportChange={setViewport} height={height} width={width}/>);
};
export default memo(DeckMulti);
//# sourceMappingURL=Multi.jsx.map