From 5b77218087f6563665244eee136e9f94233a22cf Mon Sep 17 00:00:00 2001
From: CameronEYDS <53542131+cameron-eyds@users.noreply.github.com>
Date: Wed, 5 Jun 2024 11:52:21 -0700
Subject: [PATCH] SAN: Amendment Tracking UX (#1915)

* Improve parent/child tracking reactivity

* lint fix: remove unused IF

* version edit
---
 ppr-ui/package-lock.json                      |  4 +--
 ppr-ui/package.json                           |  2 +-
 .../securities-act-notices/NoticePanel.vue    | 31 ++++++++++++-------
 .../pprRegistration/usePprRegistration.ts     | 12 +++++--
 4 files changed, 32 insertions(+), 17 deletions(-)

diff --git a/ppr-ui/package-lock.json b/ppr-ui/package-lock.json
index b5cb5d59a..b3cedd4ca 100644
--- a/ppr-ui/package-lock.json
+++ b/ppr-ui/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "ppr-ui",
-  "version": "3.2.8",
+  "version": "3.2.9",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "ppr-ui",
-      "version": "3.2.8",
+      "version": "3.2.9",
       "dependencies": {
         "@bcrs-shared-components/input-field-date-picker": "^1.0.0",
         "@lemoncode/fonk": "^1.5.1",
diff --git a/ppr-ui/package.json b/ppr-ui/package.json
index c2d7a58e2..c7179bce7 100644
--- a/ppr-ui/package.json
+++ b/ppr-ui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ppr-ui",
-  "version": "3.2.8",
+  "version": "3.2.9",
   "private": true,
   "appName": "Assets UI",
   "sbcName": "SBC Common Components",
diff --git a/ppr-ui/src/components/registration/securities-act-notices/NoticePanel.vue b/ppr-ui/src/components/registration/securities-act-notices/NoticePanel.vue
index 27c7efe77..831c7487c 100644
--- a/ppr-ui/src/components/registration/securities-act-notices/NoticePanel.vue
+++ b/ppr-ui/src/components/registration/securities-act-notices/NoticePanel.vue
@@ -369,7 +369,7 @@ import { useStore } from '@/store/store'
 import { storeToRefs } from 'pinia'
 import { confirmRemoveNoticeDialog } from '@/resources/dialogOptions'
 import { BaseDialog } from '@/components/dialogs'
-import { cloneDeep, isEqual } from 'lodash'
+import { cloneDeep, isEqual, omit } from 'lodash'
 
 /** Composables **/
 const { setSecuritiesActNotices, setSecuritiesActNoticeOrder } = useStore()
@@ -482,14 +482,15 @@ const removeOrder = (noticeIndex: number, orderIndex: number) => {
   } else {
     // Remove New/Added Orders
     orders.splice(orderIndex, 1)
-    setSecuritiesActNotices([...getSecuritiesActNotices.value])
+    setAndCloseNotice(true)
   }
 }
 
 /** Handle notice form edits **/
 const handleEditNotice = (notice: AddEditSaNoticeIF, isUndo = false): void => {
   // Set add edit notices
-  getSecuritiesActNotices.value[props.noticeIndex] = cloneDeep(notice)
+  const editNotice = !notice.effectiveDateTime ? omit(notice, 'effectiveDateTime') : notice
+  getSecuritiesActNotices.value[props.noticeIndex] = cloneDeep(editNotice)
   setAndCloseNotice(isUndo)
 }
 
@@ -499,15 +500,15 @@ const handleAddEditOrder = (order: CourtOrderIF, orderIndex: number = null, isUn
 
   // Handle Undo
   if (isUndo) {
-    setSecuritiesActNoticeOrder(props.noticeIndex, orderIndex, order)
+    setSecuritiesActNoticeOrder(props.noticeIndex, orderIndex, omit(order, 'action'))
   } else if (editOrderIndex.value > -1) {
     const isAmendedOrder = !isEqual(parentNotice.securitiesActOrders[editOrderIndex.value], order)
 
     // Edit Order
     parentNotice.securitiesActOrders[editOrderIndex.value] = {
       ...order,
-      ...((props.isAmendment && order.action !== ActionTypes.ADDED) && {
-        action: isAmendedOrder ? ActionTypes.EDITED : null
+      ...(props.isAmendment && order.action !== ActionTypes.ADDED && isAmendedOrder && {
+        action: ActionTypes.EDITED
       })
     }
   } else {
@@ -546,11 +547,19 @@ const togglePanel = (isCancel: boolean = false) => {
 
 /** Set Notices to Store and close active panels **/
 const setAndCloseNotice = (isUndo = false): void => {
-  const notices = getSecuritiesActNotices.value.map(notice =>
-    notice?.securitiesActOrders?.some(order => !!order.action)
-      ? { ...notice, action: ActionTypes.EDITED }
-      : { ...notice }
-  )
+  // Determine the action for each notice: mark as edited if it has changes,
+  // retain added/removed notices, otherwise omit the action property.
+  const notices = getSecuritiesActNotices.value.map((notice, index) => {
+    const originalNotice = getOriginalSecuritiesActNotices.value[index]
+    const isAdded = notice.action === ActionTypes.ADDED
+    const isRemoved = notice.action === ActionTypes.REMOVED
+    const isEdited = !isAdded && !isEqual(omit(notice, 'action'), omit(originalNotice, 'action'))
+
+    if (isEdited) {
+      return { ...notice, action: ActionTypes.EDITED }
+    }
+    return (isAdded || isRemoved) ? { ...notice } : omit(notice, 'action')
+  })
 
   setSecuritiesActNotices([...notices])
   // Close expanded panel
diff --git a/ppr-ui/src/composables/pprRegistration/usePprRegistration.ts b/ppr-ui/src/composables/pprRegistration/usePprRegistration.ts
index 8a022ad88..3e025e0a1 100644
--- a/ppr-ui/src/composables/pprRegistration/usePprRegistration.ts
+++ b/ppr-ui/src/composables/pprRegistration/usePprRegistration.ts
@@ -1,6 +1,6 @@
 import { APIRegistrationTypes, RegistrationFlowType } from '@/enums'
 import {
-  AddCollateralIF, AddEditSaNoticeIF,
+  AddCollateralIF,
   AddPartiesIF,
   CertifyIF,
   CourtOrderIF,
@@ -53,8 +53,14 @@ export const usePprRegistration = () => {
 
     // Conditionally parse Securities Act Notices
     if (!!statement?.securitiesActNotices){
-      setSecuritiesActNotices(statement.securitiesActNotices)
-      setOriginalSecuritiesActNotices(cloneDeep(statement.securitiesActNotices) as Array<AddEditSaNoticeIF>)
+      // Map the notices to include an empty array for Orders when there is no pre-existing orders on the notice
+      const mappedNotices = statement.securitiesActNotices.map(notice => ({
+        ...notice,
+        securitiesActOrders: notice.securitiesActOrders || []
+      }))
+
+      setSecuritiesActNotices(mappedNotices)
+      setOriginalSecuritiesActNotices(cloneDeep(mappedNotices))
     }
 
     const collateral = {