<commit_before>import axios from "../utils/axios";
import React from "react";
import "react-stepzilla/src/css/main.css";
import { Transition } from "react-transition-group";
import qs from "querystring-es3";

import NavSelect from "../utils/navSelect";

import MultiStepForm from "./MultiStepForm";
import FormStep from "./steps/FormStep";
import ContactStep from "./steps/ContactStep";
import LocationStep from "./steps/LocationStep";

import "./style.css";
import PropTypes from "prop-types";
import * as Sentry from "@sentry/react";

class CreateGroupForm extends React.Component {
  constructor(props) {
    super(props);
    this.setFields = this.setFields.bind(this);

    let state = {
      fields: props.initial || {},
      skipType: false,
      types: props.types,
    };

    if (state.types.length === 1 && !state.types[0].disabled) {
      state.fields.type = state.types[0].id;
      const subtypes = this.props.subtypes.filter(
        (s) => s.type === state.types[0].id
      );

      if (subtypes.length < 2) {
        state.fields.subtypes = subtypes.map((s) => s.label);

        state.skipType = true;
      }
    }

    this.state = state;
  }

  setFields(fields) {
    this.setState({ fields: Object.assign({}, this.state.fields, fields) });
  }

  render() {
    let steps = [
      {
        name: "Informations de contact",
        component: (
          <ContactStep setFields={this.setFields} fields={this.state.fields} />
        ),
      },
      {
        name: "Localisation",
        component: (
          <LocationStep setFields={this.setFields} fields={this.state.fields} />
        ),
      },
      {
        name: "Validation et nom",
        component: (
          <ValidateStep fields={this.state.fields} types={this.state.types} />
        ),
      },
    ];

    let typeStep = {
      name: "Un groupe pour quoi ?",
      component: (
        <GroupTypeStep
          setFields={this.setFields}
          fields={this.state.fields}
          subtypes={this.props.subtypes}
          types={this.state.types}
        />
      ),
    };

    if (!this.state.skipType) {
      steps.unshift(typeStep);
    }

    return <MultiStepForm steps={steps} />;
  }
}
CreateGroupForm.propTypes = {
  initial: PropTypes.object,
  subtypes: PropTypes.array,
  types: PropTypes.array,
};

class GroupTypeStep extends FormStep {
  constructor(props) {
    super(props);
    this.groupRefs = props.types.map(() => React.createRef());
  }

  isValidated() {
    const { subtypes } = this.props.fields;
    return !!subtypes && subtypes.length !== 0;
  }

  subtypesFor(type) {
    return this.props.subtypes.filter((s) => s.type === type);
  }

  setType(type) {
    return () => {
      if (type !== this.state.type) {
        this.props.setFields({ type, subtypes: [] });
      }
      const subtypes = this.subtypesFor(type);

      if (subtypes.length < 2) {
        this.props.setFields({ type, subtypes: subtypes.map((s) => s.label) });
      }
    };
  }

