Merge pull request #21 from UW-Macrostrat/separate-frontend-modules

Separate frontend modules
UW-Macrostrat · Feb 15, 2025 · b41a854 · b41a854
2 parents 516d197 + 445a6a3
commit b41a854
Show file tree

Hide file tree

Showing 18 changed files with 150 additions and 59 deletions.
diff --git a/frontend/packages/corelle/src/index.ts b/frontend/packages/corelle/src/index.ts
diff --git a/frontend/packages/demo-app/package.json b/frontend/packages/demo-app/package.json
@@ -18,7 +18,7 @@
   "prettier": {},
   "dependencies": {
     "@blueprintjs/core": "^5",
-    "@macrostrat/corelle": "workspace:^",
+    "@corelle/svg-map-layers": "workspace:^",
     "@macrostrat/hyper": "^3.0.6",
     "@macrostrat/svg-map-components": "^1.0.2",
     "@macrostrat/ui-components": "^4.1.0",

diff --git a/frontend/packages/demo-app/src/app.ts b/frontend/packages/demo-app/src/app.ts
@@ -2,7 +2,7 @@ import { useState, useContext, useEffect, useCallback } from "react";
 import { WorldMap } from "./world-map";
 import ControlPanel from "./control-panel";
 import h from "@macrostrat/hyper";
-import { RotationsProvider } from "@macrostrat/corelle";
+import { RotationsProvider } from "@corelle/svg-map-layers";
 import { MapSettingsProvider } from "./map-settings";
 import { Spinner } from "@blueprintjs/core";
 import {
@@ -13,7 +13,7 @@ import {
   getQueryString,
 } from "@macrostrat/ui-components";
 
-import "./app.styl"
+import "./app.styl";
 
 const qs = getQueryString();
 
@@ -31,16 +31,16 @@ function App(props) {
 
   const setTime = useCallback(
     (time) => setState({ ...state, time }),
-    [setState]
+    [setState],
   );
   const setModel = useCallback(
     (model) => setState({ ...state, model }),
-    [setState]
+    [setState],
   );
 
   const { baseURL } = useContext(APIContext);
   const models = useAPIResult<string[]>("/model", null, (data: any) =>
-    data.map((d) => d.name)
+    data.map((d) => d.name),
   );
   const featureDatasets = useAPIResult<string[]>("/feature");
 

diff --git a/frontend/packages/demo-app/src/control-panel.ts b/frontend/packages/demo-app/src/control-panel.ts
@@ -7,7 +7,7 @@ import {
   Alignment,
   NumericInput,
 } from "@blueprintjs/core";
-import { RotationsContext } from "@macrostrat/corelle";
+import { RotationsContext } from "@corelle/svg-map-layers";
 import * as styles from "./app.styl";
 import { MapSettingsContext } from "./map-settings";
 

diff --git a/frontend/packages/demo-app/src/world-map.ts b/frontend/packages/demo-app/src/world-map.ts
@@ -1,12 +1,12 @@
 import h from "@macrostrat/hyper";
 import { useContext, useRef } from "react";
+import { Globe, MapContext } from "@macrostrat/svg-map-components";
 import {
   PlateFeatureLayer,
   RotationsContext,
   PlatePolygons,
   PlateFeature,
-} from "@macrostrat/corelle";
-import { Globe, MapContext } from "@macrostrat/svg-map-components";
+} from "@corelle/svg-map-layers";
 
 import { MapSettingsContext } from "./map-settings";
 

diff --git a/frontend/packages/rotations/CHANGELOG.md b/frontend/packages/rotations/CHANGELOG.md
@@ -0,0 +1,11 @@
+# Changelog
+
+All notable changes to this project will be documented in this file. The format
+is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this
+project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+## [1.0.0] - 2024-02-15
+
+Split off `@corelle/rotations` module from legacy `@macrostrat/corelle` package.
+The React components for creating an SVG map have been moved to the
+`@corelle/svg-map-layers` package.
diff --git a/frontend/packages/rotations/package.json b/frontend/packages/rotations/package.json
@@ -0,0 +1,35 @@
+{
+  "name": "@corelle/rotations",
+  "version": "1.0.0",
+  "description": "A client library for the Corelle plate-rotation API",
+  "scripts": {
+    "build": "rm -rf dist && parcel build",
+    "prepare": "npm run build"
+  },
+  "author": "Daven Quinn",
+  "license": "MIT",
+  "module": "dist/esm/index.js",
+  "main": "dist/cjs/index.js",
+  "source": "src/index.ts",
+  "types": "dist/esm/index.d.ts",
+  "dependencies": {
+    "@types/d3-geo": "^3.0",
+    "d3-geo": "^3.1.1",
+    "quaternion": "^2.0.2"
+  },
+  "peerDependencies": {
+    "react": "^16.13.1||^17.0.0||^18.0.0||^19.0.0"
+  },
+  "exports": {
+    ".": {
+      "source": "./src/index.ts",
+      "import": "./dist/esm/index.js",
+      "require": "./dist/cjs/index.js",
+      "types": "./dist/esm/index.d.ts"
+    }
+  },
+  "devDependencies": {
+    "@babel/core": "^7.12.0",
+    "parcel": "^2.13.3"
+  }
+}
diff --git a/frontend/packages/rotations/src/geometry.ts b/frontend/packages/rotations/src/geometry.ts
@@ -0,0 +1,27 @@
+import { geoTransform, geoPath, GeoProjection } from "d3-geo";
+
+type RotateFunction = (coords: [number, number]) => [number, number];
+
+export function pathGenerator(
+  projection: GeoProjection,
+  rotation: RotateFunction,
+  canvasContext = null,
+) {
+  /** Returns a composite of a geo projection and a rotation
+   * Optionally, a canvas context can be provided to render to a canvas
+   * */
+  // Filter out features that are too young
+  const trans = geoTransform({
+    point(lon, lat) {
+      const [x, y] = rotation([lon, lat]);
+      return this.stream.point(x, y);
+    },
+  });
+
+  // This ordering makes no sense but whatever
+  const stream = (s) =>
+    // https://stackoverflow.com/questions/27557724/what-is-the-proper-way-to-use-d3s-projection-stream
+    trans.stream(projection.stream(s));
+
+  return geoPath({ stream }, canvasContext);
+}
diff --git a/frontend/packages/rotations/src/index.ts b/frontend/packages/rotations/src/index.ts
@@ -0,0 +1,3 @@
+export * from "./rotations";
+export * from "./math";
+export * from "./geometry";
diff --git a/frontend/packages/corelle/src/math.ts → frontend/packages/rotations/src/math.ts b/frontend/packages/corelle/src/math.ts → frontend/packages/rotations/src/math.ts
diff --git a/frontend/packages/corelle/src/rotations.ts → frontend/packages/rotations/src/rotations.ts b/frontend/packages/corelle/src/rotations.ts → frontend/packages/rotations/src/rotations.ts
@@ -1,5 +1,7 @@
 import Quaternion from "quaternion";
 import { sph2cart, cart2sph } from "./math";
+import { GeoProjection } from "d3-geo";
+import { pathGenerator } from "./geometry";
 
 // Drag to rotate globe
 // http://bl.ocks.org/ivyywang/7c94cb5a3accd9913263
@@ -23,6 +25,7 @@ class RotationData {
     this.plateRotation = this.plateRotation.bind(this);
     this.geographyRotator = this.geographyRotator.bind(this);
     this.rotatedProjection = this.rotatedProjection.bind(this);
+    this.pathGenerator = this.pathGenerator.bind(this);
   }
 
   plateRotation(id) {
@@ -58,6 +61,15 @@ class RotationData {
       return projection.apply(this, arguments);
     };
   }
+
+  pathGenerator(
+    plate_id: number,
+    projection: GeoProjection,
+    context: CanvasRenderingContext2D | null = null,
+  ) {
+    const rotationFunc = this.geographyRotator(plate_id);
+    pathGenerator(projection, rotationFunc, context);
+  }
 }
 
 export { RotationData, RotationOptions };
diff --git a/frontend/packages/corelle/CHANGELOG.md → ...tend/packages/svg-map-layers/CHANGELOG.md b/frontend/packages/corelle/CHANGELOG.md → ...tend/packages/svg-map-layers/CHANGELOG.md
@@ -4,24 +4,32 @@ All notable changes to this project will be documented in this file. The format
 is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this
 project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
-## [3.0.0] - 2025-02-14
+## [1.0.0] - 2025-02-15
+
+Created `@corelle/svg-map-layers` package from the React-oriented components of
+the `@macrostrat/corelle` package. Basic math and geometry functions have been
+moved to the `@corelle/rotations` library.
+
+# Legacy changes for `@macrostrat/corelle` package
+
+## [@macrostrat/corelle-v3.0.0] - 2025-02-14
 
 - Updated packaging to use Parcel
 - Updated dependency versions
 - Switch from outdated `@macrostrat/map-components` to
   `@macrostrat/svg-map-components`
 - Build within a workspace
 
-## [2.0.1] - 2024-05-29
+## [@macrostrat/corelle-v2.0.1] - 2024-05-29
 
 Update exports field
 
-## [2.0.0] - 2024-05-08
+## [@macrostrat/corelle-2.0.0] - 2024-05-08
 
 - Broaden possible ranges of dependencies
 - Remove `react-router-dom` dependency
 
-## [1.1.0] - 2021-08-08
+## [@macrostrat/corelle-v1.1.0] - 2021-08-08
 
 Updated some elements of path handling
 

diff --git a/frontend/packages/corelle/package.json → ...tend/packages/svg-map-layers/package.json b/frontend/packages/corelle/package.json → ...tend/packages/svg-map-layers/package.json
@@ -1,7 +1,7 @@
 {
-  "name": "@macrostrat/corelle",
-  "version": "3.0.0",
-  "description": "A client library for the Corelle plate-rotation API",
+  "name": "@corelle/svg-map-layers",
+  "version": "1.0.0",
+  "description": "React map layers for the Corelle plate-rotation service",
   "scripts": {
     "build": "rm -rf dist && parcel build",
     "prepare": "npm run build"
@@ -13,12 +13,10 @@
   "source": "src/index.ts",
   "types": "dist/esm/index.d.ts",
   "dependencies": {
+    "@corelle/rotations": "workspace:^",
     "@macrostrat/hyper": "^3.0.6",
     "@macrostrat/svg-map-components": "^1.0.2",
     "@macrostrat/ui-components": "^4.0.0",
-    "@types/d3-geo": "^3.0",
-    "d3-geo": "^3.1.1",
-    "quaternion": "^2.0.2",
     "url-join": "^4.0.1"
   },
   "peerDependencies": {

diff --git a/...ackages/corelle/src/components/feature.ts → ...nd/packages/svg-map-layers/src/feature.ts b/...ackages/corelle/src/components/feature.ts → ...nd/packages/svg-map-layers/src/feature.ts
@@ -1,12 +1,12 @@
 import h from "@macrostrat/hyper";
 import { useContext } from "react";
-import { geoTransform, geoPath } from "d3-geo";
 import { RotationsContext, useRotationsAPI, useRotations } from "./provider";
 import {
   MapContext,
   MapCanvasContext,
   FeatureLayer,
 } from "@macrostrat/svg-map-components";
+import { pathGenerator } from "@corelle/rotations";
 
 function usePathGenerator(plateId, context = null) {
   // Filter out features that are too young
@@ -22,20 +22,7 @@ function usePathGenerator(plateId, context = null) {
   const rotate = geographyRotator(plateId);
   if (rotate == null) return null;
 
-  const trans = geoTransform({
-    point(lon, lat) {
-      const [x, y] = rotate([lon, lat]);
-      return this.stream.point(x, y);
-    },
-  });
-
-  // This ordering makes no sense but whatever
-  const stream = (s) =>
-    // https://stackoverflow.com/questions/27557724/what-is-the-proper-way-to-use-d3s-projection-stream
-    trans.stream(projection.stream(s));
-
-  // Make it work in canvas
-  return geoPath({ stream }, context);
+  return pathGenerator(projection, rotate, context);
 }
 
 function PlateFeature(props) {
@@ -86,7 +73,7 @@ const PlateFeatureLayer = function (props: FeatureDatasetProps) {
         oldLim: old_lim,
         youngLim: young_lim,
       });
-    })
+    }),
   );
 };
 

