-
Notifications
You must be signed in to change notification settings - Fork 8
/
SelectButtons.js
41 lines (37 loc) · 1.41 KB
/
SelectButtons.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
import { useEffect, useContext } from 'react'
import CurrencyContext from '../../../context/currencyContext'
export default function SelectButtons() {
const { refreshCurrency } = useContext(CurrencyContext)
useEffect(() => {
const select = document.getElementById('rates')
select.options.namedItem(
localStorage.getItem('currency') !== null
? JSON.parse(localStorage.currency)
: '$'
).selected = 'selected'
}, [])
const changeCurrency = e => {
const selectedCurrency = e.target.value
localStorage.setItem('currency', JSON.stringify(selectedCurrency))
refreshCurrency()
}
return (
<div className="select-buttons">
<div className="currency-and-country-select-buttons currency-select-buttons">
Currency:
<select id="rates" aria-label="Currency selection" onChange={e => changeCurrency(e)}>
<option id="$" value="$">$ (USD) U.S. Dollar</option>
<option id="€" value="€">€ (EUR) Euro</option>
<option id="£" value="£">£ (GBP) British Pound</option>
</select>
</div>
<div className="currency-and-country-select-buttons country-select-buttons">
Country:
<select aria-label="Country selection">
<option value="UK">United Kingdom</option>
<option value="USA">United States</option>
</select>
</div>
</div>
)
}