Merge branch 'dev' into staging-merge-sprint-6

* dev: (107 commits)
  Create BoxShadow component and use with various cards (#106)
  Add toast notifications for favoriting actions (#114)
  Test coverage (#117)
  Handshake ribbon (#113)
  Track favoriting loading state of individual IDs (#108)
  Updates to Bid Tracker (#115)
  Remove post, add grade to bottom section
  Update ordering for data points on Compare page (#110)
  Styles, add post to top
  fix: allow export on edge to run
  Adjust elements to grow
  fix: change label. TM-632 (#107)
  Remove Status component throughout app (#105)
  Add custom filter for including null language positions (#104)
  Update empty saved search list text (#101)
  Add hover to dropdown (#103)
  Service Needs -> Featured (#100)
  Make icons consistent throughout profile pages (#102)
  dev -> staging
  feature: add bid list button to the favorites cards. TM-512
  ...

# Conflicts:
#	src/Components/AccountDropdown/AccountDropdown.jsx
#	src/Components/BidTracker/BidTrackerCard/__snapshots__/BidTrackerCard.test.jsx.snap
#	src/Components/BidTracker/BidTrackerCardTop/BidTrackerCardTop.jsx
#	src/Components/BidTracker/PriorityCards/IsOnStandby/IsOnStandby.jsx
#	src/Components/BidTracker/PriorityCards/IsOnStandby/__snapshots__/IsOnStandby.test.jsx.snap
#	src/Components/BidderPortfolio/BidderPortfolioCard/BidderPortfolioCard.jsx
#	src/Components/CompareDrawer/CompareDrawerContainer.jsx
#	src/Components/CompareDrawer/CompareDrawerContainer.test.jsx
#	src/Components/CompareList/CompareList.jsx
#	src/Components/CompareList/__snapshots__/CompareList.test.jsx.snap
#	src/Components/FavoritePositions/FavoritePositions.jsx
#	src/Components/HomePagePositionsList/HomePagePositionsList.jsx
#	src/Components/ProfileDashboard/ProfileDashboard.jsx
#	src/Components/ResultsCard/ResultsCard.jsx
#	src/Components/SearchResultsExportLink/SearchResultsExportLink.jsx
#	src/Components/SearchResultsExportLink/SearchResultsExportLink.test.jsx
#	src/Components/SearchResultsExportLink/__snapshots__/SearchResultsExportLink.test.jsx.snap
#	src/Containers/BidListButton/BidListButton.jsx
#	src/Containers/Compare/Compare.jsx
#	src/sass/_compare.scss
#	src/sass/_condensedCard.scss

package.json

@@ -9,6 +9,7 @@
     "babel-polyfill": "^6.26.0",
     "body-parser": "^1.18.2",
     "bunyan": "^1.8.12",
+    "css-box-shadow": "^1.0.0-3",
     "date-fns": "^1.29.0",
     "draft-js": "^0.10.4",
     "draft-js-plugins-editor": "^2.0.4",

src/Components/AccountDropdown/AccountDropdown.jsx

@@ -11,6 +11,7 @@ export class AccountDropdown extends Component {
   constructor(props) {
     super(props);
     this.hideDropdown = this.hideDropdown.bind(this);
+    this.showDropdown = this.showDropdown.bind(this);
     this.logout = this.logout.bind(this);
   }
 
@@ -23,6 +24,11 @@ export class AccountDropdown extends Component {
     this.dropdown.hide();
   }
 
+  showDropdown() {
+    // Explicitly show the dropdown using the built-in hide() function from react-simple-dropdown
+    this.dropdown.show();
+  }
+
   render() {
     const { shouldDisplayName, userProfile } = this.props;
     const displayName = userProfile ? userProfile.display_name : '...';
@@ -42,8 +48,8 @@ export class AccountDropdown extends Component {
         className="account-dropdown"
         ref={(dropdown) => { this.dropdown = dropdown; }}
         removeElement
-        onMouseEnter={() => this.dropdown.show()}
-        onMouseLeave={() => this.dropdown.hide()}
+        onMouseEnter={this.showDropdown}
+        onMouseLeave={this.hideDropdown}
       >
         <DropdownTrigger href="/#">
           <Avatar className="account-dropdown--avatar" {...avatar} />
@@ -53,7 +59,7 @@ export class AccountDropdown extends Component {
           }
         </DropdownTrigger>
         <div className="dropdown-content-outer-container">
-          <DropdownContent onMouseEnter={() => this.dropdown.show()}>
+          <DropdownContent onMouseEnter={this.showDropdown}>
             <div className="account-dropdown--identity account-dropdown--segment">
               <div>Signed in as</div>
               <strong>{displayName}</strong>

src/Components/AccountDropdown/AccountDropdown.test.jsx

@@ -54,14 +54,28 @@ describe('AccountDropdown', () => {
     // define the instance
     const instance = accountDropdown.instance();
     instance.dropdown = { hide: () => {} };
-    // spy the logout function
+    // spy the hideDropdown function
     const spy = sinon.spy(instance, 'hideDropdown');
-    // click to logout
+    // call function
     instance.hideDropdown();
     // logout function should have been called once
     sinon.assert.calledOnce(spy);
   });
 
+  it('can call the showDropdown function', () => {
+    const accountDropdown = shallow(<AccountDropdown />);
+
+    // define the instance
+    const instance = accountDropdown.instance();
+    instance.dropdown = { show: () => {} };
+    // spy the showDropdown function
+    const spy = sinon.spy(instance, 'showDropdown');
+    // click to logout
+    instance.showDropdown();
+    // logout function should have been called once
+    sinon.assert.calledOnce(spy);
+  });
+
   it('does not display the name when shouldDisplayName is false', () => {
     const accountDropdown = shallow(<AccountDropdown shouldDisplayName={false} />);
     expect(accountDropdown.find('#account-username').exists()).toBe(false);

src/Components/BidTracker/BidTrackerCard/BidTrackerCard.jsx

@@ -5,6 +5,7 @@ import BidSteps from '../BidStep';
 import BidTrackerCardBottom from '../BidTrackerCardBottom';
 import BidTrackerCardTop from '../BidTrackerCardTop';
 import OverlayAlert from '../OverlayAlert';
+import BoxShadow from '../../BoxShadow';
 import { shouldShowAlert } from '../BidHelpers';
 import {
   APPROVED_PROP,
@@ -24,7 +25,7 @@ userProfile }) => {
   // add class to container for draft since we need to apply an overflow:hidden for drafts only
   const draftClass = bid.status === DRAFT_PROP ? 'bid-tracker-bid-steps-container--draft' : '';
   return (
-    <div className="bid-tracker">
+    <BoxShadow className="bid-tracker">
       <div>
         <BidTrackerCardTop
           bid={bid}
@@ -57,7 +58,7 @@ userProfile }) => {
             </div>
           </div>
       }
-    </div>
+    </BoxShadow>
   );
 };
 

src/Components/BidTracker/BidTrackerCard/__snapshots__/BidTrackerCard.test.jsx.snap

@@ -1,8 +1,16 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`BidTrackerCardComponent matches snapshot 1`] = `
-<div
+<BoxShadow
+  blurRadius={10}
   className="bid-tracker"
+  color="rgba(0,0,0,.15)"
+  inset={false}
+  is="div"
+  offsetX={3}
+  offsetY={2}
+  spreadRadius={1}
+  style={Object {}}
 >
   <div>
     <BidTrackerCardTop
@@ -56,6 +64,7 @@ exports[`BidTrackerCardComponent matches snapshot 1`] = `
         }
       }
       deleteBid={[Function]}
+      hideDelete={false}
       showBidCount={true}
       showQuestion={true}
     />
@@ -170,5 +179,5 @@ exports[`BidTrackerCardComponent matches snapshot 1`] = `
       />
     </div>
   </div>
-</div>
+</BoxShadow>
 `;

src/Components/BidTracker/BidTrackerCardTop/BidTrackerCardTop.jsx

@@ -21,7 +21,7 @@ class BidTrackerCardTop extends Component {
   }
 
   render() {
-    const { bid, showBidCount, showQuestion } = this.props;
+    const { bid, hideDelete, showBidCount, showQuestion } = this.props;
     const bidStatistics = get(bid, 'position.bid_statistics[0]', {});
     const post = get(bid, 'position.post', {});
     return (
@@ -45,7 +45,7 @@ class BidTrackerCardTop extends Component {
                 </div>
             }
             <div className="bid-tracker-actions-container">
-              { bid.can_delete &&
+              { bid.can_delete && !hideDelete &&
                 <ConfirmLink
                   className="remove-bid-link"
                   defaultText="Remove Bid"
@@ -66,11 +66,13 @@ BidTrackerCardTop.propTypes = {
   showQuestion: PropTypes.bool, // Determine whether or not to show the question text
   deleteBid: PropTypes.func.isRequired,
   showBidCount: PropTypes.bool,
+  hideDelete: PropTypes.bool,
 };
 
 BidTrackerCardTop.defaultProps = {
   showQuestion: true,
   showBidCount: true,
+  hideDelete: false,
 };
 
 export default BidTrackerCardTop;

src/Components/BidTracker/PriorityCards/IsOnStandby/IsOnStandby.jsx

@@ -31,6 +31,7 @@ const IsOnStandby = ({ bid, deleteBid }) => {
           showQuestion={false}
           bid={bid}
           deleteBid={deleteBid}
+          hideDelete
         />
       </div>
     </div>

src/Components/BidTracker/PriorityCards/IsOnStandby/__snapshots__/IsOnStandby.test.jsx.snap

@@ -77,6 +77,7 @@ exports[`IsOnStandbyComponent matches snapshot 1`] = `
         }
       }
       deleteBid={[Function]}
+      hideDelete={true}
       showBidCount={false}
       showQuestion={false}
     />

src/Components/BidTracker/PriorityCards/IsPriority/IsPriority.jsx

@@ -7,11 +7,11 @@ const IsPriority = ({ children }) => (
     <div className="usa-grid-full bid-tracker-priority-wrapper">
       <div className="usa-grid-full padded-container-inner priority-banner">
         <div className="usa-width-one-half priority-banner-container-left">
-          Priority Assignment
+          Pending Assignment
         </div>
         <div className="usa-width-one-half priority-banner-container-right">
           <div className="priority-banner-question-text">
-            <FontAwesome name="question-circle" /> What is a priority Assignment?
+            <FontAwesome name="question-circle" /> What is a Pending Assignment?
           </div>
         </div>
       </div>

src/Components/BidTracker/PriorityCards/IsPriority/__snapshots__/IsPriority.test.jsx.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`IsPriorityComponent matches snapshot 1`] = `
+exports['IsPriorityComponent matches snapshot 1'] = `
 <div
   className="usa-grid-full bid-tracker-priority-wrapper-container"
 >
@@ -13,7 +13,7 @@ exports[`IsPriorityComponent matches snapshot 1`] = `
       <div
         className="usa-width-one-half priority-banner-container-left"
       >
-        Priority Assignment
+        Pending Assignment
       </div>
       <div
         className="usa-width-one-half priority-banner-container-right"
@@ -24,7 +24,7 @@ exports[`IsPriorityComponent matches snapshot 1`] = `
           <FontAwesome
             name="question-circle"
           />
-           What is a priority Assignment?
+           What is a Pending Assignment?
         </div>
       </div>
     </div>

src/Components/BidderPortfolio/BidderPortfolioCard/BidderPortfolioCard.jsx

@@ -4,9 +4,10 @@ import UserProfileGeneralInformation from '../../ProfileDashboard/UserProfile/Us
 import UserProfilePersonalInformation from '../../ProfileDashboard/UserProfile/UserProfilePersonalInformation';
 import UserProfileBidInformation from '../../ProfileDashboard/UserProfile/UserProfileBidInformation';
 import BidderPortfolioViewMore from '../BidderPortfolioViewMore';
+import BoxShadow from '../../BoxShadow';
 
 const BidderPortfolioCard = ({ userProfile }) => (
-  <div className="usa-grid-full current-user bidder-portfolio-card">
+  <BoxShadow className="usa-grid-full current-user bidder-portfolio-card">
     <UserProfileGeneralInformation
       userProfile={userProfile}
       showEditLink={false}
@@ -19,7 +20,7 @@ const BidderPortfolioCard = ({ userProfile }) => (
       submitted={userProfile.bid_statistics[0] ? userProfile.bid_statistics[0].submitted : 0}
     />
     <BidderPortfolioViewMore useLink id={userProfile.id} />
-  </div>
+  </BoxShadow>
 );
 
 BidderPortfolioCard.propTypes = {

src/Components/BidderPortfolio/BidderPortfolioCard/__snapshots__/BidderPortfolioCard.test.jsx.snap

@@ -1,8 +1,16 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`BidderPortfolioCardComponent matches snapshot 1`] = `
-<div
+<BoxShadow
+  blurRadius={10}
   className="usa-grid-full current-user bidder-portfolio-card"
+  color="rgba(0,0,0,.15)"
+  inset={false}
+  is="div"
+  offsetX={3}
+  offsetY={2}
+  spreadRadius={1}
+  style={Object {}}
 >
   <UserProfileGeneralInformation
     showEditLink={false}
@@ -128,5 +136,5 @@ exports[`BidderPortfolioCardComponent matches snapshot 1`] = `
     onClick={[Function]}
     useLink={true}
   />
-</div>
+</BoxShadow>
 `;

src/Components/BoxShadow/BoxShadow.jsx

@@ -0,0 +1,47 @@
+// forked from https://github.com/lachlanjc/react-box-shadow
+import React from 'react';
+import PropTypes from 'prop-types';
+import cssShadow from 'css-box-shadow';
+
+const BoxShadow = ({ is, inset, offsetX, offsetY, blurRadius, spreadRadius, color, style,
+...props }) => {
+  const Component = is;
+  const sx = {
+    ...style,
+    boxShadow: cssShadow.stringify([
+      {
+        inset,
+        offsetX,
+        offsetY,
+        blurRadius,
+        spreadRadius,
+        color,
+      },
+    ]),
+  };
+  return <Component style={sx} {...props} />;
+};
+
+BoxShadow.propTypes = {
+  is: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+  inset: PropTypes.bool,
+  offsetX: PropTypes.number,
+  offsetY: PropTypes.number,
+  blurRadius: PropTypes.number,
+  spreadRadius: PropTypes.number,
+  color: PropTypes.string,
+  style: PropTypes.shape({}),
+};
+
+BoxShadow.defaultProps = {
+  is: 'div',
+  inset: false,
+  offsetX: 3,
+  offsetY: 2,
+  blurRadius: 10,
+  spreadRadius: 1,
+  color: 'rgba(0,0,0,.15)',
+  style: {},
+};
+
+export default BoxShadow;

src/Components/BoxShadow/BoxShadow.test.jsx

@@ -0,0 +1,33 @@
+import { shallow } from 'enzyme';
+import React from 'react';
+import toJSON from 'enzyme-to-json';
+import BoxShadow from './BoxShadow';
+
+describe('BoxShadow', () => {
+  it('can receive props', () => {
+    const wrapper = shallow(
+      <BoxShadow
+        is="span"
+        inset
+        offsetX={23}
+        offsetY={25}
+        blurRadius={27}
+        spreadRadius={29}
+        color="#f2f2f2"
+        style={{ backgroundColor: 'red' }}
+      />,
+    );
+    const output = {
+      backgroundColor: 'red',
+      boxShadow: 'inset 23px 25px 27px 29px #f2f2f2',
+    };
+    expect(wrapper.props().style).toEqual(output);
+  });
+
+  it('matches snapshot', () => {
+    const wrapper = shallow(
+      <BoxShadow />,
+    );
+    expect(toJSON(wrapper)).toMatchSnapshot();
+  });
+});

src/Components/BoxShadow/__snapshots__/BoxShadow.test.jsx.snap

@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`BoxShadow matches snapshot 1`] = `
+<div
+  style={
+    Object {
+      "boxShadow": "3px 2px 10px 1px rgba(0,0,0,.15)",
+    }
+  }
+/>
+`;

src/Components/BoxShadow/index.js

@@ -0,0 +1 @@
+export { default } from './BoxShadow';

src/Components/CompareDrawer/CompareDrawerContainer.jsx

@@ -7,7 +7,7 @@ import CompareDrawer from './CompareDrawer';
 import { COMPARE_LIST } from '../../Constants/PropTypes';
 import { getScrollDistanceFromBottom } from '../../utilities';
 
-class Compare extends Component {
+export class Compare extends Component {
   constructor(props) {
     super(props);
     this.lsListener = this.lsListener.bind(this);