diff --git a/.../packages/corelle/src/components/index.ts → ...tend/packages/svg-map-layers/src/index.ts b/.../packages/corelle/src/components/index.ts → ...tend/packages/svg-map-layers/src/index.ts
diff --git a/.../corelle/src/components/plate-polygons.ts → ...ages/svg-map-layers/src/plate-polygons.ts b/.../corelle/src/components/plate-polygons.ts → ...ages/svg-map-layers/src/plate-polygons.ts
diff --git a/...ckages/corelle/src/components/provider.ts → ...d/packages/svg-map-layers/src/provider.ts b/...ckages/corelle/src/components/provider.ts → ...d/packages/svg-map-layers/src/provider.ts
@@ -2,7 +2,7 @@ import React, { createContext, useContext } from "react";
 import h from "@macrostrat/hyper";
 import { useAPIResult } from "@macrostrat/ui-components";
 import join from "url-join";
-import { RotationData, RotationOptions } from "../rotations";
+import { RotationData, RotationOptions } from "@corelle/rotations";
 
 // Drag to rotate globe
 // http://bl.ocks.org/ivyywang/7c94cb5a3accd9913263
@@ -37,7 +37,7 @@ function RotationsProvider(props: React.PropsWithChildren<P>) {
     useAPIResult(
       join(endpoint, "/rotate"),
       { time: `${time}`, model, quaternion: "true" },
-      { debounce }
+      { debounce },
     ) ?? [];
 
   const value = new RotationData({ rotations, model, time });
@@ -48,7 +48,7 @@ function RotationsProvider(props: React.PropsWithChildren<P>) {
     h(RotationsContext.Provider, {
       value,
       children,
-    })
+    }),
   );
 }
 

