Add mappign to intervals, liths, and strat concepts

Author: davidsklar99

pages/lex/intervals/@id/+Page.client.ts

@@ -25,7 +25,8 @@ export function Page() {
     h(ColumnsTable, {
       resData,
       colData,
-      fossilsData
+      fossilsData,
+      mapUrl: "intervals=" + id
     }),
     h(Charts, { features }),
     h(PrevalentTaxa, { taxaData }),

pages/lex/lithologies/@id/+Page.client.ts

@@ -27,7 +27,8 @@ export function Page() {
     h(ColumnsTable, {
       resData,
       colData,
-      fossilsData
+      fossilsData,
+      mapUrl: "lithologies=" + id
     }),
     h(Charts, { features }),
     h(PrevalentTaxa, { taxaData }),

pages/lex/strat-concepts/@id/+Page.client.ts

@@ -33,7 +33,8 @@ export function Page() {
     h(ColumnsTable, {
       resData,
       colData,
-      fossilsData
+      fossilsData,
+      mapUrl: "strat_name_concept=" + id 
     }),
     h(Charts, { features }),
     h(PrevalentTaxa, { taxaData }),

pages/lex/strat-names/@id/+Page.client.ts

@@ -30,7 +30,7 @@ export function Page() {
     h(ColumnsTable, {
       resData,
       colData,
-      fossilsData
+      fossilsData,
     }),
     h(Charts, { features }),
     h(PrevalentTaxa, { taxaData }),

src/components/lex/index.ts

@@ -36,7 +36,7 @@ function ColumnMapContainer(props) {
     {
       load: () => import("./map.client").then((d) => d.ColumnsMapContainer),
       fallback: h("div.loading", "Loading map..."),
-      deps: [props.columns, props.projectID, props.fossilData, props.filters],
+      deps: [props.columns, props.projectID, props.fossilData, props.filters, props.mapUrl],
     },
     (component) => h(component, props)
   );
@@ -100,7 +100,7 @@ function LexItemPageInner(props: LexItemPageProps) {
   ]);
 }
 
-export function ColumnsTable({ resData, colData, fossilsData }) {
+export function ColumnsTable({ resData, colData, fossilsData, mapUrl }) {
   if (!colData || !colData.features || colData.features.length === 0) return;
   const summary = summarize(colData.features || []);
 
@@ -201,7 +201,7 @@ export function ColumnsTable({ resData, colData, fossilsData }) {
       columns: colData,
       className: "column-map-container",
       fossilsData,
-      lex: true
+      mapUrl,
     }),
   ]);
 }

src/components/lex/map.client.ts

@@ -15,6 +15,7 @@ import mapboxgl from "mapbox-gl"
 import { pbdbDomain, tileserverDomain } from "@macrostrat-web/settings";
 import { buildMacrostratStyle } from "@macrostrat/map-styles";
 import { getExpressionForFilters } from "./filter-helper";
+import { navigate } from "vike/client/router";
 
 const _macrostratStyle = buildMacrostratStyle({
   tileserverDomain,
@@ -35,9 +36,9 @@ function ColumnsMapInner({
   columnIDs = null,
   className = "map-container",
   columns = null,
-  lex = false,
   fossilsData = [],
   filters = [],
+  mapUrl = ""
 }) {
   const [showSatellite, setShowSatellite] = useState(true);
   const [showFossils, setShowFossils] = useState(false);
@@ -59,8 +60,10 @@ function ColumnsMapInner({
       setShowOutcrop(!showOutcrop);
     }
 
+    const map = "/map/layers#" + mapUrl
 
     return h('div.lex-controls', [
+      h.if(mapUrl !== "")('div.btn', { onClick: () => navigate(map) }, h(Icon, { icon: "map", className: 'icon' })),
       h.if(fossilsExist)('div.btn', { onClick: handleFossils }, h(Icon, { icon: "mountain", className: 'icon' })),
       h.if(filters.length > 0)('div.btn', { onClick: handleOutcrop }, h(Icon, { icon: "excavator", className: 'icon' })),
       h('div.btn', { onClick: handleSatellite }, h(Icon, { icon: "satellite", className: 'icon' })),