<commit_before>import React, { useEffect } from 'react';
import { connect } from 'react-redux';
import { useHistory } from 'react-router-dom';
import SchemaForm from 'platform/forms-system/src/js/components/SchemaForm';
import FormButtons from '../../components/FormButtons';
import * as actions from '../redux/actions';
import { getFormPageInfo } from '../redux/selectors';
import { TYPE_OF_VISIT } from '../../utils/constants';
import { scrollAndFocus } from '../../utils/scrollAndFocus';

const initialSchema = {
  type: 'object',
  required: ['visitType'],
  properties: {
    visitType: {
      type: 'string',
      enum: TYPE_OF_VISIT.map(v => v.id),
      enumNames: TYPE_OF_VISIT.map(v => v.name),
    },
  },
};

const uiSchema = {
  visitType: {
    'ui:widget': 'radio',
    'ui:title':
      'Please let us know how you would like to be seen for this appointment.',
  },
};

const pageKey = 'visitType';
const pageTitle = 'Choose a type of appointment';

function TypeOfVisitPage({
  schema,
  data,
  openFormPage,
  updateFormData,
  routeToPreviousAppointmentPage,
  routeToNextAppointmentPage,
  pageChangeInProgress,
}) {
  const history = useHistory();
  useEffect(() => {
    openFormPage(pageKey, uiSchema, initialSchema);
    document.title = `${pageTitle} | Veterans Affairs`;
    scrollAndFocus();
  }, []);

  return (
    <div>
      <h1 className="vads-u-font-size--h2">{pageTitle}</h1>
      {!!schema && (
        <SchemaForm
          name="Type of visit"
          title="Type of visit"
          schema={schema}
          uiSchema={uiSchema}
          onSubmit={() => routeToNextAppointmentPage(history, pageKey)}
          onChange={newData => updateFormData(pageKey, uiSchema, newData)}
          data={data}
        >
          <FormButtons
            onBack={() => routeToPreviousAppointmentPage(history, pageKey)}
            pageChangeInProgress={pageChangeInProgress}
            loadingText="Page change in progress"
          />
        </SchemaForm>
      )}
    </div>
  );
}

function mapStateToProps(state) {
  return getFormPageInfo(state, pageKey);
}

const mapDispatchToProps = {
  openFormPage: actions.openFormPage,
  updateFormData: actions.updateFormData,
  routeToNextAppointmentPage: actions.routeToNextAppointmentPage,
  routeToPreviousAppointmentPage: actions.routeToPreviousAppointmentPage,
};

export default connect(
  mapStateToProps,
  mapDispatchToProps,
)(TypeOfVisitPage);<commit_msg>convert connect to useSelect and useDispatch (#16849)<commit_after>import React, { useEffect } from 'react';
import { shallowEqual, useDispatch, useSelector } from 'react-redux';
import { useHistory } from 'react-router-dom';
import SchemaForm from 'platform/forms-system/src/js/components/SchemaForm';
import FormButtons from '../../components/FormButtons';
import { getFormPageInfo } from '../redux/selectors';
import { TYPE_OF_VISIT } from '../../utils/constants';
import { scrollAndFocus } from '../../utils/scrollAndFocus';
import {
  openFormPage,
  routeToNextAppointmentPage,
  routeToPreviousAppointmentPage,
  updateFormData,
} from '../redux/actions';

const initialSchema = {
  type: 'object',
  required: ['visitType'],
  properties: {
    visitType: {
      type: 'string',
      enum: TYPE_OF_VISIT.map(v => v.id),
      enumNames: TYPE_OF_VISIT.map(v => v.name),
    },
  },
};

const uiSchema = {
  visitType: {
    'ui:widget': 'radio',
    'ui:title':
      'Please let us know how you would like to be seen for this appointment.',
  },
};

const pageKey = 'visitType';
const pageTitle = 'Choose a type of appointment';

export default function TypeOfVisitPage() {
  const { schema, data, pageChangeInProgress } = useSelector(
    state => getFormPageInfo(state, pageKey),
    shallowEqual,
  );
  const dispatch = useDispatch();
  const history = useHistory();
  useEffect(() => {
    dispatch(openFormPage(pageKey, uiSchema, initialSchema));
    document.title = `${pageTitle} | Veterans Affairs`;
    scrollAndFocus();
  }, []);

  return (
    <div>
      <h1 className="vads-u-font-size--h2">{pageTitle}</h1>
      {!!schema && (
        <SchemaForm
          name="Type of visit"
          title="Type of visit"
          schema={schema}
          uiSchema={uiSchema}
          onSubmit={() =>
            dispatch(routeToNextAppointmentPage(history, pageKey))
          }
          onChange={newData =>
            dispatch(updateFormData(pageKey, uiSchema, newData))
          }
          data={data}
        >
          <FormButtons
            onBack={() =>
              dispatch(routeToPreviousAppointmentPage(history, pageKey))
            }
            pageChangeInProgress={pageChangeInProgress}
            loadingText="Page change in progress"
          />
        </SchemaForm>
      )}
    </div>
  );
}
{'fraction_non_alphanumeric': 0.13340292275574112, 'fraction_numerical': 0.0022964509394572024, 'mean_word_length': 3.101883561643836, 'pattern_counts': {'":': 0, '<': 17, '<?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': '2893318', 'n_tokens_mistral': 1427, 'n_tokens_neox': 1433, 'n_words': 313}