From 411e332f1bdb98e175665ecf769c71981aa52825 Mon Sep 17 00:00:00 2001 From: Wu Tianwei <30284043+WTW0313@users.noreply.github.com> Date: Wed, 19 Mar 2025 11:19:57 +0800 Subject: [PATCH] feat: dark mode for knowledge (#15236) --- .../[datasetId]/layout.tsx | 11 +- web/app/components/app-sidebar/navLink.tsx | 2 +- web/app/components/base/button/index.tsx | 5 +- .../icons/src/public/other/RowStruct.json | 6 +- .../base/notion-page-selector/base.module.css | 4 - .../base/notion-page-selector/base.tsx | 30 ++--- .../page-selector/index.module.css | 17 --- .../page-selector/index.tsx | 30 +++-- .../search-input/index.module.css | 15 --- .../search-input/index.tsx | 12 +- .../workspace-selector/index.module.css | 9 -- .../workspace-selector/index.tsx | 28 ++-- .../components/base/search-input/index.tsx | 16 +-- .../base/tag-management/selector.tsx | 4 +- .../datasets/common/document-picker/index.tsx | 2 +- .../create/embedding-process/index.tsx | 8 +- .../index.module.css | 9 +- .../create/file-preview/index.module.css | 27 +--- .../datasets/create/file-preview/index.tsx | 4 +- .../datasets/create/file-uploader/index.tsx | 2 +- .../notion-page-preview/index.module.css | 84 +++++------- .../create/notion-page-preview/index.tsx | 6 +- .../datasets/create/step-one/index.module.css | 95 ++------------ .../datasets/create/step-one/index.tsx | 23 +++- .../datasets/create/step-three/index.tsx | 4 +- .../datasets/create/step-two/index.tsx | 20 +-- .../datasets/create/step-two/option-card.tsx | 2 +- .../website/base/checkbox-with-label.tsx | 2 +- .../website/base/crawled-result-item.tsx | 32 ++++- .../create/website/base/crawled-result.tsx | 16 ++- .../datasets/create/website/base/crawling.tsx | 8 +- .../create/website/base/error-message.tsx | 6 +- .../datasets/create/website/base/field.tsx | 4 +- .../datasets/create/website/base/input.tsx | 9 +- .../create/website/base/options-wrap.tsx | 12 +- .../create/website/base/url-input.tsx | 4 +- .../create/website/firecrawl/header.tsx | 29 +++-- .../create/website/firecrawl/index.tsx | 13 +- .../create/website/firecrawl/options.tsx | 2 + .../datasets/create/website/index.tsx | 20 +-- .../jina-reader/base/checkbox-with-label.tsx | 4 +- .../jina-reader/crawled-result-item.tsx | 40 ------ .../website/jina-reader/crawled-result.tsx | 87 ------------- .../create/website/jina-reader/crawling.tsx | 37 ------ .../create/website/jina-reader/header.tsx | 29 +++-- .../create/website/jina-reader/index.tsx | 13 +- .../website/jina-reader/mock-crawl-result.ts | 24 ---- .../create/website/jina-reader/options.tsx | 2 + .../datasets/create/website/no-data.tsx | 14 +- .../datasets/create/website/preview.tsx | 10 +- .../detail/completed/child-segment-list.tsx | 2 +- .../detail/completed/common/chunk-content.tsx | 4 +- .../documents/detail/segment-add/index.tsx | 16 +-- .../documents/detail/settings/index.tsx | 2 +- .../components/datasets/documents/list.tsx | 5 +- .../datasets/documents/rename-modal.tsx | 2 +- .../datasets/documents/style.module.css | 4 +- .../hit-testing/components/result-item.tsx | 2 +- .../components/datasets/hit-testing/index.tsx | 10 +- .../hit-testing/modify-retrieval-modal.tsx | 37 +++--- .../datasets/hit-testing/textarea.tsx | 8 +- .../settings/permission-selector/index.tsx | 59 +++++---- .../header/account-dropdown/compliance.tsx | 28 ++-- .../header/account-dropdown/support.tsx | 22 ++-- .../variable/var-reference-vars.tsx | 6 +- web/i18n/en-US/dataset-creation.ts | 2 + web/i18n/en-US/dataset-settings.ts | 1 + web/i18n/zh-Hans/dataset-creation.ts | 2 + web/i18n/zh-Hans/dataset-settings.ts | 1 + web/tailwind-common-config.ts | 1 + web/themes/manual-dark.css | 5 +- web/themes/manual-light.css | 123 +++++++++--------- 72 files changed, 473 insertions(+), 761 deletions(-) delete mode 100644 web/app/components/base/notion-page-selector/base.module.css delete mode 100644 web/app/components/base/notion-page-selector/page-selector/index.module.css delete mode 100644 web/app/components/base/notion-page-selector/search-input/index.module.css delete mode 100644 web/app/components/base/notion-page-selector/workspace-selector/index.module.css delete mode 100644 web/app/components/datasets/create/website/jina-reader/crawled-result-item.tsx delete mode 100644 web/app/components/datasets/create/website/jina-reader/crawled-result.tsx delete mode 100644 web/app/components/datasets/create/website/jina-reader/crawling.tsx delete mode 100644 web/app/components/datasets/create/website/jina-reader/mock-crawl-result.ts diff --git a/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/layout.tsx b/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/layout.tsx index a6fb116fa8..77f42117fd 100644 --- a/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/layout.tsx +++ b/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/layout.tsx @@ -15,7 +15,7 @@ import { // CommandLineIcon as CommandLineSolidIcon, DocumentTextIcon as DocumentTextSolidIcon, } from '@heroicons/react/24/solid' -import { RiApps2AddLine, RiInformation2Line } from '@remixicon/react' +import { RiApps2AddLine, RiBookOpenLine, RiInformation2Line } from '@remixicon/react' import s from './style.module.css' import classNames from '@/utils/classnames' import { fetchDatasetDetail, fetchDatasetRelatedApps } from '@/service/datasets' @@ -58,13 +58,6 @@ const TargetSolidIcon = ({ className }: SVGProps) => { } -const BookOpenIcon = ({ className }: SVGProps) => { - return - - - -} - type IExtraInfoProps = { isMobile: boolean relatedApps?: RelatedAppResponse @@ -131,7 +124,7 @@ const ExtraInfo = ({ isMobile, relatedApps, expand }: IExtraInfoProps) => { } target='_blank' rel='noopener noreferrer' > - + {t('common.datasetMenus.viewDoc')} diff --git a/web/app/components/app-sidebar/navLink.tsx b/web/app/components/app-sidebar/navLink.tsx index 4e04fcc3e1..295b553b04 100644 --- a/web/app/components/app-sidebar/navLink.tsx +++ b/web/app/components/app-sidebar/navLink.tsx @@ -44,7 +44,7 @@ export default function NavLink({ key={name} href={href} className={classNames( - isActive ? 'bg-state-accent-active text-text-accent font-semibold' : 'text-components-menu-item-text hover:bg-gray-100 hover:text-components-menu-item-text-hover', + isActive ? 'bg-state-accent-active text-text-accent font-semibold' : 'text-components-menu-item-text hover:bg-state-base-hover hover:text-components-menu-item-text-hover', 'group flex items-center h-9 rounded-md py-2 text-sm font-normal', mode === 'expand' ? 'px-3' : 'px-2.5', )} diff --git a/web/app/components/base/button/index.tsx b/web/app/components/base/button/index.tsx index 3bd4b21a5e..b467c494b0 100644 --- a/web/app/components/base/button/index.tsx +++ b/web/app/components/base/button/index.tsx @@ -34,10 +34,11 @@ export type ButtonProps = { destructive?: boolean loading?: boolean styleCss?: CSSProperties + spinnerClassName?: string } & React.ButtonHTMLAttributes & VariantProps const Button = React.forwardRef( - ({ className, variant, size, destructive, loading, styleCss, children, ...props }, ref) => { + ({ className, variant, size, destructive, loading, styleCss, children, spinnerClassName, ...props }, ref) => { return ( ) }, diff --git a/web/app/components/base/icons/src/public/other/RowStruct.json b/web/app/components/base/icons/src/public/other/RowStruct.json index 0d1ef43f4f..93c8068601 100644 --- a/web/app/components/base/icons/src/public/other/RowStruct.json +++ b/web/app/components/base/icons/src/public/other/RowStruct.json @@ -20,7 +20,7 @@ "width": "16", "height": "16", "rx": "5", - "fill": "#F2F4F7" + "fill": "currentColor" }, "children": [] }, @@ -33,7 +33,7 @@ "width": "233", "height": "10", "rx": "3", - "fill": "#EAECF0" + "fill": "currentColor" }, "children": [] }, @@ -46,7 +46,7 @@ "width": "345", "height": "6", "rx": "3", - "fill": "#F2F4F7" + "fill": "currentColor" }, "children": [] } diff --git a/web/app/components/base/notion-page-selector/base.module.css b/web/app/components/base/notion-page-selector/base.module.css deleted file mode 100644 index d9aa9fe359..0000000000 --- a/web/app/components/base/notion-page-selector/base.module.css +++ /dev/null @@ -1,4 +0,0 @@ -.setting-icon { - background: url(./assets/setting.svg) center center no-repeat; - background-size: 14px 14px; -} \ No newline at end of file diff --git a/web/app/components/base/notion-page-selector/base.tsx b/web/app/components/base/notion-page-selector/base.tsx index e3b321b120..a16be24ce7 100644 --- a/web/app/components/base/notion-page-selector/base.tsx +++ b/web/app/components/base/notion-page-selector/base.tsx @@ -1,10 +1,9 @@ import { useCallback, useEffect, useMemo, useState } from 'react' import useSWR from 'swr' -import s from './base.module.css' +import { RiEqualizer2Line } from '@remixicon/react' 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' @@ -88,23 +87,24 @@ const NotionPageSelector = ({ }, [firstWorkspaceId]) return ( -
+
{ data?.notion_info?.length ? ( <> -
- -
-
setShowAccountSettingModal({ payload: 'data-source', onCancelCallback: mutate })} - /> -
+
+
+ +
+ setShowAccountSettingModal({ payload: 'data-source', onCancelCallback: mutate })} + /> +
handleToggle(index)} - /> + > + { + current.expand + ? + : + } +
) } if (current.parent_id === 'root' || !pagesMap[current.parent_id]) { @@ -112,14 +118,12 @@ const ItemComponent = ({ index, style, data }: ListChildComponentProps<{ return (
{ @@ -135,7 +139,7 @@ const ItemComponent = ({ index, style, data }: ListChildComponentProps<{ src={current.page_icon} />
{current.page_name} @@ -143,7 +147,9 @@ const ItemComponent = ({ index, style, data }: ListChildComponentProps<{ { canPreview && (
handlePreview(index)}> {t('common.dataSource.notion.selector.preview')}
@@ -152,7 +158,7 @@ const ItemComponent = ({ index, style, data }: ListChildComponentProps<{ { searchValue && (
{breadCrumbs.join(' / ')} @@ -278,7 +284,7 @@ const PageSelector = ({ if (!currentDataList.length) { return ( -
+
{t('common.dataSource.notion.selector.noSearchResult')}
) diff --git a/web/app/components/base/notion-page-selector/search-input/index.module.css b/web/app/components/base/notion-page-selector/search-input/index.module.css deleted file mode 100644 index a65b7d5390..0000000000 --- a/web/app/components/base/notion-page-selector/search-input/index.module.css +++ /dev/null @@ -1,15 +0,0 @@ -.search-icon { - background: url(../assets/search.svg) center center; - background-size: 14px 14px; -} - -.clear-icon { - background: url(../assets/clear.svg) center center; - background-size: contain; -} - -.input-wrapper { - flex-basis: 200px; - width: 0; - box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05); -} \ No newline at end of file diff --git a/web/app/components/base/notion-page-selector/search-input/index.tsx b/web/app/components/base/notion-page-selector/search-input/index.tsx index 8bf55273b7..665d0cca4f 100644 --- a/web/app/components/base/notion-page-selector/search-input/index.tsx +++ b/web/app/components/base/notion-page-selector/search-input/index.tsx @@ -1,7 +1,7 @@ import { useCallback } from 'react' import type { ChangeEvent } from 'react' import { useTranslation } from 'react-i18next' -import s from './index.module.css' +import { RiCloseCircleFill, RiSearchLine } from '@remixicon/react' import cn from '@/utils/classnames' type SearchInputProps = { @@ -19,18 +19,18 @@ const SearchInput = ({ }, [onChange]) return ( -
-
+
+ ) => onChange(e.target.value)} placeholder={t('common.dataSource.notion.selector.searchPages') || ''} /> { value && ( -
) diff --git a/web/app/components/base/notion-page-selector/workspace-selector/index.module.css b/web/app/components/base/notion-page-selector/workspace-selector/index.module.css deleted file mode 100644 index b68e1561e9..0000000000 --- a/web/app/components/base/notion-page-selector/workspace-selector/index.module.css +++ /dev/null @@ -1,9 +0,0 @@ -.down-arrow { - background: url(../assets/down-arrow.svg) center center no-repeat; - background-size: cover; -} - -.popup { - box-shadow: 0px 12px 16px -4px rgba(16, 24, 40, 0.08), 0px 4px 6px -2px rgba(16, 24, 40, 0.03); - z-index: 10; -} \ No newline at end of file diff --git a/web/app/components/base/notion-page-selector/workspace-selector/index.tsx b/web/app/components/base/notion-page-selector/workspace-selector/index.tsx index 66227d4f4d..f83389f96c 100644 --- a/web/app/components/base/notion-page-selector/workspace-selector/index.tsx +++ b/web/app/components/base/notion-page-selector/workspace-selector/index.tsx @@ -2,9 +2,8 @@ import { useTranslation } from 'react-i18next' import { Fragment } from 'react' import { Menu, Transition } from '@headlessui/react' +import { RiArrowDownSLine } from '@remixicon/react' import NotionIcon from '../../notion-icon' -import s from './index.module.css' -import cn from '@/utils/classnames' import type { DataSourceNotionWorkspace } from '@/models/common' type WorkspaceSelectorProps = { @@ -25,15 +24,15 @@ export default function WorkspaceSelector({ { ({ open }) => ( <> - + -
{currentWorkspace?.workspace_name}
-
{currentWorkspace?.pages.length}
-
+
{currentWorkspace?.workspace_name}
+ {/*
{currentWorkspace?.pages.length}
*/} +
{ items.map(item => (
onSelect(item.workspace_id)} > -
{item.workspace_name}
-
+
{item.workspace_name}
+
{item.pages.length} {t('common.dataSource.notion.selector.pageSelected')}
diff --git a/web/app/components/base/search-input/index.tsx b/web/app/components/base/search-input/index.tsx index 556a7bdf49..bd8d4de32a 100644 --- a/web/app/components/base/search-input/index.tsx +++ b/web/app/components/base/search-input/index.tsx @@ -1,9 +1,8 @@ import type { FC } from 'react' import { useRef, useState } from 'react' import { useTranslation } from 'react-i18next' -import { RiSearchLine } from '@remixicon/react' +import { RiCloseCircleFill, RiSearchLine } from '@remixicon/react' import cn from '@/utils/classnames' -import { XCircle } from '@/app/components/base/icons/src/vender/solid/general' type SearchInputProps = { placeholder?: string @@ -27,22 +26,19 @@ const SearchInput: FC = ({ return (
-
= ({ setInternalValue('') }} > - +
)}
diff --git a/web/app/components/base/tag-management/selector.tsx b/web/app/components/base/tag-management/selector.tsx index 0e8a9dd8d8..fd6101d157 100644 --- a/web/app/components/base/tag-management/selector.tsx +++ b/web/app/components/base/tag-management/selector.tsx @@ -234,8 +234,8 @@ const TagSelector: FC = ({
- -
+ +
{!triggerContent ? t('common.tag.addTag') : triggerContent}
diff --git a/web/app/components/datasets/common/document-picker/index.tsx b/web/app/components/datasets/common/document-picker/index.tsx index 30690fca00..5ae95e1aff 100644 --- a/web/app/components/datasets/common/document-picker/index.tsx +++ b/web/app/components/datasets/common/document-picker/index.tsx @@ -78,7 +78,7 @@ const DocumentPicker: FC = ({
- {name || '--'} + {name || '--'}
diff --git a/web/app/components/datasets/create/embedding-process/index.tsx b/web/app/components/datasets/create/embedding-process/index.tsx index ead593d272..65de2c33e4 100644 --- a/web/app/components/datasets/create/embedding-process/index.tsx +++ b/web/app/components/datasets/create/embedding-process/index.tsx @@ -253,9 +253,9 @@ const EmbeddingProcess: FC = ({ datasetId, batchId, documents = [], index return ( <>
-
+
{isEmbedding &&
- + {t('datasetDocuments.embedding.processing')}
} {isEmbeddingCompleted && t('datasetDocuments.embedding.completed')} @@ -304,7 +304,7 @@ const EmbeddingProcess: FC = ({ datasetId, batchId, documents = [], index /> )}
-
+
{getSourceName(indexingStatusDetail.id)}
{ @@ -314,7 +314,7 @@ const EmbeddingProcess: FC = ({ datasetId, batchId, documents = [], index }
{isSourceEmbedding(indexingStatusDetail) && ( -
{`${getSourcePercent(indexingStatusDetail)}%`}
+
{`${getSourcePercent(indexingStatusDetail)}%`}
)} {indexingStatusDetail.indexing_status === 'error' && (
-
+
{t('datasetCreation.stepOne.filePreview')}
-
+
{getFileName(file)}.{file?.extension}
diff --git a/web/app/components/datasets/create/file-uploader/index.tsx b/web/app/components/datasets/create/file-uploader/index.tsx index 9cceb95f4d..c04444ce59 100644 --- a/web/app/components/datasets/create/file-uploader/index.tsx +++ b/web/app/components/datasets/create/file-uploader/index.tsx @@ -256,7 +256,7 @@ const FileUploader = ({ /> )} -
{t('datasetCreation.stepOne.uploader.title')}
+
{t('datasetCreation.stepOne.uploader.title')}
{!hideUpload && (
diff --git a/web/app/components/datasets/create/notion-page-preview/index.module.css b/web/app/components/datasets/create/notion-page-preview/index.module.css index 12d3747356..6f2e5d9fa5 100644 --- a/web/app/components/datasets/create/notion-page-preview/index.module.css +++ b/web/app/components/datasets/create/notion-page-preview/index.module.css @@ -1,54 +1,34 @@ .filePreview { - @apply flex flex-col border-l border-gray-200 shrink-0; - width: 528px; - background-color: #fcfcfd; - } - - .previewHeader { - @apply border-b border-gray-200 shrink-0; - margin: 42px 32px 0; - padding-bottom: 16px; - } - - .previewHeader .title { - display: flex; - justify-content: space-between; - align-items: center; - color: #101828; - font-weight: 600; - font-size: 18px; - line-height: 28px; - } - - .previewHeader .fileName { - display: flex; - align-items: center; - font-weight: 400; - font-size: 12px; - line-height: 18px; - color: #1D2939; - } - - .previewHeader .filetype { - color: #667085; - } - - .previewContent { - @apply overflow-y-auto grow; - padding: 20px 32px; - font-weight: 400; - font-size: 16px; - line-height: 24px; - color: #344054; - } - - .previewContent .loading { - width: 100%; - height: 180px; - background: #f9fafb center no-repeat url(../assets/Loading.svg); - background-size: contain; - } - .fileContent { - white-space: pre-line; - } + @apply flex flex-col border-l border-components-panel-border shrink-0 bg-background-default-lighter; + width: 528px; +} + +.previewHeader { + @apply border-b border-divider-subtle shrink-0; + margin: 42px 32px 0; + padding-bottom: 16px; +} + +.previewHeader .title { + @apply flex justify-between items-center text-text-primary; +} + +.previewHeader .fileName { + @apply flex items-center text-text-tertiary; +} + +.previewContent { + @apply overflow-y-auto grow text-text-secondary; + padding: 20px 32px; +} + +.previewContent .loading { + width: 100%; + height: 180px; + background: #f9fafb center no-repeat url(../assets/Loading.svg); + background-size: contain; +} +.fileContent { + white-space: pre-line; +} \ No newline at end of file diff --git a/web/app/components/datasets/create/notion-page-preview/index.tsx b/web/app/components/datasets/create/notion-page-preview/index.tsx index f658f213e8..32073719ca 100644 --- a/web/app/components/datasets/create/notion-page-preview/index.tsx +++ b/web/app/components/datasets/create/notion-page-preview/index.tsx @@ -46,13 +46,13 @@ const NotionPagePreview = ({ return (
-
+
{t('datasetCreation.stepOne.pagePreview')}
-
+
-
+
{loading &&
} {!loading && (
{previewContent}
diff --git a/web/app/components/datasets/create/step-one/index.module.css b/web/app/components/datasets/create/step-one/index.module.css index d479722904..4b5dfaa331 100644 --- a/web/app/components/datasets/create/step-one/index.module.css +++ b/web/app/components/datasets/create/step-one/index.module.css @@ -1,11 +1,5 @@ .stepHeader { - position: sticky; - top: 0; - left: 0; padding: 42px 64px 12px 0; - font-weight: 600; - font-size: 18px; - line-height: 28px; } .form { @@ -14,38 +8,22 @@ } .dataSourceItem { - @apply w-full box-border relative flex items-center p-3 h-14 bg-white rounded-xl cursor-pointer; - border: 0.5px solid #EAECF0; - box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05); - font-weight: 500; - font-size: 14px; - line-height: 20px; - color: #101828; + @apply w-full relative flex items-center p-3 h-14 bg-components-option-card-option-bg rounded-xl + cursor-pointer border border-components-option-card-option-border text-text-secondary; } .dataSourceItem:hover { - background-color: #f5f8ff; - border: 0.5px solid #B2CCFF; - box-shadow: 0px 12px 16px -4px rgba(16, 24, 40, 0.08), 0px 4px 6px -2px rgba(16, 24, 40, 0.03); + @apply bg-components-option-card-option-bg-hover border border-components-option-card-option-border-hover shadow-xs shadow-shadow-shadow-3; } .dataSourceItem.active { - background-color: #f5f8ff; - border: 1.5px solid #528BFF; - box-shadow: 0px 1px 3px rgba(16, 24, 40, 0.1), 0px 1px 2px rgba(16, 24, 40, 0.06); -} - -.dataSourceItem.disabled { - background-color: #f9fafb; - border: 0.5px solid #EAECF0; - box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05); - cursor: default; + @apply bg-components-option-card-option-selected-bg border border-components-option-card-option-selected-border + ring-[0.5px] ring-components-option-card-option-selected-border; } +.dataSourceItem.disabled, .dataSourceItem.disabled:hover { - background-color: #f9fafb; - border: 0.5px solid #EAECF0; - box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05); + @apply bg-components-option-card-option-bg border-[0.5px] border-components-option-card-option-border cursor-not-allowed text-text-disabled shadow-none; } .comingTag { @@ -64,17 +42,9 @@ } .datasetIcon { - @apply flex shrink-0 mr-2 w-8 h-8 rounded-lg bg-center bg-no-repeat; - background-color: #F5FAFF; + @apply flex shrink-0 mr-2 w-8 h-8 rounded-lg bg-center bg-no-repeat bg-text-primary-on-surface border-[0.5px] border-divider-regular backdrop-blur-sm; background-image: url(../assets/file.svg); background-size: 16px; - border: 0.5px solid #D1E9FF; -} - -.dataSourceItem:active .datasetIcon, -.dataSourceItem:hover .datasetIcon { - background-color: #F5F8FF; - border: 0.5px solid #E0EAFF; } .datasetIcon.notion { @@ -97,54 +67,7 @@ background-color: #eaecf0; } -.notionConnectionTip { - display: flex; - flex-direction: column; - align-items: flex-start; - padding: 24px; - width: 640px; - background: #F9FAFB; - border-radius: 16px; -} - .notionIcon { - display: flex; - padding: 12px; - width: 48px; - height: 48px; - background: #fff center no-repeat url(../assets/notion.svg); + background: var(--color-components-card-bg) center no-repeat url(../assets/notion.svg); background-size: 24px; - border: 0.5px solid #EAECF5; - box-shadow: 0px 12px 16px -4px rgba(16, 24, 40, 0.08), 0px 4px 6px -2px rgba(16, 24, 40, 0.03); - border-radius: 12px; -} - -.notionConnectionTip .title { - position: relative; - margin: 24px 0 4px; - font-style: normal; - font-weight: 600; - font-size: 16px; - line-height: 24px; - color: #374151; -} - -.notionConnectionTip .title::after { - content: ''; - position: absolute; - top: -6px; - right: -12px; - width: 16px; - height: 16px; - background: center no-repeat url(../assets/Icon-3-dots.svg); - background-size: contain; -} - -.notionConnectionTip .tip { - margin-bottom: 20px; - font-style: normal; - font-weight: 400; - font-size: 13px; - line-height: 18px; - color: #6B7280; } \ No newline at end of file diff --git a/web/app/components/datasets/create/step-one/index.tsx b/web/app/components/datasets/create/step-one/index.tsx index 629ed8b015..f2e9349b7e 100644 --- a/web/app/components/datasets/create/step-one/index.tsx +++ b/web/app/components/datasets/create/step-one/index.tsx @@ -19,6 +19,7 @@ import { useDatasetDetailContext } from '@/context/dataset-detail' import { useProviderContext } from '@/context/provider-context' import VectorSpaceFull from '@/app/components/billing/vector-space-full' import classNames from '@/utils/classnames' +import { Icon3Dots } from '@/app/components/base/icons/src/vender/line/others' type IStepOneProps = { datasetId?: string @@ -48,10 +49,15 @@ export const NotionConnector = ({ onSetting }: NotionConnectorProps) => { const { t } = useTranslation() return ( -
- -
{t('datasetCreation.stepOne.notionSyncTitle')}
-
{t('datasetCreation.stepOne.notionSyncTip')}
+
+ +
+ + {t('datasetCreation.stepOne.notionSyncTitle')} + + +
{t('datasetCreation.stepOne.notionSyncTip')}
+
) @@ -132,7 +138,9 @@ const StepOne = ({
{ shouldShowDataSourceTypeList && ( -
{t('datasetCreation.steps.one')}
+
+ {t('datasetCreation.steps.one')} +
) } { @@ -141,6 +149,7 @@ const StepOne = ({
-
{t('datasetCreation.stepThree.label')}
-
{datasetName || creationCache?.dataset?.name}
+
{t('datasetCreation.stepThree.label')}
+
{datasetName || creationCache?.dataset?.name}
diff --git a/web/app/components/datasets/create/step-two/index.tsx b/web/app/components/datasets/create/step-two/index.tsx index 65a8b474a3..249721f37a 100644 --- a/web/app/components/datasets/create/step-two/index.tsx +++ b/web/app/components/datasets/create/step-two/index.tsx @@ -581,7 +581,7 @@ const StepTwo = ({ return (
-
{t('datasetCreation.stepTwo.segmentation')}
+
{t('datasetCreation.stepTwo.segmentation')}
{((isInUpload && [ChunkingMode.text, ChunkingMode.qa].includes(currentDataset!.doc_form)) || isUploadInEmptyDataset || isInInit) @@ -832,10 +832,10 @@ const StepTwo = ({
} -
{t('datasetCreation.stepTwo.indexMode')}
+
{t('datasetCreation.stepTwo.indexMode')}
{(!hasSetIndexType || (hasSetIndexType && indexingType === IndexingType.QUALIFIED)) && ( - {t('datasetCreation.stepTwo.qualified')} @@ -889,7 +889,7 @@ const StepTwo = ({ placement={'top'} > - } @@ -916,11 +916,11 @@ const StepTwo = ({
{!hasSetIndexType && indexType === IndexingType.QUALIFIED && (
-
+
- {t('datasetCreation.stepTwo.highQualityTip')} + {t('datasetCreation.stepTwo.highQualityTip')}
)} {hasSetIndexType && indexType === IndexingType.ECONOMICAL && ( @@ -932,7 +932,7 @@ const StepTwo = ({ {/* Embedding model */} {indexType === IndexingType.QUALIFIED && (
-
{t('datasetSettings.form.embeddingModel')}
+
{t('datasetSettings.form.embeddingModel')}
{isModelAndRetrievalConfigDisabled && ( -
+
{t('datasetCreation.stepTwo.indexSettingTip')} {t('datasetCreation.stepTwo.datasetSettingLink')}
@@ -956,7 +956,7 @@ const StepTwo = ({ {!isModelAndRetrievalConfigDisabled ? (
-
{t('datasetSettings.form.retrievalSetting.title')}
+
{t('datasetSettings.form.retrievalSetting.title')}
{t('datasetSettings.form.retrievalSetting.learnMore')} {t('datasetSettings.form.retrievalSetting.longDescription')} @@ -964,7 +964,7 @@ const StepTwo = ({
) : ( -
+
{t('datasetSettings.form.retrievalSetting.title')}
)} diff --git a/web/app/components/datasets/create/step-two/option-card.tsx b/web/app/components/datasets/create/step-two/option-card.tsx index 57ed50d518..7a0f67850a 100644 --- a/web/app/components/datasets/create/step-two/option-card.tsx +++ b/web/app/components/datasets/create/step-two/option-card.tsx @@ -34,7 +34,7 @@ export const OptionCardHeader: FC = (props) => {
{title}
diff --git a/web/app/components/datasets/create/website/base/checkbox-with-label.tsx b/web/app/components/datasets/create/website/base/checkbox-with-label.tsx index d055a79490..b8b3746df0 100644 --- a/web/app/components/datasets/create/website/base/checkbox-with-label.tsx +++ b/web/app/components/datasets/create/website/base/checkbox-with-label.tsx @@ -25,7 +25,7 @@ const CheckboxWithLabel: FC = ({ return (