chore: refactor settings context

This commit is contained in:
AP 2020-01-30 07:01:13 +01:00
parent 222cd75c7b
commit 6e56cf1665
4 changed files with 17 additions and 59 deletions

View file

@ -9,9 +9,17 @@ export const Price = ({
amount: number;
breakNumber?: boolean;
}) => {
const { price, symbol, currency } = useSettings();
const { currency, prices } = useSettings();
const priceProps = { price, symbol, currency };
const current: { last: number; symbol: string } = prices[currency] ?? {
last: 0,
symbol: '',
};
const priceProps = {
price: current.last,
symbol: current.symbol,
currency,
};
const getFormat = (amount: number) =>
getValue({ amount, ...priceProps, breakNumber });

View file

@ -5,36 +5,28 @@ interface PriceProps {
last: number;
symbol: string;
}
interface CurrencyChangeProps {
currency: string;
}
interface ChangeProps {
prices?: { [key: string]: PriceProps };
theme?: string;
sidebar?: boolean;
currency?: string;
}
interface SettingsProps {
prices: { [key: string]: PriceProps };
price: number;
symbol: string;
currency: string;
theme: string;
sidebar: boolean;
setSettings: (newProps: ChangeProps) => void;
updateCurrency: (newProps: CurrencyChangeProps) => void;
}
export const SettingsContext = createContext<SettingsProps>({
prices: {},
price: 0,
symbol: '',
currency: '',
theme: '',
sidebar: true,
setSettings: () => {},
updateCurrency: () => {},
});
const SettingsProvider = ({ children }: any) => {
@ -43,59 +35,18 @@ const SettingsProvider = ({ children }: any) => {
localStorage.getItem('sidebar') === 'false' ? false : true;
const savedCurrency = localStorage.getItem('currency') || 'sat';
const setSettings = ({ prices, theme, sidebar }: ChangeProps) => {
let price = 0;
let symbol = '';
const lookupCurrency =
savedCurrency === 'sat' || savedCurrency === 'btc'
? 'EUR'
: savedCurrency;
if (prices && prices[lookupCurrency]) {
price = prices[lookupCurrency].last;
symbol = prices[lookupCurrency].symbol;
}
const setSettings = ({ prices, currency, theme, sidebar }: ChangeProps) => {
updateSettings((prevState: any) => {
const newState = { ...prevState };
return merge(newState, {
prices,
...(prices && { price, symbol }),
currency,
theme,
sidebar,
});
});
};
const updateCurrency = ({ currency }: CurrencyChangeProps) => {
const prices: { [key: string]: PriceProps } = settings?.prices;
let price = 0;
let symbol = '';
let isFiat = false;
if (
prices &&
currency !== 'sat' &&
currency !== 'btc' &&
prices[currency]
) {
price = prices[currency].last;
symbol = prices[currency].symbol;
isFiat = true;
}
console.log(price, symbol, isFiat);
updateSettings((prevState: any) => {
const newState = { ...prevState };
return merge(newState, {
...(isFiat && { price, symbol }),
currency,
});
});
};
const settingsState = {
prices: { EUR: { last: 0, symbol: '€' } },
price: 0,
@ -104,7 +55,6 @@ const SettingsProvider = ({ children }: any) => {
theme: savedTheme,
sidebar: savedSidebar,
setSettings,
updateCurrency,
};
const [settings, updateSettings] = useState(settingsState);

View file

@ -86,7 +86,7 @@ export const SideSettings = ({
isBurger,
setIsOpen,
}: SideSettingsProps) => {
const { theme, currency, updateCurrency, setSettings } = useSettings();
const { theme, currency, setSettings } = useSettings();
const renderIcon = (
type: string,
@ -103,7 +103,7 @@ export const SideSettings = ({
onClick={() => {
localStorage.setItem(type, value);
type === 'currency' &&
updateCurrency({
setSettings({
currency:
isOpen || isBurger
? value

View file

@ -14,7 +14,7 @@ import {
} from 'components/buttons/multiButton/MultiButton';
export const InterfaceSettings = () => {
const { setSettings, updateCurrency } = useSettings();
const { setSettings } = useSettings();
const cTheme = localStorage.getItem('theme') || 'light';
const cCurrency = localStorage.getItem('currency') || 'sat';
@ -29,7 +29,7 @@ export const InterfaceSettings = () => {
onClick={() => {
localStorage.setItem(type, value);
type === 'theme' && setSettings({ theme: value });
type === 'currency' && updateCurrency({ currency: value });
type === 'currency' && setSettings({ currency: value });
}}
>
{title}