ScreenSizeMixin.js

'use strict';

var ScreenSizeStore = require('../stores/ScreenSizeStore');

var ScreenSizeMixin = {
  getInitialState() {
    return this.getScreenSizeState();
  },

  getScreenSize() {
    return ScreenSizeStore.getScreenSize();
  },

  getScreenSizeState() {
    return {
      isMobile: ScreenSizeStore.isMobile(),
      isTablet: ScreenSizeStore.isTablet(),
      isDesktop: ScreenSizeStore.isDesktop(),
      screenSize: ScreenSizeStore.getScreenSize()
    };
  },

  componentDidMount() {
    ScreenSizeStore.addChangeListener(this.handleScreenSizeChange);
  },

  componentWillUnmount() {
    ScreenSizeStore.removeChangeListener(this.handleScreenSizeChange);
  },

  handleScreenSizeChange() {
    this.setState(this.getScreenSizeState());
  }
};

module.exports = ScreenSizeMixin;