@seasketch/geoprocessing
Version:
Geoprocessing and reporting framework for SeaSketch 2.0
106 lines (103 loc) • 5.15 kB
JavaScript
import React from "react";
import { iucnActivities, iucnActivityCategories, iucnCategoriesList, fullColor, highColor, } from "../../iucn/index.js";
import { styled } from "styled-components";
import { useTranslation } from "react-i18next";
const MatrixStyled = styled.div `
td,
th {
padding: 5px 6px;
}
tr > :nth-child(n + 2) {
text-align: center;
}
td {
border: 1px solid #999;
}
table {
border-collapse: collapse;
}
.full {
background-color: ${fullColor};
}
.high {
background-color: ${highColor};
}
.yes,
.yesbut,
.variable {
background-color: #ddd;
}
`;
export const IucnMatrix = () => {
const { t } = useTranslation();
const iucnActivityLabels = {
RESEARCH_NE: t("IUCN activity - research", "Research: non-extractive"),
TRAD_USE_NE: t("IUCN activity - traditional use", "Traditional use: non-extractive"),
RESTORE_CON: t("IUCN activity - restoration", "Restoration/enhancement for conservation"),
TRAD_FISH_COLLECT: t("IUCN activity - traditional fishing", "Traditional fishing/collection"),
RECREATE_NE: t("IUCN activity - non-extractive", "Non-extractive recreation"),
TOURISM: t("IUCN activity - tourism", "Large scale high intensity tourism"),
SHIPPING: t("IUCN activity - shipping", "Shipping"),
RESEARCH: t("IUCN activity - research extractive", "Research: extractive"),
RENEWABLE_ENERGY: t("IUCN activity - renewable", "Renewable energy generation"),
RESTORE_OTH: t("IUCN activity - restoration", "Restoration/enhancement for other reasons"),
FISH_COLLECT_REC: t("IUCN activity - fishing sustainable", "Fishing/collection: recreational (sustainable)"),
FISH_COLLECT_LOCAL: t("IUCN activity - local fishing", "Fishing/collection: local fishing (sustainable)"),
FISH_AQUA_INDUSTRIAL: t("IUCN activity - industrial fishing", "Industrial fishing, industrial scale aquaculture"),
AQUA_SMALL: t("IUCN activity - aquaculture", "Aquaculture - small scale"),
WORKS: t("IUCN activity - works", "Works (harbors, ports, dredging)"),
UNTREATED_WATER: t("IUCN activity - untreated water", "Untreated water discharge"),
MINING_OIL_GAS: t("IUCN activity - extraction", "Mining, oil and gas extraction"),
HABITATION: t("IUCN activity - habitation", "Habitation"),
};
const activityRanks = {
no: {
id: "no",
desc: t("IUCN rank - no description", "No"),
display: t("IUCN rank - shorthand label for no", "N"),
},
nobut: {
id: "nobut",
desc: t("IUCN rank - special no description", "Generally no, a strong prerogative against unless special circumstances apply"),
display: `${t("IUCN rank - shorthand label for no, with extra meaning", "N*")}`,
},
yes: {
id: "yes",
desc: t("IUCN rank - yes description", "Yes"),
display: t("IUCN rank - shorthand label for yes", "Y"),
},
yesbut: {
id: "yesbut",
desc: t("IUCN rank - special yes description", "Yes because no alternative exists, but special approval is essential"),
display: `${t("IUCN rank - shorthand label for yes, with extra meaning", "Y*")}`,
},
variable: {
id: "variable",
desc: t("IUCN rank - special 'variable' description", "Variable; depends on whether this activity can be managed in such a way that it is compatible with the MPA’s objectives"),
display: "*",
},
};
console.log(activityRanks);
return (React.createElement(MatrixStyled, null,
React.createElement("table", null,
React.createElement("thead", null,
React.createElement("tr", null,
React.createElement("th", null),
React.createElement("th", { className: "full", colSpan: 4 }, t("Full protection level label", "Full")),
React.createElement("th", { className: "high", colSpan: 3 }, t("High protection level label", "High"))),
React.createElement("tr", null,
React.createElement("th", null, t("Activity")),
Object.keys(iucnCategoriesList)
.sort()
.map((cat, index) => (React.createElement("th", { key: index, className: iucnCategoriesList[cat].level }, iucnCategoriesList[cat].category))))),
React.createElement("tbody", null, Object.values(iucnActivities).map((act, index) => {
return (React.createElement("tr", { key: index },
React.createElement("td", null, iucnActivityLabels[act.id]),
iucnActivityCategories[act.id].map((rank, index) => {
/* i18next-extract-disable-next-line */
const display = t(activityRanks[rank].display);
return (React.createElement("td", { key: index, className: rank }, display));
})));
})))));
};
//# sourceMappingURL=IucnMatrix.js.map