<commit_before>import React, { Component, PropTypes } from "react";
import ReactDOM from "react-dom";
import Localization from "../../localization";
import GridCell from "dnn-grid-cell";
import Tags from "dnn-tags";
import Dropdown from "dnn-dropdown";
import Button from "dnn-button";
import DropdownDayPicker from "../DropdownDayPicker/DropdownDayPicker";
import {CalendarIcon} from "dnn-svg-icons";
import utils from "../../utils";

class SearchAdvancedDetails extends Component {

    constructor(props) {
        super(props); 
        this.state = {
            DropdownCalendarIsActive : false,
            tags : props.tags?props.tags.split(","):[]
        };
    }

    componentWillReceiveProps(newProps) {
        if (newProps.tags) {
            this.setState({
                tags:newProps.tags.split(",")
            });
        }
    }

    getDateLabel() {
        let filterByDateText = utils.isPlatform() ? "FilterByModifiedDateText" : "FilterByPublishDateText";
        const { startDate, endDate, startAndEndDateDirty } = this.props;
        let label = Localization.get(filterByDateText);
        if (startAndEndDateDirty) {
            const fullStartDate = utils.formatDate(startDate);
            const fullEndDate = utils.formatDate(endDate);
            label = fullStartDate !== fullEndDate ? `${fullStartDate} - ${fullEndDate}` : `${fullStartDate}`;
        }
        return label;
    }
    
    toggleDropdownCalendar() {
        this.setState({
            DropdownCalendarIsActive : !this.state.DropdownCalendarIsActive
        });
    }
    getPageStatusLabel() {
        return (
            this.props.filterByPublishStatus ? 
            this.props.getFilterByPageStatusOptions().find(
                x => x.value === this.props.filterByPublishStatus.toLowerCase()
            ).label : 
            Localization.get("FilterbyPublishStatusText"));
    }

    onClear() {
        this.setState({
            DropdownCalendarIsActive : false,
            tags:[]
        });
        this.props.clearAdvancedSearch();
    }

    onChangeTags(evnt) {
        this.setState({
            tags: evnt
        },()=>this.props.updateSearchAdvancedTags(this.state.tags.join(",")));        
    }

    onTagClick() {
        ReactDOM.findDOMNode(this).getElementsByClassName("input-container")[0].childNodes[0].focus();
    }

