rerge branch 'main' of https://github.com/UW-Macrostrat/web

* 'main' of https://github.com/UW-Macrostrat/web:
  Moved correlation diagram to within columns section
  Small changes
  Remove legacy column files

package.json

@@ -127,9 +127,9 @@
     "jose": "^5.1.2",
     "mapbox-gl": "^2.15.0",
     "new-github-issue-url": "^1.0.0",
-    "react": "^18.2.0",
+    "react": "^18.3.0",
     "react-cookie": "^3.0.4",
-    "react-dom": "^18.2.0",
+    "react-dom": "^18.3.0",
     "react-intersection-observer": "^9.4.3",
     "react-redux": "^7.2.0",
     "react-router": "^6.8.2",

src/components/page-header.ts

@@ -1,7 +1,8 @@
 import hyper from "@macrostrat/hyper";
 import { MacrostratIcon } from "./macrostrat-icon";
-import { Link } from "./buttons";
+import { DevLinkButton, Link } from "./buttons";
 import styles from "./icon.module.sass";
+import { AnchorButton, ButtonGroup } from "@blueprintjs/core";
 
 const h = hyper.styled(styles);
 
@@ -49,3 +50,9 @@ export function Icon(props) {
     children,
   ]);
 }
+
+export function AssistantLinks({ children }) {
+  return h("div.float-right.padding.stick-to-top", [
+    h(ButtonGroup, { vertical: true, large: true }, [children]),
+  ]);
+}

src/components/unit-details/main.module.sass

@@ -24,6 +24,12 @@
   display: flex
   justify-content: space-between
   gap: 1em
+  border-bottom: 1px solid var(--panel-rule-color)
+  position: sticky
+  top: -1em
+  background-color: var(--panel-secondary-background-color)
+  margin: -1em -1em 0
+  padding: 0.5em 1em
   code
     font-size: 0.9em
     color: var(--secondary-color)

src/pages/columns/+Page.ts

@@ -1,13 +1,17 @@
 import h from "@macrostrat/hyper";
 import { ContentPage } from "~/layouts";
-import { PageHeader, Link } from "~/components";
-import { Tag } from "@blueprintjs/core";
+import { PageHeader, Link, AssistantLinks, DevLinkButton } from "~/components";
+import { AnchorButton, Tag } from "@blueprintjs/core";
 import { usePageProps } from "~/renderer";
 
 export function Page() {
   const { columnGroups, title, linkPrefix } = usePageProps();
 
   return h(ContentPage, [
+    h(AssistantLinks, [
+      h(AnchorButton, { href: "/projects", minimal: true }, "Projects"),
+      h(DevLinkButton, { href: "/columns/correlation" }, "Correlation chart"),
+    ]),
     h(PageHeader, { title }),
     columnGroups.map((d) => h(ColumnGroup, { data: d, key: d.id, linkPrefix })),
   ]);

src/pages/columns/@column/+onBeforeRender.ts

@@ -59,6 +59,10 @@ export async function onBeforeRender(pageContext) {
         linkPrefix,
         project: projectData?.[0],
       },
+      documentProps: {
+        // The page's <title>
+        title: columnInfo.col_name,
+      },
     },
   };
 }

src/pages/correlation/columns/column-renderer-demo.ts → src/pages/columns/@column/__archive/column-renderer-demo.ts

