import { observer } from 'mobx-react-lite' ; import { useCallback } from 'react' ; import styled , { css } from 'reshadow' ; import { Loader } from '@cloudbeaver/core-blocks' ; import { useService } from '@cloudbeaver/core-di' ; import { ConnectionForm } from '../ConnectionForm/ConnectionForm' ; import { PublicConnectionFormService } from './PublicConnectionFormService' ; const styles = css `
  Loader {
    height: 100%;
  }
` ; export const PublicConnectionForm = observer ( function PublicConnectionForm ( ) { const service = useService ( PublicConnectionFormService ) ; const close = useCallback ( ( ) => service . close ( true ) , [ ] ) ; const save = useCallback ( ( ) => service . save ( ) , [ ] ) ; return styled ( styles ) ( < Loader loading = { service . formState === null } > { ( ) => service . formState && ( < ConnectionForm state = { service . formState } onSave = { save } onCancel = { close } / > ) } < /Loader>); } ) ;