diff --git a/source/frontend/src/features/mapSideBar/property/tabs/propertyDetails/detail/OperationSectionView.test.tsx b/source/frontend/src/features/mapSideBar/property/tabs/propertyDetails/detail/OperationSectionView.test.tsx new file mode 100644 index 0000000000..5fbdb00e6a --- /dev/null +++ b/source/frontend/src/features/mapSideBar/property/tabs/propertyDetails/detail/OperationSectionView.test.tsx @@ -0,0 +1,112 @@ +import { lookupCodesSlice } from '@/store/slices/lookupCodes'; +import { createMemoryHistory } from 'history'; +import { mockLookups } from '@/mocks/lookups.mock'; +import { render, RenderOptions } from '@/utils/test-utils'; +import { EpochIsoDateTime } from '@/models/api/UtcIsoDateTime'; +import { getEmptyProperty } from '@/models/defaultInitializers'; +import { ApiGen_Concepts_Property } from '@/models/api/generated/ApiGen_Concepts_Property'; +import { ApiGen_CodeTypes_PropertyOperationTypes } from '@/models/api/generated/ApiGen_CodeTypes_PropertyOperationTypes'; +import { + IOperationSectionViewProps, + OperationSectionView, +} from './propertyOperation/OperationSectionView'; +import { OperationSet } from './propertyOperation/OperationContainer'; +import { getMockApiProperties } from '@/mocks/properties.mock'; + +const history = createMemoryHistory(); +const store = { [lookupCodesSlice.name]: { lookupCodes: mockLookups } }; + +describe('Operation section view', () => { + const setup = ( + renderOptions: RenderOptions & { props?: Partial } = {}, + ) => { + const props = renderOptions.props; + const component = render( + , + { + ...renderOptions, + useMockAuthentication: true, + claims: renderOptions?.claims, + history: history, + store: store, + }, + ); + + return { ...component }; + }; + + it('matches snapshot', () => { + const subdivisionOperations: OperationSet[] = [ + { + sourceProperties: [getMockApiProperties()[0]], + destinationProperties: [getMockApiProperties()[1]], + operationDateTime: '2020-01-01', + operationType: ApiGen_CodeTypes_PropertyOperationTypes.SUBDIVIDE, + }, + ]; + const consolidationOperations: OperationSet[] = [ + { + sourceProperties: [getMockApiProperties()[0]], + destinationProperties: [getMockApiProperties()[1]], + operationDateTime: '2020-01-01', + operationType: ApiGen_CodeTypes_PropertyOperationTypes.CONSOLIDATE, + }, + ]; + const { asFragment } = setup({ props: { subdivisionOperations, consolidationOperations } }); + expect(asFragment()).toMatchSnapshot(); + }); + + it('Displays the empty subdivisions message', async () => { + const subdivisionOperations: OperationSet[] = [ + { + sourceProperties: [], + destinationProperties: [], + operationDateTime: '2020-01-01', + operationType: ApiGen_CodeTypes_PropertyOperationTypes.SUBDIVIDE, + }, + ]; + const consolidationOperations: OperationSet[] = [ + { + sourceProperties: [getMockApiProperties()[0]], + destinationProperties: [getMockApiProperties()[1]], + operationDateTime: '2020-01-01', + operationType: ApiGen_CodeTypes_PropertyOperationTypes.CONSOLIDATE, + }, + ]; + + const { getByText, container } = setup({ + props: { subdivisionOperations, consolidationOperations }, + }); + + expect(getByText('This property is not part of a subdivision')).toBeVisible(); + }); + + it('Displays the empty consolidations message', async () => { + const subdivisionOperations: OperationSet[] = [ + { + sourceProperties: [getMockApiProperties()[0]], + destinationProperties: [getMockApiProperties()[1]], + operationDateTime: '2020-01-01', + operationType: ApiGen_CodeTypes_PropertyOperationTypes.SUBDIVIDE, + }, + ]; + const consolidationOperations: OperationSet[] = [ + { + sourceProperties: [], + destinationProperties: [], + operationDateTime: '2020-01-01', + operationType: ApiGen_CodeTypes_PropertyOperationTypes.CONSOLIDATE, + }, + ]; + + const { getByText, container } = setup({ + props: { subdivisionOperations, consolidationOperations }, + }); + + expect(getByText('This property is not part of a consolidation')).toBeVisible(); + }); +}); diff --git a/source/frontend/src/features/mapSideBar/property/tabs/propertyDetails/detail/__snapshots__/OperationSectionView.test.tsx.snap b/source/frontend/src/features/mapSideBar/property/tabs/propertyDetails/detail/__snapshots__/OperationSectionView.test.tsx.snap new file mode 100644 index 0000000000..62579c66ba --- /dev/null +++ b/source/frontend/src/features/mapSideBar/property/tabs/propertyDetails/detail/__snapshots__/OperationSectionView.test.tsx.snap @@ -0,0 +1,848 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Operation section view matches snapshot 1`] = ` + +
+
+ .c6 { + float: right; + cursor: pointer; +} + +.c1 { + font-weight: bold; + border-bottom: 0.2rem solid; + margin-bottom: 2rem; +} + +.c3 { + font-size: 1.0em; + border-bottom: 0.2rem solid; + margin-bottom: 2rem; +} + +.c0 { + margin: 1.5rem; + padding: 1.5rem; + background-color: white; + text-align: left; + border-radius: 0.5rem; +} + +.c2 { + background-color: white; + text-align: left; + border-radius: 0.5rem; +} + +.c5.required::before { + content: '*'; + position: absolute; + top: 0.75rem; + left: 0rem; +} + +.c4 { + font-weight: bold; +} + +
+

