import React from "react";
import SearchBox from "./SearchBox";
import TagsMenu from "../../../../shared/TagsMenu";
import SortBy from "./SortBy";
import TagsList from "./TagsList";
import { getStore } from "../stores/LauncherStore";
import storeActions from "../stores/StoreActions";
let store;
export default class FilterSort extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            tags: [],
            search: "",
        };
        this.setStateValues = this.setStateValues.bind(this);
        store = getStore();
    }
    setStateValues() {
        this.setState({
            tags: storeActions.getAllAppsTags(),
        });
    }
    /**
     * Add tag to list in local store
     * so that other components get notified
     **/
    onTagClick(tag) {
        let tags = storeActions.getTags();
        if (tags.includes(tag)) {
            storeActions.deleteTag(tag);
        }
        else {
            storeActions.addTag(tag);
        }
    }
    componentDidMount() {
        this.setStateValues();
        store === null || store === void 0 ? void 0 : store.addListener({ field: "appFolders.folders" }, this.setStateValues);
    }
    componentWillUnmount() {
        store === null || store === void 0 ? void 0 : store.removeListener({ field: "appFolders.folders" }, this.setStateValues);
    }
    render() {
        let activeTags = storeActions.getTags();
        return (React.createElement("div", { className: "filter-sort" },
            React.createElement(SearchBox, null),
            React.createElement(TagsList, null),
            React.createElement(SortBy, null),
            React.createElement(TagsMenu, { label: "Tags", align: "right", list: this.state.tags, active: activeTags, onItemClick: this.onTagClick })));
    }
}
//# sourceMappingURL=FilterSort.js.map