import React, { useState } from 'react';
import Leads from './Leads';

import '../styles/_tabComponents.scss';

function TabComponent() {
    const [leadsactiveTab, setLeadsTab] = useState('formdeck');

    const handleLeadsTabClick = (tab) => {
        setLeadsTab(tab);
    };

    return (
        <div>
            <div className="leads-tab-components">
                <button
                    className={leadsactiveTab === 'formdeck' ? 'active' : ''}
                    onClick={() => handleLeadsTabClick('formdeck')}
                >
                    SimpleForm
                </button>

            </div>
            <div className="leads-tab-content">
                <div className={leadsactiveTab === 'formdeck' ? 'active' : ''}>
                    <LoadSimpleFormContent />
                </div>

            </div>
        </div>
    );
}

function LoadSimpleFormContent() {
    return <div><Leads /></div>;
}

export default TabComponent;