+
+
+ Subdivision History +
+
+

+
+
+

+
+
+
+
+ +
+
+ Dec 31, 2019 at 04:00 pm +
+
+
+
+ + + collapse-section + + + + +
+
+

+
+
+
+
+
+
+
+ Parent +
+
+
+
+ Identifier +
+
+
+
+ Plan # +
+
+
+
+ Status +
+
+
+
+ Area +
+
+
+
+
+
+
+
+ + + + +
+
+ + + + + +
+
+ + Location: 123.000000, 48.000000 + + + + +
+
+ +
+
+ Active +
+
+ 123 m + + 2 + +
+
+
+
+
+
+ + + + +
+
+
+ + PID: 000-000-001 + + + + +
+
+ +
+
+ Active +
+
+ 123 m + + 2 + +
+
+
+
+
+
+
+
+
+ .c6 { + float: right; + cursor: pointer; +} + +.c1 { + font-weight: bold; + border-bottom: 0.2rem solid; + margin-bottom: 2rem; +} + +.c3 { + font-size: 1.0em; + border-bottom: 0.2rem solid; + margin-bottom: 2rem; +} + +.c0 { + margin: 1.5rem; + padding: 1.5rem; + background-color: white; + text-align: left; + border-radius: 0.5rem; +} + +.c2 { + background-color: white; + text-align: left; + border-radius: 0.5rem; +} + +.c5.required::before { + content: '*'; + position: absolute; + top: 0.75rem; + left: 0rem; +} + +.c4 { + font-weight: bold; +} + +
+

+
+
+ Consolidation History +
+
+

+
+
+

+
+
+
+
+ +
+
+ Dec 31, 2019 at 04:00 pm +
+
+
+
+ + + collapse-section + + + + +
+
+

+
+
+
+
+
+
+
+ Child +
+
+
+
+ Identifier +
+
+
+
+ Plan # +
+
+
+
+ Status +
+
+
+
+ Area +
+
+
+
+
+
+
+
+ + + + +
+
+
+ + Location: 123.000000, 48.000000 + + + + +
+
+ +
+
+ Active +
+
+ 123 m + + 2 + +
+
+
+
+
+
+ + + + +
+
+ + + + + +
+
+ + PID: 000-000-001 + + + + +
+
+ +
+
+ Active +
+
+ 123 m + + 2 + +
+
+
+
+
+
+
+
+
+ +`; diff --git a/source/frontend/src/features/mapSideBar/property/tabs/propertyDetails/detail/__snapshots__/PropertyDetailsTabView.test.tsx.snap b/source/frontend/src/features/mapSideBar/property/tabs/propertyDetails/detail/__snapshots__/PropertyDetailsTabView.test.tsx.snap index 7a0be2cdfa..403bc4a187 100644 --- a/source/frontend/src/features/mapSideBar/property/tabs/propertyDetails/detail/__snapshots__/PropertyDetailsTabView.test.tsx.snap +++ b/source/frontend/src/features/mapSideBar/property/tabs/propertyDetails/detail/__snapshots__/PropertyDetailsTabView.test.tsx.snap @@ -75,6 +75,11 @@ exports[`PropertyDetailsTabView component renders as expected when provided vali border-radius: 0.5rem; } +.c10 { + text-align: center; + font-style: italic; +} +
@@ -750,7 +755,13 @@ exports[`PropertyDetailsTabView component renders as expected when provided vali
+ > +
+ This property is not part of a subdivision +
+
+ > +
+ This property is not part of a consolidation +
+
diff --git a/source/frontend/src/features/mapSideBar/property/tabs/propertyDetails/detail/propertyOperation/OperationSectionView.tsx b/source/frontend/src/features/mapSideBar/property/tabs/propertyDetails/detail/propertyOperation/OperationSectionView.tsx index efb61cd8fa..054362ebdc 100644 --- a/source/frontend/src/features/mapSideBar/property/tabs/propertyDetails/detail/propertyOperation/OperationSectionView.tsx +++ b/source/frontend/src/features/mapSideBar/property/tabs/propertyDetails/detail/propertyOperation/OperationSectionView.tsx @@ -1,5 +1,8 @@ +import React from 'react'; + import LoadingBackdrop from '@/components/common/LoadingBackdrop'; import { Section } from '@/components/common/Section/Section'; +import { StyledNoData } from '@/features/documents/commonStyles'; import { ApiGen_CodeTypes_PropertyOperationTypes } from '@/models/api/generated/ApiGen_CodeTypes_PropertyOperationTypes'; import { OperationSet } from './OperationContainer'; @@ -17,36 +20,49 @@ export const OperationSectionView: React.FunctionComponent { + const hasSubdivisions = subdivisionOperations.length > 0; + const hasConsolidations = consolidationOperations.length > 0; return ( <>
- - {subdivisionOperations.map((operationSet, index) => ( + {hasSubdivisions ? ( <> - - {index < subdivisionOperations.length - 1 &&
} + + {subdivisionOperations.map((operationSet, index) => ( + + + {index < subdivisionOperations.length - 1 &&
} + + ))} - ))} + ) : ( + This property is not part of a subdivision + )}
- - {consolidationOperations.map((operationSet, index) => ( - - ))} + {hasConsolidations ? ( + <> + + {consolidationOperations.map((operationSet, index) => ( + + ))} + + ) : ( + This property is not part of a consolidation + )}
);