From b3613582257f20a52691cfb9d0b33c1cbd176b1b Mon Sep 17 00:00:00 2001
From: Herrera <eduardo.herrera@quartech.com>
Date: Wed, 15 May 2024 18:04:04 -0700
Subject: [PATCH 1/3] PSP-8314 : Record reason for rejecting or terminating a
 lease

---
 .../apimodels/CodeTypes/LeaseStatusTypes.cs   | 34 +++++++
 .../Models/Concepts/Lease/LeaseMap.cs         |  4 +
 .../Models/Concepts/Lease/LeaseModel.cs       |  4 +
 .../features/leases/add/AddLeaseYupSchema.ts  | 18 ++++
 .../leases/add/LeaseDetailSubForm.test.tsx    | 39 +++++++-
 .../leases/add/LeaseDetailSubForm.tsx         | 88 ++++++++++++++++++-
 .../detail/LeasePages/LeasePageForm.tsx       | 60 ++++++++++++-
 .../LeaseSearchResults/LeaseSearchResults.tsx |  2 +-
 source/frontend/src/features/leases/models.ts |  8 ++
 .../mapSideBar/lease/LeaseContainer.tsx       | 24 ++++-
 .../mapSideBar/lease/detail/LeaseTab.tsx      |  2 +-
 source/frontend/src/mocks/lease.mock.ts       |  2 +
 .../ApiGen_CodeTypes_LeaseStatusTypes.ts      | 14 +++
 .../api/generated/ApiGen_Concepts_Lease.ts    |  2 +
 .../src/models/defaultInitializers.ts         |  2 +
 15 files changed, 294 insertions(+), 9 deletions(-)
 create mode 100644 source/backend/apimodels/CodeTypes/LeaseStatusTypes.cs
 create mode 100644 source/frontend/src/models/api/generated/ApiGen_CodeTypes_LeaseStatusTypes.ts

diff --git a/source/backend/apimodels/CodeTypes/LeaseStatusTypes.cs b/source/backend/apimodels/CodeTypes/LeaseStatusTypes.cs
new file mode 100644
index 0000000000..b96e36add6
--- /dev/null
+++ b/source/backend/apimodels/CodeTypes/LeaseStatusTypes.cs
@@ -0,0 +1,34 @@
+using System.Runtime.Serialization;
+using System.Text.Json.Serialization;
+
+namespace Pims.Api.Models.CodeTypes
+{
+    [JsonConverter(typeof(JsonStringEnumMemberConverter))]
+
+    public enum LeaseStatusTypes
+    {
+        [EnumMember(Value = "ACTIVE")]
+        ACTIVE,
+
+        [EnumMember(Value = "ARCHIVED")]
+        ARCHIVED,
+
+        [EnumMember(Value = "DISCARD")]
+        DISCARD,
+
+        [EnumMember(Value = "DRAFT")]
+        DRAFT,
+
+        [EnumMember(Value = "DUPLICATE")]
+        DUPLICATE,
+
+        [EnumMember(Value = "EXPIRED")]
+        EXPIRED,
+
+        [EnumMember(Value = "INACTIVE")]
+        INACTIVE,
+
+        [EnumMember(Value = "TERMINATED")]
+        TERMINATED,
+    }
+}
diff --git a/source/backend/apimodels/Models/Concepts/Lease/LeaseMap.cs b/source/backend/apimodels/Models/Concepts/Lease/LeaseMap.cs
index d763697e3a..242a94a6d5 100644
--- a/source/backend/apimodels/Models/Concepts/Lease/LeaseMap.cs
+++ b/source/backend/apimodels/Models/Concepts/Lease/LeaseMap.cs
@@ -53,6 +53,8 @@ public void Register(TypeAdapterConfig config)
                 .Map(dest => dest.HasDigitalLicense, src => src.HasDigitalLicense)
                 .Map(dest => dest.HasDigitalFile, src => src.HasDigitalFile)
                 .Map(dest => dest.HasPhysicalLicense, src => src.HasPhysicialLicense)
+                .Map(dest => dest.CancellationReason, src => src.CancellationReason)
+                .Map(dest => dest.TerminationReason, src => src.TerminationReason)
                 .Map(dest => dest.Project, src => src.Project)
                 .Map(dest => dest.Tenants, src => src.PimsLeaseTenants)
                 .Map(dest => dest.Terms, src => src.PimsLeaseTerms);
@@ -93,6 +95,8 @@ public void Register(TypeAdapterConfig config)
                 .Map(dest => dest.HasPhysicialLicense, src => src.HasPhysicalLicense)
                 .Map(dest => dest.HasDigitalFile, src => src.HasDigitalFile)
                 .Map(dest => dest.HasDigitalLicense, src => src.HasDigitalLicense)
+                .Map(dest => dest.CancellationReason, src => src.CancellationReason)
+                .Map(dest => dest.TerminationReason, src => src.TerminationReason)
                 .Map(dest => dest.ProjectId, src => src.Project != null ? src.Project.Id : (long?)null)
                 .IgnoreNullValues(true);
         }
diff --git a/source/backend/apimodels/Models/Concepts/Lease/LeaseModel.cs b/source/backend/apimodels/Models/Concepts/Lease/LeaseModel.cs
index 420d4344ac..ec39cbfc74 100644
--- a/source/backend/apimodels/Models/Concepts/Lease/LeaseModel.cs
+++ b/source/backend/apimodels/Models/Concepts/Lease/LeaseModel.cs
@@ -186,6 +186,10 @@ public class LeaseModel : FileModel
 
         public bool? HasDigitalLicense { get; set; }
 
+        public string CancellationReason { get; set; }
+
+        public string TerminationReason { get; set; }
+
         public bool IsExpired { get; set; }
 
         /// <summary>
