import React, { Suspense, lazy } from 'react';
import type { useAbuseDbLookup } from './useAbuseDbLookup';

const FirewallAbuseDbLookupPopup = lazy(() => import('./firewallAbuseDbLookupPopup'));

type LookupState = ReturnType<typeof useAbuseDbLookup>;

type Props = Pick<
    LookupState,
    'lookupResult' | 'lookupIp' | 'saving' | 'allowSave' | 'closeLookup' | 'saveAndClose'
>;

export default function AbuseDbLookupOverlay({
    lookupResult,
    lookupIp,
    saving,
    allowSave,
    closeLookup,
    saveAndClose,
}: Props) {
    if (!lookupResult) return null;

    return (
        <Suspense fallback={null}>
            <FirewallAbuseDbLookupPopup
                response={lookupResult}
                ip={lookupIp}
                saving={saving}
                onClose={closeLookup}
                onSaveAndClose={allowSave ? saveAndClose : undefined}
            />
        </Suspense>
    );
}