<commit_before>import {
    DetailsList,
    DetailsListLayoutMode,
    DetailsRow,
    IColumn,
    Selection,
    SelectionMode,
} from "office-ui-fabric-react/lib/DetailsList";
import { List } from "office-ui-fabric-react/lib/List";
import * as React from "react";
import { IResult, ISearchResult, ISearchResultKeyValue } from "../interfaces/spSearchInterfaces";

interface ISpSearchResultsItemProps {
    item: IResult;
    onSeeAllPropsClick: (ev?: React.FormEvent<HTMLElement | HTMLInputElement>) => void;
}
interface ISpSearchResultsItemState {
    collapsed: boolean;
}

export class SpSearchResultsItem extends React.Component<ISpSearchResultsItemProps, ISpSearchResultsItemState> {
    private _columns: IColumn[] = [
        { key: "Key", name: "Key", fieldName: "Key", maxWidth: 160, minWidth: 160 } as IColumn,
        { key: "Value", name: "Value", fieldName: "Value" } as IColumn
    ];
    constructor() {
        super();
        this.state = { collapsed: true };
        this.onToggle = this.onToggle.bind(this);
    }
    public render() {
        return (
            <div className="ms-ListBasicSpChromeDevTool-itemCell" data-is-focusable={true} key={this.props.item.key}>
                <div className="ms-ListBasicSpChromeDevTool-itemContent">
                    <div className="ms-ListBasicSpChromeDevTool-itemName">
                        <a onClick={this.onToggle} href="#"> {this.props.item.title}{this.state.collapsed
                            ? <i className="ms-Icon ms-Icon--ChevronDownSmall" aria-hidden="true" />
                            : <i className="ms-Icon ms-Icon--ChevronUpSmall" aria-hidden="true" />
                        } </a>
                    </div>
                    {this.properties(this.state.collapsed, this.props.item.props)}
                    {this.loadAll(this.state.collapsed)}
                </div>
            </div>
        );
    }

    private properties(collapsed: boolean, props: ISearchResultKeyValue[]) {
        if (!collapsed) {
            return (
                <div className="ms-ListBasicSpChromeDevTool-itemDesc"><commit_msg>Optimized code<commit_after>import {
    DetailsList,
    DetailsListLayoutMode,
    DetailsRow,
    IColumn,
    Selection,
    SelectionMode,
} from "office-ui-fabric-react/lib/DetailsList";
import { List } from "office-ui-fabric-react/lib/List";
import * as React from "react";
import { IResult, ISearchResult, ISearchResultKeyValue } from "../interfaces/spSearchInterfaces";

interface ISpSearchResultsItemProps {
    item: IResult;
    onSeeAllPropsClick: (ev?: React.FormEvent<HTMLElement | HTMLInputElement>) => void;
}
interface ISpSearchResultsItemState {
    collapsed: boolean;
}

export class SpSearchResultsItem extends React.Component<ISpSearchResultsItemProps, ISpSearchResultsItemState> {
    private _columns: IColumn[] = [
        { key: "Key", name: "Key", fieldName: "Key", maxWidth: 160, minWidth: 160 } as IColumn,
        { key: "Value", name: "Value", fieldName: "Value" } as IColumn
    ];
    constructor() {
        super();
        this.state = { collapsed: true };
        this.onToggle = this.onToggle.bind(this);
    }
    public render() {
        return (
            <div className="ms-ListBasicSpChromeDevTool-itemCell" data-is-focusable={true} key={this.props.item.key}>
                <div className="ms-ListBasicSpChromeDevTool-itemContent">
                    <div className="ms-ListBasicSpChromeDevTool-itemName">
                        <a onClick={this.onToggle} href="#"> {this.props.item.title}
                            <i
                                className={"ms-Icon ms-Icon--Chevron" + this.state.collapsed ? "DownSmall" : "UpSmall"}
                                aria-hidden="true" />
                        </a>
                    </div>
                    {this.properties(this.state.collapsed, this.props.item.props)}
                    {this.loadAll(this.state.collapsed)}
                </div>
            </div>
        );
    }

    private properties(collapsed: boolean, props: ISearchResultKeyValue[]) {
        if (!collapsed) {
            return (
                <div className="ms-ListBasicSpChromeDevTool-itemDesc">
{'fraction_non_alphanumeric': 0.12378237110952721, 'fraction_numerical': 0.002851033499643621, 'mean_word_length': 2.3465818759936408, 'pattern_counts': {'":': 0, '<': 28, '<?xml version=': 0, '>': 30, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1791650', 'n_tokens_mistral': 1225, 'n_tokens_neox': 1186, 'n_words': 225}