diff --git a/source/frontend/src/features/leases/add/AddLeaseYupSchema.ts b/source/frontend/src/features/leases/add/AddLeaseYupSchema.ts
index 3c1195ffda..4fbc201a82 100644
--- a/source/frontend/src/features/leases/add/AddLeaseYupSchema.ts
+++ b/source/frontend/src/features/leases/add/AddLeaseYupSchema.ts
@@ -1,6 +1,8 @@
 /* eslint-disable no-template-curly-in-string */
 import * as Yup from 'yup';
 
+import { ApiGen_CodeTypes_LeaseStatusTypes } from '@/models/api/generated/ApiGen_CodeTypes_LeaseStatusTypes';
+
 import { isLeaseCategoryVisible } from './AdministrationSubForm';
 
 export const AddLeaseYupSchema = Yup.object().shape({
@@ -79,4 +81,20 @@ export const AddLeaseYupSchema = Yup.object().shape({
         .max(2000, 'Other Description must be at most ${max} characters'),
     }),
   ),
+  cancellationReason: Yup.string().when('statusTypeCode', {
+    is: (statusTypeCode: string) =>
+      statusTypeCode && statusTypeCode === ApiGen_CodeTypes_LeaseStatusTypes.DISCARD.toString(),
+    then: Yup.string()
+      .required('Cancellation reason is required.')
+      .max(500, 'Cancellation reason must be at most ${max} characters'),
+    otherwise: Yup.string().nullable(),
+  }),
+  terminationReason: Yup.string().when('statusTypeCode', {
+    is: (statusTypeCode: string) =>
+      statusTypeCode && statusTypeCode === ApiGen_CodeTypes_LeaseStatusTypes.TERMINATED.toString(),
+    then: Yup.string()
+      .required('Termination reason is required.')
+      .max(500, 'Termination reason must be at most ${max} characters'),
+    otherwise: Yup.string().nullable(),
+  }),
 });
diff --git a/source/frontend/src/features/leases/add/LeaseDetailSubForm.test.tsx b/source/frontend/src/features/leases/add/LeaseDetailSubForm.test.tsx
index 52f31560ec..ff0a283eac 100644
--- a/source/frontend/src/features/leases/add/LeaseDetailSubForm.test.tsx
+++ b/source/frontend/src/features/leases/add/LeaseDetailSubForm.test.tsx
@@ -5,11 +5,20 @@ import noop from 'lodash/noop';
 import { useProjectTypeahead } from '@/hooks/useProjectTypeahead';
 import { mockLookups } from '@/mocks/lookups.mock';
 import { lookupCodesSlice } from '@/store/slices/lookupCodes';
-import { act, fillInput, renderAsync, RenderOptions, userEvent, waitFor } from '@/utils/test-utils';
+import {
+  act,
+  fillInput,
+  fireEvent,
+  renderAsync,
+  RenderOptions,
+  userEvent,
+  waitFor,
+} from '@/utils/test-utils';
 
 import { getDefaultFormLease } from '../models';
 import { AddLeaseYupSchema } from './AddLeaseYupSchema';
 import LeaseDetailSubForm, { ILeaseDetailsSubFormProps } from './LeaseDetailSubForm';
+import { ApiGen_CodeTypes_LeaseStatusTypes } from '@/models/api/generated/ApiGen_CodeTypes_LeaseStatusTypes';
 
 const history = createMemoryHistory();
 const storeState = {
@@ -42,12 +51,20 @@ describe('LeaseDetailSubForm component', () => {
     return {
       ...component,
       // Finding elements
+      getStatusDropDown: () =>
+        component.container.querySelector(`select[name="statusTypeCode"]`) as HTMLInputElement,
       getProjectSelector: () => {
         return document.querySelector(`input[name="typeahead-project"]`);
       },
       findProjectSelectorItems: async () => {
         return document.querySelectorAll(`a[id^="typeahead-project-item"]`);
       },
+      getTerminationReason: () => {
+        return document.querySelector(`textarea[name="terminationReason"]`);
+      },
+      getCancellationReason: () => {
+        return document.querySelector(`textarea[name="cancellationReason"]`);
+      },
     };
   };
 
@@ -94,4 +111,24 @@ describe('LeaseDetailSubForm component', () => {
     expect(items[0]).toHaveTextContent(/MOCK TEST PROJECT/i);
     expect(items[1]).toHaveTextContent(/ANOTHER MOCK/i);
   });
+
+  it('displays the cancellation reason textbox whe status is changed to "Cancelled"', async () => {
+    const { container, getCancellationReason } = await setup({});
+
+    await act(async () => {
+      fillInput(container, 'statusTypeCode', ApiGen_CodeTypes_LeaseStatusTypes.DISCARD, 'select');
+    });
+
+    expect(getCancellationReason()).toBeInTheDocument();
+  });
+
+  it('displays the confirmation modal when the status changed from "Cancelled" to other status', async () => {
+    const { container, getCancellationReason } = await setup({});
+
+    await act(async () => {
+      fillInput(container, 'statusTypeCode', ApiGen_CodeTypes_LeaseStatusTypes.DISCARD, 'select');
+    });
+
+    expect(getCancellationReason()).toBeInTheDocument();
+  });
 });
diff --git a/source/frontend/src/features/leases/add/LeaseDetailSubForm.tsx b/source/frontend/src/features/leases/add/LeaseDetailSubForm.tsx
index 8360d22423..2f41cbc1cc 100644
--- a/source/frontend/src/features/leases/add/LeaseDetailSubForm.tsx
+++ b/source/frontend/src/features/leases/add/LeaseDetailSubForm.tsx
@@ -1,11 +1,14 @@
 import { FormikProps } from 'formik/dist/types';
