diff --git a/src/_scss/custom.scss b/src/_scss/custom.scss index 06607d3185..573d5eedb8 100644 --- a/src/_scss/custom.scss +++ b/src/_scss/custom.scss @@ -14,5 +14,6 @@ @import './layouts/article/aboutArticle'; @import './pages/testStyle/testStyle'; @import './pages/agencyLanding/agencyLandingPage'; +@import './pages/errorPage/errorPage'; // ***** MODALS @import './pages/modals/all'; diff --git a/src/_scss/pages/agency/_section.scss b/src/_scss/pages/agency/_section.scss index fb93770298..08f130f5dd 100644 --- a/src/_scss/pages/agency/_section.scss +++ b/src/_scss/pages/agency/_section.scss @@ -7,7 +7,7 @@ @include justify-content(center); width: 100%; position: relative; - margin: rem(100) 0 rem(60); + margin: rem(60) 0 rem(60); padding: 0 rem(63); color: $color-base; font-family: $font-sans; @@ -23,11 +23,19 @@ line-height: rem(47); margin: rem(5) 0; } + em { + font-size: rem(12); + } } .agency-section-content { @import "pages/homepage/treemapSection"; + .agency-viz-description { + margin-top: rem(20); + font-size: rem(12); + } + .usa-da-treemap-section { background: white; padding-top: rem(50); @@ -69,6 +77,20 @@ font-size: rem(12); line-height: $base-line-height; + .info-icon-circle { + @include align-self(center); + display: inline-block; + fill: $color-gray; + height: rem(17); + left: rem(5); + position: relative; + top: rem(3); + width: rem(15); + } + span { + margin-left: rem(10); + } + .back { color: $color-gray; cursor: pointer; diff --git a/src/_scss/pages/agency/visualizations/_obligated.scss b/src/_scss/pages/agency/visualizations/_obligated.scss index 6ef1943853..f7604f2f75 100644 --- a/src/_scss/pages/agency/visualizations/_obligated.scss +++ b/src/_scss/pages/agency/visualizations/_obligated.scss @@ -1,14 +1,4 @@ -.agency-obligated-wrapper { - margin-top: rem(15); - - .agency-obligated-title { - h4 { - font-size: rem(38); - line-height: rem(47); - margin: rem(5) 0; - } - } - +.agency-section-wrapper { .agency-obligated-content { text-align: center; .fy-text { diff --git a/src/_scss/pages/agency/visualizations/federalAccount/federalAccount.scss b/src/_scss/pages/agency/visualizations/federalAccount/federalAccount.scss index 9d72a781bd..6131c9f0a3 100644 --- a/src/_scss/pages/agency/visualizations/federalAccount/federalAccount.scss +++ b/src/_scss/pages/agency/visualizations/federalAccount/federalAccount.scss @@ -16,5 +16,17 @@ .visualization-tooltip { @import "components/visualizations/tooltip/_tooltip"; } + + .horizontal-bar { + height: rem(15); + .legend-container { + color: $color-gray-medium; + .key-label { + font-size: rem(12); + } + } + } + + } } \ No newline at end of file diff --git a/src/_scss/pages/agency/visualizations/recipient/recipient.scss b/src/_scss/pages/agency/visualizations/recipient/recipient.scss index 800d11b3cc..5fab6965ab 100644 --- a/src/_scss/pages/agency/visualizations/recipient/recipient.scss +++ b/src/_scss/pages/agency/visualizations/recipient/recipient.scss @@ -18,6 +18,16 @@ @import "components/visualizations/tooltip/_tooltip"; } + .horizontal-bar { + height: rem(15); + .legend-container { + color: $color-gray-medium; + .key-label { + font-size: rem(12); + } + } + } + @import "pages/search/results/visualizations/rank/_pager"; .visualization-pager-container { @include display(flex); diff --git a/src/_scss/pages/award/_recipientInfo.scss b/src/_scss/pages/award/_recipientInfo.scss index 03c0965abe..9ae2d58c34 100644 --- a/src/_scss/pages/award/_recipientInfo.scss +++ b/src/_scss/pages/award/_recipientInfo.scss @@ -26,9 +26,9 @@ @include span-columns(16); } @include media($medium-screen) { - @include span-columns(3.7); + @include span-columns(5.1); &:first-child { - @include span-columns(6); + @include span-columns(4.6); } &:nth-of-type(2), &:nth-of-type(3) { @@ -42,6 +42,17 @@ } .item-value { @include setText($small-font-size); + ul { + display: initial; + list-style-type: none; + padding: 0; + li { + display: list-item; + width: 100%; + margin: 0 0 rem(5) 0; + line-height: rem(18); + } + } } } &.single { @@ -49,6 +60,11 @@ @include span-columns(16); } } + @import './_moreButton'; + button.see-more { + display: block; + margin-left: 0; + } } @include media($tablet-screen) { @include span-columns(9); diff --git a/src/_scss/pages/errorPage/errorPage.scss b/src/_scss/pages/errorPage/errorPage.scss new file mode 100644 index 0000000000..c653d6f7d9 --- /dev/null +++ b/src/_scss/pages/errorPage/errorPage.scss @@ -0,0 +1,63 @@ +.usa-da-error-page { + @import "mixins/fullSectionWrap"; + @import "layouts/default/default"; + + .error-content { + @include display(flex); + @include justify-content(center); + @include align-items(center); + position: relative; + + padding: rem(25); + + @include media($tablet-screen) { + height: calc(100vh - 300px); + } + + .error-box { + @include flex(1 1 auto); + box-shadow: $box-shadow; + background-color: $color-white; + padding: rem(25); + + height: 100%; + + .error-header { + @include display(flex); + @include justify-content(center); + @include align-items(center); + position: relative; + + .error-icon { + @include flex(0 0 auto); + width: rem(35); + height: rem(35); + + svg { + width: rem(35); + height: rem(35); + fill: $color-primary-darker; + } + } + + .error-title { + @include flex(1 1 auto); + margin-left: rem(15); + h1 { + margin: 0; + padding: 0; + font-size: $h3-font-size; + } + } + } + + .error-body { + a { + color: $color-link; + } + } + + + } + } +} \ No newline at end of file diff --git a/src/_scss/pages/search/results/visualizations/rank/chart/_item.scss b/src/_scss/pages/search/results/visualizations/rank/chart/_item.scss index 9c751673d2..dd92e12520 100644 --- a/src/_scss/pages/search/results/visualizations/rank/chart/_item.scss +++ b/src/_scss/pages/search/results/visualizations/rank/chart/_item.scss @@ -11,7 +11,7 @@ fill: $color-base; } .group-label-link { - text-decoration: underline; + fill: $color-link; } } diff --git a/src/_scss/pages/search/searchPage.scss b/src/_scss/pages/search/searchPage.scss index e895781da1..c98df26f56 100644 --- a/src/_scss/pages/search/searchPage.scss +++ b/src/_scss/pages/search/searchPage.scss @@ -23,5 +23,13 @@ margin-bottom: rem(60); @import "./results/searchResults"; @import "./topFilterBar/topFilterBar"; + + .last-update { + font-size: rem(12); + margin-bottom: rem(5); + strong { + font-weight: $font-bold; + } + } } } \ No newline at end of file diff --git a/src/js/components/agency/AgencyContent.jsx b/src/js/components/agency/AgencyContent.jsx index e75db47be9..209f019991 100644 --- a/src/js/components/agency/AgencyContent.jsx +++ b/src/js/components/agency/AgencyContent.jsx @@ -7,6 +7,8 @@ import React from 'react'; import PropTypes from 'prop-types'; import { find, throttle } from 'lodash'; import { scrollToY } from 'helpers/scrollToHelper'; +import moment from 'moment'; +import { convertQuarterToDate } from 'helpers/fiscalYearHelper'; import ObjectClassContainer from 'containers/agency/visualizations/ObjectClassContainer'; import RecipientContainer from 'containers/agency/visualizations/RecipientContainer'; @@ -41,7 +43,8 @@ const agencySections = [ ]; const propTypes = { - agency: PropTypes.object + agency: PropTypes.object, + lastUpdate: PropTypes.string }; export default class AgencyContent extends React.Component { @@ -213,6 +216,10 @@ export default class AgencyContent extends React.Component { } render() { + const qtr = parseFloat(this.props.agency.overview.activeFQ); + const endOfQuarter = convertQuarterToDate(qtr, this.props.agency.overview.activeFY); + const asOfDate = moment(endOfQuarter, "YYYY-MM-DD").format("MMMM D, YYYY"); + return (
@@ -229,17 +236,22 @@ export default class AgencyContent extends React.Component { + activeQuarter={this.props.agency.overview.activeFQ} + id={this.props.agency.id} + asOfDate={asOfDate} /> + activeFY={this.props.agency.overview.activeFY} + asOfDate={asOfDate} /> + obligatedAmount={this.props.agency.overview.obligatedAmount} + asOfDate={asOfDate} /> + activeFY={this.props.agency.overview.activeFY} + lastUpdate={this.props.lastUpdate} />
diff --git a/src/js/components/agency/AgencyPage.jsx b/src/js/components/agency/AgencyPage.jsx index d66785ec0e..359aacd4a3 100644 --- a/src/js/components/agency/AgencyPage.jsx +++ b/src/js/components/agency/AgencyPage.jsx @@ -23,7 +23,8 @@ const propTypes = { loading: PropTypes.bool, error: PropTypes.bool, id: PropTypes.string, - agency: PropTypes.object + agency: PropTypes.object, + lastUpdate: PropTypes.string }; export default class AgencyPage extends React.Component { diff --git a/src/js/components/agency/visualizations/federalAccount/FederalAccountChart.jsx b/src/js/components/agency/visualizations/federalAccount/FederalAccountChart.jsx index f4f4bb8a78..6e01b1b0e9 100644 --- a/src/js/components/agency/visualizations/federalAccount/FederalAccountChart.jsx +++ b/src/js/components/agency/visualizations/federalAccount/FederalAccountChart.jsx @@ -7,6 +7,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import HorizontalChart from 'components/search/visualizations/rank/chart/HorizontalChart'; +import BarChartLegend from 'components/search/visualizations/time/chart/BarChartLegend'; import FederalAccountTooltip from './FederalAccountTooltip'; @@ -67,7 +68,16 @@ export default class FederalAccountChart extends React.Component { isLoading = 'loading-visualization'; } + const legend = [ + { + color: '#597785', + label: 'Obligated Amount', + offset: 0 + } + ]; + return ( +
+ + + + +

Federal Accounts

+ Data as of {this.props.asOfDate}
{ diff --git a/src/js/components/agency/visualizations/objectClass/ObjectClassTreeMap.jsx b/src/js/components/agency/visualizations/objectClass/ObjectClassTreeMap.jsx index 960f3da5ac..c44fb6a8ab 100644 --- a/src/js/components/agency/visualizations/objectClass/ObjectClassTreeMap.jsx +++ b/src/js/components/agency/visualizations/objectClass/ObjectClassTreeMap.jsx @@ -18,7 +18,8 @@ const propTypes = { minorObjectClasses: PropTypes.object, totalObligation: PropTypes.number, totalMinorObligation: PropTypes.number, - showMinorObjectClasses: PropTypes.func + showMinorObjectClasses: PropTypes.func, + asOfDate: PropTypes.string }; export default class ObjectClassTreeMap extends React.Component { @@ -66,7 +67,12 @@ export default class ObjectClassTreeMap extends React.Component { } generateHeader() { - let header = "Hover over a segment for more information"; + let header = (
+
+ +
+ Hover over a segment for more information +
); if (this.state.showMinorObjectClass === true) { header = (
+
This visualization represents obligated amount.
); diff --git a/src/js/components/agency/visualizations/obligated/ObligatedGraph.jsx b/src/js/components/agency/visualizations/obligated/ObligatedGraph.jsx index 6825b6e269..f5cbb7388b 100644 --- a/src/js/components/agency/visualizations/obligated/ObligatedGraph.jsx +++ b/src/js/components/agency/visualizations/obligated/ObligatedGraph.jsx @@ -10,8 +10,6 @@ import BarChartLegend from 'components/search/visualizations/time/chart/BarChart import HorizontalBarItem from './HorizontalBarItem'; const propTypes = { - activeFY: PropTypes.string, - reportingFiscalQuarter: PropTypes.number, obligatedAmount: PropTypes.number, budgetAuthority: PropTypes.number, width: PropTypes.number, diff --git a/src/js/components/agency/visualizations/obligated/ObligatedVisualization.jsx b/src/js/components/agency/visualizations/obligated/ObligatedVisualization.jsx index 1ea0be4f64..757596c324 100644 --- a/src/js/components/agency/visualizations/obligated/ObligatedVisualization.jsx +++ b/src/js/components/agency/visualizations/obligated/ObligatedVisualization.jsx @@ -5,19 +5,17 @@ import React from 'react'; import PropTypes from 'prop-types'; -import moment from 'moment'; -import { convertQuarterToDate } from 'helpers/fiscalYearHelper'; import * as MoneyFormatter from 'helpers/moneyFormatter'; -import { throttle } from 'lodash'; +import { capitalize, throttle } from 'lodash'; import AgencyObligatedGraph from './ObligatedGraph'; const propTypes = { activeFY: PropTypes.string, - reportingFiscalQuarter: PropTypes.number, agencyName: PropTypes.string, obligatedAmount: PropTypes.number, - budgetAuthority: PropTypes.number + budgetAuthority: PropTypes.number, + asOfDate: PropTypes.string }; export default class AgencyObligatedAmount extends React.Component { @@ -54,20 +52,23 @@ export default class AgencyObligatedAmount extends React.Component { } render() { - const obligatedValue = this.props.obligatedAmount; - const authorityValue = this.props.budgetAuthority; - - const authUnits = MoneyFormatter.calculateUnitForSingleValue(authorityValue); - const authority = `${MoneyFormatter.formatMoney(authorityValue / authUnits.unit)} - ${authUnits.longLabel}`; - - const obUnits = MoneyFormatter.calculateUnitForSingleValue(obligatedValue); - - const amountObligated = `${MoneyFormatter.formatMoney(obligatedValue / obUnits.unit)} - ${obUnits.longLabel}`; - - const endOfQuarter = convertQuarterToDate(this.props.reportingFiscalQuarter, this.props.activeFY); - const asOfDate = moment(endOfQuarter, "YYYY-MM-DD").format("MMMM D, YYYY"); + // Move props to variables for readability + const obligatedAmount = this.props.obligatedAmount; + const budgetAuthority = this.props.budgetAuthority; + + // Generate Budget Authority string + const budgetAuthorityAmount = MoneyFormatter + .calculateUnitForSingleValue(budgetAuthority); + const formattedBudgetAuthority = `${MoneyFormatter + .formatMoneyWithPrecision(budgetAuthority / budgetAuthorityAmount.unit, 1)} + ${capitalize(budgetAuthorityAmount.longLabel)}`; + + // Generate Obligated Amount string + const obligatedAmountValue = MoneyFormatter + .calculateUnitForSingleValue(obligatedAmount); + const formattedObligatedAmount = `${MoneyFormatter + .formatMoneyWithPrecision(obligatedAmount / obligatedAmountValue.unit, 1)} + ${capitalize(obligatedAmountValue.longLabel)}`; const legend = [ { @@ -79,11 +80,6 @@ export default class AgencyObligatedAmount extends React.Component { color: '#D6D7D9', label: 'Budgetary Resources', offset: 100 - }, - { - color: '#ffffff', - label: `*as of ${asOfDate}`, - offset: this.state.visualizationWidth - 150 } ]; @@ -99,9 +95,10 @@ example, when it places an order, signs a contract, awards a grant, purchases a takes other actions that require it to make a payment.

-
-
+
+

Obligated Amount

+ Data as of {this.props.asOfDate}
{ @@ -110,18 +107,16 @@ takes other actions that require it to make a payment.

- In fiscal year {this.props.activeFY}*, {this.props.agencyName} has obligated + In fiscal year {this.props.activeFY}, {this.props.agencyName} has obligated...

- {amountObligated} against its {authority} in Budgetary Resources + {formattedObligatedAmount} against its {formattedBudgetAuthority} in Budgetary Resources

diff --git a/src/js/components/agency/visualizations/recipient/RecipientChart.jsx b/src/js/components/agency/visualizations/recipient/RecipientChart.jsx index 6a8c2579e4..3460dfd856 100644 --- a/src/js/components/agency/visualizations/recipient/RecipientChart.jsx +++ b/src/js/components/agency/visualizations/recipient/RecipientChart.jsx @@ -8,6 +8,7 @@ import PropTypes from 'prop-types'; import { AngleLeft, AngleRight } from 'components/sharedComponents/icons/Icons'; import HorizontalChart from 'components/search/visualizations/rank/chart/HorizontalChart'; +import BarChartLegend from 'components/search/visualizations/time/chart/BarChartLegend'; import RecipientTooltip from './RecipientTooltip'; @@ -100,6 +101,14 @@ export default class RecipientChart extends React.Component { isLoading = 'loading-visualization'; } + const legend = [ + { + color: '#597785', + label: 'Obligated Amount', + offset: 0 + } + ]; + return (
+ + + + +
diff --git a/src/js/components/agency/visualizations/recipient/RecipientVisualization.jsx b/src/js/components/agency/visualizations/recipient/RecipientVisualization.jsx index 75acc0c13e..dffbf8fe43 100644 --- a/src/js/components/agency/visualizations/recipient/RecipientVisualization.jsx +++ b/src/js/components/agency/visualizations/recipient/RecipientVisualization.jsx @@ -22,7 +22,8 @@ const propTypes = { descriptions: PropTypes.array, page: PropTypes.number, isLastPage: PropTypes.bool, - changePage: PropTypes.func + changePage: PropTypes.func, + lastUpdate: PropTypes.string }; @@ -99,6 +100,7 @@ or foreign). Here is a look at who these recipients are and how they rank by awa

Recipients

+ Data as of {this.props.lastUpdate}
{ diff --git a/src/js/components/agencyLanding/table/TableCell.jsx b/src/js/components/agencyLanding/table/TableCell.jsx deleted file mode 100644 index a69a1fbea3..0000000000 --- a/src/js/components/agencyLanding/table/TableCell.jsx +++ /dev/null @@ -1,31 +0,0 @@ -/** - * TableCell.jsx - * Created by Lizzie Salita 08/01/17 - **/ - -import React from 'react'; -import PropTypes from 'prop-types'; - -const propTypes = { - rowIndex: PropTypes.number, - column: PropTypes.object -}; - -export default class TableCell extends React.Component { - render() { - let rowClass = 'row-even'; - if (this.props.rowIndex % 2 === 0) { - // row index is zero-based - rowClass = 'row-odd'; - } - - return ( - - {this.props.column.cell(this.props.rowIndex)} - - ); - } -} - -TableCell.propTypes = propTypes; - diff --git a/src/js/components/agencyLanding/table/TableRow.jsx b/src/js/components/agencyLanding/table/TableRow.jsx index e7981772e7..03aa094f9b 100644 --- a/src/js/components/agencyLanding/table/TableRow.jsx +++ b/src/js/components/agencyLanding/table/TableRow.jsx @@ -17,11 +17,16 @@ const propTypes = { export default class TableRow extends React.PureComponent { render() { + let rowClass = 'row-even'; + if (this.props.rowIndex % 2 === 0) { + rowClass = 'row-odd'; + } const cells = this.props.columns.map((column) => { if (column.columnName === 'agency_name') { // show the agency link cell return ( +
{name} diff --git a/src/js/components/award/RecipientInfo.jsx b/src/js/components/award/RecipientInfo.jsx index d5a6033e1f..e1d3a845c0 100644 --- a/src/js/components/award/RecipientInfo.jsx +++ b/src/js/components/award/RecipientInfo.jsx @@ -7,6 +7,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { toLower, includes } from 'lodash'; import { awardTypeGroups } from 'dataMapping/search/awardType'; +import * as BusinessTypesHelper from 'helpers/businessTypesHelper'; import InfoSnippet from './InfoSnippet'; import RecipientAddress from './RecipientAddress'; @@ -19,8 +20,14 @@ export default class RecipientInfo extends React.Component { constructor(props) { super(props); + + this.state = { + moreTypesButton: true + }; + this.buildSnippets = this.buildSnippets.bind(this); this.buildName = this.buildName.bind(this); + this.toggleButton = this.toggleButton.bind(this); } buildName() { @@ -38,6 +45,12 @@ export default class RecipientInfo extends React.Component { return recipientName; } + toggleButton() { + this.setState({ + moreTypesButton: !this.state.moreTypesButton + }); + } + buildSnippets() { const recipient = this.props.recipient; const isMultiple = toLower(this.props.recipient.recipient_name) === 'multiple recipients'; @@ -47,7 +60,6 @@ export default class RecipientInfo extends React.Component { let duns = "Not Available"; let parentDuns = "Not Available"; - let businessType = "Not Available"; const isContract = includes(awardTypeGroups.contracts, this.props.recipient.award_type); if (this.props.recipient.recipient_parent_duns) { @@ -56,9 +68,46 @@ export default class RecipientInfo extends React.Component { if (this.props.recipient.recipient_duns) { duns = this.props.recipient.recipient_duns; } - if (this.props.recipient.recipient_business_type) { + + let businessType = "Not Available"; + let businessTypeLabel = "Business Type"; + let overflow = false; + const businessTypesArray = []; + let typesList = ''; + + if (isContract && this.props.recipient.recipient_business_type === 'Unknown Types') { + businessTypeLabel = "Business Types"; + // Build an array of applicable business type fields + const allBusinessTypes = BusinessTypesHelper.getBusinessTypes(); + allBusinessTypes.forEach((type) => { + if (recipient.latest_transaction.recipient[type.fieldName] === '1') { + businessTypesArray.push(type); + } + }); + + if ((businessTypesArray.length > 0) && (businessTypesArray.length <= 2)) { + // Show all the business types + typesList = businessTypesArray.map((type) =>
  • {type.displayName}
    • ); + } + else if (businessTypesArray.length > 2) { + // Show just the first two types until a user clicks the 'See More' button + overflow = true; + if (this.state.moreTypesButton) { + typesList = [businessTypesArray[0], businessTypesArray[1]].map((type) => +
  • {type.displayName}
    • + ); + } + else { + typesList = businessTypesArray.map((type) => +
  • {type.displayName}
    • + ); + } + } + } + else { businessType = this.props.recipient.recipient_business_type; } + let parentDunsSnippet = ( ); + + if (overflow) { + let button = (); + if (!this.state.moreTypesButton) { + button = (); + } + businessTypesSnippet = ( +
  • +
    +
    + Business Types +
    +
    +
      + {typesList} +
    + {button} +
    +
    +
    • ); + } + let infoSnippets = (
      {parentDunsSnippet} - + {businessTypesSnippet}
    ); if (isMultiple) { diff --git a/src/js/components/award/subawards/SubawardsTable.jsx b/src/js/components/award/subawards/SubawardsTable.jsx index 085de1807f..c50a33039f 100644 --- a/src/js/components/award/subawards/SubawardsTable.jsx +++ b/src/js/components/award/subawards/SubawardsTable.jsx @@ -142,7 +142,7 @@ export default class SubawardsTable extends React.Component { } let message = null; - if (this.props.subawards.length === 0) { + if (this.props.subawards.length === 0 && !this.props.inFlight) { message = (); } diff --git a/src/js/components/award/table/FinancialSystemTable.jsx b/src/js/components/award/table/FinancialSystemTable.jsx index f55d614f97..b7fe2c2071 100644 --- a/src/js/components/award/table/FinancialSystemTable.jsx +++ b/src/js/components/award/table/FinancialSystemTable.jsx @@ -14,6 +14,7 @@ import tableMapping from 'dataMapping/contracts/financialSystem'; import FinSysHeaderCellContainer from 'containers/award/table/cells/FinSysHeaderCellContainer'; import FinSysGenericCell from './cells/FinSysGenericCell'; +import FinSysAccountCell from './cells/FinSysAccountCell'; import SummaryPageTableMessage from './SummaryPageTableMessage'; const rowHeight = 40; @@ -94,6 +95,11 @@ export default class FinancialSystemTable extends React.Component { const apiKey = tableMapping.table._mapping[column]; const defaultSort = tableMapping.defaultSortDirection[column]; + let CellComponent = FinSysGenericCell; + if (column === 'fedAccount') { + CellComponent = FinSysAccountCell; + } + return { width: columnWidth, name: column, @@ -106,7 +112,7 @@ export default class FinancialSystemTable extends React.Component { isLastColumn={isLast} />), cell: (index) => { const item = this.props.award.finSysData[index]; - return ( + {this.props.data.title} +     ); + if (!content) { + content = "\u00A0"; + } + + // calculate even-odd class names + let rowClass = 'row-even'; + if (this.props.rowIndex % 2 === 0) { + // row index is zero-based + rowClass = 'row-odd'; + } + + if (this.props.isLastColumn) { + rowClass += ' last-column'; + } + + return ( +
    +
    + {content} +
    +
    + ); + } +} + +FinSysAccountCell.propTypes = propTypes; diff --git a/src/js/components/errorPage/ErrorPage.jsx b/src/js/components/errorPage/ErrorPage.jsx new file mode 100644 index 0000000000..b3de0aad0f --- /dev/null +++ b/src/js/components/errorPage/ErrorPage.jsx @@ -0,0 +1,44 @@ +/** + * ErrorPage.jsx + * Created by Kevin Li 8/10/17 + */ + +import React from 'react'; + +import { ExclamationCircle } from 'components/sharedComponents/icons/Icons'; + +import * as MetaTagHelper from 'helpers/metaTagHelper'; + +import MetaTags from '../sharedComponents/metaTags/MetaTags'; +import Header from '../sharedComponents/header/Header'; +import Footer from '../sharedComponents/Footer'; + +const ErrorPage = () => ( +
    + +
    +
    +
    +
    +
    +
    + +
    +
    +

    Page not found

    +
    +
    +
    +

    Sorry, the page you are looking for doesn't exist.

    +

    + Check the URL for typos or return to the home page. +

    +
    +
    +
    +
    +
    +
    +); + +export default ErrorPage; diff --git a/src/js/components/search/SearchPage.jsx b/src/js/components/search/SearchPage.jsx index 756285d6d2..e0d2cccb44 100644 --- a/src/js/components/search/SearchPage.jsx +++ b/src/js/components/search/SearchPage.jsx @@ -17,7 +17,9 @@ import SearchSidebar from './SearchSidebar'; import SearchResults from './SearchResults'; const propTypes = { - clearAllFilters: PropTypes.func + clearAllFilters: PropTypes.func, + filters: PropTypes.object, + lastUpdate: PropTypes.string }; export default class SearchPage extends React.Component { @@ -219,7 +221,7 @@ export default class SearchPage extends React.Component { } render() { - let fullSidebar = (); + let fullSidebar = (); if (this.state.isMobile) { fullSidebar = null; } @@ -254,7 +256,8 @@ export default class SearchPage extends React.Component { showMobileFilters={this.state.showMobileFilters} updateFilterCount={this.updateFilterCount} toggleMobileFilters={this.toggleMobileFilters} - clearAllFilters={this.props.clearAllFilters} /> + clearAllFilters={this.props.clearAllFilters} + lastUpdate={this.props.lastUpdate} />