text: import React from 'react';
  import PropTypes from 'prop-types';
  import classNames from 'classnames';
  import { FormattedMessage } from 'react-intl';
  
  import { ensureListing } from '../../util/data';
  import { EditListingFeaturesForm } from '../../forms';
  import { ListingLink } from '../../components';
  
  import css from './EditListingFeaturesPanel.css';
  
  const FEATURES_NAME = 'amenities';
  
  const EditListingFeaturesPanel = props => {
    const {
      rootClassName,
      className,
      listing,
      onSubmit,
      onChange,
      submitButtonText,
      panelUpdated,
      updateInProgress,
      errors,
    } = props;
  
    const classes = classNames(rootClassName || css.root, className);
    const currentListing = ensureListing(listing);
    const { publicData } = currentListing.attributes;
  
    const panelTitle = currentListing.id ? (
      <FormattedMessage
        id="EditListingFeaturesPanel.title"
        values={{ listingTitle: <ListingLink listing={listing} /> }}
      />
    ) : (
      <FormattedMessage id="EditListingFeaturesPanel.createListingTitle" />
    );
  
    const amenities = publicData && publicData.amenities;
    const initialValues = { amenities };
  
    return (
      <div className={classes}>
        <h1 className={css.title}>{panelTitle}</h1>
        <EditListingFeaturesForm
          className={css.form}
          name={FEATURES_NAME}
          initialValues={initialValues}
          onSubmit={values => {
            const { amenities = [] } = values;
  
            const updatedValues = {
              publicData: { amenities },
            };
            onSubmit(updatedValues);
          }}
          onChange={onChange}
          saveActionMsg={submitButtonText}
          updated={panelUpdated}
          updateError={errors.updateListingError}
          updateInProgress={updateInProgress}
        />
      </div>
    );
  };
  
  EditListingFeaturesPanel.defaultProps = {
    rootClassName: null,
    className: null,
    listing: null,
  };
  
  const { bool, func, object, string } = PropTypes;
  
  EditListingFeaturesPanel.propTypes = {
    rootClassName: string,
    className: string,
  
    // We cannot use propTypes.listing since the listing might be a draft.
    listing: object,
  
    onSubmit: func.isRequired,
    onChange: func.isRequired,
    submitButtonText: string.isRequired,
    panelUpdated: bool.isRequired,
    updateInProgress: bool.isRequired,
    errors: object.isRequired,
  };
  
  export default EditListingFeaturesPanel;
  