Fix bid tracker URL

src/Components/BidTracker/BidTrackerCard/BidTrackerCard.jsx

@@ -28,7 +28,7 @@ class BidTrackerCard extends Component {
   }
   render() {
     const { bid, acceptBid, condensedView, declineBid, priorityExists, submitBid, deleteBid,
-      showBidCount, /* userProfile, */ useCDOView } = this.props;
+      showBidCount, /* userProfile, */ useCDOView, userId } = this.props;
     // determine whether we render an alert on top of the card
     const showAlert = shouldShowAlert(bid, { condensedView });
     // determine whether we should show the contacts section based on the status
@@ -68,6 +68,7 @@ class BidTrackerCard extends Component {
                   declineBid={declineBid}
                   submitBid={submitBid}
                   deleteBid={deleteBid}
+                  userId={userId}
                 />
             }
           </div>
@@ -110,6 +111,7 @@ BidTrackerCard.propTypes = {
   priorityExists: PropTypes.bool,
   useCDOView: PropTypes.bool,
   readOnly: PropTypes.bool,
+  userId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
 };
 
 BidTrackerCard.defaultProps = {
@@ -121,6 +123,7 @@ BidTrackerCard.defaultProps = {
   priorityExists: false,
   useCDOView: false,
   readOnly: false,
+  userId: '',
 };
 
 BidTrackerCard.childContextTypes = {

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

@@ -187,6 +187,7 @@ exports[`BidTrackerCardComponent matches snapshot 1`] = `
         declineBid={[Function]}
         deleteBid={[Function]}
         submitBid={[Function]}
+        userId=""
       />
     </div>
   </div>

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

@@ -65,6 +65,7 @@ exports[`BidTrackerCardContainerComponent matches snapshot when priorityExists i
     showBidCount={true}
     submitBid={[Function]}
     useCDOView={false}
+    userId=""
     userProfile={
       Object {
         "bid_statistics": Array [
@@ -259,6 +260,7 @@ exports[`BidTrackerCardContainerComponent matches snapshot when priorityExists i
       showBidCount={false}
       submitBid={[Function]}
       useCDOView={false}
+      userId=""
       userProfile={
         Object {
           "bid_statistics": Array [

src/Components/BidTracker/OverlayAlert/ClosedAlert/ClosedAlert.jsx

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import LinkButton from '../../../LinkButton';
 
 
-const ClosedAlert = ({ title, date, id }, { condensedView }) => (
+const ClosedAlert = ({ title, date, bidIdUrl }, { condensedView }) => (
   <div className="bid-tracker-alert-container bid-tracker-alert-container--closed">
     <div className="top-text">
         Your bid  on {title} is no longer applicable.
@@ -17,7 +17,7 @@ const ClosedAlert = ({ title, date, id }, { condensedView }) => (
     {
       condensedView &&
       <div className="usa-grid-full">
-        <LinkButton toLink={`/profile/bidtracker/${id || ''}`} className="tm-button-transparent">
+        <LinkButton toLink={bidIdUrl} className="tm-button-transparent">
           Go to Bid Tracker
         </LinkButton>
       </div>
@@ -28,12 +28,12 @@ const ClosedAlert = ({ title, date, id }, { condensedView }) => (
 ClosedAlert.propTypes = {
   title: PropTypes.string.isRequired,
   date: PropTypes.string,
-  id: PropTypes.number,
+  bidIdUrl: PropTypes.string,
 };
 
 ClosedAlert.defaultProps = {
-  id: 0,
   date: '',
+  bidIdUrl: '',
 };
 
 ClosedAlert.contextTypes = {

src/Components/BidTracker/OverlayAlert/DeclinedAlert/DeclinedAlert.jsx

@@ -2,15 +2,15 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import LinkButton from '../../../LinkButton';
 
-const DeclinedAlert = ({ bureau, id }, { condensedView }) => (
+const DeclinedAlert = ({ bureau, bidIdUrl }, { condensedView }) => (
   <div className="bid-tracker-alert-container bid-tracker-alert-container--declined">
     <div className="top-text">
       {bureau || 'The bureau'} has <strong>declined</strong> the bid
     </div>
     {
       condensedView &&
       <div className="usa-grid-full">
-        <LinkButton toLink={`/profile/bidtracker/${id || ''}`} className="tm-button-transparent">
+        <LinkButton toLink={bidIdUrl} className="tm-button-transparent">
           Go to Bid Tracker
         </LinkButton>
       </div>
@@ -20,11 +20,11 @@ const DeclinedAlert = ({ bureau, id }, { condensedView }) => (
 
 DeclinedAlert.propTypes = {
   bureau: PropTypes.string.isRequired,
-  id: PropTypes.number,
+  bidIdUrl: PropTypes.string,
 };
 
 DeclinedAlert.defaultProps = {
-  id: 0,
+  bidIdUrl: '',
 };
 
 DeclinedAlert.contextTypes = {

src/Components/BidTracker/OverlayAlert/HandshakeDeclinedAlert/HandshakeDeclinedAlert.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import LinkButton from '../../../LinkButton';
 
-const HandshakeDeclinedAlert = ({ userName, bureau, id }, { condensedView }) => (
+const HandshakeDeclinedAlert = ({ userName, bureau, bidIdUrl }, { condensedView }) => (
   <div
     className="bid-tracker-alert-container bid-tracker-alert-container--handshake-declined"
   >
@@ -17,7 +17,7 @@ const HandshakeDeclinedAlert = ({ userName, bureau, id }, { condensedView }) =>
     {
       condensedView &&
       <div className="usa-grid-full">
-        <LinkButton toLink={`/profile/bidtracker/${id || ''}`} className="tm-button-transparent">
+        <LinkButton toLink={bidIdUrl} className="tm-button-transparent">
           Go to Bid Tracker
         </LinkButton>
       </div>
@@ -28,11 +28,11 @@ const HandshakeDeclinedAlert = ({ userName, bureau, id }, { condensedView }) =>
 HandshakeDeclinedAlert.propTypes = {
   userName: PropTypes.string.isRequired,
   bureau: PropTypes.string.isRequired,
-  id: PropTypes.number,
+  bidIdUrl: PropTypes.string,
 };
 
 HandshakeDeclinedAlert.defaultProps = {
-  id: 0,
+  bidIdUrl: '',
 };
 
 HandshakeDeclinedAlert.contextTypes = {

src/Components/BidTracker/OverlayAlert/HandshakeOfferedAlert/HandshakeOfferedAlert.jsx

@@ -15,15 +15,15 @@ class HandshakeOfferedAlert extends Component {
   };
 
   render() {
-    const { userName, id } = this.props;
+    const { userName, bidIdUrl } = this.props;
     const { condensedView } = this.context;
     return (
       <div className="bid-tracker-alert-container bid-tracker-alert-container--handshake-offered">
         <div className="top-text">{`${userName}, you've been offered a handshake`}</div>
         <div className="usa-grid-full">
           {
             condensedView ?
-              <LinkButton toLink={`/profile/bidtracker/${id}`} className="tm-button-transparent">
+              <LinkButton toLink={bidIdUrl} className="tm-button-transparent">
                 Go to Bid Tracker
               </LinkButton>
               :
@@ -46,6 +46,11 @@ HandshakeOfferedAlert.propTypes = {
   userName: PropTypes.string.isRequired,
   acceptBid: PropTypes.func.isRequired,
   declineBid: PropTypes.func.isRequired,
+  bidIdUrl: PropTypes.string,
+};
+
+HandshakeOfferedAlert.defaultProps = {
+  bidIdUrl: '',
 };
 
 HandshakeOfferedAlert.contextTypes = {

src/Components/BidTracker/OverlayAlert/OverlayAlert.jsx

@@ -1,8 +1,8 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { BID_OBJECT } from '../../../Constants/PropTypes';
+import { BID_OBJECT } from 'Constants/PropTypes';
 import { APPROVED_PROP, CLOSED_PROP, HAND_SHAKE_OFFERED_PROP, DRAFT_PROP,
-  HAND_SHAKE_DECLINED_PROP, IN_PANEL_PROP, DECLINED_PROP, PANEL_RESCHEDULED_PROP } from '../../../Constants/BidData';
+  HAND_SHAKE_DECLINED_PROP, IN_PANEL_PROP, DECLINED_PROP, PANEL_RESCHEDULED_PROP } from 'Constants/BidData';
 import ApprovedAlert from './ApprovedAlert';
 import HandshakeOfferedAlert from './HandshakeOfferedAlert';
 import InPanelAlert from './InPanelAlert';
@@ -11,10 +11,12 @@ import DeclinedAlert from './DeclinedAlert';
 import ClosedAlert from './ClosedAlert';
 import PanelRescheduledAlert from './PanelRescheduledAlert';
 import DraftAlert from './DraftAlert';
+import { getBidIdUrl } from './helpers';
 
 // Alert rendering based on status is handled here.
 // eslint-disable-next-line complexity
-const OverlayAlert = ({ bid, acceptBid, declineBid, submitBid }, { condensedView }) => {
+const OverlayAlert = ({ bid, acceptBid, declineBid, submitBid, userId },
+  { condensedView, readOnly }) => {
   const CLASS_PENDING = 'bid-tracker-overlay-alert--pending';
   const CLASS_SUCCESS = 'bid-tracker-overlay-alert--success';
   const CLASS_CLOSED = 'bid-tracker-overlay-alert--closed';
@@ -23,6 +25,8 @@ const OverlayAlert = ({ bid, acceptBid, declineBid, submitBid }, { condensedView
   const { position } = bid;
   const BID_TITLE = `${position.title}${position.position_number ? ` (${position.position_number})` : ''}`;
 
+  const bidIdUrl = getBidIdUrl(bid.id, readOnly, userId);
+
   let overlayClass = '';
   let overlayContent = '';
 
@@ -53,6 +57,7 @@ const OverlayAlert = ({ bid, acceptBid, declineBid, submitBid }, { condensedView
           userName={bid.user}
           acceptBid={acceptBid}
           declineBid={declineBid}
+          bidIdUrl={bidIdUrl}
         />
       );
       break;
@@ -66,16 +71,23 @@ const OverlayAlert = ({ bid, acceptBid, declineBid, submitBid }, { condensedView
           userName={bid.user}
           bureau={position.bureau}
           id={bid.id}
+          bidIdUrl={bidIdUrl}
         />
       );
       break;
     case DECLINED_PROP:
       overlayClass = CLASS_CLOSED;
-      overlayContent = <DeclinedAlert bureau={position.bureau} id={bid.id} />;
+      overlayContent = <DeclinedAlert bureau={position.bureau} id={bid.id} bidIdUrl={bidIdUrl} />;
       break;
     case CLOSED_PROP:
       overlayClass = CLASS_CLOSED;
-      overlayContent = <ClosedAlert title={BID_TITLE} date={bid.closed_date} id={bid.id} />;
+      overlayContent =
+        (<ClosedAlert
+          title={BID_TITLE}
+          date={bid.closed_date}
+          id={bid.id}
+          bidIdUrl={bidIdUrl}
+        />);
       break;
     case PANEL_RESCHEDULED_PROP:
       overlayClass = CLASS_PENDING;
@@ -109,10 +121,16 @@ OverlayAlert.propTypes = {
   acceptBid: PropTypes.func.isRequired,
   declineBid: PropTypes.func.isRequired,
   submitBid: PropTypes.func.isRequired,
+  userId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+};
+
+OverlayAlert.defaultProps = {
+  userId: '',
 };
 
 OverlayAlert.contextTypes = {
   condensedView: PropTypes.bool,
+  readOnly: PropTypes.bool,
 };
 
 export default OverlayAlert;

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

@@ -27,6 +27,7 @@ exports[`OverlayAlertComponent matches snapshot when type is "closed" 1`] = `
       className="bid-tracker-overlay-alert-content"
     >
       <ClosedAlert
+        bidIdUrl="/profile/bidtracker/3"
         date="2017-12-20"
         id={3}
         title="POLITICAL/ECONOMIC OFFICER (10035561)"
@@ -47,6 +48,7 @@ exports[`OverlayAlertComponent matches snapshot when type is "declined" 1`] = `
       className="bid-tracker-overlay-alert-content"
     >
       <DeclinedAlert
+        bidIdUrl="/profile/bidtracker/3"
         bureau="(AF) BUREAU OF AFRICAN AFFAIRS"
         id={3}
       />
@@ -150,6 +152,7 @@ exports[`OverlayAlertComponent matches snapshot when type is "handshake_declined
       className="bid-tracker-overlay-alert-content"
     >
       <HandshakeDeclinedAlert
+        bidIdUrl="/profile/bidtracker/3"
         bureau="(AF) BUREAU OF AFRICAN AFFAIRS"
         id={3}
         userName="rehmant"
@@ -171,6 +174,7 @@ exports[`OverlayAlertComponent matches snapshot when type is "handshake_offered"
     >
       <HandshakeOfferedAlert
         acceptBid={[Function]}
+        bidIdUrl="/profile/bidtracker/3"
         declineBid={[Function]}
         id={3}
         userName="rehmant"

src/Components/BidTracker/OverlayAlert/helpers.js

@@ -0,0 +1,12 @@
+export const getBidIdUrl = (id = '', isPublic = false, userId = '') => {
+  let url = '/profile/bidtracker';
+  if (isPublic && userId) {
+    url = `${url}/public/${userId}`;
+  }
+  if (id) {
+    url = `${url}/${id}`;
+  }
+  return url;
+};
+
+export default getBidIdUrl;

src/Components/ProfileDashboard/BidList/BidList.jsx

@@ -27,6 +27,7 @@ const BidList = ({ bids, submitBidPosition, deleteBid, isLoading, isPublic,
       deleteBid={deleteBid}
       priorityExists={doesPriorityExist}
       readOnly={isPublic}
+      userId={userId}
     />
   ));
   return (

src/Components/ProfileDashboard/BidList/__snapshots__/BidList.test.jsx.snap

@@ -98,6 +98,7 @@ exports[`BidListComponent matches snapshot 1`] = `
         showBidCount={true}
         submitBid={[Function]}
         useCDOView={false}
+        userId=""
       />
       <BidTrackerCard
         acceptBid={[Function]}
@@ -161,6 +162,7 @@ exports[`BidListComponent matches snapshot 1`] = `
         showBidCount={true}
         submitBid={[Function]}
         useCDOView={false}
+        userId=""
       />
       <BidTrackerCard
         acceptBid={[Function]}
@@ -227,6 +229,7 @@ exports[`BidListComponent matches snapshot 1`] = `
         showBidCount={true}
         submitBid={[Function]}
         useCDOView={false}
+        userId=""
       />
     </div>
     <div

src/Components/ProfilePage/ProfilePage.jsx

@@ -37,10 +37,10 @@ const ProfilePage = ({ user, isLoading }) => (
           <Route path="/profile/favorites" component={FavoritePositionsContainer} />
           <Route path="/profile/searches" component={SavedSearchesWrapper} />
           <Route
-            path="/profile/bidtracker/public/:id"
+            path="/profile/bidtracker/public/:id/:bid?"
             render={props => <BidTracker {...props} isPublic />}
           />
-          <Route path="/profile/bidtracker/:id?" component={BidTracker} />
+          <Route path="/profile/bidtracker/:bid?" component={BidTracker} />
           <Route path="/profile/statistics" component={BidStatistics} />
           <Route path="/profile/glossaryeditor" component={GlossaryEditor} />
           <Route path="/profile/public/:id" component={ProfilePublic} />

src/Containers/BidTracker/BidTracker.jsx

@@ -31,8 +31,8 @@ class BidTrackerContainer extends Component {
 
   componentDidUpdate() {
     const { match: { params } } = this.props;
-    if (params.id) {
-      this.scrollToId(params.id);
+    if (params.bid) {
+      this.scrollToId(params.bid);
     }
   }
 
@@ -144,7 +144,10 @@ BidTrackerContainer.propTypes = {
   userProfile: USER_PROFILE.isRequired,
   userProfileIsLoading: PropTypes.bool.isRequired,
   match: PropTypes.shape({
-    params: PropTypes.shape({ id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]) }),
+    params: PropTypes.shape({
+      id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+      bid: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    }),
   }),
   userProfilePublic: USER_PROFILE,
   userProfilePublicIsLoading: PropTypes.bool,

src/Containers/BidTracker/BidTracker.test.jsx

@@ -46,10 +46,10 @@ describe('BidTracker', () => {
   it('calls scrollToId when componentDidUpdate is called', () => {
     const wrapper = shallow(<BidTracker.WrappedComponent
       {...props}
-      match={{ params: { id: 2 } }}
+      match={{ params: { bid: 2 } }}
     />);
     const spy = sinon.spy(wrapper.instance(), 'scrollToId');
-    wrapper.instance().componentDidUpdate({ ...props, match: { params: { id: 2 } } });
+    wrapper.instance().componentDidUpdate({ ...props, match: { params: { bid: 2 } } });
     sinon.assert.calledOnce(spy);
   });