import React, { useEffect } from 'react';
import { __ } from '@wordpress/i18n';
import { intersection } from 'ramda';
import { useNavigate } from 'react-router-dom';

// store
import { useStoreValue } from '../../store';

// components
import { Button } from 'primereact/button';
import ManageApplDeleteSection from '../Admin/components/ManageApplDeleteSection';

const DELETE_PERMISSIONS = [
    'ROOT_MANAGE_APPL_VIEW_DELETED',
    'ROOT_MANAGE_APPL_DELETE_CONFIRM',
    'ROOT_MANAGE_APPL_DELETE'
];

const AdminEliminaDomande = () => {
    const permissions = useStoreValue('getPermissions');
    const navigate = useNavigate();
    const hasPermission = intersection(permissions, DELETE_PERMISSIONS).length > 0;
    const canViewDeleted = intersection(permissions, ['ROOT_MANAGE_APPL_VIEW_DELETED']).length > 0;
    const canDeleteConfirm = intersection(permissions, ['ROOT_MANAGE_APPL_DELETE_CONFIRM']).length > 0;
    const canDelete = intersection(permissions, ['ROOT_MANAGE_APPL_DELETE']).length > 0;

    useEffect(() => {
        if (!hasPermission) navigate('/admin');
    }, [hasPermission]);

    return <div className="appPage">
        <div className="appPage__pageHeader">
            <h1>{__('Elimina Domande', 'gepafin')}</h1>
        </div>
        <div className="appPage__spacer"></div>
        <div className="appPageSection__actions">
            <Button type="button" outlined label={__('Indietro', 'gepafin')} icon="pi pi-arrow-left" onClick={() => navigate('/admin')}/>
        </div>
        <div className="appPage__spacer"></div>
        {hasPermission && <ManageApplDeleteSection
            canViewDeleted={canViewDeleted}
            canDeleteConfirm={canDeleteConfirm}
            canDelete={canDelete}
        />}
    </div>
}

export default AdminEliminaDomande;
