import { PATHS } from '@/shared/constants/paths';
import { useState } from 'react';
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
import { IMAGE_ROOT } from '@/shared/constants/common';
import { HeaderType } from '@/entities/common/model/types';
import { LinkPaymentTab } from '@/entities/additional-service/ui/link-payment/link-payment-tab';
import { LinkPaymentTabKeys } from '@/entities/additional-service/model/types';
import { LinkPaymentDispatchListWrap } from '../../../entities/additional-service/ui/link-payment/link-payment-dispatch-list-wrap';
import {
    useSetHeaderTitle,
    useSetHeaderType,
    useSetFooterMode,
    useSetOnBack
} from '@/widgets/sub-layout/use-sub-layout';


export const LinkPaymentDispatchListPage = () => {
    const { navigate } = useNavigate();

    const [activeTab, setActiveTab] = useState<LinkPaymentTabKeys>(LinkPaymentTabKeys.DispatchList)

    useSetHeaderTitle('링크결제')
    useSetHeaderType(HeaderType.LeftArrow);
    useSetFooterMode(false);
    useSetOnBack(() => {
        navigate(PATHS.home);
    });

    return (
        <>
            <main>
                <div className="tab-content">
                    <div className="tab-pane pt-46 active">
                        <LinkPaymentTab activeTab={activeTab}></LinkPaymentTab>
                        <LinkPaymentDispatchListWrap></LinkPaymentDispatchListWrap>
                    </div>
                </div>
            </main>
        </>
    )
}