Mhr History Owners

ppr-ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ppr-ui",
-  "version": "3.2.32",
+  "version": "3.2.33",
   "private": true,
   "appName": "Assets UI",
   "sbcName": "SBC Common Components",

ppr-ui/src/assets/styles/base.scss

@@ -168,6 +168,9 @@ a {
 .error-text {
   color: $error !important;
 }
+.gray7 {
+  color: $gray7;
+}
 
 .disabled-text {
   opacity: 0.4;

ppr-ui/src/components/common/SimpleTable.vue

@@ -20,8 +20,13 @@
           <td
             v-for="(header, colIndex) in tableHeaders"
             :key="`cell-${rowIndex}-${colIndex}`"
-            :class="{ 'font-weight-bold' : colIndex === 1, 'expanded-row-cell' : expandRow[rowIndex] }"
+            :class="{
+              'pt-1' : colIndex === 0,
+              'font-weight-bold gray9' : colIndex === 1,
+              'expanded-row-cell' : expandRow[rowIndex]
+            }"
           >
+            <!-- Expand/Collapse Btn -->
             <v-btn
               v-if="colIndex === 0"
               class="toggle-expand-row-btn"
@@ -40,7 +45,15 @@
                 {{ expandRow[rowIndex] ? 'Hide' : 'View' }} {{ rowLabel }}
               </span>
             </v-btn>
-            <span v-else>{{ getItemValue(item, header.value) }}</span>
+            <!-- Cell Content -->
+            <template v-else>
+              <slot
+                :name="`cell-slot-${colIndex}`"
+                :content="item"
+              >
+                {{ getItemValue(item, header.value) }}
+              </slot>
+            </template>
           </td>
         </tr>
         <tr
@@ -136,6 +149,12 @@ const getItemValue = (item: object, valuePaths: Array<string> | string): string
 </script>
 <style lang="scss" scoped>
 @import '@/assets/styles/theme';
+:deep(td) {
+  align-content: flex-start;
+}
+.gray9 {
+  color: $gray9 !important;
+}
 .expanded-row-cell {
   border-bottom: 0!important;
 }

ppr-ui/src/components/mhrHistory/MhrHistoryLocations.vue

@@ -1,6 +1,6 @@
 <template>
   <section
-    id="mhr-history-description"
+    id="mhr-history-location"
     class="pr-4"
   >
     <v-row

ppr-ui/src/components/mhrHistory/MhrHistoryOwners.vue

@@ -0,0 +1,190 @@
+<template>
+  <section
+    id="mhr-history-owners"
+    class="pr-4"
+  >
+    <v-row
+      noGutters
+      class="condensed-row py-3"
+    >
+      <p>
+        <span class="generic-label-14">Tenancy Type:</span>
+        {{ content.type }} <v-divider vertical />
+      </p>
+      <p>
+        <span class="generic-label-14">Group:</span>
+        {{ content.groupId }} of {{ content.groupCount }} <v-divider vertical />
+      </p>
+      <p>
+        <span class="generic-label-14">Owner:</span>
+        {{ content.ownerId }} of {{ content.groupOwnerCount }} <v-divider vertical />
+      </p>
+      <p>
+        <span class="generic-label-14">Group Tenancy Type:</span>
+        {{ content.groupTenancyType }}
+        <v-divider vertical />
+      </p>
+      <p>
+        <span class="generic-label-14">Interest:</span>
+        {{ content.interest }} {{ content.interestNumerator }}/{{ content.interestDenominator }}
+      </p>
+    </v-row>
+
+    <v-row
+      noGutters
+      class="condensed-row py-3"
+    >
+      <v-col cols="3">
+        <h4>Mailing Address</h4>
+        <BaseAddress :value="content.address" />
+      </v-col>
+      <v-col
+        cols="3"
+        class="pl-3"
+      >
+        <h4>Phone Number</h4>
+        <p>{{ content.phoneNumber }} {{ content.phoneExtension ? `Ext ${content.phoneExtension}` : '' }}</p>
+      </v-col>
+      <v-col cols="3">
+        <h4>Email Address</h4>
+        <p>{{ content.emailAddress || '(Not Entered)' }}</p>
+      </v-col>
+    </v-row>
+
+    <!-- Owner From/Until Details -->
+    <v-row
+      noGutters
+      class="py-6 condensed-row"
+    >
+      <v-col cols="3">
+        <h4>Owned From</h4>
+      </v-col>
+      <v-col
+        cols="6"
+        class="pl-3"
+      >
+        <p>{{ shortPacificDate(content?.createDateTime) || '(Not Entered)' }}</p>
+      </v-col>
+      <v-col cols="3">
+        <h4>Document Type</h4>
+      </v-col>
+      <v-col
+        cols="6"
+        class="pl-3"
+      >
+        <p>{{ content?.registrationDescription || '(Not Entered)' }}</p>
+      </v-col>
+      <v-col cols="3">
+        <h4>Registration Number</h4>
+      </v-col>
+      <v-col
+        cols="6"
+        class="pl-3"
+      >
+        <p>{{ content?.documentRegistrationNumber || '(Not Entered)' }}</p>
+      </v-col>
+      <v-col cols="3">
+        <h4>Document ID</h4>
+      </v-col>
+      <v-col
+        cols="6"
+        class="pl-3"
+      >
+        <p>{{ content?.documentId || '(Not Entered)' }}</p>
+      </v-col>
+
+      <template v-if="content?.endDateTime">
+        <v-col
+          cols="3"
+          class="mt-4"
+        >
+          <h4>Owned Until</h4>
+        </v-col>
+        <v-col
+          cols="6"
+          class="pl-3 mt-4"
+        >
+          <p>{{ shortPacificDate(content?.endDateTime) || '(Not Entered)' }}</p>
+        </v-col>
+        <v-col cols="3">
+          <h4>Document Type</h4>
+        </v-col>
+        <v-col
+          cols="6"
+          class="pl-3"
+        >
+          <p>{{ content?.registrationDescription || '(Not Entered)' }}</p>
+        </v-col>
+        <v-col cols="3">
+          <h4>Registration Number</h4>
+        </v-col>
+        <v-col
+          cols="6"
+          class="pl-3"
+        >
+          <p>{{ content?.documentRegistrationNumber || '(Not Entered)' }}</p>
+        </v-col>
+        <v-col cols="3">
+          <h4>Document ID</h4>
+        </v-col>
+        <v-col
+          cols="6"
+          class="pl-3"
+        >
+          <p>{{ content?.documentId || '(Not Entered)' }}</p>
+        </v-col>
+      </template>
+      <template v-else>
+        <v-col
+          cols="3"
+          class="mt-4"
+        >
+          <h4>Owned Until</h4>
+        </v-col>
+        <v-col
+          cols="6"
+          class="pl-3 mt-4"
+        >
+          <p>Current</p>
+        </v-col>
+      </template>
+    </v-row>
+  </section>
+</template>
+
+<script setup lang="ts">
+import { OwnerIF } from '@/interfaces'
+import { BaseAddress } from '@/composables/address'
+import { shortPacificDate } from '@/utils'
+
+/** Props **/
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+const props = withDefaults(defineProps<{
+  content: OwnerIF
+}>(), {
+  content: null
+})
+
+</script>
+<style lang="scss" scoped>
+@import '@/assets/styles/theme';
+.v-row {
+  min-height: 65px;
+  border-top: 1px solid $gray3;
+}
+.condensed-row {
+  p, h4 {
+    line-height: 1.5rem;
+  }
+}
+:deep(.v-divider) {
+  height: 14px;
+  color: $gray3;
+  margin: 0 20px;
+  opacity: 1;
+}
+:deep(.v-col-3) {
+  flex: 0 0 26.25%;
+  max-width: 26.25%;
+}
+</style>

ppr-ui/src/components/mhrHistory/index.ts

@@ -1,2 +1,3 @@
 export { default as MhrHistoryDescription } from './MhrHistoryDescription.vue'
 export { default as MhrHistoryLocations } from './MhrHistoryLocations.vue'
+export { default as MhrHistoryOwners } from './MhrHistoryOwners.vue'

ppr-ui/src/composables/mhrInformation/useTransferOwners.ts

@@ -427,18 +427,28 @@ export const useTransferOwners = (enableAllActions: boolean = false) => {
     if (getMhrTransferType.value?.transferType === ApiTransferTypes.SALE_OR_GIFT &&
       getMhrInformation.value.statusType === MhApiStatusTypes.FROZEN &&
       !QSLockedStateUnitNoteTypes.includes(getMhrInformation.value?.frozenDocumentType)) {
-      // Find ExecutorAdministrator group
-      // Updated to restrict to the last group in the structure, as that is always the recently added executors group
-      const isExecutorOrAdministratorOwnerGroup = getMhrTransferHomeOwnerGroups.value.find(group => group.groupId ===
-        getMhrTransferHomeOwnerGroups.value.length && group.groupId === owner.groupId)?.owners.some(owner => {
-        return owner.partyType === HomeOwnerPartyTypes.EXECUTOR || owner.partyType === HomeOwnerPartyTypes.ADMINISTRATOR
-      })
-
-      return !isExecutorOrAdministratorOwnerGroup
+      const mostRecentExecutorOrAdmin = getMostRecentExecutorOrAdmin(getMhrTransferHomeOwnerGroups.value)
+      return mostRecentExecutorOrAdmin.groupId !== owner.groupId
     }
     return false
   }
 
+  /**
+   * Retrieves the executor or administrator with the highest ownerId from a list of owner groups.
+   *
+   * @param {Array<MhrHomeOwnerGroupIF>} ownerGroups - The list of owner groups to search through.
+   * @returns {MhrRegistrationHomeOwnerIF} - The executor or administrator with the highest ownerId.
+   */
+  const getMostRecentExecutorOrAdmin = (ownerGroups: Array<MhrHomeOwnerGroupIF>): MhrRegistrationHomeOwnerIF => {
+    return ownerGroups
+      .flatMap(group => group.owners) // Combine all owners into a single array
+      .filter(owner => owner.partyType === HomeOwnerPartyTypes.EXECUTOR ||
+        owner.partyType === HomeOwnerPartyTypes.ADMINISTRATOR) // Keep only executors or admins
+      .reduce((highest: any, owner: any) => {
+        return owner.ownerId > highest.ownerId ? owner : highest
+      }, { ownerId: -Infinity }) // Find the executor with the highest ownerId
+  }
+
   /**
    * Return true if there is a deceased or modified owner outside the specified owners group
    * in Surviving Joint Tenants
@@ -1001,6 +1011,7 @@ export const useTransferOwners = (enableAllActions: boolean = false) => {
     hasCurrentGroupChanges,
     moveCurrentOwnersToPreviousOwners,
     hasMinOneExecOrAdminInGroup,
+    getMostRecentExecutorOrAdmin,
     ...toRefs(localState)
   }
 }

ppr-ui/src/composables/mhrRegistration/useHomeOwners.ts

@@ -9,7 +9,7 @@ import {
 import { useStore } from '@/store/store'
 import { ActionTypes, ApiTransferTypes, HomeOwnerPartyTypes, HomeTenancyTypes, MhApiStatusTypes } from '@/enums'
 import { MhrCompVal, MhrSectVal } from '@/composables/mhrRegistration/enums'
-import { useMhrValidations } from '@/composables'
+import { useMhrValidations, useTransferOwners } from '@/composables'
 import { find, findIndex, remove, set, uniq } from 'lodash'
 import { storeToRefs } from 'pinia'
 import { deepChangesComparison } from '@/utils'
@@ -302,7 +302,8 @@ export function useHomeOwners (isMhrTransfer: boolean = false, isMhrCorrection:
     // Try to find a group to add the owner
     // If frozen Sale or Gift Transfer: Add Owner to the last ownership group with recently added Executor
     const groupToUpdate = isFrozenSoGTransfer
-      ? homeOwnerGroups[homeOwnerGroups?.length -1]
+      ? homeOwnerGroups.find(group => group.groupId ===
+        useTransferOwners().getMostRecentExecutorOrAdmin(homeOwnerGroups)?.groupId)
       : homeOwnerGroups.find(
       (group: MhrRegistrationHomeOwnerGroupIF) => group.groupId === (groupId || fallBackId)
     ) || ({} as MhrRegistrationHomeOwnerGroupIF)

ppr-ui/src/interfaces/mhr-api-interfaces/MhrHistoryIF.ts

@@ -1,4 +1,5 @@
 import { AddressIF, MhrLocationInfoIF } from '@/interfaces'
+import { HomeOwnerPartyTypes } from '@/enums'
 
 export interface DescriptionIF {
   baseInformation?: {
@@ -62,8 +63,10 @@ export interface IndividualNameIF {
 export interface OwnerIF {
   address?: AddressIF
   createDateTime?: string
+  description?: string
   documentId?: string
   documentRegistrationNumber?: string
+  emailAddress?: string
   endDateTime?: string
   endRegistrationDescription?: string
   groupCount?: number
@@ -75,8 +78,10 @@ export interface OwnerIF {
   interestDenominator?: number
   interestNumerator?: number
   ownerId?: number
-  partyType?: string
+  organizationName?: string
+  partyType?: HomeOwnerPartyTypes
   phoneNumber?: string
+  phoneExtension?: number
   registrationDescription?: string
   status?: string
   type?: string

ppr-ui/src/resources/mhr-history/mhHistoryTableHeaders.ts

@@ -64,7 +64,7 @@ export const homeOwnerHeaders: Array<BaseHeaderIF> = [
   },
   {
     name: 'Owner Name',
-    value: ['individualName.first', 'individualName.middle', 'individualName.last'],
+    value: ['individualName.first', 'individualName.middle', 'individualName.last', 'organizationName'],
     class: 'col-22-5'
   },
   {