@@ -1,11 +1,13 @@
 $(document).ready(function () {
   /*
-        ISSUES TO SOLVE
-        -some formations, have themselves as the fisrt 'member', but aren't labeled as members in the db.   see #495
-        -some formations are ordered wrong. this breaks the UnMergedColun function (because it uses filter)
+  Macrostrat's first strat column renderer, by Lance Weaver
 
-        -UNCONFORMITIES need to be in the db, and displayed with a wavy or dashed line and note!
-        -fossils, unconforms, and other notes need to be added to db, and displayed in borderless column on right
+  ISSUES TO SOLVE
+  -some formations, have themselves as the fisrt 'member', but aren't labeled as members in the db.   see #495
+  -some formations are ordered wrong. this breaks the UnMergedColun function (because it uses filter)
+
+  -UNCONFORMITIES need to be in the db, and displayed with a wavy or dashed line and note!
+  -fossils, unconforms, and other notes need to be added to db, and displayed in borderless column on right
 
     */
 
@@ -105,7 +107,7 @@ $(document).ready(function () {
       createUnmergedColumn(unit, n);
     });
     mergeHtmlCells();
-    /* 
+    /*
      // because the api json data is so unpredictable, this option is problematic
         data = getRowSpans(data); // prep the data by calculating rowspan values for the html table
         $.each(data, function( n,unit ) {

src/pages/correlation/+Page.ts → src/pages/columns/correlation/+Page.ts

@@ -23,12 +23,11 @@ import classNames from "classnames";
 import { CorrelationChart } from "./correlation-chart";
 import { DarkModeProvider } from "@macrostrat/ui-components";
 import { ErrorBoundary } from "@macrostrat/ui-components";
-import { columnGeoJSONRecordToColumnIdentifier } from "./state";
 import {
   UnitSelectionProvider,
   useSelectedUnit,
 } from "@macrostrat/column-views";
-import { UnitDescription } from "~/pages/correlation/column";
+import { UnitDescription } from "~/pages/columns/correlation/column";
 
 export function Page() {
   const startup = useCorrelationDiagramStore((state) => state.startup);

src/pages/correlation/+config.ts → src/pages/columns/correlation/+config.ts

@@ -10,5 +10,5 @@ export default {
       },
     },
   },
-  title: "Correlation diagram",
+  title: "Correlation chart",
 };

src/pages/correlation/column.module.scss → src/pages/columns/correlation/column.module.scss

@@ -1,7 +1,8 @@
-.column-container :global {
+.column-container {
   --background-color: var(--column-background-color, #fff);
   --stroke-color: var(--column-stroke-color, #000);
 }
+
 .column-container :global .column {
   display: flex;
   flex-direction: row;
@@ -93,7 +94,8 @@
 .column-container.dark-mode :global .timescale {
   color: #000;
 }
-.column-container.dark-mode :global g.inner pattern image {
+
+.column-container.dark-mode :global g.lithology-column pattern image {
   filter: invert(80%);
 }
 

src/pages/correlation/column.ts → src/pages/columns/correlation/column.ts

@@ -5,7 +5,7 @@ import {
   useColumn,
 } from "@macrostrat/column-components";
 import { Timescale, TimescaleOrientation } from "@macrostrat/timescale";
-import { JSONView, useDarkMode } from "@macrostrat/ui-components";
+import { useDarkMode } from "@macrostrat/ui-components";
 import classNames from "classnames";
 import { useContext, useEffect, useMemo, useRef } from "react";
 import { AgeAxis, useSelectedUnit } from "@macrostrat/column-views";
@@ -25,7 +25,7 @@ import {
   LegendPanelHeader,
   UnitDetailsPopover,
 } from "~/components/unit-details";
-import { useCorrelationDiagramStore } from "~/pages/correlation/state";
+import { useCorrelationDiagramStore } from "~/pages/columns/correlation/state";
 
 export function MacrostratColumnProvider(props) {
   // A column provider specialized the Macrostrat API

src/pages/correlation/correlation-chart.ts → src/pages/columns/correlation/correlation-chart.ts

@@ -9,7 +9,7 @@ import { UnitLong } from "@macrostrat/api-types";
 import { GapBoundPackage, SectionRenderData, AgeComparable } from "./types";
 
 import h from "./main.module.sass";
-import { useCorrelationDiagramStore } from "~/pages/correlation/state";
+import { useCorrelationDiagramStore } from "~/pages/columns/correlation/state";
 
 export interface ColumnIdentifier {
   col_id: number;