| | |
| | | import { useCallback, useEffect, useMemo, useState } from 'react' |
| | | import useSWR from 'swr' |
| | | import { RiEqualizer2Line } from '@remixicon/react' |
| | | import s from './base.module.css' |
| | | import WorkspaceSelector from './workspace-selector' |
| | | import SearchInput from './search-input' |
| | | import PageSelector from './page-selector' |
| | | import cn from '@/utils/classnames' |
| | | import { preImportNotionPages } from '@/service/datasets' |
| | | import { NotionConnector } from '@/app/components/datasets/create/step-one' |
| | | import type { DataSourceNotionPageMap, DataSourceNotionWorkspace, NotionPage } from '@/models/common' |
| | |
| | | }, [firstWorkspaceId]) |
| | | |
| | | return ( |
| | | <div className='rounded-xl border border-components-panel-border bg-background-default-subtle'> |
| | | <div className='bg-gray-25 border border-gray-200 rounded-xl'> |
| | | { |
| | | data?.notion_info?.length |
| | | ? ( |
| | | <> |
| | | <div className='flex h-12 items-center gap-x-2 rounded-t-xl border-b border-b-divider-regular bg-components-panel-bg p-2'> |
| | | <div className='flex grow items-center gap-x-1'> |
| | | <div className='flex items-center pl-[10px] pr-2 h-11 bg-white border-b border-b-gray-200 rounded-t-xl'> |
| | | <WorkspaceSelector |
| | | value={currentWorkspaceId || firstWorkspaceId} |
| | | items={notionWorkspaces} |
| | | onSelect={handleSelectWorkspace} |
| | | /> |
| | | <div className='mx-1 h-3 w-[1px] bg-divider-regular' /> |
| | | <RiEqualizer2Line |
| | | className='h-4 w-4 cursor-pointer text-text-tertiary' |
| | | <div className='mx-1 w-[1px] h-3 bg-gray-200' /> |
| | | <div |
| | | className={cn(s['setting-icon'], 'w-6 h-6 cursor-pointer')} |
| | | onClick={() => setShowAccountSettingModal({ payload: 'data-source', onCancelCallback: mutate })} |
| | | /> |
| | | </div> |
| | | <div className='grow' /> |
| | | <SearchInput |
| | | value={searchValue} |
| | | onChange={handleSearchValueChange} |
| | | /> |
| | | </div> |
| | | <div className='overflow-hidden rounded-b-xl'> |
| | | <div className='rounded-b-xl overflow-hidden'> |
| | | <PageSelector |
| | | value={selectedPagesId} |
| | | disabledValue={getPagesMapAndSelectedPagesId[2]} |