Skip to content
This repository was archived by the owner on Mar 13, 2025. It is now read-only.

Commit deded31

Browse files
authored
Merge pull request #307 from mbaghel/feature/frontend-search
Feature/frontend search - winner's submission
2 parents 92a2eff + 90d28e3 commit deded31

File tree

26 files changed

+683
-599
lines changed

26 files changed

+683
-599
lines changed

src/constants/index.js

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -109,8 +109,8 @@ export const CANDIDATE_STATUS = {
109109
REJECTED_OTHER: "rejected - other",
110110
INTERVIEW: "interview",
111111
TOPCODER_REJECTED: "topcoder-rejected",
112-
JOB_CLOSED:"job-closed",
113-
OFFERED:"offered"
112+
JOB_CLOSED: "job-closed",
113+
OFFERED: "offered",
114114
};
115115

116116
/**
@@ -146,7 +146,7 @@ export const CANDIDATE_STATUS_FILTERS = [
146146
buttonText: "Selected",
147147
title: "Selected",
148148
noCandidateMessage: "No Selected Candidates",
149-
statuses: [CANDIDATE_STATUS.SELECTED,CANDIDATE_STATUS.OFFERED],
149+
statuses: [CANDIDATE_STATUS.SELECTED, CANDIDATE_STATUS.OFFERED],
150150
},
151151
{
152152
key: CANDIDATE_STATUS_FILTER_KEY.NOT_INTERESTED,
@@ -347,3 +347,8 @@ export const INTERVIEW_POPUP_MEDIA_URL =
347347
"http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4";
348348

349349
export const MAX_ALLOWED_INTERVIEWS = 3;
350+
351+
/**
352+
* Matching rate to show in CreateNewTeam ResultCard
353+
*/
354+
export const MATCHING_RATE = "80";

src/root.component.jsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -35,8 +35,8 @@ export default function Root() {
3535
<PositionDetails path="/taas/myteams/:teamId/positions/:positionId/candidates" />
3636
<TeamAccess path="/taas/myteams/:teamId/access" />
3737
<InputJobDescription path="/taas/myteams/createnewteam/jd" />
38-
<InputSkills path="/taas/myteams/createnewteam/:projectId/skills" />
39-
<SelectRole path="/taas/myteams/createnewteam/:projectId/role" />
38+
<InputSkills path="/taas/myteams/createnewteam/skills" />
39+
<SelectRole path="/taas/myteams/createnewteam/role" />
4040
</Router>
4141

4242
{/* Global config for Toastr popups */}
Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import "./styles.module.scss";
1313
function AddedRolesAccordion({ addedRoles }) {
1414
const [isOpen, setIsOpen] = useState(false);
1515

16-
return (
16+
return addedRoles.length ? (
1717
<div styleName="accordion">
1818
<button onClick={() => setIsOpen(!isOpen)} styleName="button">
1919
<div styleName="heading">
@@ -32,7 +32,7 @@ function AddedRolesAccordion({ addedRoles }) {
3232
</div>
3333
)}
3434
</div>
35-
);
35+
) : null;
3636
}
3737