    render() {
        return (
            <div className="search-more-flyout">
                <GridCell columnSize={70} style={{ padding: "5px 5px 5px 10px" }}>
                    <h1>{Localization.get("lblGeneralFilters").toUpperCase()}</h1>
                </GridCell>
                <GridCell columnSize={30} style={{ paddingLeft: "10px" }}>
                    <h1>{Localization.get("lblTagFilters").toUpperCase()}</h1>
                </GridCell>
                <GridCell columnSize={70} style={{ padding: "5px" }}>
                    <GridCell columnSize={100} >
                        <GridCell columnSize={50} style={{ padding: "5px" }}>
                            <Dropdown
                                className="more-dropdown"
                                options={this.props.getFilterByPageTypeOptions()}
                                label={this.props.filterByPageType ? this.props.getFilterByPageTypeOptions().find(x => x.value === this.props.filterByPageType.toLowerCase()).label : Localization.get("FilterbyPageTypeText")}
                                value={this.props.filterByPageType !== "" && this.props.filterByPageType}
                                onSelect={(data) => { this.props.updateFilterByPageTypeOptions(data); }}
                                withBorder={true}
                            />
                        </GridCell>
                        <GridCell columnSize={50} style={{ padding: "5px 5px 5px 15px" }}>
                            <Dropdown
                                className="more-dropdown"
                                options={this.props.getFilterByPageStatusOptions()}
                                label={this.getPageStatusLabel()}
                                value={this.props.filterByPublishStatus !== "" && this.props.filterByPublishStatus}
                                onSelect={data=>this.props.updateFilterByPageStatusOptions(data)}
                                withBorder={true} />
                        </GridCell>
                    </GridCell>
                    <GridCell columnSize={100}>
                        <GridCell columnSize={50} style={{ padding: "5px" }}>
                            <DropdownDayPicker
                                onDayClick={this.props.onDayClick}
                                dropdownIsActive={this.state.DropdownCalendarIsActive}
                                applyChanges={() => {this.toggleDropdownCalendar(); this.props.onApplyChangesDropdownDayPicker();}}
                                clearChanges={() => {this.toggleDropdownCalendar();this.props.clearAdvancedSearchDateInterval();}}
                                startDate={this.props.startDate}
                                endDate={this.props.endDate}
                                toggleDropdownCalendar={this.toggleDropdownCalendar.bind(this)}
                                CalendarIcon={CalendarIcon}
                                label={this.getDateLabel()}
                            />
                        </GridCell>
                        {!utils.isPlatform() &&
                            <GridCell columnSize={50} style={{ padding: "5px 5px 5px 15px" }}>
                                <Dropdown
                                    className="more-dropdown"
                                    options={this.props.getFilterByWorkflowOptions()}
                                    label={this.props.filterByWorkflow ? this.props.getFilterByWorkflowOptions().find(x => x.value === this.props.filterByWorkflow).label : Localization.get("FilterbyWorkflowText")}
                                    value={this.props.filterByWorkflow !== "" && this.props.filterByWorkflow}
                                    onSelect={data=>this.props.updateFilterByWorkflowOptions(data)}
                                    withBorder={true} />
                            </GridCell>
                        }
                    </GridCell>
                </GridCell>
                <GridCell columnSize={30} style={{ paddingLeft: "10px", paddingTop: "10px" }}>
                    <div onClick={this.onTagClick.bind(this)}>
                        <Tags style={{minHeight:"82px", width:"100%" }}
                            tags={this.state.tags}
                            onUpdateTags={this.onChangeTags.bind(this)} />
                    </div>
                </GridCell>
                <GridCell columnSize={100} style={{ textAlign: "center",height:"30%" }}>
                    <Button style={{ marginRight: "5px" }} onClick={this.onClear.bind(this)}>{Localization.get("Clear")}</Button>
                    <Button type="primary" onClick={()=>this.props.onSearch()}>{Localization.get("Apply")}</Button>
                </GridCell>
            </div>);
    }
}

SearchAdvancedDetails.propTypes = {
    onSearch : PropTypes.func.isRequired,
    workflowList : PropTypes.array.isRequired,
    getWorkflowsList : PropTypes.func.isRequired,
    getFilterByPageTypeOptions : PropTypes.func.isRequired,
    getFilterByPageStatusOptions : PropTypes.func.isRequired,
    getFilterByWorkflowOptions : PropTypes.func.isRequired,
    updateFilterByPageTypeOptions : PropTypes.func.isRequired,
    updateFilterByPageStatusOptions : PropTypes.func.isRequired,
    updateFilterByWorkflowOptions : PropTypes.func.isRequired,
    onApplyChangesDropdownDayPicker : PropTypes.func.isRequired,
    filterByPublishStatus: PropTypes.string.isRequired,
    filterByPageType : PropTypes.string.isRequired,
    onDayClick : PropTypes.func.isRequired,
    startDate : PropTypes.instanceOf(Date).isRequired,
    endDate : PropTypes.instanceOf(Date).isRequired,
    startAndEndDateDirty : PropTypes.bool.isRequired,
    tags : PropTypes.string.isRequired,
    filterByWorkflow : PropTypes.string.isRequired,
    collapsed : PropTypes.bool.isRequired, 
    clearAdvancedSearch : PropTypes.func.isRequired,
    clearAdvancedSearchDateInterval : PropTypes.func.isRequired,
    updateSearchAdvancedTags : PropTypes.func.isRequired
};


export default SearchAdvancedDetails;<commit_msg>DNN-10714 - Fix one line multiple commands<commit_after>import React, { Component, PropTypes } from "react";
import ReactDOM from "react-dom";
import Localization from "../../localization";
import GridCell from "dnn-grid-cell";
import Tags from "dnn-tags";
import Dropdown from "dnn-dropdown";
import Button from "dnn-button";
import DropdownDayPicker from "../DropdownDayPicker/DropdownDayPicker";
import {CalendarIcon} from "dnn-svg-icons";
import utils from "../../utils";

