Skip to content

Commit

Permalink
PSP-8324 Update area convertor in Lease and License (#3981)
Browse files Browse the repository at this point in the history 
* Code cleanup

* Show common area component on lease view

* Update property-lease repository to return area unit type-code

* Use common area component to update lease property areas

* Test updates

* Increase spacing as per UI/UX review

* Update snapshots
  • Loading branch information
@asanchezr
asanchezr committed May 1, 2024
1 parent 40d8a14 commit d28be7b
Show file tree
Hide file tree
Showing 13 changed files with 653 additions and 185 deletions.
3 changes: 2 additions & 1 deletion source/backend/dal/Repositories/PropertyLeaseRepository.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,8 @@ public IEnumerable<PimsPropertyLease> GetAllByPropertyId(long propertyId)
/// <returns></returns>
public IEnumerable<PimsPropertyLease> GetAllByLeaseId(long leaseId)
{
return this.Context.PimsPropertyLeases.AsNoTracking()
return Context.PimsPropertyLeases.AsNoTracking()
.Include(pl => pl.AreaUnitTypeCodeNavigation)
.Include(pl => pl.Property)
.ThenInclude(p => p.Address)
.ThenInclude(p => p.Country)
Expand Down
56 changes: 27 additions & 29 deletions source/frontend/src/components/measurements/AreaView.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,37 +13,35 @@ interface IAreaViewProps {
const AreaView: React.FunctionComponent<IAreaViewProps> = props => {
const meters = convertArea(props.landArea || 0, props.unitCode || '', AreaUnitTypes.SquareMeters);
const feet = convertArea(props.landArea || 0, props.unitCode || '', AreaUnitTypes.SquareFeet);
const hectars = convertArea(props.landArea || 0, props.unitCode || '', AreaUnitTypes.Hectares);
const hectares = convertArea(props.landArea || 0, props.unitCode || '', AreaUnitTypes.Hectares);
const acres = convertArea(props.landArea || 0, props.unitCode || '', AreaUnitTypes.Acres);
return (
<>
<Row>
<Col>
<StyledGreenCol>
<Row>
<Col className="text-right">{formatNumber(meters, 0, 2)}</Col>
<Col>sq. metres</Col>
</Row>
<Row>
<Col className="text-right">{formatNumber(hectars, 0, 2)}</Col>
<Col>hectares</Col>
</Row>
</StyledGreenCol>
</Col>
<Col>
<StyledGreenGrey>
<Row>
<Col className="text-right">{formatNumber(feet, 0, 2)}</Col>
<Col>sq. feet</Col>
</Row>
<Row>
<Col className="text-right">{formatNumber(acres, 0, 2)}</Col>
<Col>acres</Col>
</Row>
</StyledGreenGrey>
</Col>
</Row>
</>
<Row>
<Col>
<StyledGreenCol>
<Row>
<Col className="text-right">{formatNumber(meters, 0, 2)}</Col>
<Col>sq. metres</Col>
</Row>
<Row>
<Col className="text-right">{formatNumber(hectares, 0, 2)}</Col>
<Col>hectares</Col>
</Row>
</StyledGreenCol>
</Col>
<Col>
<StyledGreenGrey>
<Row>
<Col className="text-right">{formatNumber(feet, 0, 2)}</Col>
<Col>sq. feet</Col>
</Row>
<Row>
<Col className="text-right">{formatNumber(acres, 0, 2)}</Col>
<Col>acres</Col>
</Row>
</StyledGreenGrey>
</Col>
</Row>
);
};

Expand Down
5 changes: 0 additions & 5 deletions source/frontend/src/features/leases/add/__snapshots__/AddLeaseContainer.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1343,11 +1343,6 @@ exports[`AddLeaseContainer component > renders as expected 1`] = `
</svg>
</span>
</div>
<div
class="col-3"
>
Area included
</div>
</div>
<span>
No Properties selected
Expand Down
12 changes: 6 additions & 6 deletions source/frontend/src/features/leases/detail/LeasePages/details/PropertyInformation.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,10 @@ import { createMemoryHistory } from 'history';
import noop from 'lodash/noop';

import { mockApiProperty } from '@/mocks/filterData.mock';
import { getMockApiLease } from '@/mocks/lease.mock';
import { getEmptyPropertyLease } from '@/mocks/properties.mock';
import { ApiGen_Concepts_Lease } from '@/models/api/generated/ApiGen_Concepts_Lease';
import { toTypeCodeNullable } from '@/utils/formUtils';
import { getMockApiLease } from '@/mocks/lease.mock';
import { render, RenderOptions } from '@/utils/test-utils';

import PropertyInformation, { IPropertyInformationProps } from './PropertyInformation';
Expand Down Expand Up @@ -45,7 +45,7 @@ describe('PropertyInformation component', () => {
fileProperties: [
{
...getEmptyPropertyLease(),
...mockApiProperty,
property: { ...mockApiProperty },
areaUnitType: toTypeCodeNullable('test'),
leaseArea: 123,
fileId: 0,
Expand All @@ -65,7 +65,7 @@ describe('PropertyInformation component', () => {
fileProperties: [
{
...getEmptyPropertyLease(),
...mockApiProperty,
property: { ...mockApiProperty },
areaUnitType: toTypeCodeNullable('test'),
leaseArea: 123,
fileId: 0,
Expand Down Expand Up @@ -94,7 +94,7 @@ describe('PropertyInformation component', () => {
fileProperties: [
{
...getEmptyPropertyLease(),
...mockApiProperty,
property: { ...mockApiProperty },
leaseArea: 1,
areaUnitType: toTypeCodeNullable('test'),
fileId: 0,
Expand Down Expand Up @@ -123,7 +123,7 @@ describe('PropertyInformation component', () => {
fileProperties: [
{
...getEmptyPropertyLease(),
...mockApiProperty,
property: { ...mockApiProperty },
leaseArea: 123,
areaUnitType: null,
fileId: 0,
Expand All @@ -141,7 +141,7 @@ describe('PropertyInformation component', () => {
startDate: '2020-01-01',
},
});
expect(component.getByText(/123.00/i)).toBeVisible();
expect(component.getByText(/123/i)).toBeVisible();
expect(component.queryByDisplayValue('undefined')).toBeNull();
});
});
20 changes: 9 additions & 11 deletions source/frontend/src/features/leases/detail/LeasePages/details/PropertyInformation.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,11 @@ import styled from 'styled-components';

import { Input } from '@/components/common/form';
import { SectionField } from '@/components/common/Section/SectionField';
import AreaContainer from '@/components/measurements/AreaContainer';
import { AreaUnitTypes } from '@/constants';
import { ApiGen_Base_CodeType } from '@/models/api/generated/ApiGen_Base_CodeType';
import { ApiGen_Concepts_Lease } from '@/models/api/generated/ApiGen_Concepts_Lease';
import { formatNumber, isValidId, isValidString, pidFormatter } from '@/utils';
import { isValidId, pidFormatter } from '@/utils';
import { withNameSpace } from '@/utils/formUtils';

import AddressSubForm from '../AddressSubForm';
Expand Down Expand Up @@ -47,18 +49,14 @@ export const PropertyInformation: React.FunctionComponent<
<SectionField label="Descriptive name" labelWidth="3">
<Input disabled={disabled} field={withNameSpace(nameSpace, 'propertyName')} />
</SectionField>
<SectionField label="Area included" labelWidth="3">
{formatNumber(landArea || 0, 2, 2)}{' '}
{isValidString(areaUnitType?.description) ? (
`${areaUnitType?.description}.`
) : (
<>
m<sup>2</sup>
</>
)}
<SectionField label="Area included" labelWidth="3" className="py-4">
<AreaContainer
landArea={landArea}
unitCode={areaUnitType?.id ?? AreaUnitTypes.SquareMeters}
/>
</SectionField>
{!hideAddress ? (
<SectionField label="Address" labelWidth="3">
<SectionField label="Address" labelWidth="3" className="py-2">
<AddressSubForm
nameSpace={withNameSpace(nameSpace, 'property.address')}
disabled={disabled}
Expand Down
98 changes: 92 additions & 6 deletions ...atures/leases/detail/LeasePages/details/__snapshots__/PropertiesInformation.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,20 @@ exports[`PropertiesInformation component > renders as expected 1`] = `
font-weight: bold;
}
.c6 {
max-width: 25rem;
padding: 1rem;
border: 1px solid;
border-radius: 0.5rem;
}
.c7 {
max-width: 25rem;
padding: 1rem;
border: 1px solid;
border-radius: 0.5rem;
}
.c3 {
margin-top: 4rem;
}
Expand Down Expand Up @@ -131,7 +145,7 @@ exports[`PropertiesInformation component > renders as expected 1`] = `
</div>
</div>
<div
class="pb-2 row"
class="py-4 row"
>
<div
class="pr-0 text-left col-3"
Expand All @@ -145,14 +159,86 @@ exports[`PropertiesInformation component > renders as expected 1`] = `
<div
class="c5 text-left col"
>
123.00 m
<sup>
2
</sup>
<div
class="row"
>
<div
class="col"
>
<div
class="c6"
>
<div
class="row"
>
<div
class="text-right col"
>
123
</div>
<div
class="col"
>
sq. metres
</div>
</div>
<div
class="row"
>
<div
class="text-right col"
>
0.01
</div>
<div
class="col"
>
hectares
</div>
</div>
</div>
</div>
<div
class="col"
>
<div
class="c7"
>
<div
class="row"
>
<div
class="text-right col"
>
1,323.96
</div>
<div
class="col"
>
sq. feet
</div>
</div>
<div
class="row"
>
<div
class="text-right col"
>
0.03
</div>
<div
class="col"
>
acres
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div
class="pb-2 row"
class="py-2 row"
>
<div
class="pr-0 text-left col-3"
Expand Down
Loading

0 comments on commit d28be7b

Please sign in to comment.