3838
AddedRolesAccordion.propTypes = {
Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
import React from "react";
2+
import PT from "prop-types";
3+
import Modal from "react-responsive-modal";
4+
import IconCrossLight from "../../../../assets/images/icon-cross-light.svg";
5+
import CenteredSpinner from "components/CenteredSpinner";
6+
import "./styles.module.scss";
7+
import cn from "classnames";
8+
9+
const modalStyle = {
10+
borderRadius: "8px",
11+
padding: "72px 0 60px 0",
12+
width: "100%",
13+
margin: 0,
14+
"overflow-x": "hidden",
15+
};
16+
17+
const containerStyle = {
18+
padding: "10px",
19+
};
20+
21+
const closeButtonStyle = {
22+
top: "31px",
23+
right: "31px",
24+
};
25+
26+
function BaseCreateModal({
27+
open,
28+
onClose,
29+
hideCloseIcon,
30+
headerIcon,
31+
title,
32+
subtitle,
33+
buttons,
34+
isLoading,
35+
loadingMessage,
36+
maxWidth = "680px",
37+
darkHeader,
38+
children,
39+
}) {
40+
return (
41+
<Modal
42+
open={open}
43+
center
44+
onClose={onClose}
45+
showCloseIcon={!hideCloseIcon}
46+
closeIcon={
47+
<IconCrossLight height="20px" width="20px" styleName="cross" />
48+
}
49+
styles={{
50+
modal: { ...modalStyle, maxWidth },
51+
modalContainer: containerStyle,
52+
closeButton: closeButtonStyle,
53+
}}
54+
>
55+
<div styleName="modal-body">
56+
{isLoading ? (
57+
<div styleName={cn("modal-header", { "dark-header": darkHeader })}>
58+
<CenteredSpinner />
59+
{loadingMessage && <h5>{loadingMessage}</h5>}
60+
</div>
61+
) : (
62+
<>
63+
<div styleName={cn("modal-header", { "dark-header": darkHeader })}>
64+
<div styleName="header-icon">{headerIcon}</div>
65+
<h5>{title}</h5>
66+
{subtitle && <p>{subtitle}</p>}
67+
</div>
68+
{children}
69+
</>
70+
)}
71+
</div>
72+
<div styleName="button-group">{buttons}</div>
73+
</Modal>
74+
);
75+
}
76+
77+
BaseCreateModal.propTypes = {
78+
open: PT.bool,
79+
onClose: PT.func,
80+
hideCloseIcon: PT.bool,
81+
headerIcon: PT.node,
82+
title: PT.string,
83+
subtitle: PT.string,
84+
buttons: PT.node,
85+
isLoading: PT.bool,
86+
loadingMessage: PT.string,
87+
maxWidth: PT.string,
88+
darkHeader: PT.bool,
89+
children: PT.node,
90+
};
91+
92+
export default BaseCreateModal;
Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
@import "styles/include";
2+
3+
.button-group {
4+
display: flex;
5+
flex-direction: row;
6+
justify-content: center;
7+
align-items: flex-end;
8+
:first-child {
9+
margin-right: 8px;
10+
}
11+
}
12+
13+
.modal-body {
14+
margin: 0 80px 40px 80px;
15+
}
16+
17+
.modal-header {
18+
display: flex;
19+
flex-direction: column;
20+
justify-content: flex-start;
21+
align-items: center;
22+
text-align: center;
23+
margin-bottom: 24px;
24+
25+
.header-icon {
26+
margin-bottom: 16px;
27+
width: 42px;
28+
height: 42px;
29+
30+
img,
31+
svg {
32+
width: 100%;
33+
height: 100%;
34+
object-fit: cover;
35+
}
36+
}
37+
38+
h5 {
39+
@include font-barlow-condensed;
40+
font-size: 34px;
41+
color: #1e94a3;
42+
text-transform: uppercase;
43+
font-weight: 500;
44+
margin-bottom: 10px;
45+
}
46+
47+
p {
48+
@include font-roboto;
49+
font-size: 16px;
50+
color: #555555;
51+
line-height: 26px;
52+
}
53+
54+
&.dark-header {
55+
h5 {
56+
color: #2a2a2a;
57+
}
58+
}
59+
}
60+
61+
.cross {
62+
g {
63+
stroke: #000;
64+
}
65+
}

src/routes/CreateNewTeam/components/Completeness/styles.module.scss

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
}
1717

1818
.input-skills {
19-
background-image: linear-gradient(221.5deg, #2c95d7 0%, #9d41c9 100%);
19+
background-image: linear-gradient(221.5deg, #646CD0 0%, #9d41c9 100%);
2020
}
2121

2222
.role-selection {
@@ -34,6 +34,7 @@
3434

3535
&:before {
3636
content: "";
37+
color: #fff;
3738
border: 1px solid #ffffff;
3839
border-radius: 100%;
3940
width: 16px;
@@ -57,7 +58,7 @@
5758
content: "";
5859
font-size: 9px;
5960
line-height: 14px;
60-
padding-left: 3px;
61+
padding-left: 2px;
6162
}
6263
}
6364
}

src/routes/CreateNewTeam/components/NoMatchingProfilesResultCard/index.jsx

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,13 @@
33
* Card that appears when there are no matching profiles after searching.
44
*/
55
import React from "react";
6-
import { navigate } from "@reach/router";
6+
import { Link } from "@reach/router";
77
import "./styles.module.scss";
88
import IconEarthX from "../../../../assets/images/icon-earth-x.svg";
99
import Curve from "../../../../assets/images/curve.svg";
1010
import Button from "components/Button";
1111

12-
function NoMatchingProfilesResultCard() {
12+
function NoMatchingProfilesResultCard({ prevSearchId, addedRoles }) {
1313
return (
1414
<div styleName="result-card">
1515
<div styleName="heading">
@@ -28,13 +28,14 @@ function NoMatchingProfilesResultCard() {
2828
<p styleName="cost">$1,200</p>
2929
<p>/Week</p>
3030
</div>
31-
<Button
32-
onClick={() => navigate("/taas/myteams/createnewteam")}
33-
type="secondary"
34-
styleName="button"
31+
<Link
32+
to="/taas/myteams/createnewteam"
33+
state={{ prevSearchId, addedRoles }}
3534
>
36-
Modify Search Criteria
37-
</Button>
35+
<Button type="secondary" styleName="button">
36+
Modify Search Criteria
37+
</Button>
38+
</Link>
3839
</div>
3940
</div>
4041
);

0 commit comments

Comments
 (0)