'use client';

import Loader from '@/components/common/Loader';
import useRequest from '@/hooks/useRequest';
import { useParams } from 'next/navigation';
import React, { useEffect } from 'react';
import DashboardCreateRealBoxPage from './DashboardCreateRealBox';
import { real_box_requests } from '@/data/real-box/real-box.requests';

type Props = {};

const DashboardEditRealBoxPage = (props: Props) => {
    const params = useParams();
    const box_id = params.box_id as string;

    const getOneBox = useRequest(
        () => {
            return real_box_requests.find({ boxId: box_id });
        },
        {
            selectData(data) {
                const boxData = data.data; // ⬅️ Faqat data.data, data.data.data emas
                if (!boxData) return null;
                console.log(boxData.data, 'boxdata');

                return {
                    id: box_id,
                    boxId: box_id!,
                    partyId: boxData.data.party.id, // ⬅️ To‘g‘ri yo‘l
                    partyName: boxData.data.party.name!,
                    paketIds: boxData.data.packets!
                };
            },
        }
    );


    useEffect(() => {
        getOneBox.refetch()
    }, [box_id])

    console.log(getOneBox);

    if (getOneBox.loading || !getOneBox.data) {
        return <Loader p={8} size={96} />;
    }

    return (
        <>
            <DashboardCreateRealBoxPage initialValues={getOneBox.data as any} />
        </>
    );
};

export default DashboardEditRealBoxPage;
