<commit_before>import React, { useState, useMemo } from 'react';
import PropTypes from 'prop-types';
import { Link } from 'react-router-dom';

import buildEventCategoryUrl from './buildEventCategoryUrl';
import ErrorDisplay from '../ErrorDisplay';
import { EventAdminEventsQuery } from './queries.gql';
import RunFormFields from '../BuiltInForms/RunFormFields';
import useAsyncFunction from '../useAsyncFunction';
import useEventFormWithCategorySelection, { EventFormWithCategorySelection } from './useEventFormWithCategorySelection';
import useCreateEvent from './useCreateEvent';
import useQuerySuspended from '../useQuerySuspended';
import usePageTitle from '../usePageTitle';

function NewEvent({ history, match }) {
  const { data, error } = useQuerySuspended(EventAdminEventsQuery);

  const initialEventCategory = useMemo(
    () => (error
      ? null
      : data.convention.event_categories
        .find(c => c.id === Number.parseInt(match.params.eventCategoryId, 10))
    ),
    [data, error, match],
  );
  const [createMutate, createError] = useAsyncFunction(useCreateEvent());
  const [formProps, {
    event, eventCategory, eventCategoryId, validateForm,
  }] = useEventFormWithCategorySelection({
    convention: error ? {} : data.convention,
    schedulingUi: initialEventCategory ? initialEventCategory.scheduling_ui : null,
    initialEvent: initialEventCategory ? { event_category: initialEventCategory } : null,
  });
  const [run, setRun] = useState({});

  usePageTitle('New event');

  if (error) {
    return <ErrorDisplay graphQLError={error} />;
  }

  const { convention } = data;
  const donePath = convention.site_mode === 'single_event' ? '/' : buildEventCategoryUrl(eventCategory);

  const createEvent = async () => {
    if (!validateForm()) {
      return;
    }

    await createMutate({
      event, eventCategory, eventCategoryId, setRun,
    });
    history.push(donePath);
  };

  return (
    <>
      <h2 className="mb-4 mt-2">New event</h2>
      <EventFormWithCategorySelection {...formProps}>
        {eventCategory.scheduling_ui === 'single_run' && event.form_response_attrs.length_seconds && (
          <RunFormFields
            run={run}
            event={{ length_seconds: event.form_response_attrs.length_seconds }}
            convention={convention}
            onChange={setRun}
          />
        )}

        <ErrorDisplay graphQLError={createError} />

        <div>
          <button
            type="button"
            className="btn btn-primary"
            onClick={createEvent}
            disabled={!eventCategoryId}
          >
            Create event
          </button>
          <Link className="btn btn-link" to={donePath}>
            Cancel
          </Link>
        </div>
      </EventFormWithCategorySelection>
    </>
  );
}

NewEvent.propTypes = {
  history: PropTypes.shape({
    push: PropTypes.func.isRequired,
  }).isRequired,<commit_msg>Add a warning message if a length is needed and not provided<commit_after>import React, { useState, useMemo } from 'react';
import PropTypes from 'prop-types';
import { Link } from 'react-router-dom';

import buildEventCategoryUrl from './buildEventCategoryUrl';
import ErrorDisplay from '../ErrorDisplay';
import { EventAdminEventsQuery } from './queries.gql';
import RunFormFields from '../BuiltInForms/RunFormFields';
import useAsyncFunction from '../useAsyncFunction';
import useEventFormWithCategorySelection, { EventFormWithCategorySelection } from './useEventFormWithCategorySelection';
import useCreateEvent from './useCreateEvent';
import useQuerySuspended from '../useQuerySuspended';
import usePageTitle from '../usePageTitle';

function NewEvent({ history, match }) {
  const { data, error } = useQuerySuspended(EventAdminEventsQuery);

  const initialEventCategory = useMemo(
    () => (error
      ? null
      : data.convention.event_categories
        .find(c => c.id === Number.parseInt(match.params.eventCategoryId, 10))
    ),
    [data, error, match],
  );
  const [createMutate, createError] = useAsyncFunction(useCreateEvent());
  const [formProps, {
    event, eventCategory, eventCategoryId, validateForm,
  }] = useEventFormWithCategorySelection({
    convention: error ? {} : data.convention,
    schedulingUi: initialEventCategory ? initialEventCategory.scheduling_ui : null,
    initialEvent: initialEventCategory ? { event_category: initialEventCategory } : null,
  });
  const [run, setRun] = useState({});

  usePageTitle('New event');

  if (error) {
    return <ErrorDisplay graphQLError={error} />;
  }

  const { convention } = data;
  const donePath = convention.site_mode === 'single_event' ? '/' : buildEventCategoryUrl(eventCategory);

  const createEvent = async () => {
    if (!validateForm()) {
      return;
    }

    await createMutate({
      event, eventCategory, eventCategoryId, setRun,
    });
    history.push(donePath);
  };

  const warningMessage = (
    eventCategory.scheduling_ui === 'single_run' && !event.form_response_attrs.length_seconds
      ? 'Please specify a length of time for this event.'
      : null
  );

  return (
    <>
      <h2 className="mb-4 mt-2">New event</h2>
      <EventFormWithCategorySelection {...formProps}>
        {eventCategory.scheduling_ui === 'single_run' && event.form_response_attrs.length_seconds && (
          <RunFormFields
            run={run}
            event={{ length_seconds: event.form_response_attrs.length_seconds }}
            convention={convention}
            onChange={setRun}
          />
        )}

        {warningMessage && (
          <div className="alert alert-warning">{warningMessage}</div>
        )}

        <ErrorDisplay graphQLError={createError} />

        <div>
          <button
            type="button"
            className="btn btn-primary"
            onClick={createEvent}
            disabled={!eventCategoryId || warningMessage}
          >
            Create event
          </button>
          <Link className="btn btn-link" to={donePath}>
            Cancel
          </Link>
        </div>
      </EventFormWithCategorySelection>
    </>
  );
}

NewEvent.propTypes = {
  history: PropTypes.shape({
    push: PropTypes.func.isRequired,
  }).isRequired,
{'fraction_non_alphanumeric': 0.12327225972356155, 'fraction_numerical': 0.0019286403085824494, 'mean_word_length': 3.151434289526351, 'pattern_counts': {'":': 0, '<': 35, '<?xml version=': 0, '>': 41, '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': '6524881', 'n_tokens_mistral': 1740, 'n_tokens_neox': 1715, 'n_words': 370}