@rileybathurst/paddle 0.0.84 → 0.0.85
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/src/PaddleSpecs.tsx +52 -57
package/package.json
CHANGED
package/src/PaddleSpecs.tsx
CHANGED
|
@@ -7,69 +7,64 @@ interface SpecsTypes {
|
|
|
7
7
|
};
|
|
8
8
|
}
|
|
9
9
|
// * moving the section tag to the parent component means you can loop yourself
|
|
10
|
-
const PaddleSpecs = (specs: SpecsTypes) =>
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
Object.entries(specs).map(([key, value]) => {
|
|
10
|
+
export const PaddleSpecs = (specs: SpecsTypes) =>
|
|
11
|
+
// <section className='specs'>
|
|
12
|
+
Object.entries(specs).map(([key, value]) => {
|
|
14
13
|
|
|
15
|
-
|
|
14
|
+
// console.log(key, value);
|
|
16
15
|
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
16
|
+
if (!value) {
|
|
17
|
+
return null;
|
|
18
|
+
}
|
|
20
19
|
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
if (key === 'cost' && typeof value === 'object' && value.discount) {
|
|
20
|
+
/* I didnt know you could call yourself like this */
|
|
21
|
+
/* I guess its not a infinite loop as its not calling an object */
|
|
22
|
+
if (key === 'weight' && typeof value === 'object') {
|
|
23
|
+
return (
|
|
24
|
+
<PaddleSpecs {...value} />
|
|
25
|
+
);
|
|
26
|
+
}
|
|
30
27
|
|
|
31
|
-
|
|
28
|
+
if (key === 'cost' && typeof value === 'object' && value.discount) {
|
|
32
29
|
|
|
33
|
-
|
|
34
|
-
<>
|
|
35
|
-
{/* // TODO: add color */}
|
|
36
|
-
<div className="spec">
|
|
37
|
-
<h2><del>Original Price</del></h2>
|
|
38
|
-
<h3>
|
|
39
|
-
<del>
|
|
40
|
-
${value.price}
|
|
41
|
-
</del>
|
|
42
|
-
</h3>
|
|
43
|
-
</div>
|
|
44
|
-
<div className="spec mullen">
|
|
45
|
-
<h2>Sale Price</h2>
|
|
46
|
-
{value.discount}% off
|
|
47
|
-
<h3>${amount}</h3>
|
|
48
|
-
</div>
|
|
49
|
-
</>
|
|
50
|
-
);
|
|
51
|
-
}
|
|
30
|
+
const amount = Number(value.price) - (Number(value.discount) * (Number(value.price) / 100)) as number;
|
|
52
31
|
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
32
|
+
return (
|
|
33
|
+
<>
|
|
34
|
+
{/* // TODO: add color */}
|
|
35
|
+
<div className="spec">
|
|
36
|
+
<h2><del>Original Price</del></h2>
|
|
37
|
+
<h3>
|
|
38
|
+
<del>
|
|
39
|
+
${value.price}
|
|
40
|
+
</del>
|
|
41
|
+
</h3>
|
|
42
|
+
</div>
|
|
43
|
+
<div className="spec mullen">
|
|
44
|
+
<h2>Sale Price</h2>
|
|
45
|
+
{value.discount}% off
|
|
46
|
+
<h3>${amount}</h3>
|
|
47
|
+
</div>
|
|
48
|
+
</>
|
|
49
|
+
);
|
|
50
|
+
}
|
|
58
51
|
|
|
52
|
+
if (typeof value === 'object') {
|
|
59
53
|
return (
|
|
60
|
-
<
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
{key === 'price' ? <span className="spec__unit">$</span> : null}
|
|
64
|
-
{key === 'length' && typeof value === 'number' ? <PaddleRemainder inches={value} /> : value}
|
|
65
|
-
{key === 'hullweight' || key === 'riggedweight' ? <span className="spec__unit">lbs</span> : null}
|
|
66
|
-
{key === 'width' || key === 'length' || key === 'capacity' ? <span className="spec__unit">"</span> : null}
|
|
67
|
-
</h3>
|
|
68
|
-
</div>
|
|
69
|
-
)
|
|
70
|
-
})
|
|
71
|
-
// </section>
|
|
72
|
-
)
|
|
73
|
-
}
|
|
54
|
+
<PaddleSpecs {...value} />
|
|
55
|
+
);
|
|
56
|
+
}
|
|
74
57
|
|
|
75
|
-
|
|
58
|
+
return (
|
|
59
|
+
<div key={key} className="spec">
|
|
60
|
+
<h2>{key}</h2>
|
|
61
|
+
<h3>
|
|
62
|
+
{key === 'price' ? <span className="spec__unit">$</span> : null}
|
|
63
|
+
{key === 'length' && typeof value === 'number' ? <PaddleRemainder inches={value} /> : value}
|
|
64
|
+
{key === 'hullweight' || key === 'riggedweight' ? <span className="spec__unit">lbs</span> : null}
|
|
65
|
+
{key === 'width' || key === 'length' || key === 'capacity' ? <span className="spec__unit">"</span> : null}
|
|
66
|
+
</h3>
|
|
67
|
+
</div>
|
|
68
|
+
)
|
|
69
|
+
})
|
|
70
|
+
// </section>
|