import { connect } from "react-redux";

import {
    setDrawerButton, setLevelLookedAt,
    setLevelCurrentVocab, setLevelVocab, setLevelLoading
} from "../actions";

import { IVocab } from "../models/vocab";

import LevelPage from "../pages/level";

const mapStateToProps = state => {
    const { currentVocab, lookedAt, vocab, loading } = state.level;

    return {
        currentVocab,
        lookedAt,
        vocab,
        loading,
    };
};

const mapDispatchToProps = dispatch => {
    return {
        drawerButtonState: (state: boolean) => dispatch(setDrawerButton(state)),
        setLookedAt: (ids: number[]) => dispatch(setLevelLookedAt(ids)),
        setCurrentVocab: (vocab: IVocab) => dispatch(setLevelCurrentVocab(vocab)),
        setVocab: (vocab: IVocab[]) => dispatch(setLevelVocab(vocab)),
        setLoading: (state: boolean) => dispatch(setLevelLoading(state)),
    };
};

const LevelPageContainer = connect(mapStateToProps,
    mapDispatchToProps)(LevelPage);
export default LevelPageContainer;
