-
Notifications
You must be signed in to change notification settings - Fork 212
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #7009 from topcoder-platform/develop
Merge dev into branch
- Loading branch information
Showing
30 changed files
with
117 additions
and
1,351 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -8,16 +8,11 @@ import { isEmpty } from 'lodash'; | |
import React, { useState } from 'react'; | ||
import PT from 'prop-types'; | ||
import { connect } from 'react-redux'; | ||
import { isomorphy, Link, config } from 'topcoder-react-utils'; | ||
import { PrimaryButton } from 'topcoder-react-ui-kit'; | ||
import { Link, config } from 'topcoder-react-utils'; | ||
import ReactHtmlParser from 'react-html-parser'; | ||
import { getSalaryType, getCustomField } from 'utils/gigs'; | ||
import SubscribeMailChimpTag from 'containers/SubscribeMailChimpTag'; | ||
import { isValidEmail } from 'utils/tc'; | ||
import './style.scss'; | ||
import IconFacebook from 'assets/images/icon-facebook.svg'; | ||
import IconTwitter from 'assets/images/icon-twitter.svg'; | ||
import IconLinkedIn from 'assets/images/icon-linkedIn.svg'; | ||
import IconLocation from 'assets/images/icon-location.svg'; | ||
import IconMoney from 'assets/images/icon-payment.svg'; | ||
import IconDuration from 'assets/images/icon-calendar-gig.svg'; | ||
|
@@ -28,7 +23,6 @@ import iconLabel1 from 'assets/images/l1.png'; | |
import iconLabel2 from 'assets/images/l2.png'; | ||
import iconLabel3 from 'assets/images/l3.png'; | ||
import SadFace from 'assets/images/sad-face-icon.svg'; | ||
import ReferralModal from '../ReferralModal'; | ||
import LoginModal from '../LoginModal'; | ||
|
||
// Cleanup HTML from style tags | ||
|
@@ -44,28 +38,16 @@ const ReactHtmlParserOptions = { | |
|
||
function GigDetails(props) { | ||
const { | ||
job, application, profile, onSendClick, isReferrSucess, isReferrError, onReferralDone, growSurf, | ||
job, application, profile, | ||
} = props; | ||
let shareUrl; | ||
let retUrl; | ||
if (isomorphy.isClientSide()) { | ||
shareUrl = encodeURIComponent(window.location.href); | ||
if (growSurf && growSurf.data) { | ||
shareUrl = `${window.location.origin}${window.location.pathname}?referralId=${growSurf.data.id}`; | ||
} | ||
retUrl = `${window.location.origin}${window.location.pathname}/apply${window.location.search}`; | ||
} | ||
let skills = getCustomField(job.custom_fields, 'Technologies Required'); | ||
if (skills !== 'n/a') skills = skills.split(',').join(', '); | ||
const hPerW = getCustomField(job.custom_fields, 'Hours per week'); | ||
const compens = job.min_annual_salary === job.max_annual_salary ? job.max_annual_salary : `${job.min_annual_salary} - ${job.max_annual_salary} (USD)`; | ||
|
||
const [isModalOpen, setModalOpen] = useState(false); | ||
const [isLoginModalOpen, setLoginModalOpen] = useState(false); | ||
const [copyBtnText, setCopyBtnText] = useState('COPY'); | ||
const [referrEmail, setreferrEmail] = useState(); | ||
const duration = getCustomField(job.custom_fields, 'Duration'); | ||
let refEmailInput; | ||
|
||
return ( | ||
<div styleName="container"> | ||
|
@@ -157,83 +139,6 @@ function GigDetails(props) { | |
</div> | ||
</div> | ||
<div styleName="right"> | ||
<div styleName="referr-area"> | ||
<h6>REFER THIS GIG</h6> | ||
{ | ||
growSurf && growSurf.data ? ( | ||
<React.Fragment> | ||
<span styleName="referralLinkTitile">Share your Referral Link:</span> | ||
<input type="text" styleName="referralLink" readOnly value={`https://topcoder.com/gigs/${job.slug}?referralId=${growSurf.data.id}`} /> | ||
<div styleName="copyAndShare"> | ||
<PrimaryButton | ||
onClick={() => { | ||
const copyhelper = document.createElement('input'); | ||
copyhelper.className = 'copyhelper'; | ||
document.body.appendChild(copyhelper); | ||
copyhelper.value = `https://www.topcoder.com/gigs/${job.slug}?referralId=${growSurf.data.id}`; | ||
copyhelper.select(); | ||
document.execCommand('copy'); | ||
document.body.removeChild(copyhelper); | ||
setCopyBtnText('COPIED'); | ||
setTimeout(() => { | ||
setCopyBtnText('COPY'); | ||
}, 3000); | ||
}} | ||
> | ||
{copyBtnText} | ||
</PrimaryButton> | ||
<div styleName="shareButtons"> | ||
Share on: | ||
<a href={`https://www.linkedin.com/sharing/share-offsite/?url=${shareUrl}`} target="_blank" rel="noopener noreferrer"> | ||
<IconLinkedIn /> | ||
</a> | ||
<a href={`https://www.facebook.com/sharer/sharer.php?u=${shareUrl}&src=share_button`} target="_blank" rel="noopener noreferrer"> | ||
<IconFacebook /> | ||
</a> | ||
<a href={`https://twitter.com/intent/tweet?url=${shareUrl}`} target="_blank" rel="noopener noreferrer"> | ||
<IconTwitter /> | ||
</a> | ||
</div> | ||
</div> | ||
</React.Fragment> | ||
) : ( | ||
<div styleName="shareButtons"> | ||
Share this job on: | ||
<a href={`https://www.linkedin.com/sharing/share-offsite/?url=${shareUrl}`} target="_blank" rel="noopener noreferrer"> | ||
<IconLinkedIn /> | ||
</a> | ||
<a href={`https://www.facebook.com/sharer/sharer.php?u=${shareUrl}&src=share_button`} target="_blank" rel="noopener noreferrer"> | ||
<IconFacebook /> | ||
</a> | ||
<a href={`https://twitter.com/intent/tweet?url=${shareUrl}`} target="_blank" rel="noopener noreferrer"> | ||
<IconTwitter /> | ||
</a> | ||
</div> | ||
) | ||
} | ||
<div styleName="sepWrap"> | ||
<div styleName="sepLine" /> | ||
<span>or</span> | ||
<div styleName="sepLine" /> | ||
</div> | ||
<p>Refer someone to this gig and earn $500. Just add their email below. See <Link to="/community/gig-referral" styleName="how-it-works" openNewTab>how it works.</Link></p> | ||
<div styleName="referr-form"> | ||
<input type="email" placeholder="Email" onChange={e => setreferrEmail(e.target.value)} ref={ref => refEmailInput = ref} /> | ||
<button | ||
type="button" | ||
onClick={() => { | ||
if (!isEmpty(profile) && growSurf.data) { | ||
onSendClick(referrEmail); | ||
setreferrEmail(); | ||
refEmailInput.value = ''; | ||
} | ||
setModalOpen(true); | ||
}} | ||
disabled={!referrEmail || !isValidEmail(referrEmail)} | ||
>SEND | ||
</button> | ||
</div> | ||
</div> | ||
<div styleName="subscribe-area"> | ||
<h6>SUBSCRIBE TO WEEKLY GIG UPDATES</h6> | ||
<SubscribeMailChimpTag listId="28bfd3c062" groups={{ d0c48e9da3: true }} /> | ||
|
@@ -256,27 +161,6 @@ function GigDetails(props) { | |
</ul> | ||
</div> | ||
<div styleName="support">If you have any questions or doubts, don’t hesitate to email <a href="mailto:[email protected]">[email protected]</a>.</div> | ||
<div styleName="referral"> | ||
{ | ||
isModalOpen | ||
&& ( | ||
<ReferralModal | ||
profile={profile} | ||
onCloseButton={() => { | ||
onReferralDone(); | ||
setModalOpen(false); | ||
}} | ||
isReferrSucess={isReferrSucess} | ||
isReferrError={isReferrError} | ||
referralId={growSurf && growSurf.data ? growSurf.data.id : null} | ||
onReferralDone={() => { | ||
onReferralDone(true); | ||
setModalOpen(false); | ||
}} | ||
/> | ||
) | ||
} | ||
</div> | ||
{ | ||
isLoginModalOpen && <LoginModal retUrl={retUrl} onCancel={() => setLoginModalOpen(false)} /> | ||
} | ||
|
@@ -292,19 +176,12 @@ function GigDetails(props) { | |
GigDetails.defaultProps = { | ||
application: null, | ||
profile: {}, | ||
growSurf: {}, | ||
isReferrError: null, | ||
}; | ||
|
||
GigDetails.propTypes = { | ||
job: PT.shape().isRequired, | ||
application: PT.shape(), | ||
profile: PT.shape(), | ||
onSendClick: PT.func.isRequired, | ||
isReferrSucess: PT.bool.isRequired, | ||
isReferrError: PT.shape(), | ||
onReferralDone: PT.func.isRequired, | ||
growSurf: PT.shape(), | ||
}; | ||
|
||
function mapStateToProps(state) { | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.