import React from 'react';
import useFingerprintRulesConfig from 'src/config';
import {
    useGetAccountFingerprintRules,
    useTerritoriesQuery,
} from 'src/data/queries';
import { FingerprintRulesOAPanel } from './fingerprint-rules-oa-panel';

const FingerprintRulesOAPanelContainer = () => {
    const { vendorId, subaccountId } = useFingerprintRulesConfig();
    const {
        loading: loadingFingerprintRules,
        data: fingerprintRules,
        error: errorFingerprintRules,
        canManageRules: canManageSoundRecordingRules,
    } = useGetAccountFingerprintRules(vendorId, subaccountId);
    const {
        loading: loadingTerritories,
        data: territories,
        error: errorTerritories,
    } = useTerritoriesQuery();

    return (
        <FingerprintRulesOAPanel
            rules={fingerprintRules}
            territories={territories}
            loading={loadingFingerprintRules || loadingTerritories}
            error={!!errorFingerprintRules || !!errorTerritories}
            canManageRules={canManageSoundRecordingRules}
        />
    );
};

export default FingerprintRulesOAPanelContainer;