diff --git a/web/app/(commonLayout)/datasets/Container.tsx b/web/app/(commonLayout)/datasets/Container.tsx index 871ef04951be1a..c9158a84872dd6 100644 --- a/web/app/(commonLayout)/datasets/Container.tsx +++ b/web/app/(commonLayout)/datasets/Container.tsx @@ -1,27 +1,28 @@ 'use client' +// Libraries import { useRef, useState } from 'react' import { useTranslation } from 'react-i18next' import useSWR from 'swr' + +// Components import Datasets from './Datasets' import DatasetFooter from './DatasetFooter' import ApiServer from './ApiServer' import Doc from './Doc' import TabSlider from '@/app/components/base/tab-slider' + +// Services import { fetchDatasetApiBaseUrl } from '@/service/datasets' const Container = () => { const { t } = useTranslation() + const options = [ - { - value: 'dataset', - text: t('dataset.datasets'), - }, - { - value: 'api', - text: t('dataset.datasetsApi'), - }, + { value: 'dataset', text: t('dataset.datasets') }, + { value: 'api', text: t('dataset.datasetsApi') }, ] + const [activeTab, setActiveTab] = useState('dataset') const containerRef = useRef(null) const { data } = useSWR(activeTab === 'dataset' ? null : '/datasets/api-base-info', fetchDatasetApiBaseUrl) @@ -34,26 +35,21 @@ const Container = () => { onChange={newActiveTab => setActiveTab(newActiveTab)} options={options} /> - { - activeTab === 'api' && ( - - ) - } + {activeTab === 'api' && data && } - { - activeTab === 'dataset' && ( -
- + + {activeTab === 'dataset' + ? ( + <> + -
- ) - } - { - activeTab === 'api' && ( - + ) - } + : ( + activeTab === 'api' && data && + )} + ) }