import { lazy, Suspense } from 'react';
import { withContainer, withUxTheme } from '@arcblock/ux/lib/DIDConnect';

import withBlocklet from './with-blocklet';
import withBridgeCall from './with-bridge-call';
import useSecurity from './hooks/security';
import FallbackConnect from './fallback-connect';

const LazyConnect = lazy(() => import('./connect'));

function WrapConnect(props) {
  return (
    <Suspense fallback={<FallbackConnect />}>
      <LazyConnect {...props} />
    </Suspense>
  );
}

export default withUxTheme(withBridgeCall(withBlocklet(withContainer(WrapConnect))));

export { useSecurity };
