Skip to content

Commit 7e83f66

Browse files
author
vikasrohit
authored
Merge pull request #1209 from yoution/issue-1195
fix issue #1195 #1203 #1204
2 parents 2d7372a + c016876 commit 7e83f66

File tree

6 files changed

+109
-117
lines changed

6 files changed

+109
-117
lines changed

‎src/components/ChallengeEditor/ChallengeEditor.module.scss‎

Lines changed: 14 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -15,20 +15,26 @@
1515
}
1616
}
1717

18-
.title {
19-
@include roboto-bold();
18+
.topContainer {
19+
margin-top: 30px;
20+
display: flex;
21+
justify-content: space-between;
22+
align-items: center;
23+
padding: 0 20px;
24+
}
2025

26+
.leftContainer {
27+
display: flex;
28+
align-items: center;
29+
}
30+
31+
.title {
2132
font-size: 24px;
2233
font-weight: 700;
2334
line-height: 29px;
35+
margin-right: 5px;
2436
color: $challenges-title;
25-
margin-top: 30px;
2637
text-align: center;
27-
28-
span {
29-
color: $tc-red;
30-
}
31-
3238
}
3339

3440
.textRequired {
@@ -255,7 +261,6 @@
255261
}
256262

257263
.actionButtons {
258-
position: absolute;
259264
top: 30px;
260265
a,button {
261266
height: 40px;

‎src/components/ChallengeEditor/ChallengeViewTabs/ChallengeViewTabs.module.scss‎

Lines changed: 23 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,32 @@
33
$tc-dark-blue: #0681ff;
44
$tc-white: #FFFFFF;
55

6+
.topContainer {
7+
margin-top: 30px;
8+
display: flex;
9+
justify-content: space-between;
10+
align-items: center;
11+
padding: 0 20px;
12+
}
13+
14+
.leftContainer {
15+
display: flex;
16+
align-items: center;
17+
}
18+
.title {
19+
@include roboto-bold();
20+
21+
font-size: 24px;
22+
font-weight: 700;
23+
line-height: 29px;
24+
margin-right: 5px;
25+
color: $challenges-title;
26+
text-align: center;
27+
}
28+
629
.actionButtons {
730
display: flex;
8-
position: absolute;
931
top: 30px;
10-
margin-top: 53px;
1132
}
1233

1334
.actionButtonsLeft {
@@ -38,21 +59,6 @@ $tc-white: #FFFFFF;
3859
}
3960
}
4061

41-
.title {
42-
@include roboto-bold();
43-
44-
font-size: 24px;
45-
font-weight: 700;
46-
line-height: 29px;
47-
color: $challenges-title;
48-
margin-top: 25px;
49-
text-align: center;
50-
51-
span {
52-
color: $tc-red;
53-
}
54-
}
55-
5662
.challenge-view-selector {
5763
display: flex;
5864
flex-wrap: wrap;

‎src/components/ChallengeEditor/ChallengeViewTabs/index.js‎

Lines changed: 51 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -81,60 +81,64 @@ const ChallengeViewTabs = ({
8181
return (
8282
<div className={styles.list}>
8383
<Helmet title='View Details' />
84-
{!isTask && (
84+
<div className={styles.topContainer}>
85+
<div className={styles.leftContainer}>
86+
<div className={styles.title}>{challenge.name}</div>
87+
{!isTask && (
88+
<div
89+
className={cn(
90+
styles.actionButtons,
91+
styles.button,
92+
styles.actionButtonsLeft
93+
)}
94+
>
95+
<LegacyLinks challenge={challenge} challengeView />
96+
</div>
97+
)}
98+
</div>
8599
<div
86100
className={cn(
87101
styles.actionButtons,
88102
styles.button,
89-
styles.actionButtonsLeft
103+
styles.actionButtonsRight
90104
)}
91105
>
92-
<LegacyLinks challenge={challenge} challengeView />
106+
{(challenge.status === 'Draft' || challenge.status === 'New') && <div className={styles['cancel-button']}><CancelDropDown challenge={challenge} onSelectMenu={cancelChallenge} /></div>}
107+
{challenge.status === 'Draft' && (
108+
<div className={styles.button}>
109+
{challenge.legacyId || isTask ? (
110+
<PrimaryButton
111+
text={'Launch'}
112+
type={'info'}
113+
onClick={onLaunchChallenge}
114+
/>
115+
) : (
116+
<Tooltip content={MESSAGE.NO_LEGACY_CHALLENGE}>
117+
{/* Don't disable button for real inside tooltip, otherwise mouseEnter/Leave events work not good */}
118+
<PrimaryButton text={'Launch'} type={'disabled'} />
119+
</Tooltip>
120+
)}
121+
</div>
122+
)}
123+
{isTask && challenge.status === 'Active' && (
124+
<div className={styles.button}>
125+
{assignedMemberDetails ? (
126+
<Tooltip content={MESSAGE.MARK_COMPLETE}>
127+
<PrimaryButton text={'Mark Complete'} type={'success'} onClick={onCloseTask} />
128+
</Tooltip>
129+
) : (
130+
<Tooltip content={MESSAGE.NO_TASK_ASSIGNEE}>
131+
{/* Don't disable button for real inside tooltip, otherwise mouseEnter/Leave events work not good */}
132+
<PrimaryButton text={'Mark Complete'} type={'disabled'} />
133+
</Tooltip>
134+
)}
135+
</div>
136+
)}
137+
{enableEdit && (
138+
<PrimaryButton text={'Edit'} type={'info'} submit link={`./edit`} />
139+
)}
140+
<PrimaryButton text={'Back'} type={'info'} submit link={`..`} />
93141
</div>
94-
)}
95-
<div className={styles.title}>{challenge.name}</div>
96-
<div
97-
className={cn(
98-
styles.actionButtons,
99-
styles.button,
100-
styles.actionButtonsRight
101-
)}
102-
>
103-
{(challenge.status === 'Draft' || challenge.status === 'New') && <div className={styles['cancel-button']}><CancelDropDown challenge={challenge} onSelectMenu={cancelChallenge} /></div>}
104-
{challenge.status === 'Draft' && (
105-
<div className={styles.button}>
106-
{challenge.legacyId || isTask ? (
107-
<PrimaryButton
108-
text={'Launch'}
109-
type={'info'}
110-
onClick={onLaunchChallenge}
111-
/>
112-
) : (
113-
<Tooltip content={MESSAGE.NO_LEGACY_CHALLENGE}>
114-
{/* Don't disable button for real inside tooltip, otherwise mouseEnter/Leave events work not good */}
115-
<PrimaryButton text={'Launch'} type={'disabled'} />
116-
</Tooltip>
117-
)}
118-
</div>
119-
)}
120-
{isTask && challenge.status === 'Active' && (
121-
<div className={styles.button}>
122-
{assignedMemberDetails ? (
123-
<Tooltip content={MESSAGE.MARK_COMPLETE}>
124-
<PrimaryButton text={'Mark Complete'} type={'success'} onClick={onCloseTask} />
125-
</Tooltip>
126-
) : (
127-
<Tooltip content={MESSAGE.NO_TASK_ASSIGNEE}>
128-
{/* Don't disable button for real inside tooltip, otherwise mouseEnter/Leave events work not good */}
129-
<PrimaryButton text={'Mark Complete'} type={'disabled'} />
130-
</Tooltip>
131-
)}
132-
</div>
133-
)}
134-
{enableEdit && (
135-
<PrimaryButton text={'Edit'} type={'info'} submit link={`./edit`} />
136-
)}
137-
<PrimaryButton text={'Back'} type={'info'} submit link={`..`} />
138142
</div>
139143
<div className={styles['challenge-view-selector']}>
140144
<a

‎src/components/ChallengeEditor/index.js‎

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -59,12 +59,12 @@ const theme = {
5959
container: styles.modalContainer
6060
}
6161

62-
const getTitle = (isNew) => {
62+
const getTitle = (isNew, challenge) => {
6363
if (isNew) {
6464
return 'Create New Work'
6565
}
6666

67-
return 'Set-Up Work'
67+
return challenge.name || 'Set-Up Work'
6868
}
6969

7070
class ChallengeEditor extends Component {
@@ -1600,14 +1600,16 @@ class ChallengeEditor extends Component {
16001600

16011601
return (
16021602
<div className={styles.wrapper}>
1603-
<Helmet title={getTitle(isNew)} />
1604-
<div className={cn(styles.actionButtons, styles.actionButtonsLeft)}>
1605-
{!isNew && <LegacyLinks challenge={challenge} />}
1606-
</div>
1607-
<div className={styles.title}>{getTitle(isNew)}</div>
1608-
<div className={cn(styles.actionButtons, styles.actionButtonsRight)}>
1609-
{!isNew && this.props.challengeDetails.status === 'New' && <PrimaryButton text={'Delete'} type={'danger'} onClick={this.deleteModalLaunch} />}
1610-
<PrimaryButton text={'Back'} type={'info'} submit link={`/projects/${projectDetail.id}/challenges`} />
1603+
<Helmet title={getTitle(isNew, challenge)} />
1604+
<div className={styles.topContainer}>
1605+
<div className={styles.leftContainer}>
1606+
<div className={styles.title}>{getTitle(isNew, challenge)}</div>
1607+
{!isNew && <LegacyLinks challenge={challenge} />}
1608+
</div>
1609+
<div className={cn(styles.actionButtons, styles.actionButtonsRight)}>
1610+
{!isNew && this.props.challengeDetails.status === 'New' && <PrimaryButton text={'Delete'} type={'danger'} onClick={this.deleteModalLaunch} />}
1611+
<PrimaryButton text={'Back'} type={'info'} submit link={`/projects/${projectDetail.id}/challenges`} />
1612+
</div>
16111613
</div>
16121614
<div className={styles.textRequired}>* Required</div>
16131615
<div className={styles.container}>

‎src/components/LegacyLinks/LegacyLinks.module.scss‎

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,10 @@
11
@import "../../styles/includes";
22
.container {
33
display: flex;
4-
margin-top: auto;
54
align-items: center;
65

7-
button:not(:first-child),
8-
a:not(:first-child) {
9-
margin-left: 20px;
10-
}
11-
12-
button {
13-
height: 40px;
14-
outline: none;
15-
white-space: nowrap;
6+
> a {
7+
margin: 0 5px;
168
}
179

1810
.row {

‎src/components/LegacyLinks/index.js‎

Lines changed: 7 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -5,40 +5,23 @@ import React, { useCallback } from 'react'
55
import PropTypes from 'prop-types'
66
import cn from 'classnames'
77
import styles from './LegacyLinks.module.scss'
8-
import { DIRECT_PROJECT_URL, MESSAGE, ONLINE_REVIEW_URL } from '../../config/constants'
9-
import PrimaryButton from '../Buttons/PrimaryButton'
108
import Tooltip from '../Tooltip'
9+
import { MESSAGE, ONLINE_REVIEW_URL } from '../../config/constants'
1110

1211
const LegacyLinks = ({ challenge, challengeView }) => {
1312
const onClick = useCallback((e) => {
1413
e.stopPropagation()
1514
}, [])
1615

17-
const directUrl = `${DIRECT_PROJECT_URL}/contest/detail?projectId=${challenge.legacyId}`
1816
const orUrl = `${ONLINE_REVIEW_URL}/review/actions/ViewProjectDetails?pid=${challenge.legacyId}`
1917
return (
2018
<div className={styles.container}>
21-
{challenge.legacyId ? (
22-
<>
23-
<a href={directUrl} target={'_blank'} onClick={onClick}>
24-
<PrimaryButton text={'Direct'} type={'info'} />
25-
</a>
26-
<a href={orUrl} target={'_blank'} onClick={onClick}>
27-
<PrimaryButton text={'Online Review'} type={'info'} />
28-
</a>
29-
</>
30-
) : (
31-
<>
32-
<Tooltip content={MESSAGE.NO_LEGACY_CHALLENGE}>
33-
{/* Don't disable button for real inside tooltip, otherwise mouseEnter/Leave events work not good */}
34-
<PrimaryButton text={'Direct'} type={'disabled'} />
35-
</Tooltip>
36-
<Tooltip content={MESSAGE.NO_LEGACY_CHALLENGE}>
37-
{/* Don't disable button for real inside tooltip, otherwise mouseEnter/Leave events work not good */}
38-
<PrimaryButton text={'Online Review'} type={'disabled'} />
39-
</Tooltip>
40-
</>
41-
)}
19+
( {challenge.legacyId ? <a href={orUrl} target={'_blank'} onClick={onClick}>Online Review</a>
20+
: <Tooltip content={MESSAGE.NO_LEGACY_CHALLENGE}>
21+
{/* Don't disable button for real inside tooltip, otherwise mouseEnter/Leave events work not good */}
22+
<a disabled>Online Review</a>
23+
</Tooltip>}
24+
)
4225
<div>
4326
{ challengeView && challenge.discussions && challenge.discussions.map(d => (
4427
<div key={d.id} className={cn(styles.row, styles.topRow)}>

0 commit comments

Comments
 (0)