/* eslint-disable no-underscore-dangle */
/* @aztlan/generator-front 2.0.9 */
import * as React from 'react'
import {
  useInsertionEffect, useMemo,
} from 'react'

import styleNames from '@aztlan/bem'
import { SimpleForm } from '@aztlan/ui'
import { propTypes } from './types.js'
import type { Props } from './types.js'

const baseClassName = styleNames.base
const componentClassName = 'entity'

/**
 * description
 * @param {InferProps<typeof Base.propTypes>} props -
 * @returns {React.ReactElement} - Rendered Base
 */
function BaseForm({
  id,
  className: userClassName,
  style,
  // children,
  instance,
  fields,
  isInFlight,
  ...props
}: Props): React.ReactElement {
  useInsertionEffect(
    () => {
    // @ts-ignore
      import('./styles.scss')
    }, [],
  )

  return (
    <SimpleForm
      id={id}
      className={[
        baseClassName,
        componentClassName,
        userClassName,
      ]
        .filter(Boolean)
        .join(' ')}
      style={style}
      fields={fields || instance._meta.formFields}
      defaultValues={instance}
      isInFlight={isInFlight}
      {...props}
    />
  )
}

BaseForm.propTypes = propTypes

export default BaseForm