class SearchAdvancedDetails extends Component {

    constructor(props) {
        super(props); 
        this.state = {
            DropdownCalendarIsActive : false,
            tags : props.tags?props.tags.split(","):[]
        };
    }

    componentWillReceiveProps(newProps) {
        if (newProps.tags) {
            this.setState({
                tags:newProps.tags.split(",")
            });
        }
    }

    getDateLabel() {
        let filterByDateText = utils.isPlatform() ? "FilterByModifiedDateText" : "FilterByPublishDateText";
        const { startDate, endDate, startAndEndDateDirty } = this.props;
        let label = Localization.get(filterByDateText);
        if (startAndEndDateDirty) {
            const fullStartDate = utils.formatDate(startDate);
            const fullEndDate = utils.formatDate(endDate);
            label = fullStartDate !== fullEndDate ? `${fullStartDate} - ${fullEndDate}` : `${fullStartDate}`;
        }
        return label;
    }
    
    toggleDropdownCalendar() {
        this.setState({
            DropdownCalendarIsActive : !this.state.DropdownCalendarIsActive
        });
    }
    getPageStatusLabel() {
        return (
            this.props.filterByPublishStatus ? 
            this.props.getFilterByPageStatusOptions().find(
                x => x.value === this.props.filterByPublishStatus.toLowerCase()
            ).label : 
            Localization.get("FilterbyPublishStatusText"));
    }

    onClear() {
        this.setState({
            DropdownCalendarIsActive : false,
            tags:[]
        });
        this.props.clearAdvancedSearch();
    }

    onChangeTags(evnt) {
        this.setState({
            tags: evnt
        },()=>this.props.updateSearchAdvancedTags(this.state.tags.join(",")));        
    }

    onTagClick() {
        ReactDOM.findDOMNode(this).getElementsByClassName("input-container")[0].childNodes[0].focus();
    }

    applyDateFilter() {
        this.toggleDropdownCalendar(); 
        this.props.onApplyChangesDropdownDayPicker();
    }

    clearDateFilter() {
        this.toggleDropdownCalendar();
        this.props.clearAdvancedSearchDateInterval();
    }

