+
);
}
diff --git a/web/src/pages/datasets/index.tsx b/web/src/pages/datasets/index.tsx
index 558243aeaca..2e6d188f8da 100644
--- a/web/src/pages/datasets/index.tsx
+++ b/web/src/pages/datasets/index.tsx
@@ -1,12 +1,7 @@
+import ListFilterBar from '@/components/list-filter-bar';
import { Button } from '@/components/ui/button';
import { Card, CardContent } from '@/components/ui/card';
-import {
- ChevronRight,
- Filter,
- MoreHorizontal,
- Plus,
- Search,
-} from 'lucide-react';
+import { ChevronRight, MoreHorizontal, Plus } from 'lucide-react';
const datasets = [
{
@@ -86,17 +81,10 @@ const datasets = [
export default function Datasets() {
return (
-
-
Datasets
-
-
-
-
-
-
+
+
+ Create dataset
+
{datasets.map((dataset) => (
{
- const { searchString, handleInputChange } = useSearchKnowledge();
- const { loading, list: data } = useNextFetchKnowledgeList();
- const list = data.filter((x) => x.name.includes(searchString));
const { data: userInfo } = useFetchUserInfo();
const { t } = useTranslation('translation', { keyPrefix: 'knowledgeList' });
const {
@@ -22,9 +30,23 @@ const KnowledgeList = () => {
onCreateOk,
loading: creatingLoading,
} = useSaveKnowledge();
+ const {
+ fetchNextPage,
+ data,
+ hasNextPage,
+ searchString,
+ handleInputChange,
+ loading,
+ } = useInfiniteFetchKnowledgeList();
+ console.log('🚀 ~ KnowledgeList ~ data:', data);
+ const nextList = data?.pages?.flatMap((x) => x.kbs) ?? [];
+
+ const total = useMemo(() => {
+ return data?.pages.at(-1).total ?? 0;
+ }, [data?.pages]);
return (
-
+
@@ -53,21 +75,30 @@ const KnowledgeList = () => {
- }
+ endMessage={total && {t('noMoreData')} 🤐}
+ scrollableTarget="scrollableDiv"
>
- {list.length > 0 ? (
- list.map((item: any) => {
- return (
-
- );
- })
- ) : (
-
- )}
-
+
+ {nextList?.length > 0 ? (
+ nextList.map((item: any) => {
+ return (
+
+ );
+ })
+ ) : (
+
+ )}
+
+
{
{item.name}
-
{item.description}
+
{item.description}
diff --git a/web/src/utils/file-util.ts b/web/src/utils/file-util.ts
index 8a61217bf33..02529427feb 100644
--- a/web/src/utils/file-util.ts
+++ b/web/src/utils/file-util.ts
@@ -5,7 +5,41 @@ export const transformFile2Base64 = (val: any): Promise
=> {
const reader = new FileReader();
reader.readAsDataURL(val);
reader.onload = (): void => {
- resolve(reader.result);
+ // Create image object
+ const img = new Image();
+ img.src = reader.result as string;
+
+ img.onload = () => {
+ // Create canvas
+ const canvas = document.createElement('canvas');
+ const ctx = canvas.getContext('2d');
+
+ // Calculate compressed dimensions, set max width/height to 800px
+ let width = img.width;
+ let height = img.height;
+ const maxSize = 100;
+
+ if (width > height && width > maxSize) {
+ height = (height * maxSize) / width;
+ width = maxSize;
+ } else if (height > maxSize) {
+ width = (width * maxSize) / height;
+ height = maxSize;
+ }
+
+ // Set canvas dimensions
+ canvas.width = width;
+ canvas.height = height;
+
+ // Draw image
+ ctx?.drawImage(img, 0, 0, width, height);
+
+ // Convert to base64, maintain original format and transparency
+ const compressedBase64 = canvas.toDataURL('image/png');
+ resolve(compressedBase64);
+ };
+
+ img.onerror = reject;
};
reader.onerror = reject;
});
@@ -15,6 +49,7 @@ export const transformBase64ToFile = (
dataUrl: string,
filename: string = 'file',
) => {
+ console.log('transformBase64ToFile', dataUrl);
let arr = dataUrl.split(','),
bstr = atob(arr[1]),
n = bstr.length,
@@ -30,6 +65,7 @@ export const transformBase64ToFile = (
};
export const normFile = (e: any) => {
+ console.log('normFile', e);
if (Array.isArray(e)) {
return e;
}
@@ -37,6 +73,7 @@ export const normFile = (e: any) => {
};
export const getUploadFileListFromBase64 = (avatar: string) => {
+ console.log('getUploadFileListFromBase64', avatar);
let fileList: UploadFile[] = [];
if (avatar) {
@@ -47,6 +84,7 @@ export const getUploadFileListFromBase64 = (avatar: string) => {
};
export const getBase64FromUploadFileList = async (fileList?: UploadFile[]) => {
+ console.log('getBase64FromUploadFileList', fileList);
if (Array.isArray(fileList) && fileList.length > 0) {
const file = fileList[0];
const originFileObj = file.originFileObj;
@@ -71,6 +109,7 @@ export const downloadFile = ({
filename?: string;
target?: string;
}) => {
+ console.log('downloadFile', url);
const downloadElement = document.createElement('a');
downloadElement.style.display = 'none';
downloadElement.href = url;
@@ -89,6 +128,7 @@ export const downloadFile = ({
const Units = ['bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
export const formatBytes = (x: string | number) => {
+ console.log('formatBytes', x);
let l = 0,
n = (typeof x === 'string' ? parseInt(x, 10) : x) || 0;
diff --git a/web/tailwind.config.js b/web/tailwind.config.js
index d7641ca0062..1d6a15d70c3 100644
--- a/web/tailwind.config.js
+++ b/web/tailwind.config.js
@@ -33,6 +33,7 @@ module.exports = {
'colors-text-core-standard': 'var(--colors-text-core-standard)',
'colors-text-neutral-strong': 'var(--colors-text-neutral-strong)',
'colors-text-neutral-standard': 'var(--colors-text-neutral-standard)',
+ 'colors-text-functional-danger': 'var(--colors-text-functional-danger)',
primary: {
DEFAULT: 'hsl(var(--primary))',
diff --git a/web/tailwind.css b/web/tailwind.css
index a8dd5a7c299..cb16f6b70b7 100644
--- a/web/tailwind.css
+++ b/web/tailwind.css
@@ -46,6 +46,7 @@
--colors-text-core-standard: rgba(127, 105, 255, 1);
--colors-text-neutral-strong: rgb(130, 121, 121);
--colors-text-neutral-standard: rgba(230, 227, 246, 1);
+ --colors-text-functional-danger: rgba(255, 81, 81, 1);
}
.dark {
@@ -122,6 +123,7 @@
--colors-text-core-standard: rgba(137, 126, 255, 1);
--colors-text-neutral-strong: rgba(255, 255, 255, 1);
--colors-text-neutral-standard: rgba(230, 227, 246, 1);
+ --colors-text-functional-danger: rgba(255, 81, 81, 1);
}
}