diff --git a/source/frontend/src/components/common/HeaderField/AuditSection.tsx b/source/frontend/src/components/common/HeaderField/AuditSection.tsx new file mode 100644 index 0000000000..cc23984989 --- /dev/null +++ b/source/frontend/src/components/common/HeaderField/AuditSection.tsx @@ -0,0 +1,50 @@ +import { Col, Row } from 'react-bootstrap'; +import styled from 'styled-components'; + +import { UserNameTooltip } from '@/components/common/UserNameTooltip'; +import { Api_LastUpdatedBy } from '@/models/api/File'; +import { ApiGen_Base_BaseAudit } from '@/models/api/generated/ApiGen_Base_BaseAudit'; +import { prettyFormatUTCDate } from '@/utils'; + +export interface IAuditSectionProps { + baseAudit: ApiGen_Base_BaseAudit; + lastUpdatedBy: Api_LastUpdatedBy; +} + +export const AuditSection: React.FC = ({ baseAudit, lastUpdatedBy }) => { + return ( + <> + + + + Created: + {prettyFormatUTCDate(baseAudit?.appCreateTimestamp)} by{' '} + + + + + + + + Updated: + {prettyFormatUTCDate(lastUpdatedBy?.appLastUpdateTimestamp)} by{' '} + + + + + + ); +}; + +export default AuditSection; + +const StyledSmallText = styled.span` + font-size: 0.87em; + line-height: 1.9; +`; diff --git a/source/frontend/src/components/common/HeaderField/HeaderField.tsx b/source/frontend/src/components/common/HeaderField/HeaderField.tsx index bb5d2aa195..f4d49afdc6 100644 --- a/source/frontend/src/components/common/HeaderField/HeaderField.tsx +++ b/source/frontend/src/components/common/HeaderField/HeaderField.tsx @@ -29,7 +29,9 @@ export const HeaderField: React.FC> = export const HeaderLabelCol: React.FC = props => ( - + + + ); @@ -42,7 +44,7 @@ export const HeaderContentCol: React.FC< className="pl-1 text-left" data-testid={props.valueTestId} > - {props.children} + {props.children} ); }; diff --git a/source/frontend/src/components/common/UserNameTooltip.tsx b/source/frontend/src/components/common/UserNameTooltip.tsx index ca2c600feb..526b43155f 100644 --- a/source/frontend/src/components/common/UserNameTooltip.tsx +++ b/source/frontend/src/components/common/UserNameTooltip.tsx @@ -44,6 +44,6 @@ export const UserNameTooltip: FunctionComponent = ({ innerClassName={'userNameTooltip'} toolTip={userNameInfo} customToolTipIcon={{userName ?? 'USER'}} - > + /> ); }; diff --git a/source/frontend/src/components/common/styles.ts b/source/frontend/src/components/common/styles.ts index a0abd5be5a..fd32f8af7b 100644 --- a/source/frontend/src/components/common/styles.ts +++ b/source/frontend/src/components/common/styles.ts @@ -36,7 +36,7 @@ export const Breadcrumb = styled(BsBreadcrumb)` export const SelectedText = styled.p` font-size: 1.4rem; - color: ${props => props.theme.bcTokens.iconColorSuccess}; + color: ${props => props.theme.bcTokens.iconsColorSuccess}; `; /** @@ -132,7 +132,7 @@ export const FilterBoxForm = styled(Form)` export const StyledAddButton = styled(Button)` &.btn.btn-primary, &.btn.btn-primary:active { - background-color: ${props => props.theme.bcTokens.iconColorSuccess}; + background-color: ${props => props.theme.bcTokens.iconsColorSuccess}; } `; diff --git a/source/frontend/src/components/measurements/styles.tsx b/source/frontend/src/components/measurements/styles.tsx index b78e9b4ac3..84a61974ab 100644 --- a/source/frontend/src/components/measurements/styles.tsx +++ b/source/frontend/src/components/measurements/styles.tsx @@ -4,7 +4,7 @@ export const StyledGreenCol = styled.div` max-width: 25rem; padding: 1rem; background-color: ${props => props.theme.css.highlightBackgroundColor}; - border: 1px solid ${props => props.theme.bcTokens.iconColorSuccess}; + border: 1px solid ${props => props.theme.bcTokens.iconsColorSuccess}; border-radius: 0.5rem; `; diff --git a/source/frontend/src/features/acquisition/list/AcquisitionListView.tsx b/source/frontend/src/features/acquisition/list/AcquisitionListView.tsx index b5f49238a1..bd698d7759 100644 --- a/source/frontend/src/features/acquisition/list/AcquisitionListView.tsx +++ b/source/frontend/src/features/acquisition/list/AcquisitionListView.tsx @@ -140,7 +140,7 @@ export const AcquisitionListView: React.FunctionComponent< const StyledAddButton = styled(Button)` &.btn.btn-primary { - background-color: ${props => props.theme.bcTokens.iconColorSuccess}; + background-color: ${props => props.theme.bcTokens.iconsColorSuccess}; } `; diff --git a/source/frontend/src/features/admin/financial-codes/list/FinancialCodeListView.tsx b/source/frontend/src/features/admin/financial-codes/list/FinancialCodeListView.tsx index 587be505df..255f154284 100644 --- a/source/frontend/src/features/admin/financial-codes/list/FinancialCodeListView.tsx +++ b/source/frontend/src/features/admin/financial-codes/list/FinancialCodeListView.tsx @@ -125,7 +125,7 @@ export const FinancialCodeListView: React.FC = () => { const StyledAddButton = styled(Button)` &.btn.btn-primary { - background-color: ${props => props.theme.bcTokens.iconColorSuccess}; + background-color: ${props => props.theme.bcTokens.iconsColorSuccess}; } `; diff --git a/source/frontend/src/features/contacts/styles.ts b/source/frontend/src/features/contacts/styles.ts index 5392aa7607..bc4200fc7b 100644 --- a/source/frontend/src/features/contacts/styles.ts +++ b/source/frontend/src/features/contacts/styles.ts @@ -25,8 +25,8 @@ export const StatusIndicators = styled.div` padding: 0.2rem 1rem; color: ${props => props.theme.css.borderOutlineColor}; &.active { - color: ${props => props.theme.bcTokens.iconColorSuccess}; - border: 1px solid ${props => props.theme.bcTokens.iconColorSuccess}; + color: ${props => props.theme.bcTokens.iconsColorSuccess}; + border: 1px solid ${props => props.theme.bcTokens.iconsColorSuccess}; } `; diff --git a/source/frontend/src/features/leases/detail/LeasePages/payment/styles.tsx b/source/frontend/src/features/leases/detail/LeasePages/payment/styles.tsx index c5028e4aae..2f096346f2 100644 --- a/source/frontend/src/features/leases/detail/LeasePages/payment/styles.tsx +++ b/source/frontend/src/features/leases/detail/LeasePages/payment/styles.tsx @@ -171,7 +171,7 @@ export const WarningTextBox = styled(InlineFlexDiv)` export const AddActualButton = styled(Button)` &&& { - background-color: ${props => props.theme.bcTokens.iconColorSuccess}; + background-color: ${props => props.theme.bcTokens.iconsColorSuccess}; color: white; &:hover { background-color: #3aba53; diff --git a/source/frontend/src/features/leases/detail/LeaseStatusSummary.tsx b/source/frontend/src/features/leases/detail/LeaseStatusSummary.tsx index 947e39d262..5bb50fc046 100644 --- a/source/frontend/src/features/leases/detail/LeaseStatusSummary.tsx +++ b/source/frontend/src/features/leases/detail/LeaseStatusSummary.tsx @@ -46,9 +46,9 @@ const StyledLeaseStatusSummary = styled.div` } } &.active { - border: 1px solid ${props => props.theme.bcTokens.iconColorSuccess}; + border: 1px solid ${props => props.theme.bcTokens.iconsColorSuccess}; b:first-child { - color: ${props => props.theme.bcTokens.iconColorSuccess}; + color: ${props => props.theme.bcTokens.iconsColorSuccess}; } } &.terminated { diff --git a/source/frontend/src/features/leases/list/LeaseListView.tsx b/source/frontend/src/features/leases/list/LeaseListView.tsx index f04538482b..02604b9b6c 100644 --- a/source/frontend/src/features/leases/list/LeaseListView.tsx +++ b/source/frontend/src/features/leases/list/LeaseListView.tsx @@ -128,7 +128,7 @@ export const LeaseListView: React.FunctionComponent props.theme.bcTokens.iconColorSuccess}; + background-color: ${props => props.theme.bcTokens.iconsColorSuccess}; } `; diff --git a/source/frontend/src/features/mapSideBar/acquisition/AcquisitionView.test.tsx b/source/frontend/src/features/mapSideBar/acquisition/AcquisitionView.test.tsx index 38cc338709..8946e7cace 100644 --- a/source/frontend/src/features/mapSideBar/acquisition/AcquisitionView.test.tsx +++ b/source/frontend/src/features/mapSideBar/acquisition/AcquisitionView.test.tsx @@ -170,9 +170,11 @@ describe('AcquisitionView component', () => { expect(getByText('Acquisition File')).toBeVisible(); expect(getByText('1-12345-01 - Test ACQ File')).toBeVisible(); - expect(getByText(prettyFormatUTCDate(testAcquisitionFile.appCreateTimestamp))).toBeVisible(); expect( - getByText(prettyFormatUTCDate(mockLastUpdatedBy(1).appLastUpdateTimestamp)), + getByText(new RegExp(prettyFormatUTCDate(testAcquisitionFile.appCreateTimestamp))), + ).toBeVisible(); + expect( + getByText(new RegExp(prettyFormatUTCDate(mockLastUpdatedBy(1).appLastUpdateTimestamp))), ).toBeVisible(); }); diff --git a/source/frontend/src/features/mapSideBar/acquisition/__snapshots__/AcquisitionView.test.tsx.snap b/source/frontend/src/features/mapSideBar/acquisition/__snapshots__/AcquisitionView.test.tsx.snap index 91d2d9bee7..f35435ba46 100644 --- a/source/frontend/src/features/mapSideBar/acquisition/__snapshots__/AcquisitionView.test.tsx.snap +++ b/source/frontend/src/features/mapSideBar/acquisition/__snapshots__/AcquisitionView.test.tsx.snap @@ -89,6 +89,11 @@ exports[`AcquisitionView component > renders as expected 1`] = ` position: relative; } +.c2 { + font-size: 0.87em; + line-height: 1.9; +} + .c1 { margin-top: 0.5rem; margin-bottom: 1.5rem; @@ -97,11 +102,6 @@ exports[`AcquisitionView component > renders as expected 1`] = ` border-bottom-width: 0.1rem; } -.c2 { - font-size: 0.87em; - line-height: 1.9; -} -
@@ -123,16 +123,16 @@ exports[`AcquisitionView component > renders as expected 1`] = `
- + + +
- - 1-12345-01 - Test ACQ File - + 1-12345-01 - Test ACQ File
@@ -149,16 +149,16 @@ exports[`AcquisitionView component > renders as expected 1`] = `
- + + +
- - 001 - Hwy 14 Expansion - Vancouver Island but it's really long so it can wrap around if it has to - + 001 - Hwy 14 Expansion - Vancouver Island but it's really long so it can wrap around if it has to
@@ -175,17 +175,17 @@ exports[`AcquisitionView component > renders as expected 1`] = `
- + + +
- - 00048 - MISCELLANEOUS CLAIMS - + 00048 - MISCELLANEOUS CLAIMS
@@ -196,14 +196,16 @@ exports[`AcquisitionView component > renders as expected 1`] = `
- + + +
- +
@@ -219,11 +221,10 @@ exports[`AcquisitionView component > renders as expected 1`] = ` - Created: - May 27, 2022 + Created: - by + May 27, 2022 by renders as expected 1`] = ` - Last updated: - Oct 6, 2023 + Updated: - by + Oct 6, 2023 by renders as expected 1`] = `
- + + +
- - Active - + Active
diff --git a/source/frontend/src/features/mapSideBar/acquisition/common/AcquisitionHeader.test.tsx b/source/frontend/src/features/mapSideBar/acquisition/common/AcquisitionHeader.test.tsx index 5438247ed3..34d2c2be0c 100644 --- a/source/frontend/src/features/mapSideBar/acquisition/common/AcquisitionHeader.test.tsx +++ b/source/frontend/src/features/mapSideBar/acquisition/common/AcquisitionHeader.test.tsx @@ -54,9 +54,11 @@ describe('AcquisitionHeader component', () => { await act(async () => {}); expect(getByText('1-12345-01 - Test ACQ File')).toBeVisible(); - expect(getByText(prettyFormatUTCDate(testAcquisitionFile.appCreateTimestamp))).toBeVisible(); expect( - getByText(prettyFormatUTCDate(testAcquisitionFile.appLastUpdateTimestamp)), + getByText(new RegExp(prettyFormatUTCDate(testAcquisitionFile.appCreateTimestamp))), + ).toBeVisible(); + expect( + getByText(new RegExp(prettyFormatUTCDate(testAcquisitionFile.appLastUpdateTimestamp))), ).toBeVisible(); }); @@ -124,7 +126,9 @@ describe('AcquisitionHeader component', () => { await act(async () => {}); expect(getByText('1-12345-01 - Test ACQ File')).toBeVisible(); - expect(getByText(prettyFormatUTCDate(testAcquisitionFile.appCreateTimestamp))).toBeVisible(); - expect(getByText(prettyFormatUTCDate(testDate))).toBeVisible(); + expect( + getByText(new RegExp(prettyFormatUTCDate(testAcquisitionFile.appCreateTimestamp))), + ).toBeVisible(); + expect(getByText(new RegExp(prettyFormatUTCDate(testDate)))).toBeVisible(); }); }); diff --git a/source/frontend/src/features/mapSideBar/acquisition/common/AcquisitionHeader.tsx b/source/frontend/src/features/mapSideBar/acquisition/common/AcquisitionHeader.tsx index fc606a72da..9eaeec9baa 100644 --- a/source/frontend/src/features/mapSideBar/acquisition/common/AcquisitionHeader.tsx +++ b/source/frontend/src/features/mapSideBar/acquisition/common/AcquisitionHeader.tsx @@ -2,11 +2,10 @@ import React from 'react'; import { Col, Row } from 'react-bootstrap'; import styled from 'styled-components'; +import AuditSection from '@/components/common/HeaderField/AuditSection'; import { HeaderField } from '@/components/common/HeaderField/HeaderField'; -import { UserNameTooltip } from '@/components/common/UserNameTooltip'; import { Api_LastUpdatedBy } from '@/models/api/File'; import { ApiGen_Concepts_AcquisitionFile } from '@/models/api/generated/ApiGen_Concepts_AcquisitionFile'; -import { prettyFormatUTCDate } from '@/utils'; import { formatMinistryProject } from '@/utils/formUtils'; import HistoricalNumbersContainer from '../../shared/header/HistoricalNumberContainer'; @@ -64,30 +63,7 @@ export const AcquisitionHeader: React.FunctionComponent< - - - - Created: {prettyFormatUTCDate(acquisitionFile?.appCreateTimestamp)}{' '} - by{' '} - - - - - - - - Last updated:{' '} - {prettyFormatUTCDate(lastUpdatedBy?.appLastUpdateTimestamp)} by{' '} - - - - + @@ -109,8 +85,3 @@ const StyledRow = styled(Row)` border-bottom-color: grey; border-bottom-width: 0.1rem; `; - -const StyleSmallText = styled.span` - font-size: 0.87em; - line-height: 1.9; -`; diff --git a/source/frontend/src/features/mapSideBar/acquisition/common/__snapshots__/AcquisitionHeader.test.tsx.snap b/source/frontend/src/features/mapSideBar/acquisition/common/__snapshots__/AcquisitionHeader.test.tsx.snap index 2e09d95cbc..86ebfc5cb9 100644 --- a/source/frontend/src/features/mapSideBar/acquisition/common/__snapshots__/AcquisitionHeader.test.tsx.snap +++ b/source/frontend/src/features/mapSideBar/acquisition/common/__snapshots__/AcquisitionHeader.test.tsx.snap @@ -6,7 +6,12 @@ exports[`AcquisitionHeader component > renders as expected when no data is provi class="Toastify" />
- .c0 { + .c1 { + font-size: 0.87em; + line-height: 1.9; +} + +.c0 { margin-top: 0.5rem; margin-bottom: 1.5rem; border-bottom-style: solid; @@ -14,11 +19,6 @@ exports[`AcquisitionHeader component > renders as expected when no data is provi border-bottom-width: 0.1rem; } -.c1 { - font-size: 0.87em; - line-height: 1.9; -} -
@@ -37,16 +37,16 @@ exports[`AcquisitionHeader component > renders as expected when no data is provi
- + + +
- - - - + -
@@ -63,15 +63,15 @@ exports[`AcquisitionHeader component > renders as expected when no data is provi
- + + +
- -
+ /> @@ -87,16 +87,16 @@ exports[`AcquisitionHeader component > renders as expected when no data is provi
- + + +
- -
+ /> @@ -106,14 +106,16 @@ exports[`AcquisitionHeader component > renders as expected when no data is provi
- + + +
- +
@@ -129,8 +131,9 @@ exports[`AcquisitionHeader component > renders as expected when no data is provi - Created: - + + Created: + by renders as expected when no data is provi - Last updated: - + + Updated: + by renders as expected when no data is provi
- + + +
- -
+ /> diff --git a/source/frontend/src/features/mapSideBar/acquisition/tabs/compensation/detail/__snapshots__/CompensationRequisitionDetailView.test.tsx.snap b/source/frontend/src/features/mapSideBar/acquisition/tabs/compensation/detail/__snapshots__/CompensationRequisitionDetailView.test.tsx.snap index a4eeed2f28..480cb9ab97 100644 --- a/source/frontend/src/features/mapSideBar/acquisition/tabs/compensation/detail/__snapshots__/CompensationRequisitionDetailView.test.tsx.snap +++ b/source/frontend/src/features/mapSideBar/acquisition/tabs/compensation/detail/__snapshots__/CompensationRequisitionDetailView.test.tsx.snap @@ -254,17 +254,17 @@ exports[`Compensation Detail View Component > renders as expected 1`] = `
- + + +
- - 034 - + 034
renders as expected 1`] = `
- + + +
- - 1 - + 1
@@ -296,21 +296,21 @@ exports[`Compensation Detail View Component > renders as expected 1`] = `
- + + +
- -

- $0.00 -

- +

+ $0.00 +

renders as expected 1`] = `
- + + +
- -

- $0.00 -

- +

+ $0.00 +

renders as expected 1`] = `
- + + +
- -

- $0.00 -

- +

+ $0.00 +

diff --git a/source/frontend/src/features/mapSideBar/disposition/DispositionView.test.tsx b/source/frontend/src/features/mapSideBar/disposition/DispositionView.test.tsx index 052e84e6d3..54278a6c71 100644 --- a/source/frontend/src/features/mapSideBar/disposition/DispositionView.test.tsx +++ b/source/frontend/src/features/mapSideBar/disposition/DispositionView.test.tsx @@ -205,7 +205,9 @@ describe('DispositionView component', () => { expect(getByText('Disposition File')).toBeVisible(); expect(getByText(/FILE_NUMBER 3A8F46B/i)).toBeVisible(); - expect(getByText(prettyFormatUTCDate(testDispositionFile.appCreateTimestamp))).toBeVisible(); + expect( + getByText(new RegExp(prettyFormatUTCDate(testDispositionFile.appCreateTimestamp))), + ).toBeVisible(); }); it('should display the Edit Properties button if the user has permissions', async () => { diff --git a/source/frontend/src/features/mapSideBar/disposition/__snapshots__/DispositionView.test.tsx.snap b/source/frontend/src/features/mapSideBar/disposition/__snapshots__/DispositionView.test.tsx.snap index b05116f1ba..961b85a574 100644 --- a/source/frontend/src/features/mapSideBar/disposition/__snapshots__/DispositionView.test.tsx.snap +++ b/source/frontend/src/features/mapSideBar/disposition/__snapshots__/DispositionView.test.tsx.snap @@ -89,6 +89,11 @@ exports[`DispositionView component > renders as expected 1`] = ` position: relative; } +.c2 { + font-size: 0.87em; + line-height: 1.9; +} + .c1 { margin-top: 0.5rem; margin-bottom: 1.5rem; @@ -97,11 +102,6 @@ exports[`DispositionView component > renders as expected 1`] = ` border-bottom-width: 0.1rem; } -.c2 { - font-size: 0.87em; - line-height: 1.9; -} -
@@ -123,16 +123,16 @@ exports[`DispositionView component > renders as expected 1`] = `
- + + +
- - D-FILE_NUMBER 3A8F46B - + D-FILE_NUMBER 3A8F46B
@@ -143,14 +143,16 @@ exports[`DispositionView component > renders as expected 1`] = `
- + + +
- +
@@ -163,48 +165,56 @@ exports[`DispositionView component > renders as expected 1`] = `
- - Created: - - Nov 25, 2023 - - by - - - FOUGSTER - - - -
- -
-
- + + Created: + + Nov 25, 2023 by + + + FOUGSTER + + + +
+
+
- Last updated: - - by - - - USER - - - + + + Updated: + + by + + + USER + + + +
+
renders as expected 1`] = `
- + + +
- - Draft - + Draft
diff --git a/source/frontend/src/features/mapSideBar/disposition/common/DispositionHeader.test.tsx b/source/frontend/src/features/mapSideBar/disposition/common/DispositionHeader.test.tsx index a09f09e3af..075ffdf67c 100644 --- a/source/frontend/src/features/mapSideBar/disposition/common/DispositionHeader.test.tsx +++ b/source/frontend/src/features/mapSideBar/disposition/common/DispositionHeader.test.tsx @@ -73,9 +73,11 @@ describe('DispositionHeader component', () => { }); expect(getByText(/FILE_NUMBER 3A8F46B/)).toBeVisible(); - expect(getByText(prettyFormatUTCDate(testDispositionFile.appCreateTimestamp))).toBeVisible(); expect( - getByText(prettyFormatUTCDate(testDispositionFile.appLastUpdateTimestamp)), + getByText(new RegExp(prettyFormatUTCDate(testDispositionFile.appCreateTimestamp))), + ).toBeVisible(); + expect( + getByText(new RegExp(prettyFormatUTCDate(testDispositionFile.appLastUpdateTimestamp))), ).toBeVisible(); }); @@ -104,8 +106,10 @@ describe('DispositionHeader component', () => { }); expect(getByText(/FILE_NUMBER 3A8F46B/)).toBeVisible(); - expect(getByText(prettyFormatUTCDate(testDispositionFile.appCreateTimestamp))).toBeVisible(); - expect(getByText(prettyFormatUTCDate(testDate))).toBeVisible(); + expect( + getByText(new RegExp(prettyFormatUTCDate(testDispositionFile.appCreateTimestamp))), + ).toBeVisible(); + expect(getByText(new RegExp(prettyFormatUTCDate(testDate)))).toBeVisible(); }); it('renders the file status when provided', async () => { diff --git a/source/frontend/src/features/mapSideBar/disposition/common/DispositionHeader.tsx b/source/frontend/src/features/mapSideBar/disposition/common/DispositionHeader.tsx index d09f768b84..e8fc8e7de5 100644 --- a/source/frontend/src/features/mapSideBar/disposition/common/DispositionHeader.tsx +++ b/source/frontend/src/features/mapSideBar/disposition/common/DispositionHeader.tsx @@ -2,11 +2,10 @@ import React from 'react'; import { Col, Row } from 'react-bootstrap'; import styled from 'styled-components'; +import AuditSection from '@/components/common/HeaderField/AuditSection'; import { HeaderField } from '@/components/common/HeaderField/HeaderField'; -import { UserNameTooltip } from '@/components/common/UserNameTooltip'; import { Api_LastUpdatedBy } from '@/models/api/File'; import { ApiGen_Concepts_DispositionFile } from '@/models/api/generated/ApiGen_Concepts_DispositionFile'; -import { prettyFormatUTCDate } from '@/utils/dateUtils'; import HistoricalNumbersContainer from '../../shared/header/HistoricalNumberContainer'; import HistoricalNumberFieldView from '../../shared/header/HistoricalNumberSectionView'; @@ -40,26 +39,7 @@ export const DispositionHeader: React.FunctionComponent< - - Created: {prettyFormatUTCDate(dispositionFile?.appCreateTimestamp)}{' '} - by{' '} - - - - - - - - Last updated:{' '} - {prettyFormatUTCDate(lastUpdatedBy?.appLastUpdateTimestamp)} by{' '} - - + @@ -83,8 +63,3 @@ const StyledRow = styled(Row)` border-bottom-color: grey; border-bottom-width: 0.1rem; `; - -const StyleSmallText = styled.span` - font-size: 0.87em; - line-height: 1.9; -`; diff --git a/source/frontend/src/features/mapSideBar/disposition/common/__snapshots__/DispositionHeader.test.tsx.snap b/source/frontend/src/features/mapSideBar/disposition/common/__snapshots__/DispositionHeader.test.tsx.snap index 74f8afca79..19b7af0ba0 100644 --- a/source/frontend/src/features/mapSideBar/disposition/common/__snapshots__/DispositionHeader.test.tsx.snap +++ b/source/frontend/src/features/mapSideBar/disposition/common/__snapshots__/DispositionHeader.test.tsx.snap @@ -6,7 +6,12 @@ exports[`DispositionHeader component > renders as expected when no data is provi class="Toastify" />
- .c0 { + .c1 { + font-size: 0.87em; + line-height: 1.9; +} + +.c0 { margin-top: 0.5rem; margin-bottom: 1.5rem; border-bottom-style: solid; @@ -14,11 +19,6 @@ exports[`DispositionHeader component > renders as expected when no data is provi border-bottom-width: 0.1rem; } -.c1 { - font-size: 0.87em; - line-height: 1.9; -} -
@@ -37,16 +37,16 @@ exports[`DispositionHeader component > renders as expected when no data is provi
- + + +
- - D- - + D-
@@ -57,14 +57,16 @@ exports[`DispositionHeader component > renders as expected when no data is provi
- + + +
- +
@@ -77,46 +79,56 @@ exports[`DispositionHeader component > renders as expected when no data is provi
- - Created: - - by - - - USER - - - -
- -
-
- + + Created: + + by + + + USER + + + +
+
+
- Last updated: - - by - - - USER - - - + + + Updated: + + by + + + USER + + + +
+
renders as expected when no data is provi
- + + +
- -
+ />
diff --git a/source/frontend/src/features/mapSideBar/lease/common/LeaseHeader.test.tsx b/source/frontend/src/features/mapSideBar/lease/common/LeaseHeader.test.tsx index 59b3b29240..75828079c2 100644 --- a/source/frontend/src/features/mapSideBar/lease/common/LeaseHeader.test.tsx +++ b/source/frontend/src/features/mapSideBar/lease/common/LeaseHeader.test.tsx @@ -51,8 +51,12 @@ describe('LeaseHeader component', () => { expect(getByText(testLease.lFileNo!)).toBeVisible(); expect(getByText(testLease.appCreateUserid!)).toBeVisible(); expect(getByText(testLease.appLastUpdateUserid!)).toBeVisible(); - expect(getAllByText(prettyFormatUTCDate(testLease.appCreateTimestamp))[0]).toBeVisible(); - expect(getAllByText(prettyFormatUTCDate(testLease.appLastUpdateTimestamp))[0]).toBeVisible(); + expect( + getAllByText(new RegExp(prettyFormatUTCDate(testLease.appCreateTimestamp)))[0], + ).toBeVisible(); + expect( + getAllByText(new RegExp(prettyFormatUTCDate(testLease.appLastUpdateTimestamp)))[0], + ).toBeVisible(); }); it('renders the last-update-time when provided', async () => { @@ -69,7 +73,11 @@ describe('LeaseHeader component', () => { }); await act(async () => {}); - expect(getAllByText(prettyFormatUTCDate(testLease.appCreateTimestamp))[0]).toBeVisible(); - expect(getAllByText(prettyFormatUTCDate(testLease.appLastUpdateTimestamp))[0]).toBeVisible(); + expect( + getAllByText(new RegExp(prettyFormatUTCDate(testLease.appCreateTimestamp)))[0], + ).toBeVisible(); + expect( + getAllByText(new RegExp(prettyFormatUTCDate(testLease.appLastUpdateTimestamp)))[0], + ).toBeVisible(); }); }); diff --git a/source/frontend/src/features/mapSideBar/lease/common/LeaseHeader.tsx b/source/frontend/src/features/mapSideBar/lease/common/LeaseHeader.tsx index 1b6f97e56c..c637f7425e 100644 --- a/source/frontend/src/features/mapSideBar/lease/common/LeaseHeader.tsx +++ b/source/frontend/src/features/mapSideBar/lease/common/LeaseHeader.tsx @@ -4,17 +4,17 @@ import { Col, Row } from 'react-bootstrap'; import { AiOutlineExclamationCircle } from 'react-icons/ai'; import styled from 'styled-components'; +import AuditSection from '@/components/common/HeaderField/AuditSection'; import { HeaderContentCol, HeaderField, HeaderLabelCol, } from '@/components/common/HeaderField/HeaderField'; import { InlineFlexDiv } from '@/components/common/styles'; -import { UserNameTooltip } from '@/components/common/UserNameTooltip'; import { LeaseHeaderAddresses } from '@/features/leases/detail/LeaseHeaderAddresses'; import { Api_LastUpdatedBy } from '@/models/api/File'; import { ApiGen_Concepts_Lease } from '@/models/api/generated/ApiGen_Concepts_Lease'; -import { prettyFormatDate, prettyFormatUTCDate } from '@/utils'; +import { prettyFormatDate } from '@/utils'; import HistoricalNumbersContainer from '../../shared/header/HistoricalNumberContainer'; import HistoricalNumberFieldView from '../../shared/header/HistoricalNumberSectionView'; @@ -35,10 +35,8 @@ export const LeaseHeader: React.FC = ({ lease, lastUpdatedBy - - {lease?.lFileNo ?? ''} - {lease?.paymentReceivableType?.description ?? ''} - + {lease?.lFileNo ?? ''} + {lease?.paymentReceivableType?.description ?? ''} = ({ lease, lastUpdatedBy /> - + {prettyFormatDate(lease?.startDate)} - + {prettyFormatDate(lease?.expiryDate)} + + {isExpired && ( + + +   EXPIRED + + )} + - - - - Created: {prettyFormatUTCDate(lease?.appCreateTimestamp)} by{' '} - - - - - - - - Last updated:{' '} - {prettyFormatUTCDate(lastUpdatedBy?.appLastUpdateTimestamp)} by{' '} - - - - + @@ -98,16 +82,6 @@ export const LeaseHeader: React.FC = ({ lease, lastUpdatedBy - - - {isExpired && ( - - -   EXPIRED - - )} - - @@ -124,18 +98,9 @@ const Container = styled.div` border-bottom-width: 0.1rem; `; -const StyledSmallText = styled.span` - font-size: 0.87em; - line-height: 1.9; -`; - -const StyledInlineDiv = styled(InlineFlexDiv)` - justify-content: space-between; - width: 100%; -`; - const StyledGreenText = styled.span` - color: ${props => props.theme.bcTokens.iconColorSuccess}; + font-weight: bold; + color: ${props => props.theme.bcTokens.iconsColorSuccess}; `; export const ExpiredWarning = styled(InlineFlexDiv)` diff --git a/source/frontend/src/features/mapSideBar/lease/common/__snapshots__/LeaseHeader.test.tsx.snap b/source/frontend/src/features/mapSideBar/lease/common/__snapshots__/LeaseHeader.test.tsx.snap index 8c7acda237..8c5efcaa1a 100644 --- a/source/frontend/src/features/mapSideBar/lease/common/__snapshots__/LeaseHeader.test.tsx.snap +++ b/source/frontend/src/features/mapSideBar/lease/common/__snapshots__/LeaseHeader.test.tsx.snap @@ -6,7 +6,7 @@ exports[`LeaseHeader component > renders as expected when no data is provided 1` class="Toastify" />
- .c3.btn { + .c2.btn { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -37,49 +37,49 @@ exports[`LeaseHeader component > renders as expected when no data is provided 1` height: 3.8rem; } -.c3.btn:hover { +.c2.btn:hover { -webkit-text-decoration: underline; text-decoration: underline; opacity: 0.8; } -.c3.btn:focus { +.c2.btn:focus { outline-width: 0.4rem; outline-style: solid; outline-offset: 1px; box-shadow: none; } -.c3.btn.btn-primary { +.c2.btn.btn-primary { border: none; } -.c3.btn.btn-secondary { +.c2.btn.btn-secondary { background: none; } -.c3.btn.btn-info { +.c2.btn.btn-info { border: none; background: none; padding-left: 0.6rem; padding-right: 0.6rem; } -.c3.btn.btn-info:hover, -.c3.btn.btn-info:active, -.c3.btn.btn-info:focus { +.c2.btn.btn-info:hover, +.c2.btn.btn-info:active, +.c2.btn.btn-info:focus { background: none; } -.c3.btn.btn-light { +.c2.btn.btn-light { border: none; } -.c3.btn.btn-dark { +.c2.btn.btn-dark { border: none; } -.c3.btn.btn-link { +.c2.btn.btn-link { font-size: 1.6rem; font-weight: 400; background: none; @@ -100,9 +100,9 @@ exports[`LeaseHeader component > renders as expected when no data is provided 1` padding: 0; } -.c3.btn.btn-link:hover, -.c3.btn.btn-link:active, -.c3.btn.btn-link:focus { +.c2.btn.btn-link:hover, +.c2.btn.btn-link:active, +.c2.btn.btn-link:focus { -webkit-text-decoration: underline; text-decoration: underline; border: none; @@ -111,14 +111,14 @@ exports[`LeaseHeader component > renders as expected when no data is provided 1` outline: none; } -.c3.btn.btn-link:disabled, -.c3.btn.btn-link.disabled { +.c2.btn.btn-link:disabled, +.c2.btn.btn-link.disabled { background: none; pointer-events: none; } -.c3.btn:disabled, -.c3.btn:disabled:hover { +.c2.btn:disabled, +.c2.btn:disabled:hover { box-shadow: none; -webkit-user-select: none; -moz-user-select: none; @@ -129,26 +129,21 @@ exports[`LeaseHeader component > renders as expected when no data is provided 1` opacity: 0.65; } -.c3.Button .Button__icon { +.c2.Button .Button__icon { margin-right: 1.6rem; } -.c3.Button--icon-only:focus { +.c2.Button--icon-only:focus { outline: none; } -.c3.Button--icon-only .Button__icon { +.c2.Button--icon-only .Button__icon { margin-right: 0; } -.c1 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-wrap: nowrap; - -ms-flex-wrap: nowrap; - flex-wrap: nowrap; +.c3 { + font-size: 0.87em; + line-height: 1.9; } .c0 { @@ -159,17 +154,8 @@ exports[`LeaseHeader component > renders as expected when no data is provided 1` border-bottom-width: 0.1rem; } -.c4 { - font-size: 0.87em; - line-height: 1.9; -} - -.c2 { - -webkit-box-pack: justify; - -webkit-justify-content: space-between; - -ms-flex-pack: justify; - justify-content: space-between; - width: 100%; +.c1 { + font-weight: bold; }
renders as expected when no data is provided 1`
- + + +
- -
- - L-0000001 - - -
- + + L-0000001 + +
renders as expected when no data is provided 1`
- + + +
- -
- +
renders as expected when no data is provided 1`
- + + +
- -
- - French Mouse Property Management -
- - -
- + [+2 more...] +
+ +
renders as expected when no data is provided 1`
- + + +
- -
+ />
- + + +
- - - +
+
renders as expected when no data is provided 1`
- + + +
- +
@@ -319,13 +308,12 @@ exports[`LeaseHeader component > renders as expected when no data is provided 1` class="text-right col" > - Created: - Dec 31, 2021 + Created: - by + Dec 31, 2021 by renders as expected when no data is provided 1` class="text-right col" > - Last updated: - + + Updated: + by renders as expected when no data is provided 1`
- + + +
- -
+ />
-
-
-
diff --git a/source/frontend/src/features/mapSideBar/project/__snapshots__/ProjectContainerView.test.tsx.snap b/source/frontend/src/features/mapSideBar/project/__snapshots__/ProjectContainerView.test.tsx.snap index be22dc6462..de17b8c118 100644 --- a/source/frontend/src/features/mapSideBar/project/__snapshots__/ProjectContainerView.test.tsx.snap +++ b/source/frontend/src/features/mapSideBar/project/__snapshots__/ProjectContainerView.test.tsx.snap @@ -118,16 +118,16 @@ exports[`ProjectSummaryView component > matches snapshot 1`] = `
- + + +
- - 771 Project Cool A - + 771 Project Cool A
@@ -144,16 +144,16 @@ exports[`ProjectSummaryView component > matches snapshot 1`] = `
- + + +
- - South Coast Region - + South Coast Region
@@ -226,16 +226,16 @@ exports[`ProjectSummaryView component > matches snapshot 1`] = `
- + + +
- - Active (AC) - + Active (AC)
diff --git a/source/frontend/src/features/mapSideBar/project/common/__snapshots__/ProjectHeader.test.tsx.snap b/source/frontend/src/features/mapSideBar/project/common/__snapshots__/ProjectHeader.test.tsx.snap index 5be550fbde..afd5a67a80 100644 --- a/source/frontend/src/features/mapSideBar/project/common/__snapshots__/ProjectHeader.test.tsx.snap +++ b/source/frontend/src/features/mapSideBar/project/common/__snapshots__/ProjectHeader.test.tsx.snap @@ -37,16 +37,16 @@ exports[`ProjectHeader component > renders as expected 1`] = `
- + + +
- - 771 Project Cool A - + 771 Project Cool A
@@ -63,16 +63,16 @@ exports[`ProjectHeader component > renders as expected 1`] = `
- + + +
- - South Coast Region - + South Coast Region
@@ -145,16 +145,16 @@ exports[`ProjectHeader component > renders as expected 1`] = `
- + + +
- - Active (AC) - + Active (AC)
diff --git a/source/frontend/src/features/mapSideBar/property/__snapshots__/MotiInventoryHeader.test.tsx.snap b/source/frontend/src/features/mapSideBar/property/__snapshots__/MotiInventoryHeader.test.tsx.snap index 7b3d4289e5..995f70879f 100644 --- a/source/frontend/src/features/mapSideBar/property/__snapshots__/MotiInventoryHeader.test.tsx.snap +++ b/source/frontend/src/features/mapSideBar/property/__snapshots__/MotiInventoryHeader.test.tsx.snap @@ -182,16 +182,16 @@ exports[`MotiInventoryHeader component > renders as expected 1`] = `
- + + +
- - - - + -
@@ -204,15 +204,15 @@ exports[`MotiInventoryHeader component > renders as expected 1`] = `
- + + +
- -
+ /> @@ -228,15 +228,15 @@ exports[`MotiInventoryHeader component > renders as expected 1`] = `
- + + +
- -
+ />
renders as expected 1`] = `
- + + +
- -
+ />
diff --git a/source/frontend/src/features/mapSideBar/research/__snapshots__/ResearchContainer.test.tsx.snap b/source/frontend/src/features/mapSideBar/research/__snapshots__/ResearchContainer.test.tsx.snap index 6f01e8fceb..3203eb5e17 100644 --- a/source/frontend/src/features/mapSideBar/research/__snapshots__/ResearchContainer.test.tsx.snap +++ b/source/frontend/src/features/mapSideBar/research/__snapshots__/ResearchContainer.test.tsx.snap @@ -127,6 +127,11 @@ exports[`ResearchContainer component > renders as expected 1`] = ` font-weight: bold; } +.c5 { + font-size: 0.87em; + line-height: 1.9; +} + .c4 { margin-top: 0.5rem; margin-bottom: 1.5rem; @@ -135,11 +140,6 @@ exports[`ResearchContainer component > renders as expected 1`] = ` border-bottom-width: 0.1rem; } -.c5 { - font-size: 0.87em; - line-height: 1.9; -} - .c10 { text-align: left; padding: 0px; @@ -309,16 +309,16 @@ exports[`ResearchContainer component > renders as expected 1`] = `
- + + +
- - R-109 - + R-109
@@ -335,16 +335,16 @@ exports[`ResearchContainer component > renders as expected 1`] = `
- + + +
- - fsdgsdf - + fsdgsdf
@@ -361,15 +361,15 @@ exports[`ResearchContainer component > renders as expected 1`] = `
- + + +
- -
+ /> @@ -385,15 +385,15 @@ exports[`ResearchContainer component > renders as expected 1`] = `
- + + +
- -
+ /> @@ -403,14 +403,16 @@ exports[`ResearchContainer component > renders as expected 1`] = `
- + + +
- +
@@ -426,10 +428,10 @@ exports[`ResearchContainer component > renders as expected 1`] = ` - Created: - Sep 2, 2022 + Created: + Sep 2, 2022 by renders as expected 1`] = ` - Last updated: - - + + Updated: + by renders as expected 1`] = `
- + + +
- - Active - + Active
diff --git a/source/frontend/src/features/mapSideBar/research/common/ResearchHeader.test.tsx b/source/frontend/src/features/mapSideBar/research/common/ResearchHeader.test.tsx index 174079c39a..b7d38bb91b 100644 --- a/source/frontend/src/features/mapSideBar/research/common/ResearchHeader.test.tsx +++ b/source/frontend/src/features/mapSideBar/research/common/ResearchHeader.test.tsx @@ -124,8 +124,12 @@ describe('ResearchHeader component', () => { expect(getByText(testResearchFile.fileNumber as string)).toBeVisible(); expect(getByText(testResearchFile.fileName as string)).toBeVisible(); - expect(getByText(prettyFormatUTCDate(testResearchFile.appCreateTimestamp))).toBeVisible(); - expect(getByText(prettyFormatUTCDate(testResearchFile.appLastUpdateTimestamp))).toBeVisible(); + expect( + getByText(new RegExp(prettyFormatUTCDate(testResearchFile.appCreateTimestamp))), + ).toBeVisible(); + expect( + getByText(new RegExp(prettyFormatUTCDate(testResearchFile.appLastUpdateTimestamp))), + ).toBeVisible(); }); it('renders as expected when provided a different last-updated information', async () => { @@ -146,7 +150,9 @@ describe('ResearchHeader component', () => { expect(getByText(testResearchFile.fileNumber as string)).toBeVisible(); expect(getByText(testResearchFile.fileName as string)).toBeVisible(); - expect(getByText(prettyFormatUTCDate(testResearchFile.appCreateTimestamp))).toBeVisible(); - expect(getByText(prettyFormatUTCDate(lastUpdateTimeStamp))).toBeVisible(); + expect( + getByText(new RegExp(prettyFormatUTCDate(testResearchFile.appCreateTimestamp))), + ).toBeVisible(); + expect(getByText(new RegExp(prettyFormatUTCDate(lastUpdateTimeStamp)))).toBeVisible(); }); }); diff --git a/source/frontend/src/features/mapSideBar/research/common/ResearchHeader.tsx b/source/frontend/src/features/mapSideBar/research/common/ResearchHeader.tsx index cb22d2cc60..e2f1a8fa83 100644 --- a/source/frontend/src/features/mapSideBar/research/common/ResearchHeader.tsx +++ b/source/frontend/src/features/mapSideBar/research/common/ResearchHeader.tsx @@ -1,12 +1,12 @@ import { Col, Row } from 'react-bootstrap'; import styled from 'styled-components'; +import AuditSection from '@/components/common/HeaderField/AuditSection'; import { HeaderField } from '@/components/common/HeaderField/HeaderField'; -import { UserNameTooltip } from '@/components/common/UserNameTooltip'; import { Api_LastUpdatedBy } from '@/models/api/File'; import { ApiGen_Base_CodeType } from '@/models/api/generated/ApiGen_Base_CodeType'; import { ApiGen_Concepts_ResearchFile } from '@/models/api/generated/ApiGen_Concepts_ResearchFile'; -import { exists, prettyFormatUTCDate } from '@/utils'; +import { exists } from '@/utils'; import HistoricalNumbersContainer from '../../shared/header/HistoricalNumberContainer'; import HistoricalNumberFieldView from '../../shared/header/HistoricalNumberSectionView'; @@ -82,29 +82,7 @@ const ResearchHeader: React.FunctionComponent< - - - - Created: {prettyFormatUTCDate(researchFile?.appCreateTimestamp)} by{' '} - - - - - - - - Last updated:{' '} - {prettyFormatUTCDate(props.lastUpdatedBy?.appLastUpdateTimestamp)} by{' '} - - - - + @@ -126,8 +104,3 @@ const StyledRow = styled(Row)` border-bottom-color: grey; border-bottom-width: 0.1rem; `; - -const StyleSmallText = styled.span` - font-size: 0.87em; - line-height: 1.9; -`; diff --git a/source/frontend/src/features/mapSideBar/research/common/__snapshots__/ResearchHeader.test.tsx.snap b/source/frontend/src/features/mapSideBar/research/common/__snapshots__/ResearchHeader.test.tsx.snap index 74eaf2fdce..753b5bbcbd 100644 --- a/source/frontend/src/features/mapSideBar/research/common/__snapshots__/ResearchHeader.test.tsx.snap +++ b/source/frontend/src/features/mapSideBar/research/common/__snapshots__/ResearchHeader.test.tsx.snap @@ -6,7 +6,12 @@ exports[`ResearchHeader component > renders as expected when provided no researc class="Toastify" />
- .c0 { + .c1 { + font-size: 0.87em; + line-height: 1.9; +} + +.c0 { margin-top: 0.5rem; margin-bottom: 1.5rem; border-bottom-style: solid; @@ -14,11 +19,6 @@ exports[`ResearchHeader component > renders as expected when provided no researc border-bottom-width: 0.1rem; } -.c1 { - font-size: 0.87em; - line-height: 1.9; -} -
@@ -37,15 +37,15 @@ exports[`ResearchHeader component > renders as expected when provided no researc
- + + +
- -
+ />
@@ -61,15 +61,15 @@ exports[`ResearchHeader component > renders as expected when provided no researc
- + + +
- -
+ /> @@ -85,15 +85,15 @@ exports[`ResearchHeader component > renders as expected when provided no researc
- + + +
- -
+ /> @@ -109,15 +109,15 @@ exports[`ResearchHeader component > renders as expected when provided no researc
- + + +
- -
+ /> @@ -127,14 +127,16 @@ exports[`ResearchHeader component > renders as expected when provided no researc
- + + +
- +
@@ -150,8 +152,9 @@ exports[`ResearchHeader component > renders as expected when provided no researc - Created: - + + Created: + by renders as expected when provided no researc - Last updated: - + + Updated: + by renders as expected when provided no researc
- + + +
- -
+ /> diff --git a/source/frontend/src/features/mapSideBar/shared/header/HistoricalNumberSectionView.tsx b/source/frontend/src/features/mapSideBar/shared/header/HistoricalNumberSectionView.tsx index 268ecca4c9..5255475a68 100644 --- a/source/frontend/src/features/mapSideBar/shared/header/HistoricalNumberSectionView.tsx +++ b/source/frontend/src/features/mapSideBar/shared/header/HistoricalNumberSectionView.tsx @@ -1,6 +1,10 @@ import { useMemo } from 'react'; +import styled from 'styled-components'; +import ExpandableTextList from '@/components/common/ExpandableTextList'; import { HeaderField } from '@/components/common/HeaderField/HeaderField'; +import { Dictionary } from '@/interfaces/Dictionary'; +import { ApiGen_Base_CodeType } from '@/models/api/generated/ApiGen_Base_CodeType'; import { ApiGen_Concepts_HistoricalFileNumber } from '@/models/api/generated/ApiGen_Concepts_HistoricalFileNumber'; import { exists } from '@/utils'; @@ -8,24 +12,66 @@ export interface IHistoricalNumbersViewProps { historicalNumbers: ApiGen_Concepts_HistoricalFileNumber[]; } +interface HistoricalGroup { + historicalType: ApiGen_Base_CodeType; + historicalValues: Dictionary; +} + const HistoricalNumberFieldView: React.FC = ({ historicalNumbers, }) => { const uniqueNumbers = useMemo(() => { - const flatNumberArray = historicalNumbers + const flatNumberArray: Dictionary = historicalNumbers .filter(exists) - .sort(h => h.historicalFileNumberTypeCode.displayOrder) - .map(h => `${h.historicalFileNumber}[${h.historicalFileNumberTypeCode.description}]`); + .reduce((accumulator, h) => { + const historicalTypeKey = `[${h.historicalFileNumberTypeCode.description}]`; + if (!(historicalTypeKey in accumulator)) { + accumulator[historicalTypeKey] = { + historicalType: h.historicalFileNumberTypeCode, + historicalValues: {}, + }; + } + + const historicalValueKey = `[${h.historicalFileNumberTypeCode.description}][${h.historicalFileNumber}]`; + accumulator[historicalTypeKey].historicalValues[historicalValueKey] = h; + return accumulator; + }, {} as Dictionary); - const uniqueNumberSet = new Set(flatNumberArray); - return Array.from(uniqueNumberSet); + return Object.values(flatNumberArray).sort(p => p.historicalType.displayOrder); }, [historicalNumbers]); return ( - {uniqueNumbers.join(', ')} + <> + + items={uniqueNumbers} + keyFunction={(p, index: number) => `historical-number-${p.historicalType.id}-${index}`} + renderFunction={p => ( + <> + + {p.historicalType.description}: + + + {Object.values(p.historicalValues).map((historicalValue, index) => { + return ( + <> + {historicalValue.historicalFileNumber} + {index + 1 < Object.values(p.historicalValues).length && , } + + ); + })} + + )} + delimiter={'; '} + maxCollapsedLength={2} + /> + ); }; export default HistoricalNumberFieldView; + +export const StyledLabel = styled.label` + font-weight: bold; +`; diff --git a/source/frontend/src/features/research/list/ResearchListView.tsx b/source/frontend/src/features/research/list/ResearchListView.tsx index 59cc7fba8c..f7edc17b59 100644 --- a/source/frontend/src/features/research/list/ResearchListView.tsx +++ b/source/frontend/src/features/research/list/ResearchListView.tsx @@ -98,7 +98,7 @@ export const ResearchListView: React.FunctionComponent props.theme.bcTokens.iconColorSuccess}; + background-color: ${props => props.theme.bcTokens.iconsColorSuccess}; } `; diff --git a/source/frontend/src/index.tsx b/source/frontend/src/index.tsx index d63df2420a..a87d128c82 100644 --- a/source/frontend/src/index.tsx +++ b/source/frontend/src/index.tsx @@ -50,6 +50,8 @@ const Index = () => { ); }; +console.log(bcTokens); + const InnerComponent = ({ tenant }: { tenant: ITenantConfig2 }) => { const refresh = useRefreshSiteminder(); return (