o2o-castad-frontend/src/pages/Dashboard/UrlInputContent.tsx

62 lines
2.0 KiB
TypeScript

import React from 'react';
import { AutocompleteRequest } from '../../utils/api';
import SearchInputForm, { SearchType } from '../../components/SearchInputForm';
import PipelineTabs, { Pipeline } from '../../components/PipelineTabs';
import SsulCreateForm from '../Ssulbox/SsulCreateForm';
import { Scen } from '../Ssulbox/ssulData';
interface UrlInputContentProps {
/** 현재 선택된 파이프라인. 소유자는 GenerationFlow (분기·리셋 때문) */
pipeline: Pipeline;
onPipelineChange: (pipeline: Pipeline) => void;
onAnalyze: (value: string, type?: SearchType) => void;
onAutocomplete?: (data: AutocompleteRequest) => void;
onManualInput?: (businessName: string, address: string, category: string) => void;
error: string | null;
/** 썰박스 생성 요청 접수 시. 폴링 소유는 GenerationFlow */
onSsulJobStarted: (taskId: number, scenario: Scen) => void;
/** 크레딧 부족 시 충전 화면으로 */
onGoToPayment: () => void;
}
/**
* 대시보드 진입 화면.
*
* 탭바는 로고와 하위 폼 **사이에 형제로** 얹고 하위 폼만 교체한다.
*/
const UrlInputContent: React.FC<UrlInputContentProps> = ({
pipeline,
onPipelineChange,
onAnalyze,
onAutocomplete,
onManualInput,
error,
onSsulJobStarted,
onGoToPayment,
}) => {
return (
<div className="url-input-container">
<div className="url-input-content">
<div className="url-input-logo">
<img src="/assets/images/ADO2_with Slogan_white.svg" alt="ADO2" />
</div>
<PipelineTabs value={pipeline} onChange={onPipelineChange} />
{pipeline === 'ado2' ? (
<SearchInputForm
onAnalyze={onAnalyze}
onAutocomplete={onAutocomplete}
onManualInput={onManualInput}
error={error}
/>
) : (
<SsulCreateForm onSubmitted={onSsulJobStarted} onNeedCredit={onGoToPayment} />
)}
</div>
</div>
);
};
export default UrlInputContent;