import React, { useMemo } from "react";
import { LocalLogicMap } from "@local-logic/maps";
import { useLocalContent } from "~/sdks/LocalContent/context";
import { DIRECTIONS_PATH_COLOR } from "~/sdks/LocalContent/constants";
export function Layers() {
    const { activeCategoryData, activeMarkerDetails, commuteData } = useLocalContent();
    const schoolLayerSources = useMemo(() => {
        var _a;
        const activeSchoolMarkerDetails = activeMarkerDetails;
        if (typeof (activeSchoolMarkerDetails === null || activeSchoolMarkerDetails === void 0 ? void 0 : activeSchoolMarkerDetails.catchments) === "undefined" ||
            ((_a = activeSchoolMarkerDetails.catchments) === null || _a === void 0 ? void 0 : _a.length) === 0) {
            return undefined;
        }
        const sources = [];
        activeSchoolMarkerDetails.catchments.forEach((catchment, catchmentIndex) => {
            if (typeof catchment.geometry !== "undefined" &&
                catchment.geometry.length > 0) {
                catchment.geometry.forEach((geometry, geomIndex) => {
                    var _a, _b;
                    sources.push({
                        key: `school-catchment-${catchmentIndex}-geom-${geomIndex}`,
                        layer: [
                            {
                                type: "fill",
                                color: ((_a = activeCategoryData === null || activeCategoryData === void 0 ? void 0 : activeCategoryData.colors) === null || _a === void 0 ? void 0 : _a.fill) || "#008491",
                            },
                            {
                                type: "line",
                                color: ((_b = activeCategoryData === null || activeCategoryData === void 0 ? void 0 : activeCategoryData.colors) === null || _b === void 0 ? void 0 : _b.fill) || "#008491",
                            },
                        ],
                        geometry: [geometry],
                    });
                });
            }
        });
        return sources;
    }, [activeMarkerDetails, activeCategoryData]);
    const routeSources = useMemo(() => {
        var _a;
        if (!commuteData ||
            typeof commuteData.geometry === "undefined" ||
            ((_a = commuteData.geometry) === null || _a === void 0 ? void 0 : _a.length) === 0) {
            return undefined;
        }
        const sources = [];
        sources.push({
            key: "commute-route",
            type: "LineString",
            layer: [
                {
                    type: "line",
                    color: DIRECTIONS_PATH_COLOR,
                },
            ],
            geometry: commuteData.geometry,
        });
        return sources;
    }, [commuteData, activeCategoryData]);
    return (React.createElement(React.Fragment, null,
        React.createElement(LocalLogicMap.Layers, { sources: schoolLayerSources }),
        React.createElement(LocalLogicMap.Layers, { sources: routeSources })));
}
//# sourceMappingURL=index.js.map