fix: Add dataset file upload restrictions (#29397)

Co-authored-by: kurokobo <kuro664@gmail.com>
Co-authored-by: yyh <92089059+lyzno1@users.noreply.github.com>

web/app/components/base/notion-page-selector/base.tsx

@@ -21,6 +21,7 @@ type NotionPageSelectorProps = {
   datasetId?: string
   credentialList: DataSourceCredential[]
   onSelectCredential?: (credentialId: string) => void
+  supportBatchUpload?: boolean
 }
 
 const NotionPageSelector = ({
@@ -32,6 +33,7 @@ const NotionPageSelector = ({
   datasetId = '',
   credentialList,
   onSelectCredential,
+  supportBatchUpload = false,
 }: NotionPageSelectorProps) => {
   const [searchValue, setSearchValue] = useState('')
   const setShowAccountSettingModal = useModalContextSelector(s => s.setShowAccountSettingModal)
@@ -110,7 +112,7 @@ const NotionPageSelector = ({
     setCurrentCredential(credential)
     onSelect([]) // Clear selected pages when changing credential
     onSelectCredential?.(credential.credentialId)
-  }, [invalidPreImportNotionPages, onSelect, onSelectCredential])
+  }, [datasetId, invalidPreImportNotionPages, notionCredentials, onSelect, onSelectCredential])
 
   const handleSelectPages = useCallback((newSelectedPagesId: Set<string>) => {
     const selectedPages = Array.from(newSelectedPagesId).map(pageId => pagesMapAndSelectedPagesId[0][pageId])
@@ -175,6 +177,7 @@ const NotionPageSelector = ({
               canPreview={canPreview}
               previewPageId={previewPageId}
               onPreview={handlePreviewPage}
+              isMultipleChoice={supportBatchUpload}
             />
           )}
         </div>

web/app/components/base/notion-page-selector/credential-selector/index.tsx

@@ -1,9 +1,8 @@
 'use client'
-import { useTranslation } from 'react-i18next'
 import React, { Fragment, useMemo } from 'react'
 import { Menu, MenuButton, MenuItem, MenuItems, Transition } from '@headlessui/react'
 import { RiArrowDownSLine } from '@remixicon/react'
-import NotionIcon from '../../notion-icon'
+import { CredentialIcon } from '@/app/components/datasets/common/credential-icon'
 
 export type NotionCredential = {
   credentialId: string
@@ -23,14 +22,10 @@ const CredentialSelector = ({
   items,
   onSelect,
 }: CredentialSelectorProps) => {
-  const { t } = useTranslation()
   const currentCredential = items.find(item => item.credentialId === value)!
 
   const getDisplayName = (item: NotionCredential) => {
-    return item.workspaceName || t('datasetPipeline.credentialSelector.name', {
-      credentialName: item.credentialName,
-      pluginName: 'Notion',
-    })
+    return item.workspaceName || item.credentialName
   }
 
   const currentDisplayName = useMemo(() => {
@@ -43,10 +38,11 @@ const CredentialSelector = ({
         ({ open }) => (
           <>
             <MenuButton className={`flex h-7 items-center justify-center rounded-md p-1 pr-2 hover:bg-state-base-hover ${open && 'bg-state-base-hover'} cursor-pointer`}>
-              <NotionIcon
+              <CredentialIcon
                 className='mr-2'
-                src={currentCredential?.workspaceIcon}
+                avatarUrl={currentCredential?.workspaceIcon}
                 name={currentDisplayName}
+                size={20}
               />
               <div
                 className='mr-1 w-[90px] truncate text-left text-sm font-medium text-text-secondary'
@@ -80,10 +76,11 @@ const CredentialSelector = ({
                             className='flex h-9 cursor-pointer items-center rounded-lg px-3 hover:bg-state-base-hover'
                             onClick={() => onSelect(item.credentialId)}
                           >
-                            <NotionIcon
+                            <CredentialIcon
                               className='mr-2 shrink-0'
-                              src={item.workspaceIcon}
+                              avatarUrl={item.workspaceIcon}
                               name={displayName}
+                              size={20}
                             />
                             <div
                               className='system-sm-medium mr-2 grow truncate text-text-secondary'

web/app/components/base/notion-page-selector/page-selector/index.tsx

@@ -7,6 +7,7 @@ import Checkbox from '../../checkbox'
 import NotionIcon from '../../notion-icon'
 import cn from '@/utils/classnames'
 import type { DataSourceNotionPage, DataSourceNotionPageMap } from '@/models/common'
+import Radio from '@/app/components/base/radio/ui'
 
 type PageSelectorProps = {
   value: Set<string>
@@ -18,6 +19,7 @@ type PageSelectorProps = {
   canPreview?: boolean
   previewPageId?: string
   onPreview?: (selectedPageId: string) => void
+  isMultipleChoice?: boolean
 }
 type NotionPageTreeItem = {
   children: Set<string>
@@ -80,6 +82,7 @@ const ItemComponent = ({ index, style, data }: ListChildComponentProps<{
   searchValue: string
   previewPageId: string
   pagesMap: DataSourceNotionPageMap
+  isMultipleChoice?: boolean
 }>) => {
   const { t } = useTranslation()
   const {
@@ -94,6 +97,7 @@ const ItemComponent = ({ index, style, data }: ListChildComponentProps<{
     searchValue,
     previewPageId,
     pagesMap,
+    isMultipleChoice,
   } = data
   const current = dataList[index]
   const currentWithChildrenAndDescendants = listMapWithChildrenAndDescendants[current.page_id]
@@ -134,16 +138,24 @@ const ItemComponent = ({ index, style, data }: ListChildComponentProps<{
         previewPageId === current.page_id && 'bg-state-base-hover')}
       style={{ ...style, top: style.top as number + 8, left: 8, right: 8, width: 'calc(100% - 16px)' }}
     >
-      <Checkbox
-        className='mr-2 shrink-0'
-        checked={checkedIds.has(current.page_id)}
-        disabled={disabled}
-        onCheck={() => {
-          if (disabled)
-            return
-          handleCheck(index)
-        }}
-      />
+      {isMultipleChoice ? (
+        <Checkbox
+          className='mr-2 shrink-0'
+          checked={checkedIds.has(current.page_id)}
+          disabled={disabled}
+          onCheck={() => {
+            handleCheck(index)
+          }}
+        />) : (
+        <Radio
+          className='mr-2 shrink-0'
+          isChecked={checkedIds.has(current.page_id)}
+          disabled={disabled}
+          onCheck={() => {
+            handleCheck(index)
+          }}
+        />
+      )}
       {!searchValue && renderArrow()}
       <NotionIcon
         className='mr-1 shrink-0'
@@ -192,6 +204,7 @@ const PageSelector = ({
   canPreview = true,
   previewPageId,
   onPreview,
+  isMultipleChoice = true,
 }: PageSelectorProps) => {
   const { t } = useTranslation()
   const [dataList, setDataList] = useState<NotionPageItem[]>([])
@@ -265,7 +278,7 @@ const PageSelector = ({
     const currentWithChildrenAndDescendants = listMapWithChildrenAndDescendants[pageId]
 
     if (copyValue.has(pageId)) {
-      if (!searchValue) {
+      if (!searchValue && isMultipleChoice) {
         for (const item of currentWithChildrenAndDescendants.descendants)
           copyValue.delete(item)
       }
@@ -273,12 +286,18 @@ const PageSelector = ({
       copyValue.delete(pageId)
     }
     else {
-      if (!searchValue) {
+      if (!searchValue && isMultipleChoice) {
         for (const item of currentWithChildrenAndDescendants.descendants)
           copyValue.add(item)
       }
-
-      copyValue.add(pageId)
+      // Single choice mode, clear previous selection
+      if (!isMultipleChoice && copyValue.size > 0) {
+        copyValue.clear()
+        copyValue.add(pageId)
+      }
+      else {
+        copyValue.add(pageId)
+      }
     }
 
     onSelect(new Set(copyValue))
@@ -322,6 +341,7 @@ const PageSelector = ({
         searchValue,
         previewPageId: currentPreviewPageId,
         pagesMap,
+        isMultipleChoice,
       }}
     >
       {Item}