  render() {
    const { fields } = this.props;

    return (
      <div className="row padtopmore padbottommore">
        <div className="col-sm-4">
          <h3>Quel type de groupe voulez-vous créer&nbsp;?</h3>
          <p>
            Chaque personne peut créer un groupe local et en rejoindre plusieurs
            dès lors qu'elle respecte le cadre et la démarche qui nous réunit
            autour de l'Avenir en Commun et de la candidature de Jean-Luc
            Mélenchon dans un esprit d'ouverture, de bienveillance et de volonté
            de se projeter dans l'action.
          </p>
          <p>
            En créant votre groupe, vous vous engagez à respecter{" "}
            <a href="https://infos.actionpopulaire.fr/charte-des-groupes-action-populaire/">
              une charte d'éthique
            </a>{" "}
            dans la gestion du groupe.
          </p>
          <p><commit_msg>fix: group creation form wording<commit_after>import axios from "../utils/axios";
import React from "react";
import "react-stepzilla/src/css/main.css";
import { Transition } from "react-transition-group";
import qs from "querystring-es3";

import NavSelect from "../utils/navSelect";

import MultiStepForm from "./MultiStepForm";
import FormStep from "./steps/FormStep";
import ContactStep from "./steps/ContactStep";
import LocationStep from "./steps/LocationStep";

import "./style.css";
import PropTypes from "prop-types";
import * as Sentry from "@sentry/react";

class CreateGroupForm extends React.Component {
  constructor(props) {
    super(props);
    this.setFields = this.setFields.bind(this);

    let state = {
      fields: props.initial || {},
      skipType: false,
      types: props.types,
    };

    if (state.types.length === 1 && !state.types[0].disabled) {
      state.fields.type = state.types[0].id;
      const subtypes = this.props.subtypes.filter(
        (s) => s.type === state.types[0].id
      );

      if (subtypes.length < 2) {
        state.fields.subtypes = subtypes.map((s) => s.label);

        state.skipType = true;
      }
    }

    this.state = state;
  }

  setFields(fields) {
    this.setState({ fields: Object.assign({}, this.state.fields, fields) });
  }

  render() {
    let steps = [
      {
        name: "Informations de contact",
        component: (
          <ContactStep setFields={this.setFields} fields={this.state.fields} />
        ),
      },
      {
        name: "Localisation",
        component: (
          <LocationStep setFields={this.setFields} fields={this.state.fields} />
        ),
      },
      {
        name: "Validation et nom",
        component: (
          <ValidateStep fields={this.state.fields} types={this.state.types} />
        ),
      },
    ];

    let typeStep = {
      name: "Un groupe pour quoi ?",
      component: (
        <GroupTypeStep
          setFields={this.setFields}
          fields={this.state.fields}
          subtypes={this.props.subtypes}
          types={this.state.types}
        />
      ),
    };

    if (!this.state.skipType) {
      steps.unshift(typeStep);
    }

    return <MultiStepForm steps={steps} />;
  }
}
CreateGroupForm.propTypes = {
  initial: PropTypes.object,
  subtypes: PropTypes.array,
  types: PropTypes.array,
};

class GroupTypeStep extends FormStep {
  constructor(props) {
    super(props);
    this.groupRefs = props.types.map(() => React.createRef());
  }

  isValidated() {
    const { subtypes } = this.props.fields;
    return !!subtypes && subtypes.length !== 0;
  }

  subtypesFor(type) {
    return this.props.subtypes.filter((s) => s.type === type);
  }

  setType(type) {
    return () => {
      if (type !== this.state.type) {
        this.props.setFields({ type, subtypes: [] });
      }
      const subtypes = this.subtypesFor(type);

      if (subtypes.length < 2) {
        this.props.setFields({ type, subtypes: subtypes.map((s) => s.label) });
      }
    };
  }

  render() {
    const { fields } = this.props;

    return (
      <div className="row padtopmore padbottommore">
        <div className="col-sm-4">
          <h3>Quel type de groupe voulez-vous créer&nbsp;?</h3>
          <p>
            Chaque personne peut créer un groupe local et en rejoindre plusieurs
            dès lors qu'elle respecte le cadre et la démarche qui nous réunit
            autour de l'Avenir en Commun et de la candidature de <NAME> dans un esprit d'ouverture, de bienveillance et de volonté
            de se projeter dans l'action.
          </p>
          <p>
            En créant votre groupe, vous vous engagez à respecter{" "}
            <a href="https://infos.actionpopulaire.fr/charte-des-groupes-action-populaire/">
              une charte d'éthique
            </a>{" "}
            dans l'animation du groupe.
          </p>
          <p>
{'fraction_non_alphanumeric': 0.13870389344262296, 'fraction_numerical': 0.0028176229508196722, 'mean_word_length': 2.270100502512563, 'pattern_counts': {'":': 0, '<': 40, '<?xml version=': 0, '>': 48, 'https://': 2, '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': '671395', 'n_tokens_mistral': 2448, 'n_tokens_neox': 2405, 'n_words': 553}