component.js

gistfile1.txt

import * as React from 'react';
import { Field, FormSection } from 'redux-form';

import IntlLink from '../../core/intl/intlLink/intlLink.container';
import { LOCATION } from '../../core/location/location.types';
import { IntlText } from '../../core/intl/intlText/intlText.container';
import { Input, Radio, Button, Icon, Text } from '../../components';
import { Address } from '../address/address.fieldset';
import { Name } from '../name/name.fieldset';
import {
  isRequired,
  isPhoneNumber,
} from '../../core/forms/form-field-validators';
import { isNil } from 'ramda';

interface BusinessNameRegistrationFieldsetProps {
  error: string;
  businessNameRegistrationFormValues: {
    [key: string]: string | boolean | undefined;
  };
  submitForm: React.EventHandler<React.FormEvent<HTMLFormElement>>;
}

export const BusinessNameRegistrationFieldset: React.SFC<
  BusinessNameRegistrationFieldsetProps
> = ({ businessNameRegistrationFormValues, submitForm, error: formError }) => {
  return (
    <div className="w-100 flex flex-column items-start">

      <SidebarCalculator formValues={businessNameRegistrationFormValues} />

      <form className="w-100" onSubmit={submitForm}>
              {businessNameRegistrationFormValues &&
                businessNameRegistrationFormValues.isRegisteringAsThirdParty && (
                  <div>
                    <div className="montserrat fw3 f-14 ownr-dark-purple mb2">
                      Enter Power of Attorney Information
                    </div>
                    <FormSection name="declarantName">
                      <Name
                        requiredExceptions={{
                          isRegisteringAsThirdParty: false,
                        }}
                      />
                    </FormSection>
                  </div>
                )}
              <div className="montserrat fw3 f-20 ownr-dark-purple mt5 mb2">
                Business Owner's Home Address
              </div>
              <FormSection name="homeAddress">
                <Address />
              </FormSection>

              {businessNameRegistrationFormValues &&
                !isNil(
                  businessNameRegistrationFormValues.isBusinessSameAsHome,
                ) &&
                !businessNameRegistrationFormValues.isBusinessSameAsHome && (
                  <div>
                    <div className="montserrat fw3 f-14 ownr-dark-purple mb2">
                      Enter Business Address
                    </div>
                    <FormSection name="businessAddress">
                      <Address
                        requiredExceptions={{ isBusinessSameAsHome: true }}
                      />
                    </FormSection>
                  </div>
                )}
      </form>
    </div>
  );
};

export default BusinessNameRegistrationFieldset;