import React, { useMemo } from "react";
import { useTranslation } from "react-i18next";
import * as styles from "./styles";
import { Body } from "./Body";
import { NoDataContent } from "~/components/NoDataContent";
import { useNeighborhoodSchools } from "~/sdks/NeighborhoodSchools/context";
const baseHeaders = {
    CAN: ["name", "type", "languages", "levels", "address"],
    USA: ["name", "type", "levels", "address"],
};
export const SchoolsTable = ({ schools }) => {
    const { t } = useTranslation("neighborhoodSchools");
    const { isLoading, hasCategories, location } = useNeighborhoodSchools();
    const headers = useMemo(() => {
        if (isLoading) {
            // defaulting to USA, to avoid an empty column
            return baseHeaders.USA;
        }
        if ((location === null || location === void 0 ? void 0 : location.country) === "USA" && hasCategories) {
            const usaHeaders = [...baseHeaders.USA];
            if (!usaHeaders.includes("category")) {
                usaHeaders.splice(usaHeaders.length - 1, 0, "category");
            }
            return usaHeaders;
        }
        return baseHeaders[location.country];
    }, [isLoading, location, hasCategories]);
    return (React.createElement("div", { className: styles.container, "data-is-loading": isLoading },
        !isLoading && (React.createElement("table", { className: styles.table },
            React.createElement("thead", null,
                React.createElement("tr", null, headers &&
                    headers.map((header) => (React.createElement("th", { key: header, className: styles.header },
                        React.createElement("h2", null, t(`headers.${header}`))))))),
            React.createElement("tbody", null,
                schools && (schools === null || schools === void 0 ? void 0 : schools.length) > 0 && (React.createElement(Body, { schools: schools, headers: headers })),
                (schools === null || schools === void 0 ? void 0 : schools.length) === 0 && (React.createElement("div", { className: styles.blankFilter },
                    React.createElement(NoDataContent, { text: t("noFilteredData") })))))),
        !isLoading && !schools && React.createElement(NoDataContent, { text: t("noData") })));
};
//# sourceMappingURL=index.js.map