import { PATHS } from '@/shared/constants/paths';
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
import { 
  TaxTabKeys, 
  TaxTabProps 
} from '../model/types';

export const TaxTab = ({
  activeTab
}: TaxTabProps) => {
  const { navigate } = useNavigate();

  const onClickToNavigation = (tab: TaxTabKeys) => {
    if(activeTab !== tab){
      if(tab === TaxTabKeys.InvoiceList){
        navigate(PATHS.tax.invoice.list);
      }
      else if(tab === TaxTabKeys.VatReference){
        navigate(PATHS.tax.vatReference);
      }
    }
  };
  return(
    <>
      <div className="subTab">
        <button 
          className={`subtab-btn ${(activeTab === TaxTabKeys.InvoiceList)? 'active': ''}` }
          onClick={ () => onClickToNavigation(TaxTabKeys.InvoiceList) } 
        >세금 계산서</button>
        <button 
          className={`subtab-btn ${(activeTab === TaxTabKeys.VatReference)? 'active': ''}` }
          onClick={ () => onClickToNavigation(TaxTabKeys.VatReference) } 
        >부가세 참고</button>
      </div>
    </>
  );
};