import React, {ReactNode, useEffect, useState} from 'react';
import {AccountRequestFactory} from "../../services/factories/Account_Request_Factory";
import {Industry} from "../../services/factories/general";
import {CardRequestFactory} from "../../services/factories/Card_Request_Factory";

type AccountRequestsProps = {
    children?: ReactNode
}

const AccountRequests = ({children}: AccountRequestsProps) => {

    const [factory, setFactory] = useState<string>('')

    useEffect(() => {

        if (!factory) return
        // const requests = new Array(100).fill(null).map(()=> RequestFactory())

        let req;
        switch (factory) {
            case 'acc_req':
                req = Industry(50, AccountRequestFactory)
                break;
            case 'card_req':
                req = Industry(50, CardRequestFactory)
                // Expected output: "Mangoes and papayas are $2.79 a pound."
                break;
            default:
                console.log(`Sorry, we are out of `);
        }


    }, [factory])

    return (
        <div>
            <h2>AVAILABLE FACTORIES ΦΑКΤΟΡΙΕΣ 🏭🏭 🔨 🔨 🏭 </h2>
            <div className={'d-flex'}>
                <button onClick={() => setFactory('acc_req')}>ACCOUNT REQUESTS</button>
                <button onClick={() => setFactory('card_req')}>CARD REQUESTS</button>
            </div>

            <p>OPEN THE CONSOLE 😎👉</p>
        </div>
    );
}

export default AccountRequests;