'use client' import React from 'react' import { useTranslation } from 'react-i18next' import type { NotionPage } from '@/models/common' import { usePreviewNotionPage } from '@/service/knowledge/use-dataset' import { RiCloseLine } from '@remixicon/react' import { formatNumberAbbreviated } from '@/utils/format' import Loading from './loading' import { Notion } from '@/app/components/base/icons/src/public/common' type NotionPagePreviewProps = { currentPage: NotionPage hidePreview: () => void } const NotionPagePreview = ({ currentPage, hidePreview, }: NotionPagePreviewProps) => { const { t } = useTranslation() const { data: notionPageData, isFetching } = usePreviewNotionPage({ workspaceID: currentPage.workspace_id, pageID: currentPage.page_id, pageType: currentPage.type, }) return (
{t('datasetPipeline.addDocuments.stepOne.preview')}
{currentPage?.page_name}
· Notion Page · {notionPageData && ( <> · {`${formatNumberAbbreviated(notionPageData.content.length)} ${t('datasetPipeline.addDocuments.characters')}`} )}
{isFetching && } {!isFetching && notionPageData && (
{notionPageData.content}
)}
) } export default NotionPagePreview