<commit_before>import React from "react";
import PropTypes from "prop-types";
import { connect } from "react-redux";
import { actionCreators } from "../actions/actions.js";
import * as useCaseUtils from "../usecase-utils.js";
import { getUseCaseGroupFromRoute } from "../redux/selectors/general-selectors.js";

import "~/style/_usecase-group.scss";
import { getIn } from "../utils";

const mapStateToProps = state => {
  const visibleUseCasesByConfig = getIn(state, [
    "config",
    "theme",
    "visibleUseCases",
  ]);

  const selectedGroup = getUseCaseGroupFromRoute(state);
  return {
    visibleUseCasesByConfig,
    useCaseGroup:
      visibleUseCasesByConfig &&
      useCaseUtils.getUseCaseGroupByIdentifier(selectedGroup),
  };
};

const mapDispatchToProps = dispatch => {
  return {
    routerGoCurrent: props => {
      dispatch(actionCreators.router__stateGoCurrent(props));
    },
  };
};

class WonUsecasePicker extends React.Component {
  render() {
    return (
      <won-usecase-group>
        {this.props.useCaseGroup ? (
          <React.Fragment>
            <div className="ucg__header">
              {this.props.useCaseGroup.icon && (
                <svg className="ucg__header__icon">
                  <use
                    xlinkHref={this.props.useCaseGroup.icon}
                    href={this.props.useCaseGroup.icon}
                  />
                </svg>
              )}
              {this.props.useCaseGroup.label && (
                <div className="ucg__header__title">
                  {this.props.useCaseGroup.label}
                </div>
              )}
            </div>
            <div className="ucg__main">
              {!!this.props.useCaseGroup.subItems &&
                Object.values(this.props.useCaseGroup.subItems).map(
                  (subItem, index) => {
                    if (
                      useCaseUtils.isDisplayableItem(
                        subItem,
                        this.props.visibleUseCasesByConfig
                      )
                    ) {
                      return (
                        <div
                          key={subItem.identifier + "-" + index}
                          className="ucg__main__usecase clickable"
                          onClick={() => this.startFrom(subItem)}
                        >
                          {!!subItem.icon && (
                            <svg className="ucg__main__usecase__icon">
                              <use
                                xlinkHref={subItem.icon}
                                href={subItem.icon}
                              />
                            </svg>
                          )}
                          {!!subItem.label && (
                            <div className="ucg__main__usecase__label">
                              {subItem.label}
                            </div>
                          )}
                        </div>
                      );
                    }
                  }
                )}
            </div>
          </React.Fragment>
        ) : (
          <div className="ucg__header">
            <div className="ucg__header__title">Group not found</div>
          </div>
        )}
      </won-usecase-group>
    );
  }

  startFrom(subItem) {
    const subItemIdentifier = subItem && subItem.identifier;

    if (subItemIdentifier) {
      if (useCaseUtils.isUseCaseGroup(subItem)) {
        this.props.routerGoCurrent({
          useCaseGroup: encodeURIComponent(subItemIdentifier),
        });
      } else {
        this.props.routerGoCurrent({
          useCase: encodeURIComponent(subItemIdentifier),
        });
      }
    } else {
      console.warn("No identifier found for given usecase, ", subItem);
    }
  }
}
WonUsecasePicker.propTypes = {
  visibleUseCasesByConfig: PropTypes.arrayOf(PropTypes.string),
  useCaseGroup: PropTypes.object,
  routerGoCurrent: PropTypes.func,
};

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(WonUsecasePicker);<commit_msg>Updates propType<commit_after>import React from "react";
import PropTypes from "prop-types";
import { connect } from "react-redux";
import { actionCreators } from "../actions/actions.js";
import * as useCaseUtils from "../usecase-utils.js";
import { getUseCaseGroupFromRoute } from "../redux/selectors/general-selectors.js";

import "~/style/_usecase-group.scss";
import { getIn } from "../utils";

const mapStateToProps = state => {
  const visibleUseCasesByConfig = getIn(state, [
    "config",
    "theme",
    "visibleUseCases",
  ]);

  const selectedGroup = getUseCaseGroupFromRoute(state);
  return {
    visibleUseCasesByConfig,
    useCaseGroup:
      visibleUseCasesByConfig &&
      useCaseUtils.getUseCaseGroupByIdentifier(selectedGroup),
  };
};

const mapDispatchToProps = dispatch => {
  return {
    routerGoCurrent: props => {
      dispatch(actionCreators.router__stateGoCurrent(props));
    },
  };
};

class WonUsecasePicker extends React.Component {
  render() {
    return (
      <won-usecase-group>
        {this.props.useCaseGroup ? (
          <React.Fragment>
            <div className="ucg__header">
              {this.props.useCaseGroup.icon && (
                <svg className="ucg__header__icon">
                  <use
                    xlinkHref={this.props.useCaseGroup.icon}
                    href={this.props.useCaseGroup.icon}
                  />
                </svg>
              )}
              {this.props.useCaseGroup.label && (
                <div className="ucg__header__title">
                  {this.props.useCaseGroup.label}
                </div>
              )}
            </div>
            <div className="ucg__main">
              {!!this.props.useCaseGroup.subItems &&
                Object.values(this.props.useCaseGroup.subItems).map(
                  (subItem, index) => {
                    if (
                      useCaseUtils.isDisplayableItem(
                        subItem,
                        this.props.visibleUseCasesByConfig
                      )
                    ) {
                      return (
                        <div
                          key={subItem.identifier + "-" + index}
                          className="ucg__main__usecase clickable"
                          onClick={() => this.startFrom(subItem)}
                        >
                          {!!subItem.icon && (
                            <svg className="ucg__main__usecase__icon">
                              <use
                                xlinkHref={subItem.icon}
                                href={subItem.icon}
                              />
                            </svg>
                          )}
                          {!!subItem.label && (
                            <div className="ucg__main__usecase__label">
                              {subItem.label}
                            </div>
                          )}
                        </div>
                      );
                    }
                  }
                )}
            </div>
          </React.Fragment>
        ) : (
          <div className="ucg__header">
            <div className="ucg__header__title">Group not found</div>
          </div>
        )}
      </won-usecase-group>
    );
  }

  startFrom(subItem) {
    const subItemIdentifier = subItem && subItem.identifier;

    if (subItemIdentifier) {
      if (useCaseUtils.isUseCaseGroup(subItem)) {
        this.props.routerGoCurrent({
          useCaseGroup: encodeURIComponent(subItemIdentifier),
        });
      } else {
        this.props.routerGoCurrent({
          useCase: encodeURIComponent(subItemIdentifier),
        });
      }
    } else {
      console.warn("No identifier found for given usecase, ", subItem);
    }
  }
}
WonUsecasePicker.propTypes = {
  visibleUseCasesByConfig: PropTypes.objectOf(PropTypes.string),
  useCaseGroup: PropTypes.object,
  routerGoCurrent: PropTypes.func,
};

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(WonUsecasePicker);
{'fraction_non_alphanumeric': 0.10701927829955511, 'fraction_numerical': 0.0, 'mean_word_length': 1.4129397734048896, 'pattern_counts': {'":': 0, '<': 51, '<?xml version=': 0, '>': 61, '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': '2407408', 'n_tokens_mistral': 2156, 'n_tokens_neox': 2125, 'n_words': 314}