+import { useEffect, useState } from 'react';
 import { Col, Row } from 'react-bootstrap';
 
-import { FastDatePicker, ProjectSelector, Select } from '@/components/common/form';
+import { FastDatePicker, ProjectSelector, Select, TextArea } from '@/components/common/form';
 import { Section } from '@/components/common/Section/Section';
 import { SectionField } from '@/components/common/Section/SectionField';
 import * as API from '@/constants/API';
 import { useLookupCodeHelpers } from '@/hooks/useLookupCodeHelpers';
+import { useModalContext } from '@/hooks/useModalContext';
+import { ApiGen_CodeTypes_LeaseStatusTypes } from '@/models/api/generated/ApiGen_CodeTypes_LeaseStatusTypes';
 
 import { LeaseFormModel } from '../models';
 
@@ -17,8 +20,71 @@ export const LeaseDetailSubForm: React.FunctionComponent<ILeaseDetailsSubFormPro
   formikProps,
 }) => {
   const { getOptionsByType } = useLookupCodeHelpers();
+
+  const { values, setFieldValue } = formikProps;
+  const { statusTypeCode, terminationReason, cancellationReason } = values;
+
+  const [currentlLeaseStatus, setLeaseStatus] = useState<string>(statusTypeCode);
+  const { setModalContent, setDisplayModal } = useModalContext();
+
   const leaseStatusTypes = getOptionsByType(API.LEASE_STATUS_TYPES);
   const paymentReceivableTypes = getOptionsByType(API.LEASE_PAYMENT_RECEIVABLE_TYPES);
+
+  useEffect(() => {
+    if (statusTypeCode !== currentlLeaseStatus) {
+      setLeaseStatus(statusTypeCode);
+    }
+  }, [currentlLeaseStatus, statusTypeCode]);
+
+  const statusChangeModalContent = (status: string): React.ReactNode => {
+    return (
+      <>
+        <p>
+          The lease is no longer in <strong>{status}</strong> state. The reason for doing so will be
+          cleared from the file details and can only be viewed in the notes tab.
+          <br />
+          Do you want to proceed?
+        </p>
+      </>
+    );
+  };
+
+  const onLeaseStatusChanged = (newStatus: string): void => {
+    if (
+      (currentlLeaseStatus === ApiGen_CodeTypes_LeaseStatusTypes.DISCARD ||
+        currentlLeaseStatus === ApiGen_CodeTypes_LeaseStatusTypes.TERMINATED) &&
+      (terminationReason || cancellationReason) &&
+      newStatus !== currentlLeaseStatus
+    ) {
+      setModalContent({
+        variant: 'info',
+        title: 'Are you sure?',
+        message:
+          currentlLeaseStatus === ApiGen_CodeTypes_LeaseStatusTypes.DISCARD
+            ? statusChangeModalContent('Cancelled')
+            : statusChangeModalContent('Terminated'),
+        okButtonText: 'Yes',
+        handleOk: () => {
+          setFieldValue('statusTypeCode', newStatus);
+          if (currentlLeaseStatus === ApiGen_CodeTypes_LeaseStatusTypes.DISCARD) {
+            setFieldValue('cancellationReason', '');
+          } else if (currentlLeaseStatus === ApiGen_CodeTypes_LeaseStatusTypes.TERMINATED) {
+            setFieldValue('terminationReason', '');
+          }
+          setDisplayModal(false);
+        },
+        cancelButtonText: 'No',
+        handleCancel: () => {
+          setFieldValue('statusTypeCode', currentlLeaseStatus);
+          setDisplayModal(false);
+        },
+      });
+      setDisplayModal(true);
+    } else {
+      setFieldValue('statusTypeCode', newStatus);
+    }
+  };
+
   return (
     <Section>
       <SectionField label="Ministry project" labelWidth="2">
@@ -28,10 +94,30 @@ export const LeaseDetailSubForm: React.FunctionComponent<ILeaseDetailsSubFormPro
         <Select
           placeholder="Select Status"
           field="statusTypeCode"
+          value={currentlLeaseStatus}
           options={leaseStatusTypes}
+          onChange={(e: React.ChangeEvent<HTMLSelectElement>) => {
+            const selectedValue = [].slice
+              .call(e.target.selectedOptions)
+              .map((option: HTMLOptionElement & number) => option.value)[0];
+            onLeaseStatusChanged(selectedValue);
+          }}
           required
         />
       </SectionField>
+
+      {statusTypeCode === ApiGen_CodeTypes_LeaseStatusTypes.TERMINATED && (
+        <SectionField label="Termination reason" contentWidth="12" required>
+          <TextArea field="terminationReason" />
+        </SectionField>
+      )}
+
+      {statusTypeCode === ApiGen_CodeTypes_LeaseStatusTypes.DISCARD && (
+        <SectionField label="Cancellation reason" contentWidth="12" required>
+          <TextArea field="cancellationReason" />
+        </SectionField>
+      )}
+
       <SectionField label="Account type" labelWidth="2" contentWidth="5" required>
         <Select field="paymentReceivableTypeCode" options={paymentReceivableTypes} />
       </SectionField>
diff --git a/source/frontend/src/features/leases/detail/LeasePages/LeasePageForm.tsx b/source/frontend/src/features/leases/detail/LeasePages/LeasePageForm.tsx
index f5698ef173..5225a632f4 100644
--- a/source/frontend/src/features/leases/detail/LeasePages/LeasePageForm.tsx
+++ b/source/frontend/src/features/leases/detail/LeasePages/LeasePageForm.tsx
@@ -1,8 +1,14 @@
+import { useContext } from 'react';
 import styled from 'styled-components';
 
+import { LeasePageNames } from '@/features/mapSideBar/lease/LeaseContainer';
+import { ApiGen_CodeTypes_LeaseStatusTypes } from '@/models/api/generated/ApiGen_CodeTypes_LeaseStatusTypes';
+
+import { LeaseStateContext } from '../../context/LeaseContext';
 import LeaseEditButton from '../LeaseEditButton';
 
 export interface ILeasePageFormProps {
+  leasePageName: LeasePageNames;
   isEditing: boolean;
   onEdit?: () => void;
 }
@@ -13,11 +19,41 @@ export interface ILeasePageFormProps {
  */
 export const LeaseViewPageForm: React.FunctionComponent<
   React.PropsWithChildren<ILeasePageFormProps>
-> = ({ children, isEditing, onEdit }) => {
+> = ({ children, leasePageName, isEditing, onEdit }) => {
+  const { lease } = useContext(LeaseStateContext);
+
+  const DisplayLeaseTerminationMessage = () => {
+    if (lease && leasePageName === LeasePageNames.DETAILS) {
+      if (
+        lease.fileStatusTypeCode.id === ApiGen_CodeTypes_LeaseStatusTypes.DISCARD ||
+        lease.fileStatusTypeCode.id === ApiGen_CodeTypes_LeaseStatusTypes.TERMINATED
+      ) {
+        return true;
+      }
+
+      return false;
+    }
+
+    return false;
+  };
+
+  const getTerminationMessage = (): string => {
+    if (lease.fileStatusTypeCode.id === ApiGen_CodeTypes_LeaseStatusTypes.DISCARD) {
+      return lease.cancellationReason;
+    } else {
+      return lease.terminationReason;
+    }
+  };
+
   return (
     <StyledLeasePage>
       <StyledEditWrapper className="mr-3 my-1">
-        <LeaseEditButton onEdit={onEdit} isEditing={isEditing} />
+        <StyledTerminationWrapper>
+          {DisplayLeaseTerminationMessage() && (
+            <StyledTerminationMessage>{getTerminationMessage()}</StyledTerminationMessage>
+          )}
+          <LeaseEditButton onEdit={onEdit} isEditing={isEditing} />
+        </StyledTerminationWrapper>
       </StyledEditWrapper>
       <>{children}</>
     </StyledLeasePage>
@@ -39,4 +75,24 @@ const StyledLeasePage = styled.div`
   background-color: ${props => props.theme.css.highlightBackgroundColor};
 `;
 
+const StyledTerminationWrapper = styled.div`
+  display: flex;
+  flex-direction: row;
+  justify-content: flex-end;
+  align-items: center;
+`;
+
+const StyledTerminationMessage = styled.div`
+  flex-grow: 1;
+  margin-top: 1.5rem;
+  margin-left: 1.5rem;
+  margin-right: 1.5rem;
+  padding: 0.5rem;
+  background-color: white;
+  border-radius: 0.5rem;
+  align-content: center;
+  text-align: center;
+  font-style: italic;
+`;
+
 export default LeaseViewPageForm;
diff --git a/source/frontend/src/features/leases/list/LeaseSearchResults/LeaseSearchResults.tsx b/source/frontend/src/features/leases/list/LeaseSearchResults/LeaseSearchResults.tsx
index 8589f65fef..2047ff7ad7 100644
--- a/source/frontend/src/features/leases/list/LeaseSearchResults/LeaseSearchResults.tsx
+++ b/source/frontend/src/features/leases/list/LeaseSearchResults/LeaseSearchResults.tsx
@@ -184,7 +184,7 @@ const columns: ColumnWithProps<ApiGen_Concepts_Lease>[] = [
           ) : null}
           {otherNumbers ? (
             <label>
-              <span>OHER: </span>
+              <span>OTHER: </span>
               {otherNumbers}.
             </label>
           ) : null}
diff --git a/source/frontend/src/features/leases/models.ts b/source/frontend/src/features/leases/models.ts
index 516f1287f6..e9bde7c799 100644
--- a/source/frontend/src/features/leases/models.ts
+++ b/source/frontend/src/features/leases/models.ts
@@ -59,6 +59,8 @@ export class LeaseFormModel {
   documentationReference = '';
   hasPhysicalLicense?: boolean;
   hasDigitalLicense?: boolean;
+  cancellationReason: string | null = null;
+  terminationReason: string | null = null;
   project?: IAutocompletePrediction;
   tenantNotes: string[] = [];
   properties: FormLeaseProperty[] = [];
@@ -116,6 +118,8 @@ export class LeaseFormModel {
       sortedConsultations?.map(c => FormLeaseConsultation.fromApi(c)) || [];
     leaseDetail.terms = apiModel?.terms?.map(t => FormLeaseTerm.fromApi(t)) || [];
     leaseDetail.tenants = apiModel?.tenants?.map(t => new FormTenant(t)) || [];
+    leaseDetail.cancellationReason = apiModel.cancellationReason || '';
+    leaseDetail.terminationReason = apiModel.terminationReason || '';
 
     return leaseDetail;
   }
@@ -166,6 +170,8 @@ export class LeaseFormModel {
       fileNumber: null,
       hasDigitalFile: formLease.hasDigitalLicense ?? false,
       hasPhysicalFile: formLease.hasPhysicalLicense ?? false,
+      cancellationReason: stringToNull(formLease.cancellationReason),
+      terminationReason: stringToNull(formLease.terminationReason),
       isExpired: false,
       programName: null,
       renewalCount: 0,
@@ -320,6 +326,8 @@ export const getDefaultFormLease: () => LeaseFormModel = () =>
     responsibilityEffectiveDate: null,
     hasPhysicalFile: false,
     hasDigitalFile: false,
+    cancellationReason: null,
+    terminationReason: null,
     isExpired: false,
     project: null,
     ...getEmptyBaseAudit(),
diff --git a/source/frontend/src/features/mapSideBar/lease/LeaseContainer.tsx b/source/frontend/src/features/mapSideBar/lease/LeaseContainer.tsx
index 526a117608..435b2879a0 100644
--- a/source/frontend/src/features/mapSideBar/lease/LeaseContainer.tsx
+++ b/source/frontend/src/features/mapSideBar/lease/LeaseContainer.tsx
@@ -55,6 +55,7 @@ export interface LeasePageProps {
 }
 
 export interface ILeasePage {
+  pageName: LeasePageNames;
   component: React.FunctionComponent<React.PropsWithChildren<LeasePageProps>>;
   title: string;
   description?: string;
@@ -79,6 +80,7 @@ export const leasePages: Map<LeasePageNames, ILeasePage> = new Map<LeasePageName
   [
     LeasePageNames.DETAILS,
     {
+      pageName: LeasePageNames.DETAILS,
       component: DetailContainer,
       title: 'Details',
       validation: AddLeaseYupSchema,
@@ -87,6 +89,7 @@ export const leasePages: Map<LeasePageNames, ILeasePage> = new Map<LeasePageName
   [
     LeasePageNames.TENANT,
     {
+      pageName: LeasePageNames.TENANT,
       component: TenantContainer,
       title: 'Tenant',
     },
@@ -94,6 +97,7 @@ export const leasePages: Map<LeasePageNames, ILeasePage> = new Map<LeasePageName
   [
     LeasePageNames.PAYMENTS,
     {
+      pageName: LeasePageNames.PAYMENTS,
       component: TermPaymentsContainer,
       title: 'Payments',
       validation: TermPaymentsYupSchema,
@@ -102,6 +106,7 @@ export const leasePages: Map<LeasePageNames, ILeasePage> = new Map<LeasePageName
   [
     LeasePageNames.IMPROVEMENTS,
     {
+      pageName: LeasePageNames.IMPROVEMENTS,
       component: ImprovementsContainer,
       title: 'Improvements',
     },
@@ -109,15 +114,27 @@ export const leasePages: Map<LeasePageNames, ILeasePage> = new Map<LeasePageName
   [
     LeasePageNames.INSURANCE,
     {
+      pageName: LeasePageNames.INSURANCE,
       component: InsuranceContainer,
       title: 'Insurance',
     },
   ],
-  [LeasePageNames.DEPOSIT, { component: DepositsContainer, title: 'Deposit' }],
-  [LeasePageNames.SURPLUS, { component: Surplus, title: 'Surplus Declaration' }],
+  [
+    LeasePageNames.DEPOSIT,
+    { pageName: LeasePageNames.DEPOSIT, component: DepositsContainer, title: 'Deposit' },
+  ],
+  [
+    LeasePageNames.SURPLUS,
+    { pageName: LeasePageNames.SURPLUS, component: Surplus, title: 'Surplus Declaration' },
+  ],
   [
     LeasePageNames.DOCUMENTS,
-    { component: DocumentsPage, title: 'Documents', claims: Claims.DOCUMENT_VIEW },
+    {
+      pageName: LeasePageNames.DOCUMENTS,
+      component: DocumentsPage,
+      title: 'Documents',
+      claims: Claims.DOCUMENT_VIEW,
+    },
   ],
 ]);
 
@@ -142,6 +159,7 @@ export const LeaseContainer: React.FC<ILeaseContainerProps> = ({ leaseId, onClos
   const [isValid, setIsValid] = useState<boolean>(true);
 
   const activeTab = containerState.activeTab;
+
   useEffect(() => {
     if (activeTab === LeaseFileTabNames.deposit || activeTab === LeaseFileTabNames.payments) {
       setFullWidth(true);
diff --git a/source/frontend/src/features/mapSideBar/lease/detail/LeaseTab.tsx b/source/frontend/src/features/mapSideBar/lease/detail/LeaseTab.tsx
index 970ccfadaa..bf985f6936 100644
--- a/source/frontend/src/features/mapSideBar/lease/detail/LeaseTab.tsx
+++ b/source/frontend/src/features/mapSideBar/lease/detail/LeaseTab.tsx
@@ -28,7 +28,7 @@ export const LeaseTab: React.FC<ILeaseTabProps> = ({
   const Component = leasePage.component;
 
   return (
-    <LeaseViewPageForm isEditing={isEditing} onEdit={onEdit}>
+    <LeaseViewPageForm isEditing={isEditing} onEdit={onEdit} leasePageName={leasePage.pageName}>
       <Component
         onEdit={onEdit}
         isEditing={isEditing}
diff --git a/source/frontend/src/mocks/lease.mock.ts b/source/frontend/src/mocks/lease.mock.ts
index c923d1bfa1..b213049a53 100644
--- a/source/frontend/src/mocks/lease.mock.ts
+++ b/source/frontend/src/mocks/lease.mock.ts
@@ -47,6 +47,8 @@ const emptyLease: ApiGen_Concepts_Lease = {
   hasDigitalLicense: null,
   isExpired: false,
   project: null,
+  cancellationReason: null,
+  terminationReason: null,
   ...getEmptyBaseAudit(),
   fileName: null,
   fileNumber: null,
diff --git a/source/frontend/src/models/api/generated/ApiGen_CodeTypes_LeaseStatusTypes.ts b/source/frontend/src/models/api/generated/ApiGen_CodeTypes_LeaseStatusTypes.ts
new file mode 100644
index 0000000000..2ac9d2f120
--- /dev/null
+++ b/source/frontend/src/models/api/generated/ApiGen_CodeTypes_LeaseStatusTypes.ts
@@ -0,0 +1,14 @@
+/**
+ * File autogenerated by TsGenerator.
+ * Do not manually modify, changes made to this file will be lost when this file is regenerated.
+ */
+export enum ApiGen_CodeTypes_LeaseStatusTypes {
+  ACTIVE = 'ACTIVE',
+  ARCHIVED = 'ARCHIVED',
+  DISCARD = 'DISCARD',
+  DRAFT = 'DRAFT',
+  DUPLICATE = 'DUPLICATE',
+  EXPIRED = 'EXPIRED',
+  INACTIVE = 'INACTIVE',
+  TERMINATED = 'TERMINATED',
+}
diff --git a/source/frontend/src/models/api/generated/ApiGen_Concepts_Lease.ts b/source/frontend/src/models/api/generated/ApiGen_Concepts_Lease.ts
index 8341f2ec77..61cefeb9ca 100644
--- a/source/frontend/src/models/api/generated/ApiGen_Concepts_Lease.ts
+++ b/source/frontend/src/models/api/generated/ApiGen_Concepts_Lease.ts
@@ -51,6 +51,8 @@ export interface ApiGen_Concepts_Lease extends ApiGen_Concepts_File {
   hasDigitalFile: boolean;
   hasPhysicalLicense: boolean | null;
   hasDigitalLicense: boolean | null;
+  cancellationReason: string | null;
+  terminationReason: string | null;
   isExpired: boolean;
   project: ApiGen_Concepts_Project | null;
 }
diff --git a/source/frontend/src/models/defaultInitializers.ts b/source/frontend/src/models/defaultInitializers.ts
index 6c564f7dc0..d6a0445e77 100644
--- a/source/frontend/src/models/defaultInitializers.ts
+++ b/source/frontend/src/models/defaultInitializers.ts
@@ -68,6 +68,8 @@ export const getEmptyLease = (): ApiGen_Concepts_Lease => ({
   project: null,
   fileName: null,
   fileNumber: null,
+  cancellationReason: null,
+  terminationReason: null,
   ...getEmptyBaseAudit(),
 });
 

From 2098d075e9cd0d7afb662401f50d930c25a4e557 Mon Sep 17 00:00:00 2001
From: Herrera <eduardo.herrera@quartech.com>
Date: Fri, 17 May 2024 10:45:12 -0700
Subject: [PATCH 2/3] - updates

---
 source/backend/api/Services/LeaseService.cs   | 62 ++++++++++++++-----
 .../leases/add/LeaseDetailSubForm.test.tsx    |  8 +--
 .../leases/add/LeaseDetailSubForm.tsx         | 25 +++-----
 .../detail/LeasePages/LeasePageForm.tsx       | 18 ++----
 4 files changed, 65 insertions(+), 48 deletions(-)

diff --git a/source/backend/api/Services/LeaseService.cs b/source/backend/api/Services/LeaseService.cs
index 17e562e78a..0bc1b28f38 100644
--- a/source/backend/api/Services/LeaseService.cs
+++ b/source/backend/api/Services/LeaseService.cs
@@ -3,6 +3,7 @@
 using System.Globalization;
 using System.Linq;
 using System.Security.Claims;
+using System.Text;
 using Microsoft.Extensions.Logging;
 using Pims.Api.Models.CodeTypes;
 using Pims.Core.Exceptions;
@@ -31,6 +32,7 @@ public class LeaseService : BaseService, ILeaseService
         private readonly ILeaseTenantRepository _tenantRepository;
         private readonly IUserRepository _userRepository;
         private readonly IPropertyService _propertyService;
+        private readonly ILookupRepository _lookupRepository;
 
         public LeaseService(
             ClaimsPrincipal user,
@@ -44,7 +46,8 @@ public LeaseService(
             IInsuranceRepository insuranceRepository,
             ILeaseTenantRepository tenantRepository,
             IUserRepository userRepository,
-            IPropertyService propertyService)
+            IPropertyService propertyService,
+            ILookupRepository lookupRepository)
             : base(user, logger)
         {
             _logger = logger;
@@ -59,6 +62,7 @@ public LeaseService(
             _tenantRepository = tenantRepository;
             _userRepository = userRepository;
             _propertyService = propertyService;
+            _lookupRepository = lookupRepository;
         }
 
         public bool IsRowVersionEqual(long leaseId, long rowVersion)
@@ -219,20 +223,9 @@ public PimsLease Update(PimsLease lease, IEnumerable<UserOverrideCode> userOverr
 
             if (currentLease.LeaseStatusTypeCode != lease.LeaseStatusTypeCode)
             {
-                _entityNoteRepository.Add(
-                    new PimsLeaseNote()
-                    {
-                        LeaseId = currentLease.LeaseId,
-                        AppCreateTimestamp = System.DateTime.Now,
-                        AppCreateUserid = this.User.GetUsername(),
-                        Note = new PimsNote()
-                        {
-                            IsSystemGenerated = true,
-                            NoteTxt = $"Lease status changed from {currentLease.LeaseStatusTypeCode} to {lease.LeaseStatusTypeCode}",
-                            AppCreateTimestamp = System.DateTime.Now,
-                            AppCreateUserid = this.User.GetUsername(),
-                        },
-                    });
+                PimsLeaseNote newLeaseNote = GeneratePimsLeaseNote(currentLease, lease);
+
+                _entityNoteRepository.Add(newLeaseNote);
             }
 
             _leaseRepository.Update(lease, false);
@@ -256,6 +249,45 @@ public PimsLease Update(PimsLease lease, IEnumerable<UserOverrideCode> userOverr
             return _leaseRepository.GetNoTracking(lease.LeaseId);
         }
 
+        private PimsLeaseNote GeneratePimsLeaseNote(PimsLease currentLease, PimsLease lease)
+        {
+            var leaseStatuses = _lookupRepository.GetAllLeaseStatusTypes();
+            string currentStatusDescription = leaseStatuses.FirstOrDefault(x => x.Id == currentLease.LeaseStatusTypeCode).Description.ToUpper();
+            string newStatusDescription = leaseStatuses.FirstOrDefault(x => x.Id == lease.LeaseStatusTypeCode).Description.ToUpper();
+
+            StringBuilder leaseNoteTextValue = new();
+            PimsLeaseNote leaseNote = new()
+            {
+                LeaseId = currentLease.LeaseId,
+                AppCreateTimestamp = DateTime.Now,
+                AppCreateUserid = User.GetUsername(),
+                Note = new PimsNote()
+                {
+                    IsSystemGenerated = true,
+                    NoteTxt = leaseNoteTextValue.Append($"Lease status changed from {currentStatusDescription} to {newStatusDescription}").ToString(),
+                    AppCreateTimestamp = DateTime.Now,
+                    AppCreateUserid = User.GetUsername(),
+                },
+            };
+
+            if (lease.LeaseStatusTypeCode == LeaseStatusTypes.DISCARD.ToString() || lease.LeaseStatusTypeCode == LeaseStatusTypes.TERMINATED.ToString())
+            {
+                leaseNoteTextValue.Append(". Reason: ");
+                if (lease.LeaseStatusTypeCode == LeaseStatusTypes.DISCARD.ToString())
+                {
+                    leaseNoteTextValue.Append($"{lease.CancellationReason}.");
+                }
+                else
+                {
+                    leaseNoteTextValue.Append($"{lease.TerminationReason}.");
+                }
+
+                leaseNote.Note.NoteTxt = leaseNoteTextValue.ToString();
+            }
+
+            return leaseNote;
+        }
+
         private IEnumerable<PimsPropertyLease> ReprojectPropertyLocationsToWgs84(IEnumerable<PimsPropertyLease> propertyLeases)
         {
             List<PimsPropertyLease> reprojectedProperties = new List<PimsPropertyLease>();
diff --git a/source/frontend/src/features/leases/add/LeaseDetailSubForm.test.tsx b/source/frontend/src/features/leases/add/LeaseDetailSubForm.test.tsx
index ff0a283eac..8c160abbbf 100644
--- a/source/frontend/src/features/leases/add/LeaseDetailSubForm.test.tsx
+++ b/source/frontend/src/features/leases/add/LeaseDetailSubForm.test.tsx
@@ -122,13 +122,13 @@ describe('LeaseDetailSubForm component', () => {
     expect(getCancellationReason()).toBeInTheDocument();
   });
 
-  it('displays the confirmation modal when the status changed from "Cancelled" to other status', async () => {
-    const { container, getCancellationReason } = await setup({});
+  it('displays the termination reason textbox whe status is changed to "Terminated"', async () => {
+    const { container, getTerminationReason } = await setup({});
 
     await act(async () => {
-      fillInput(container, 'statusTypeCode', ApiGen_CodeTypes_LeaseStatusTypes.DISCARD, 'select');
+      fillInput(container, 'statusTypeCode', ApiGen_CodeTypes_LeaseStatusTypes.TERMINATED, 'select');
     });
 
-    expect(getCancellationReason()).toBeInTheDocument();
+    expect(getTerminationReason()).toBeInTheDocument();
   });
 });
diff --git a/source/frontend/src/features/leases/add/LeaseDetailSubForm.tsx b/source/frontend/src/features/leases/add/LeaseDetailSubForm.tsx
index 2f41cbc1cc..7b6088793c 100644
--- a/source/frontend/src/features/leases/add/LeaseDetailSubForm.tsx
+++ b/source/frontend/src/features/leases/add/LeaseDetailSubForm.tsx
@@ -1,5 +1,4 @@
 import { FormikProps } from 'formik/dist/types';
-import { useEffect, useState } from 'react';
 import { Col, Row } from 'react-bootstrap';
 
 import { FastDatePicker, ProjectSelector, Select, TextArea } from '@/components/common/form';
@@ -24,18 +23,11 @@ export const LeaseDetailSubForm: React.FunctionComponent<ILeaseDetailsSubFormPro
   const { values, setFieldValue } = formikProps;
   const { statusTypeCode, terminationReason, cancellationReason } = values;
 
-  const [currentlLeaseStatus, setLeaseStatus] = useState<string>(statusTypeCode);
   const { setModalContent, setDisplayModal } = useModalContext();
 
   const leaseStatusTypes = getOptionsByType(API.LEASE_STATUS_TYPES);
   const paymentReceivableTypes = getOptionsByType(API.LEASE_PAYMENT_RECEIVABLE_TYPES);
 
-  useEffect(() => {
-    if (statusTypeCode !== currentlLeaseStatus) {
-      setLeaseStatus(statusTypeCode);
-    }
-  }, [currentlLeaseStatus, statusTypeCode]);
-
   const statusChangeModalContent = (status: string): React.ReactNode => {
     return (
       <>
@@ -51,31 +43,30 @@ export const LeaseDetailSubForm: React.FunctionComponent<ILeaseDetailsSubFormPro
 
   const onLeaseStatusChanged = (newStatus: string): void => {
     if (
-      (currentlLeaseStatus === ApiGen_CodeTypes_LeaseStatusTypes.DISCARD ||
-        currentlLeaseStatus === ApiGen_CodeTypes_LeaseStatusTypes.TERMINATED) &&
-      (terminationReason || cancellationReason) &&
-      newStatus !== currentlLeaseStatus
+      (statusTypeCode === ApiGen_CodeTypes_LeaseStatusTypes.DISCARD ||
+        statusTypeCode === ApiGen_CodeTypes_LeaseStatusTypes.TERMINATED) &&
+      (terminationReason || cancellationReason)
     ) {
       setModalContent({
         variant: 'info',
         title: 'Are you sure?',
         message:
-          currentlLeaseStatus === ApiGen_CodeTypes_LeaseStatusTypes.DISCARD
+          statusTypeCode === ApiGen_CodeTypes_LeaseStatusTypes.DISCARD
             ? statusChangeModalContent('Cancelled')
             : statusChangeModalContent('Terminated'),
         okButtonText: 'Yes',
         handleOk: () => {
           setFieldValue('statusTypeCode', newStatus);
-          if (currentlLeaseStatus === ApiGen_CodeTypes_LeaseStatusTypes.DISCARD) {
+          if (statusTypeCode === ApiGen_CodeTypes_LeaseStatusTypes.DISCARD) {
             setFieldValue('cancellationReason', '');
-          } else if (currentlLeaseStatus === ApiGen_CodeTypes_LeaseStatusTypes.TERMINATED) {
+          } else if (statusTypeCode === ApiGen_CodeTypes_LeaseStatusTypes.TERMINATED) {
             setFieldValue('terminationReason', '');
           }
           setDisplayModal(false);
         },
         cancelButtonText: 'No',
         handleCancel: () => {
-          setFieldValue('statusTypeCode', currentlLeaseStatus);
+          setFieldValue('statusTypeCode', statusTypeCode);
           setDisplayModal(false);
         },
       });
@@ -94,7 +85,7 @@ export const LeaseDetailSubForm: React.FunctionComponent<ILeaseDetailsSubFormPro
         <Select
           placeholder="Select Status"
           field="statusTypeCode"
-          value={currentlLeaseStatus}
+          value={statusTypeCode}
           options={leaseStatusTypes}
           onChange={(e: React.ChangeEvent<HTMLSelectElement>) => {
             const selectedValue = [].slice
diff --git a/source/frontend/src/features/leases/detail/LeasePages/LeasePageForm.tsx b/source/frontend/src/features/leases/detail/LeasePages/LeasePageForm.tsx
index 5225a632f4..bdda9974eb 100644
--- a/source/frontend/src/features/leases/detail/LeasePages/LeasePageForm.tsx
+++ b/source/frontend/src/features/leases/detail/LeasePages/LeasePageForm.tsx
@@ -23,18 +23,12 @@ export const LeaseViewPageForm: React.FunctionComponent<
   const { lease } = useContext(LeaseStateContext);
 
   const DisplayLeaseTerminationMessage = () => {
-    if (lease && leasePageName === LeasePageNames.DETAILS) {
-      if (
-        lease.fileStatusTypeCode.id === ApiGen_CodeTypes_LeaseStatusTypes.DISCARD ||
-        lease.fileStatusTypeCode.id === ApiGen_CodeTypes_LeaseStatusTypes.TERMINATED
-      ) {
-        return true;
-      }
-
-      return false;
-    }
-
-    return false;
+    return (
+      lease &&
+      leasePageName === LeasePageNames.DETAILS &&
+      (lease.fileStatusTypeCode.id === ApiGen_CodeTypes_LeaseStatusTypes.DISCARD ||
+        lease.fileStatusTypeCode.id === ApiGen_CodeTypes_LeaseStatusTypes.TERMINATED)
+    );
   };
 
   const getTerminationMessage = (): string => {

From b1fa56248e5bc826b16886afe057dab2b39b975e Mon Sep 17 00:00:00 2001
From: Herrera <eduardo.herrera@quartech.com>
Date: Fri, 17 May 2024 11:13:19 -0700
Subject: [PATCH 3/3] - test updates

---
 .../tests/unit/api/Services/LeaseServiceTest.cs    | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/source/backend/tests/unit/api/Services/LeaseServiceTest.cs b/source/backend/tests/unit/api/Services/LeaseServiceTest.cs
index 94085db1e3..1e3e732e61 100644
--- a/source/backend/tests/unit/api/Services/LeaseServiceTest.cs
+++ b/source/backend/tests/unit/api/Services/LeaseServiceTest.cs
@@ -211,9 +211,23 @@ public void Update_WithStatusNote()
 
             var leaseRepository = this._helper.GetService<Mock<ILeaseRepository>>();
             var userRepository = this._helper.GetService<Mock<IUserRepository>>();
+            var lookupRepository = this._helper.GetService<Mock<ILookupRepository>>();
+
             leaseRepository.Setup(x => x.GetNoTracking(It.IsAny<long>())).Returns(currentLeaseEntity);
             leaseRepository.Setup(x => x.Get(It.IsAny<long>())).Returns(EntityHelper.CreateLease(1));
             userRepository.Setup(x => x.GetByKeycloakUserId(It.IsAny<Guid>())).Returns(new PimsUser());
+            lookupRepository.Setup(x => x.GetAllLeaseStatusTypes()).Returns(new List<PimsLeaseStatusType>() {
+                new PimsLeaseStatusType()
+                {
+                   LeaseStatusTypeCode= "STATUS_A",
+                   Description = "STATUS_A",
+                },
+                new PimsLeaseStatusType()
+                {
+                   LeaseStatusTypeCode= "STATUS_B",
+                   Description = "STATUS_B",
+                },
+            });
 
             var noteRepository = this._helper.GetService<Mock<IEntityNoteRepository>>();