import { selectorFamily } from 'recoil';
import breakpointWidth from '../atoms/breakpointWidth';

/**
 * Read-only selector family for determining whether a specific breakpoint has
 * loaded or not. It figures this out based on whether the width has been set
 * to a defined value.
 */
const breakpointIsLoaded = selectorFamily({
  key: 'breakpoint.selectors.breakpointIsLoaded',
  get: key => ({
    get
  }) => {
    const width = get(breakpointWidth(key));
    return typeof width !== 'undefined';
  }
});
export default breakpointIsLoaded;