Merge branch 'edit-table-improvements'

* edit-table-improvements: (23 commits)
  Pass through transformRequest function
  Added the ability to run postgres aggregate functions
  Got PostgREST table to load
  Added column reordering
  Improved color management
  Infinite scrolling PostgREST sheet works
  Basic postgrest table
  Updated data sheet component
  Updated data fill values
  Major simplification to cell renderer
  Further decoupled cell renderer
  Greatly simplified rendering
  Adjusted values somewhat
  Successfully initialize props
  Started to bring different elements of data sheet together
  Updated column specs
  Updated table
  Made state provider handle basic state tracking
  Created a skeletal state provider
  Add a basic column reordering story
  ...

Author: davenquinn

.idea/misc.xml

@@ -12,12 +12,15 @@
     "@blueprintjs/core": "^5.10.2",
     "@blueprintjs/table": "^5.1.4",
     "@macrostrat/hyper": "^2.0.0",
+    "@supabase/postgrest-js": "^1.17.7",
     "chroma-js": "^2.4.2",
     "classnames": "^2.3.1",
     "immutability-helper": "^3.1.1",
     "react": "^17.0.2||^18",
     "react-color": "^2.19.3",
-    "react-colorful": "^5.6.1"
+    "react-colorful": "^5.6.1",
+    "underscore": "^1.13.7",
+    "zustand": "^5.0.2"
   },
   "exports": {
     ".": {
@@ -29,5 +32,8 @@
     "type": "git",
     "url": "https://github.com/UW-Macrostrat/web-components.git",
     "directory": "packages/data-sheet2"
+  },
+  "devDependencies": {
+    "@types/underscore": "^1"
   }
 }

…ges/data-sheet/src/data-sheet.stories.ts …data-sheet/src/data-sheet-old.stories.tspackages/data-sheet/src/data-sheet.stories.ts renamed to packages/data-sheet/src/data-sheet-old.stories.ts packages/data-sheet/src/data-sheet.stories.ts renamed to packages/data-sheet/src/data-sheet-old.stories.ts

@@ -0,0 +1,8 @@
+.table-actions, .table-action
+  display: flex
+  flex-direction: row
+  gap: 0.5em
+
+.table-actions
+  margin-bottom: 0.5em
+  gap: 1em

packages/data-sheet2/package.json

@@ -0,0 +1,11 @@
+import hyper from "@macrostrat/hyper";
+import style from "./actions.module.sass";
+const h = hyper.styled(style);
+
+export function DataSheetActionsRow(props) {
+  return h("div.table-actions", props.children);
+}
+
+export function DataSheetAction(props) {
+  return h("div.table-action", props.children);
+}

packages/data-sheet2/src/components/actions.module.sass

@@ -5,6 +5,7 @@ import styles from "./main.module.sass";
 import { asChromaColor } from "@macrostrat/color-utils";
 import { HexColorPicker } from "react-colorful";
 import { useEffect, useRef } from "react";
+import { memoize } from "underscore";
 
 const h = hyper.styled(styles);
 
@@ -17,13 +18,17 @@ export function ColorCell({ value, children, style, intent, ...rest }) {
       ...rest,
       style: {
         ...style,
-        ...pleasantCombination(value, { darkMode }),
+        ...colorCombo(value, darkMode),
       },
     },
     children
   );
 }
 
+const colorCombo = memoize((color, darkMode) =>
+  pleasantCombination(color, { darkMode })
+);
+
 export function pleasantCombination(
   color,
   { luminance = null, backgroundAlpha = 0.2, darkMode = false } = {}