    render() {
        return (
            <div className="search-more-flyout">
                <GridCell columnSize={70} style={{ padding: "5px 5px 5px 10px" }}>
                    <h1>{Localization.get("lblGeneralFilters").toUpperCase()}</h1>
                </GridCell>
                <GridCell columnSize={30} style={{ paddingLeft: "10px" }}>
                    <h1>{Localization.get("lblTagFilters").toUpperCase()}</h1>
                </GridCell>
                <GridCell columnSize={70} style={{ padding: "5px" }}>
                    <GridCell columnSize={100} >
                        <GridCell columnSize={50} style={{ padding: "5px" }}>
                            <Dropdown
                                className="more-dropdown"
                                options={this.props.getFilterByPageTypeOptions()}
                                label={this.props.filterByPageType ? this.props.getFilterByPageTypeOptions().find(x => x.value === this.props.filterByPageType.toLowerCase()).label : Localization.get("FilterbyPageTypeText")}
                                value={this.props.filterByPageType !== "" && this.props.filterByPageType}
                                onSelect={(data) => { this.props.updateFilterByPageTypeOptions(data); }}
                                withBorder={true}
                            />
                        </GridCell>
                        <GridCell columnSize={50} style={{ padding: "5px 5px 5px 15px" }}>
                            <Dropdown
                                className="more-dropdown"
                                options={this.props.getFilterByPageStatusOptions()}
                                label={this.getPageStatusLabel()}
                                value={this.props.filterByPublishStatus !== "" && this.props.filterByPublishStatus}
                                onSelect={data=>this.props.updateFilterByPageStatusOptions(data)}
                                withBorder={true} />
                        </GridCell>
                    </GridCell>
                    <GridCell columnSize={100}>
                        <GridCell columnSize={50} style={{ padding: "5px" }}>
                            <DropdownDayPicker
                                onDayClick={this.props.onDayClick}
                                dropdownIsActive={this.state.DropdownCalendarIsActive}
                                applyChanges={this.applyDateFilter.bind(this)}
                                clearChanges={this.clearDateFilter.bind(this)}
                                startDate={this.props.startDate}
                                endDate={this.props.endDate}
                                toggleDropdownCalendar={this.toggleDropdownCalendar.bind(this)}
                                CalendarIcon={CalendarIcon}
                                label={this.getDateLabel()}
                            />
                        </GridCell>
                        {!utils.isPlatform() &&
                            <GridCell columnSize={50} style={{ padding: "5px 5px 5px 15px" }}>
                                <Dropdown
                                    className="more-dropdown"
                                    options={this.props.getFilterByWorkflowOptions()}
                                    label={this.props.filterByWorkflow ? this.props.getFilterByWorkflowOptions().find(x => x.value === this.props.filterByWorkflow).label : Localization.get("FilterbyWorkflowText")}
                                    value={this.props.filterByWorkflow !== "" && this.props.filterByWorkflow}
                                    onSelect={data=>this.props.updateFilterByWorkflowOptions(data)}
                                    withBorder={true} />
                            </GridCell>
                        }
                    </GridCell>
                </GridCell>
                <GridCell columnSize={30} style={{ paddingLeft: "10px", paddingTop: "10px" }}>
                    <div onClick={this.onTagClick.bind(this)}>
                        <Tags style={{minHeight:"82px", width:"100%" }}
                            tags={this.state.tags}
                            onUpdateTags={this.onChangeTags.bind(this)} />
                    </div>
                </GridCell>
                <GridCell columnSize={100} style={{ textAlign: "center",height:"30%" }}>
                    <Button style={{ marginRight: "5px" }} onClick={this.onClear.bind(this)}>{Localization.get("Clear")}</Button>
                    <Button type="primary" onClick={()=>this.props.onSearch()}>{Localization.get("Apply")}</Button>
                </GridCell>
            </div>);
    }
}

SearchAdvancedDetails.propTypes = {
    onSearch : PropTypes.func.isRequired,
    workflowList : PropTypes.array.isRequired,
    getWorkflowsList : PropTypes.func.isRequired,
    getFilterByPageTypeOptions : PropTypes.func.isRequired,
    getFilterByPageStatusOptions : PropTypes.func.isRequired,
    getFilterByWorkflowOptions : PropTypes.func.isRequired,
    updateFilterByPageTypeOptions : PropTypes.func.isRequired,
    updateFilterByPageStatusOptions : PropTypes.func.isRequired,
    updateFilterByWorkflowOptions : PropTypes.func.isRequired,
    onApplyChangesDropdownDayPicker : PropTypes.func.isRequired,
    filterByPublishStatus: PropTypes.string.isRequired,
    filterByPageType : PropTypes.string.isRequired,
    onDayClick : PropTypes.func.isRequired,
    startDate : PropTypes.instanceOf(Date).isRequired,
    endDate : PropTypes.instanceOf(Date).isRequired,
    startAndEndDateDirty : PropTypes.bool.isRequired,
    tags : PropTypes.string.isRequired,
    filterByWorkflow : PropTypes.string.isRequired,
    collapsed : PropTypes.bool.isRequired, 
    clearAdvancedSearch : PropTypes.func.isRequired,
    clearAdvancedSearchDateInterval : PropTypes.func.isRequired,
    updateSearchAdvancedTags : PropTypes.func.isRequired
};


export default SearchAdvancedDetails;
{'fraction_non_alphanumeric': 0.11473776736009376, 'fraction_numerical': 0.007676530911221799, 'mean_word_length': 1.8297131487315537, 'pattern_counts': {'":': 0, '<': 81, '<?xml version=': 0, '>': 99, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 12, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6653204', 'n_tokens_mistral': 4419, 'n_tokens_neox': 4313, 'n_words': 613}