<commit_before>import React from "react";
import styled from "styled-components";

import { ListGroupItem, RelativeTime, Icon, Label } from "../../../base";

const methodIconProps = {
    add_isolate: {
        name: "flask",
        bsStyle: "primary"
    },
    create: {
        name: "plus-square",
        bsStyle: "primary"
    },
    create_sequence: {
        name: "dna",
        bsStyle: "primary"
    },
    edit: {
        name: "pencil-alt",
        bsStyle: "warning"
    },
    edit_isolate: {
        name: "flask",
        bsStyle: "warning"
    },
    edit_sequence: {
        name: "dna",
        bsStyle: "warning"
    },
    clone: {
        name: "clone",
        bsStyle: "primary"
    },
    import: {
        name: "file-import",
        bsStyle: "primary"
    },
    remote: {
        name: "link",
        bsStyle: "primary"
    },
    remove: {
        name: "trash",
        bsStyle: "danger"
    },
    remove_isolate: {
        name: "flask",
        bsStyle: "danger"
    },
    remove_sequence: {
        name: "dna",
        bsStyle: "danger"
    },
    set_as_default: {
        name: "star",
        bsStyle: "warning"
    },
    update: {
        name: "arrow-alt-circle-up",
        bsStyle: "warning"
    }
};

const getMethodIcon = ({ method_name }) => {
    const props = get(methodIconProps, method_name, {
        name: "exclamation-triangle",
        bsStyle: "danger"
    });

    return <Icon {...props} />;
};

const StyledChange = styled(ListGroupItem)`
    display: flex;
    flex-flow: row wrap;
    @media (max-width: 1080px) {
        align-items: flex-start;
        display: flex;
        flex-flow: row wrap;
    }
`;

const IconDescriptionNameDate = styled.section`
    display: flex;
    flex-direction: row;
    margin-left: 9px;
    justify-content: space-between;
    width: 90%;
    align-items: start;
    @media (max-width: 1080px) {
        display: flex;
        flex-flow: row wrap;
        flex-direction: column;
    }
`;

const Name = styled.div`
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    margin-right: 10px;
`;

const ChangeIcon = styled.div`
    display: flex;
    margin-right: 4px;
`;

const DateUserId = styled.div`
    @media (max-width: 1080px) {
        font-size: 12px;
    }
`;

export class Change extends React.Component {
    handleRevert = () => {<commit_msg>Fix Change component<commit_after>import { get } from "lodash-es";
import React from "react";
import styled from "styled-components";

import { Icon, Label, ListGroupItem, RelativeTime } from "../../../base";

const methodIconProps = {
    add_isolate: {
        name: "flask",
        bsStyle: "primary"
    },
    create: {
        name: "plus-square",
        bsStyle: "primary"
    },
    create_sequence: {
        name: "dna",
        bsStyle: "primary"
    },
    edit: {
        name: "pencil-alt",
        bsStyle: "warning"
    },
    edit_isolate: {
        name: "flask",
        bsStyle: "warning"
    },
    edit_sequence: {
        name: "dna",
        bsStyle: "warning"
    },
    clone: {
        name: "clone",
        bsStyle: "primary"
    },
    import: {
        name: "file-import",
        bsStyle: "primary"
    },
    remote: {
        name: "link",
        bsStyle: "primary"
    },
    remove: {
        name: "trash",
        bsStyle: "danger"
    },
    remove_isolate: {
        name: "flask",
        bsStyle: "danger"
    },
    remove_sequence: {
        name: "dna",
        bsStyle: "danger"
    },
    set_as_default: {
        name: "star",
        bsStyle: "warning"
    },
    update: {
        name: "arrow-alt-circle-up",
        bsStyle: "warning"
    }
};

const getMethodIcon = ({ method_name }) => {
    const props = get(methodIconProps, method_name, {
        name: "exclamation-triangle",
        bsStyle: "danger"
    });

    return <Icon {...props} />;
};

const StyledChange = styled(ListGroupItem)`
    display: flex;
    flex-flow: row wrap;
    @media (max-width: 1080px) {
        align-items: flex-start;
        display: flex;
        flex-flow: row wrap;
    }
`;

const IconDescriptionNameDate = styled.div`
    align-items: start;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-left: 9px;
    width: 90%;

    @media (max-width: 1080px) {
        flex-flow: row wrap;
        flex-direction: column;
    }
`;

const Name = styled.div`
    align-items: center;
    display: flex;
    flex-flow: row wrap;
    margin-right: 10px;
`;

const ChangeIcon = styled.div`
    display: flex;
    margin-right: 4px;
`;

const DateUserId = styled.div`
    @media (max-width: 1080px) {
        font-size: 12px;
    }
`;

export class Change extends React.Component {
    handleRevert = () => {
{'fraction_non_alphanumeric': 0.14327731092436974, 'fraction_numerical': 0.008403361344537815, 'mean_word_length': 1.977485928705441, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 9, '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': '362159', 'n_tokens_mistral': 1665, 'n_tokens_neox': 1580, 'n_words': 358}