import React, { useContext } from 'react';
import { usePersistState } from 'hooks/usePersistState';

const Context = React.createContext('default');

const Theme = ({ theme, children }) => {
  const [_theme, setTheme] = usePersistState({ key: 'theme', defaultValue: theme });

  return (
    <Context.Provider value={{ theme: _theme, setTheme }}>
      {children}
    </Context.Provider>
  )
};

export const withTheme = (Component) =>
  (props) => (<Component {...props} {...useContext(Context)} />);

export default Theme;