"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.LegendContainer = void 0;
var tslib_1 = require("tslib");
var React = tslib_1.__importStar(require("react"));
var legend_1 = require("../components/legend");
var i18n_1 = require("../api/i18n");
var hooks_1 = require("./hooks");
var map_1 = require("../actions/map");
var legend_2 = require("../actions/legend");
var hooks_mapguide_1 = require("./hooks-mapguide");
var context_1 = require("../components/map-providers/context");
var context_2 = require("../components/context");
var LegendContainer = function (props) {
    /**
     * TODO: Although we've nailed down the majority of excessive re-renders on un-related events, there are still one case
     * where it should not re-render but currently does: Panning
     *
     * Panning does not alter zoom/scale or layer/group structure, things that the Legend does not care about, so what is it?
     * Another mis-behaving hook? Something else?
     */
    var maxHeight = props.maxHeight, inlineBaseLayerSwitcher = props.inlineBaseLayerSwitcher;
    var dispatch = (0, context_1.useReduxDispatch)();
    var activeMapName = (0, hooks_1.useActiveMapName)();
    var locale = (0, hooks_1.useViewerLocale)();
    var map = (0, hooks_mapguide_1.useActiveMapState)();
    var view = (0, hooks_1.useActiveMapView)();
    var showGroups = (0, hooks_mapguide_1.useActiveMapShowGroups)();
    var showLayers = (0, hooks_mapguide_1.useActiveMapShowLayers)();
    var hideGroups = (0, hooks_mapguide_1.useActiveMapHideGroups)();
    var hideLayers = (0, hooks_mapguide_1.useActiveMapHideLayers)();
    var expandedGroups = (0, hooks_mapguide_1.useActiveMapExpandedGroups)();
    var selectableLayers = (0, hooks_mapguide_1.useActiveMapSelectableLayers)();
    var externalBaseLayers = (0, hooks_1.useActiveMapExternalBaseLayers)();
    var stateless = (0, hooks_1.useViewerIsStateless)();
    var appContext = React.useContext(context_2.AppContext);
    var setBaseLayerAction = React.useCallback(function (mapName, layerName) { return dispatch((0, map_1.setBaseLayer)(mapName, layerName)); }, [dispatch]);
    var setGroupVisibilityAction = React.useCallback(function (mapName, options) { return dispatch((0, legend_2.setGroupVisibility)(mapName, options)); }, [dispatch]);
    var setLayerVisibilityAction = React.useCallback(function (mapName, options) { return dispatch((0, legend_2.setLayerVisibility)(mapName, options)); }, [dispatch]);
    var setLayerSelectableAction = React.useCallback(function (mapName, options) { return dispatch((0, legend_2.setLayerSelectable)(mapName, options)); }, [dispatch]);
    var setGroupExpandedAction = React.useCallback(function (mapName, options) { return dispatch((0, legend_2.setGroupExpanded)(mapName, options)); }, [dispatch]);
    var layers = (0, hooks_1.useActiveMapLayers)();
    var onLayerSelectabilityChanged = React.useCallback(function (id, selectable) {
        if (activeMapName) {
            setLayerSelectableAction === null || setLayerSelectableAction === void 0 ? void 0 : setLayerSelectableAction(activeMapName, { id: id, value: selectable });
        }
    }, [setLayerSelectableAction]);
    var onGroupExpansionChanged = React.useCallback(function (id, expanded) {
        if (setGroupExpandedAction && activeMapName) {
            setGroupExpandedAction(activeMapName, { id: id, value: expanded });
        }
    }, [setGroupExpandedAction]);
    var onGroupVisibilityChanged = React.useCallback(function (groupId, visible) {
        if (setGroupVisibilityAction && activeMapName) {
            setGroupVisibilityAction(activeMapName, { id: groupId, value: visible });
        }
    }, [setGroupVisibilityAction]);
    var onLayerVisibilityChanged = React.useCallback(function (layerId, visible) {
        if (setLayerVisibilityAction && activeMapName) {
            setLayerVisibilityAction(activeMapName, { id: layerId, value: visible });
        }
    }, [setLayerVisibilityAction]);
    var onBaseLayerChanged = React.useCallback(function (layerName) {
        if (setBaseLayerAction && activeMapName) {
            setBaseLayerAction(activeMapName, layerName);
        }
    }, [setBaseLayerAction]);
    if ((map || layers) && view) {
        var scale = view.scale;
        if (scale || layers) {
            return React.createElement(legend_1.Legend, { map: map, activeMapName: activeMapName, stateless: stateless, maxHeight: maxHeight, currentScale: scale, externalLayers: layers, showLayers: showLayers, showGroups: showGroups, hideLayers: hideLayers, hideGroups: hideGroups, locale: locale, inlineBaseLayerSwitcher: !!inlineBaseLayerSwitcher, externalBaseLayers: externalBaseLayers, onBaseLayerChanged: onBaseLayerChanged, overrideSelectableLayers: selectableLayers, overrideExpandedItems: expandedGroups, onLayerSelectabilityChanged: onLayerSelectabilityChanged, onGroupExpansionChanged: onGroupExpansionChanged, onGroupVisibilityChanged: onGroupVisibilityChanged, onLayerVisibilityChanged: onLayerVisibilityChanged, provideExtraLayerIconsHtml: appContext.getLegendLayerExtraIconsProvider, provideExtraGroupIconsHtml: appContext.getLegendGroupExtraIconsProvider });
        }
        else {
            return React.createElement("div", null, (0, i18n_1.tr)("LOADING_MSG", locale));
        }
    }
    else {
        return React.createElement("div", null, (0, i18n_1.tr)("LOADING_MSG", locale));
    }
};
exports.LegendContainer = LegendContainer;
//# sourceMappingURL=legend.js.map