From a7778dd9c33d70b6718d240797cd671a8f0a82d8 Mon Sep 17 00:00:00 2001
From: Matthew Richardson <M.Richardson@ed.ac.uk>
Date: Tue, 28 May 2024 09:34:59 +0100
Subject: [PATCH] First work on updates rom child changes.

---
 src/components/TRList.vue           | 21 ++++++++++++++-------
 src/components/fields/TextInput.vue |  7 ++++++-
 2 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/src/components/TRList.vue b/src/components/TRList.vue
index 596fbf9..6cf9947 100644
--- a/src/components/TRList.vue
+++ b/src/components/TRList.vue
@@ -116,8 +116,8 @@ let dialogVisible = ref(false)
 let dirty = ref(false)
 // Use ref, not reactive, as we replace the whole object, rather than modify its properties
 let dtProps = ref({})
+let selectedIndex = undefined
 let selectedRow = ref({})
-let rowIndex = ref()
 let filters = ref({})
 let sortField = undefined
 let sortOrder = undefined
@@ -175,19 +175,21 @@ const onReload = () => {
 }
 
 const onRefresh = () => {
-  // Create a new object with a new reference, or it won't be reactive if underlying data is unchanged
-  selectedRow.value = Object.assign({}, collection.value[rowIndex.value])
+  // Reset detail card data to the selected row
+  selectedRow.value = collection.value[selectedIndex]
 }
 
 const onRowSelect = (event) => {
-  if (event.data) {
+  if ('index' in event) {
     // Editing existing row
     dialogConfig.value = props.configuration
     dialogName.value = props.name
     dialogHeader.value = `Edit: ${dialogName.value}`
-    selectedRow.value = event.data
-    // Preserve the rowIndex so we can access the item data in onRefresh
-    rowIndex.value = event.index
+    // Save the index of the selected row for later re-use in onRefresh
+    // FIXME: Array index is a 'poor' key since arrays can reorder, change length etc
+    // But we can't guarantee/mandate unique array entries to key off
+    selectedIndex = event.index
+    selectedRow.value = collection.value[selectedIndex]
   } else {
     // New button
     selectedRow.value = newButton.value.value || {}
@@ -226,6 +228,11 @@ const newButton = computed(() => {
   return true
 })
 
+watch(collection, () => {
+  // Update selectedRow if the collection changes (based on selected row index)
+  selectedRow.value = collection.value[selectedIndex]
+})
+
 watch(
   confTRDetail,
   (newDetail) => {
diff --git a/src/components/fields/TextInput.vue b/src/components/fields/TextInput.vue
index b4d0af0..b8cc328 100644
--- a/src/components/fields/TextInput.vue
+++ b/src/components/fields/TextInput.vue
@@ -42,7 +42,12 @@ export default {
     watch(
       [props.field, props.item],
       () => {
-        fieldValue.value = fieldBaseValue(useProps)
+        // FIXME: fbv is the 'store' value, fieldValue is the current edits
+        // We should have logic here to handle the store changing while editing, and decide what to do
+        // This would then need replicating to all other fields, potentially with different behaviours.
+        let fbv = fieldBaseValue(useProps)
+        console.log('Vals', fieldValue.value, fbv)
+        fieldValue.value = fbv
       },
       { immediate: true }
     )