Skip to content

Commit 733ab4a

Browse files
committed
PROD-2641 #comment Show complete selected package details in Complete & Pay and Work Details page
1 parent 8b929d6 commit 733ab4a

File tree

3 files changed

+157
-196
lines changed

3 files changed

+157
-196
lines changed

src-ts/tools/work/work-detail-details/work-detail-details-pane/WorkDetailDetailsPane.tsx

Lines changed: 19 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,9 @@ import { Dispatch, FC, SetStateAction, useEffect, useState } from 'react'
44
import { Link } from 'react-router-dom'
55

66
import { ArrowIcon, LoadingSpinner } from '../../../../lib'
7-
import { workFactoryMapFormData } from '../../work-lib'
7+
import { ChallengeMetadataName, workFactoryMapFormData } from '../../work-lib'
8+
import BugHuntPricingConfig from '../../work-self-service/intake-forms/bug-hunt/bug-hunt.form.pricing-config'
9+
import { currencyFormat } from '../../../../../src/utils'
810

911
import styles from './WorkDetailDetailsPane.module.scss'
1012

@@ -66,7 +68,11 @@ const WorkDetailDetailsPane: FC<WorkDetailDetailsPaneProps> = ({ collapsible, de
6668
return (
6769
<div key={detail.key} className={styles['detail']}>
6870
<h4 className={styles['title']}>{detail.title}</h4>
69-
<p className={styles['content']}>{formatOption(detail.value)}</p>
71+
{detail.key === ChallengeMetadataName.packageType ? (
72+
<p className={styles['content']}>{getSelectedPackageFormatted(detail.value)}</p>
73+
) : (
74+
<p className={styles['content']}>{formatOption(detail.value)}</p>
75+
)}
7076
</div>
7177
)
7278
})}
@@ -102,4 +108,15 @@ function checkIsEmpty(detail: Array<string> | {} | string): boolean {
102108
.filter((val) => val?.trim().length > 0).length === 0)
103109
}
104110

111+
const getSelectedPackageFormatted = (packageId: string) => {
112+
const currentPackage = BugHuntPricingConfig.find((pricingConfig) => pricingConfig.id === packageId)
113+
if (currentPackage) {
114+
const deviceType = currentPackage.sections?.[0]?.rows?.[3]?.text || ''
115+
const noOfTesters = `${currentPackage.sections?.[0]?.rows?.[2]?.text || 0} testers`
116+
return `${currentPackage.title} - ${currencyFormat(currentPackage.price)} - ${deviceType} - ${noOfTesters}`
117+
}
118+
119+
return packageId
120+
}
121+
105122
export default WorkDetailDetailsPane

src-ts/tools/work/work-self-service/intake-forms/bug-hunt/bug-hunt.form.config.tsx

Lines changed: 2 additions & 194 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import {
88
} from '../../../../../lib'
99
import { ChallengeMetadataName, ChallengeMetadataTitle } from '../../../work-lib'
1010
import { SupportInfoCard } from '../support-info-card'
11+
import BugHuntPricingConfig from './bug-hunt.form.pricing-config'
1112