diff --git a/frontend/yarn.lock b/frontend/yarn.lock
@@ -324,7 +324,7 @@ __metadata:
   resolution: "@corelle/demo-app@workspace:packages/demo-app"
   dependencies:
     "@blueprintjs/core": "npm:^5"
-    "@macrostrat/corelle": "workspace:^"
+    "@corelle/svg-map-layers": "workspace:^"
     "@macrostrat/hyper": "npm:^3.0.6"
     "@macrostrat/svg-map-components": "npm:^1.0.2"
     "@macrostrat/ui-components": "npm:^4.1.0"
@@ -338,6 +338,36 @@ __metadata:
   languageName: unknown
   linkType: soft
 
+"@corelle/rotations@workspace:^, @corelle/rotations@workspace:packages/rotations":
+  version: 0.0.0-use.local
+  resolution: "@corelle/rotations@workspace:packages/rotations"
+  dependencies:
+    "@babel/core": "npm:^7.12.0"
+    "@types/d3-geo": "npm:^3.0"
+    d3-geo: "npm:^3.1.1"
+    parcel: "npm:^2.13.3"
+    quaternion: "npm:^2.0.2"
+  peerDependencies:
+    react: ^16.13.1||^17.0.0||^18.0.0||^19.0.0
+  languageName: unknown
+  linkType: soft
+
+"@corelle/svg-map-layers@workspace:^, @corelle/svg-map-layers@workspace:packages/svg-map-layers":
+  version: 0.0.0-use.local
+  resolution: "@corelle/svg-map-layers@workspace:packages/svg-map-layers"
+  dependencies:
+    "@babel/core": "npm:^7.12.0"
+    "@corelle/rotations": "workspace:^"
+    "@macrostrat/hyper": "npm:^3.0.6"
+    "@macrostrat/svg-map-components": "npm:^1.0.2"
+    "@macrostrat/ui-components": "npm:^4.0.0"
+    parcel: "npm:^2.13.3"
+    url-join: "npm:^4.0.1"
+  peerDependencies:
+    react: ^16.13.1||^17.0.0||^18.0.0||^19.0.0
+  languageName: unknown
+  linkType: soft
+
 "@emotion/hash@npm:^0.7.1":
   version: 0.7.4
   resolution: "@emotion/hash@npm:0.7.4"
@@ -652,24 +682,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@macrostrat/corelle@workspace:^, @macrostrat/corelle@workspace:packages/corelle":
-  version: 0.0.0-use.local
-  resolution: "@macrostrat/corelle@workspace:packages/corelle"
-  dependencies:
-    "@babel/core": "npm:^7.12.0"
-    "@macrostrat/hyper": "npm:^3.0.6"
-    "@macrostrat/svg-map-components": "npm:^1.0.2"
-    "@macrostrat/ui-components": "npm:^4.0.0"
-    "@types/d3-geo": "npm:^3.0"
-    d3-geo: "npm:^3.1.1"
-    parcel: "npm:^2.13.3"
-    quaternion: "npm:^2.0.2"
-    url-join: "npm:^4.0.1"
-  peerDependencies:
-    react: ^16.13.1||^17.0.0||^18.0.0||^19.0.0
-  languageName: unknown
-  linkType: soft
-
 "@macrostrat/hyper@npm:^3.0.6":
   version: 3.0.6
   resolution: "@macrostrat/hyper@npm:3.0.6"