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

Commit f075ce0

Browse files
UI fix
1 parent bec1856 commit f075ce0

File tree

2 files changed

+83
-84
lines changed

2 files changed

+83
-84
lines changed

src/containers/MyGigs/JobListing/JobCard/index.jsx

Lines changed: 82 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -68,103 +68,101 @@ const JobCard = ({ job }) => {
6868
: ""
6969
}`}
7070
>
71-
<div styleName="card-header job-card-header">
72-
<div styleName="ribbon">
73-
<Ribbon
74-
text={job.label}
75-
tooltip={({ children }) => (
76-
<ProgressTooltip job={job}>{children}</ProgressTooltip>
77-
)}
78-
/>
71+
<a href={`${process.env.URL.BASE}/gigs/${job.jobExternalId}`}>
72+
<div styleName="card-header job-card-header">
73+
<div styleName="ribbon">
74+
<Ribbon
75+
text={job.label}
76+
tooltip={({ children }) => (
77+
<ProgressTooltip job={job}>{children}</ProgressTooltip>
78+
)}
79+
/>
80+
</div>
7981
</div>
80-
</div>
81-
<div styleName="card-body">
82-
<div styleName="job-card-content">
83-
<div styleName="content">
84-
<h4 styleName="title">
85-
<a
86-
href={`${process.env.URL.BASE}/gigs/${job.jobExternalId}`} // eslint-disable-line no-undef
87-
>
88-
{job.title}
89-
</a>
90-
</h4>
91-
<ul styleName="job-items">
92-
<li>
93-
<div styleName="job-item">
94-
{MY_GIGS_JOB_STATUS.COMPLETED === job.status && (
95-
<>
82+
<div styleName="card-body">
83+
<div styleName="job-card-content">
84+
<div styleName="content">
85+
<h4 styleName="title">{job.title}</h4>
86+
<ul styleName="job-items">
87+
<li>
88+
<div styleName="job-item">
89+
{MY_GIGS_JOB_STATUS.COMPLETED === job.status && (
90+
<>
91+
<div styleName="caption">Duration</div>
92+
<div styleName="text">
93+
{getDateRange(job.rbStartDate, job.rbEndDate)}
94+
</div>
95+
</>
96+
)}
97+
{MY_GIGS_JOB_STATUS.COMPLETED !== job.status && (
98+
<>
99+
<div styleName="caption">Payment Range</div>
100+
<div styleName="text">{paymentInfo}</div>
101+
</>
102+
)}
103+
</div>
104+
</li>
105+
<li>
106+
<div styleName="job-item">
107+
{MY_GIGS_JOB_STATUS.COMPLETED === job.status && (
108+
<>
109+
<div styleName="caption">
110+
<span>Total Earnings</span>
111+
<span styleName="earn-tip">
112+
<EarnTooltip>
113+
<IconInfo />
114+
</EarnTooltip>
115+
</span>
116+
</div>
117+
<div styleName="text">{`${job.currency}${job.paymentTotal}`}</div>
118+
</>
119+
)}
120+
{MY_GIGS_JOB_STATUS.COMPLETED !== job.status && (
121+
<>
122+
<div styleName="caption">Location</div>
123+
<div styleName="text">{job.location}</div>
124+
</>
125+
)}
126+
</div>
127+
</li>
128+
{MY_GIGS_JOB_STATUS.COMPLETED !== job.status && (
129+
<li>
130+
<div styleName="job-item">
96131
<div styleName="caption">Duration</div>
97132
<div styleName="text">
98-
{getDateRange(job.rbStartDate, job.rbEndDate)}
133+
{job.duration && `${job.duration} Weeks`}
99134
</div>
100-
</>
101-
)}
102-
{MY_GIGS_JOB_STATUS.COMPLETED !== job.status && (
103-
<>
104-
<div styleName="caption">Payment Range</div>
105-
<div styleName="text">{paymentInfo}</div>
106-
</>
107-
)}
108-
</div>
109-
</li>
110-
<li>
111-
<div styleName="job-item">
112-
{MY_GIGS_JOB_STATUS.COMPLETED === job.status && (
113-
<>
114-
<div styleName="caption">
115-
<span>Total Earnings</span>
116-
<span styleName="earn-tip">
117-
<EarnTooltip>
118-
<IconInfo />
119-
</EarnTooltip>
120-
</span>
121-
</div>
122-
<div styleName="text">{`${job.currency}${job.paymentTotal}`}</div>
123-
</>
124-
)}
125-
{MY_GIGS_JOB_STATUS.COMPLETED !== job.status && (
126-
<>
127-
<div styleName="caption">Location</div>
128-
<div styleName="text">{job.location}</div>
129-
</>
130-
)}
131-
</div>
132-
</li>
133-
{MY_GIGS_JOB_STATUS.COMPLETED !== job.status && (
135+
</div>
136+
</li>
137+
)}
134138
<li>
135139
<div styleName="job-item">
136-
<div styleName="caption">Duration</div>
140+
<div styleName="caption">Hours</div>
137141
<div styleName="text">
138-
{job.duration && `${job.duration} Weeks`}
142+
{job.hours && `${job.hours} hours / week`}
139143
</div>
140144
</div>
141145
</li>
142-
)}
143-
<li>
144-
<div styleName="job-item">
145-
<div styleName="caption">Hours</div>
146-
<div styleName="text">
147-
{job.hours && `${job.hours} hours / week`}
148-
</div>
149-
</div>
150-
</li>
151-
<li>
152-
<div styleName="job-item">
153-
<div styleName="caption">Working Hours</div>
154-
<div styleName="text">
155-
{job.workingHours && `${job.workingHours} hours`}
146+
<li>
147+
<div styleName="job-item">
148+
<div styleName="caption">Working Hours</div>
149+
<div styleName="text">
150+
{job.workingHours && `${job.workingHours} hours`}
151+
</div>
156152
</div>
157-
</div>
158-
</li>
159-
</ul>
160-
</div>
161-
<div
162-
styleName={`right-side stand-by ${!job.phaseAction ? "none" : ""}`}
163-
>
164-
{job.phaseAction && <Button size="lg">{job.phaseAction}</Button>}
153+
</li>
154+
</ul>
155+
</div>
156+
<div
157+
styleName={`right-side stand-by ${
158+
!job.phaseAction ? "none" : ""
159+
}`}
160+
>
161+
{job.phaseAction && <Button size="lg">{job.phaseAction}</Button>}
162+
</div>
165163
</div>
166164
</div>
167-
</div>
165+
</a>
168166
<div styleName="card-footer job-card-footer" ref={footerRef}>
169167
<div styleName="note-container">
170168
{(job.remark ||

src/containers/MyGigs/JobListing/JobCard/styles.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -190,6 +190,7 @@
190190
color: $tc-gray-70;
191191
background-color: $gray1;
192192
border-color: $gray2;
193+
cursor: default;
193194
}
194195
}
195196

0 commit comments

Comments
 (0)