engineersamuel

interface IActionProductName { productName: string; }
interface IActionProductVersion { productVersion string; }
 
const requestUpdateProductVersion = createAction<interfaces.IActionProductName & interfaces.IActionProductVersion, void>(types.REQUEST_UPDATE_PRODUCT_VERSION,
    (productName: string, productVersion: string) => ({productName, productVersion}),
    null
);
const receiveUpdateProductVersion = createAction<interfaces.IActionProductName & interfaces.IActionProductVersion, interfaces.IMetaIsXhrError>(types.RECEIVE_UPDATE_PRODUCT_VERSION,
    (productName: string, productVersion: string) => ({productName, productVersion}),
    isXhrError

engineersamuel

    filterElements(filter, e) {
        FilterSortActions.filter(filter);
    }
    sortElements(sort, e) {
        FilterSortActions.sort(sort);
    }
    renderLoadButtons() {
        return _.map(loadData, d => <Button key={d.name} active={this.props.type == d.value} onClick={ElementActions.loadElements.bind(this, d.value)}>{d.name}</Button>, this)
    }
    renderFilterButtons() {

engineersamuel

    componentDidUpdate(prevProps) {
        // The list of keys seen in the previous render
        let currentKeys = _.map(prevProps.children, (n) => n.key);

        // The latest list of keys that have been rendered
        let newKeys = _.map(this.props.children, (n) => n.key);

        // Find which keys are new between the current set of keys and any new children passed to this component
        let addKeys = _.difference(newKeys, currentKeys);

engineersamuel

    render() {
        return <div className="isotope" ref="isotopeContainer">
            <div className="element-item-sizer"></div>
            {this.props.children}
        </div>
    }

engineersamuel

    createIsotopeContainer() {
        if (this.iso == null) {
            this.iso = new Isotope(React.findDOMNode(this.refs.isotopeContainer), this.isoOptions);
        }
    }

engineersamuel

componentDidMount() {
        this.createIsotopeContainer();

        // Only arrange if there are elements to arrange
        if (_.get(this, 'props.children.length', 0) > 0) {
            this.iso.arrange();
        }
    }

engineersamuel

    componentWillReceiveProps(nextProps) {
        if (nextProps.filter && !_.isEqual(nextProps.filter, this.props.filter)) {
            this.iso.arrange({ filter: this.filterFns[nextProps.filter] || nextProps.filter });
        }
        if (nextProps.sort != null) {
            this.iso.arrange({sortBy: nextProps.sort});
        }
    }

engineersamuel

import React                from "react";
import shallowEqual         from "react-pure-render/shallowEqual"

// Flux
import connectToStores      from 'alt/utils/connectToStores';
import FilterSortActions    from '../flux/actions/FilterSortActions';
import FilterSortStore      from '../flux/stores/FilterSortStore';

@connectToStores
export default class IsotopeResponseRenderer extends React.Component {

engineersamuel

    shouldComponentUpdate(nextProps, nextState) {
        return !shallowEqual(this.props, nextProps) || !shallowEqual(this.state, nextState);
    }

engineersamuel

    constructor(props, context) {
        super(props, context);

        // Copied from http://codepen.io/desandro/pen/nFrte
        this.filterFns = {
            // show if number is greater than 50
            numberGreaterThan50: function () {
                var number = $(this).find('.number').text();
                return parseInt( number, 10 ) > 50;
            },