1213
export const BugHuntFormConfig: FormDefinition = {
1314
buttons: {
@@ -160,200 +161,7 @@ export const BugHuntFormConfig: FormDefinition = {
160161
{
161162
inputs: [
162163
{
163-
cards: [
164-
{
165-
id: 'standard',
166-
price: 1499,
167-
sections: [
168-
{
169-
rows: [
170-
{
171-
icon: 'clock',
172-
label: 'Hunt Duration',
173-
text: 'Up to 24h',
174-
},
175-
{
176-
icon: 'exclamation',
177-
label: 'Number of Bugs',
178-
text: 'Up to 50',
179-
},
180-
{
181-
icon: 'user-group',
182-
label: 'Potential Testers',
183-
text: 'Up to 10',
184-
},
185-
],
186-
},
187-
{
188-
rows: [
189-
{
190-
label: 'Form Factor',
191-
},
192-
{
193-
icon: 'desktop-computer',
194-
label: 'Desktop Testing',
195-
text: 'Yes',
196-
},
197-
{
198-
icon: 'device-mobile',
199-
label: 'Mobile Testing',
200-
text: '-',
201-
},
202-
{
203-
icon: 'device-tablet',
204-
label: 'Tablet Testing',
205-
text: '-',
206-
},
207-
],
208-
},
209-
{
210-
rows: [
211-
{
212-
icon: 'check',
213-
text: 'Latest Browser Testing',
214-
},
215-
{
216-
icon: 'check',
217-
text: 'Detailed Bug Reporting',
218-
},
219-
{
220-
icon: 'check',
221-
text: 'Expert Verification',
222-
},
223-
],
224-
},
225-
],
226-
title: 'Standard',
227-
},
228-
{
229-
id: 'advanced',
230-
price: 1899,
231-
sections: [
232-
{
233-
rows: [
234-
{
235-
icon: 'clock',
236-
label: 'Hunt Duration',
237-
text: 'Up to 48h',
238-
},
239-
{
240-
icon: 'exclamation',
241-
label: 'Number of Bugs',
242-
text: 'Up to 100',
243-
},
244-
{
245-
icon: 'user-group',
246-
label: 'Potential Testers',
247-
text: 'Up to 25',
248-
},
249-
],
250-
},
251-
{
252-
rows: [
253-
{
254-
label: 'Form Factor',
255-
},
256-
{
257-
icon: 'desktop-computer',
258-
label: 'Desktop Testing',
259-
text: 'Yes',
260-
},
261-
{
262-
icon: 'device-mobile',
263-
label: 'Mobile Testing',
264-
text: 'Yes',
265-
},
266-
{
267-
icon: 'device-tablet',
268-
label: 'Tablet Testing',
269-
text: '-',
270-
},
271-
],
272-
},
273-
{
274-
rows: [
275-
{
276-
icon: 'check',
277-
text: 'Latest Browser Testing',
278-
},
279-
{
280-
icon: 'check',
281-
text: 'Detailed Bug Reporting',
282-
},
283-
{
284-
icon: 'check',
285-
text: 'Expert Verification',
286-
},
287-
],
288-
},
289-
],
290-
title: 'Advanced',
291-
},
292-
{
293-
id: 'premium',
294-
price: 2299,
295-
sections: [
296-
{
297-
rows: [
298-
{
299-
icon: 'clock',
300-
label: 'Hunt Duration',
301-
text: 'Up to 72h',
302-
},
303-
{
304-
icon: 'exclamation',
305-
label: 'Number of Bugs',
306-
text: 'Up to 200',
307-
},
308-
{
309-
icon: 'user-group',
310-
label: 'Potential Testers',
311-
text: 'Up to 50',
312-
},
313-
],
314-
},
315-
{
316-
rows: [
317-
{
318-
label: 'Form Factor',
319-
},
320-
{
321-
icon: 'desktop-computer',
322-
label: 'Desktop Testing',
323-
text: 'Yes',
324-
},
325-
{
326-
icon: 'device-mobile',
327-
label: 'Mobile Testing',
328-
text: 'Yes',
329-
},
330-
{
331-
icon: 'device-tablet',
332-
label: 'Tablet Testing',
333-
text: 'Yes',
334-
},
335-
],
336-
},
337-
{
338-
rows: [
339-
{
340-
icon: 'check',
341-
text: 'Latest Browser Testing',
342-
},
343-
{
344-
icon: 'check',
345-
text: 'Detailed Bug Reporting',
346-
},
347-
{
348-
icon: 'check',
349-
text: 'Expert Verification',
350-
},
351-
],
352-
},
353-
],
354-
title: 'Premium',
355-
},
356-
],
164+
cards: BugHuntPricingConfig,
357165
name: ChallengeMetadataName.packageType,
358166
notTabbable: false,
359167
type: 'card-set',
Lines changed: 136 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,136 @@
1+
const BugHuntPricingConfig = [
2+
{
3+
id: 'standard',
4+
price: 1499,
5+
sections: [
6+
{
7+
rows: [
8+
{
9+
icon: 'clock',
10+
label: 'Hunt Duration',
11+
text: 'Up to 24h',
12+
},
13+
{
14+
icon: 'exclamation',
15+
label: 'Number of Bugs',
16+
text: 'Up to 50',
17+
},
18+
{
19+
icon: 'user-group',
20+
label: 'Number of Testers',
21+
text: 'Up to 10',
22+
},
23+
{
24+
icon: 'user-group',
25+
label: 'Device Types',
26+
text: 'Desktop',
27+
infoIcon: true
28+
},
29+
{
30+
label: 'Latest browser testing',
31+
infoIcon: true,
32+
valueIcon: 'check',
33+
},
34+
{
35+
label: 'Detailed bug reporting',
36+
valueIcon: 'check',
37+
},
38+
{
39+
label: 'Expert verification',
40+
valueIcon: 'check',
41+
},
42+
],
43+
}
44+
],
45+
title: 'Standard',
46+
},
47+
{
48+
id: 'advanced',
49+
price: 1899,
50+
sections: [
51+
{
52+
rows: [
53+
{
54+
icon: 'clock',
55+
label: 'Hunt Duration',
56+
text: 'Up to 48h',
57+
},
58+
{
59+
icon: 'exclamation',
60+
label: 'Number of Bugs',
61+
text: 'Up to 100',
62+
},
63+
{
64+
icon: 'user-group',
65+
label: 'Number of Testers',
66+
text: 'Up to 25',
67+
},
68+
{
69+
icon: 'user-group',
70+
label: 'Device Types',
71+
text: 'Desktop & Mobile',
72+
},
73+
{
74+
label: 'Latest browser testing',
75+
valueIcon: 'check'
76+
},
77+
{
78+
label: 'Detailed bug reporting',
79+
valueIcon: 'check'
80+
},
81+
{
82+
label: 'Expert verification',
83+
valueIcon: 'check'
84+
},
85+
],
86+
}
87+
],
88+
title: 'Advanced',
89+
mostPopular: true
90+
},
91+
{
92+
id: 'premium',
93+
price: 2299,
94+
sections: [
95+
{
96+
rows: [
97+
{
98+
icon: 'clock',
99+
label: 'Hunt Duration',
100+
text: 'Up to 72h',
101+
},
102+
{
103+
icon: 'exclamation',
104+
label: 'Number of Bugs',
105+
text: 'Up to 200',
106+
},
107+
{
108+
icon: 'user-group',
109+
label: 'Number of Testers',
110+
text: 'Up to 50',
111+
},
112+
{
113+
icon: 'user-group',
114+
label: 'Device Types',
115+
text: 'Desktop, Tablet & Mobile',
116+
},
117+
{
118+
label: 'Latest browser testing',
119+
valueIcon: 'check'
120+
},
121+
{
122+
label: 'Detailed bug reporting',
123+
valueIcon: 'check'
124+
},
125+
{
126+
label: 'Expert verification',
127+
valueIcon: 'check'
128+
},
129+
],
130+
}
131+
],
132+
title: 'Premium',
133+
},
134+
]
135+
136+
export default BugHuntPricingConfig

0 commit comments

Comments
 (0)