From 730fe0a8ea6f4c551f845ba5482e02b705f8dbf3 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Mon, 17 Apr 2023 15:53:20 +0100
Subject: [PATCH] Persist row height as table metadata

---
 .../components/sheet/controls/RowHeightButton.svelte  | 11 +++++++++--
 .../src/components/sheet/stores/columns.js            |  1 +
 .../frontend-core/src/components/sheet/stores/ui.js   | 11 +++++++++--
 3 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/packages/frontend-core/src/components/sheet/controls/RowHeightButton.svelte b/packages/frontend-core/src/components/sheet/controls/RowHeightButton.svelte
index e6e9103afc..c9e36c25b5 100644
--- a/packages/frontend-core/src/components/sheet/controls/RowHeightButton.svelte
+++ b/packages/frontend-core/src/components/sheet/controls/RowHeightButton.svelte
@@ -7,7 +7,7 @@
     SmallRowHeight,
   } from "../lib/constants"
 
-  const { rowHeight, loaded } = getContext("sheet")
+  const { rowHeight, loaded, columns, table } = getContext("sheet")
   const sizeOptions = [
     {
       label: "Small",
@@ -25,6 +25,13 @@
 
   let open = false
   let anchor
+
+  const changeRowHeight = height => {
+    columns.actions.saveTable({
+      ...$table,
+      rowHeight: height,
+    })
+  }
 </script>
 
 <div bind:this={anchor}>
@@ -46,7 +53,7 @@
       <ActionButton
         quiet
         selected={$rowHeight === option.size}
-        on:click={() => rowHeight.set(option.size)}
+        on:click={() => changeRowHeight(option.size)}
       >
         {option.label}
       </ActionButton>
diff --git a/packages/frontend-core/src/components/sheet/stores/columns.js b/packages/frontend-core/src/components/sheet/stores/columns.js
index 7f1b510329..6641f23cbb 100644
--- a/packages/frontend-core/src/components/sheet/stores/columns.js
+++ b/packages/frontend-core/src/components/sheet/stores/columns.js
@@ -103,6 +103,7 @@ export const deriveStores = context => {
       ...columns,
       actions: {
         saveChanges,
+        saveTable,
         changePrimaryDisplay,
       },
     },
diff --git a/packages/frontend-core/src/components/sheet/stores/ui.js b/packages/frontend-core/src/components/sheet/stores/ui.js
index acc11588df..23f7b45bac 100644
--- a/packages/frontend-core/src/components/sheet/stores/ui.js
+++ b/packages/frontend-core/src/components/sheet/stores/ui.js
@@ -1,8 +1,8 @@
 import { writable, get, derived } from "svelte/store"
 import {
+  DefaultRowHeight,
   LargeRowHeight,
   MediumRowHeight,
-  SmallRowHeight,
 } from "../lib/constants"
 
 export const createStores = () => {
@@ -10,7 +10,7 @@ export const createStores = () => {
   const focusedCellAPI = writable(null)
   const selectedRows = writable({})
   const hoveredRowId = writable(null)
-  const rowHeight = writable(36)
+  const rowHeight = writable(DefaultRowHeight)
   const previousFocusedRowId = writable(null)
 
   // Derive the current focused row ID
@@ -96,6 +96,8 @@ export const initialise = context => {
     focusedCellId,
     selectedRows,
     hoveredRowId,
+    table,
+    rowHeight,
   } = context
 
   // Ensure we clear invalid rows from state if they disappear
@@ -158,4 +160,9 @@ export const initialise = context => {
       hoveredRowId.set(null)
     }
   })
+
+  // Pull row height from table
+  table.subscribe($table => {
+    rowHeight.set($table?.rowHeight || DefaultRowHeight)
+  })
 }