mirror of https://github.com/buster-so/buster.git
update packages
This commit is contained in:
Nate Kelley
parent
1fd5703a16
commit
71f4eea5f3
|
|
@ -19,17 +19,17 @@
|
|||
"@dnd-kit/core": "^6.3.1",
|
||||
"@dnd-kit/modifiers": "^9.0.0",
|
||||
"@dnd-kit/sortable": "^10.0.0",
|
||||
"@faker-js/faker": "^9.4.0",
|
||||
"@faker-js/faker": "^9.5.0",
|
||||
"@fluentui/react-context-selector": "^9.1.72",
|
||||
"@manufac/echarts-simple-transform": "^2.0.11",
|
||||
"@million/lint": "^1.0.14",
|
||||
"@monaco-editor/react": "^4.6.0",
|
||||
"@monaco-editor/react": "^4.7.0",
|
||||
"@supabase/auth-helpers-nextjs": "^0.10.0",
|
||||
"@supabase/auth-helpers-react": "^0.5.0",
|
||||
"@supabase/ssr": "^0.5.2",
|
||||
"@supabase/supabase-js": "^2.48.1",
|
||||
"@tanstack/react-query": "^5.65.1",
|
||||
"@vercel/speed-insights": "^1.1.0",
|
||||
"@tanstack/react-query": "^5.66.7",
|
||||
"@vercel/speed-insights": "^1.2.0",
|
||||
"ahooks": "^3.8.4",
|
||||
"antd": "5.23.3",
|
||||
"antd-style": "^3.7.1",
|
||||
|
|
@ -58,16 +58,16 @@
|
|||
"echarts-stat": "^1.2.0",
|
||||
"email-validator": "^2.0.4",
|
||||
"font-color-contrast": "^11.1.0",
|
||||
"framer-motion": "^12.0.6",
|
||||
"framer-motion": "^12.4.4",
|
||||
"html2canvas": "^1.4.1",
|
||||
"js-cookie": "^3.0.5",
|
||||
"jspdf": "^2.5.2",
|
||||
"jspdf-autotable": "^3.8.4",
|
||||
"jwt-decode": "^4.0.0",
|
||||
"material-symbols": "^0.28.1",
|
||||
"monaco-sql-languages": "^0.12.2",
|
||||
"material-symbols": "^0.28.2",
|
||||
"monaco-sql-languages": "^0.13.1",
|
||||
"monaco-themes": "^0.4.4",
|
||||
"monaco-yaml": "^5.2.3",
|
||||
"monaco-yaml": "^5.3.1",
|
||||
"mutative": "^1.1.0",
|
||||
"next": "14.2.22",
|
||||
"next-themes": "^0.4.4",
|
||||
|
|
@ -75,29 +75,25 @@
|
|||
"papaparse": "^5.5.2",
|
||||
"patternomaly": "^1.3.2",
|
||||
"pluralize": "^8.0.0",
|
||||
"posthog-js": "^1.212.0",
|
||||
"prettier": "^3.4.2",
|
||||
"posthog-js": "*",
|
||||
"prettier": "^3.5.1",
|
||||
"prettier-plugin-tailwindcss": "^0.6.11",
|
||||
"react": "^18",
|
||||
"react-chartjs-2": "^5.3.0",
|
||||
"react-data-grid": "^7.0.0-beta.47",
|
||||
"react-data-grid": "^7.0.0-beta.48",
|
||||
"react-dom": "^18",
|
||||
"react-hotkeys-hook": "^4.6.1",
|
||||
"react-icons": "^5.4.0",
|
||||
"react-icons": "^5.5.0",
|
||||
"react-markdown": "^9.0.3",
|
||||
"react-material-symbols": "^4.4.0",
|
||||
"react-monaco-editor": "^0.56.2",
|
||||
"react-scan": "^0.1.0",
|
||||
"react-monaco-editor": "^0.58.0",
|
||||
"react-scan": "^0.1.3",
|
||||
"react-syntax-highlighter": "^15.6.1",
|
||||
"react-type-animation": "^3.2.0",
|
||||
"react-use-websocket": "^4.11.1",
|
||||
"react-virtualized-auto-sizer": "^1.0.25",
|
||||
"react-window": "^1.8.11",
|
||||
"react-window-infinite-loader": "^1.0.10",
|
||||
"rehype-raw": "^7.0.0",
|
||||
"remark-gfm": "^4.0.0",
|
||||
"remark-gfm": "^4.0.1",
|
||||
"split-pane-react": "^0.1.3",
|
||||
"tailwind-merge": "^2.6.0",
|
||||
"tailwind-merge": "^3.0.1",
|
||||
"utility-types": "^3.11.0",
|
||||
"uuid": "^11.0.5",
|
||||
"virtua": "^0.40.0"
|
||||
|
|
|
|||
|
|
@ -3,7 +3,6 @@ import { AppMaterialIcons } from '@/components/icons';
|
|||
import { SelectProps, Select } from 'antd';
|
||||
import isEmpty from 'lodash/isEmpty';
|
||||
import React, { useMemo } from 'react';
|
||||
import { BsStars } from 'react-icons/bs';
|
||||
import { Text } from '@/components/text';
|
||||
import { useMemoizedFn } from 'ahooks';
|
||||
import { createStyles } from 'antd-style';
|
||||
|
|
@ -20,7 +19,7 @@ export const NewChatModalDataSourceSelect: React.FC<{
|
|||
() => ({
|
||||
label: (
|
||||
<div className="flex items-center space-x-1">
|
||||
<BsStars size={14} className={`min-w-[14px] ${styles.icon}`} />
|
||||
<AppMaterialIcons size={14} className={`min-w-[14px] ${styles.icon}`} icon="stars" />
|
||||
<span>Auto-select</span>
|
||||
</div>
|
||||
),
|
||||
|
|
|
|||
|
|
@ -1,211 +0,0 @@
|
|||
import React, { useEffect, useMemo, useRef, useState } from 'react';
|
||||
import { BusterListProps } from './interfaces';
|
||||
import { VariableSizeList as List } from 'react-window';
|
||||
import { useMemoizedFn } from 'ahooks';
|
||||
import { BusterListContentMenu } from './BusterListContentMenu';
|
||||
import AutoSizer from 'react-virtualized-auto-sizer';
|
||||
import { HEIGHT_OF_SECTION_ROW, HEIGHT_OF_ROW } from './config';
|
||||
import { getAllIdsInSection } from './helpers';
|
||||
import { BusterListHeader } from './BusterListHeader';
|
||||
import { BusterListRowComponentSelector } from './BusterListRowComponentSelector';
|
||||
|
||||
export const BusterListReactWindow: React.FC<BusterListProps> = ({
|
||||
columns,
|
||||
rows,
|
||||
selectedRowKeys,
|
||||
onSelectChange,
|
||||
emptyState,
|
||||
showHeader = true,
|
||||
contextMenu,
|
||||
showSelectAll = true,
|
||||
useRowClickSelectChange = false,
|
||||
rowClassName = ''
|
||||
}) => {
|
||||
const contextMenuRef = useRef<HTMLDivElement>(null);
|
||||
const containerRef = useRef<HTMLDivElement>(null);
|
||||
const showEmptyState = (!rows || rows.length === 0) && !!emptyState;
|
||||
|
||||
const [contextMenuPosition, setContextMenuPosition] = useState<{
|
||||
x: number;
|
||||
y: number;
|
||||
scrollYPosition: number;
|
||||
show: boolean;
|
||||
id: string;
|
||||
} | null>(null);
|
||||
|
||||
const onGlobalSelectChange = useMemoizedFn((v: boolean) => {
|
||||
onSelectChange?.(v ? rows.map((row) => row.id) : []);
|
||||
});
|
||||
|
||||
const onSelectSectionChange = useMemoizedFn((v: boolean, id: string) => {
|
||||
if (!onSelectChange) return;
|
||||
const idsInSection = getAllIdsInSection(rows, id);
|
||||
|
||||
if (v === false) {
|
||||
onSelectChange(selectedRowKeys?.filter((d) => !idsInSection.includes(d)) || []);
|
||||
} else {
|
||||
onSelectChange(selectedRowKeys?.concat(idsInSection) || []);
|
||||
}
|
||||
});
|
||||
|
||||
const onSelectChangePreflight = useMemoizedFn((v: boolean, id: string) => {
|
||||
if (!onSelectChange || !selectedRowKeys) return;
|
||||
if (v === false) {
|
||||
onSelectChange(selectedRowKeys?.filter((d) => d !== id));
|
||||
} else {
|
||||
onSelectChange(selectedRowKeys?.concat(id) || []);
|
||||
}
|
||||
});
|
||||
|
||||
const onContextMenuClick = useMemoizedFn((e: React.MouseEvent<HTMLDivElement>, id: string) => {
|
||||
if (!contextMenu) return;
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
const x = e.clientX - 5;
|
||||
const y = e.clientY - 5; // offset the top by 30px
|
||||
const menuWidth = 250; // width of the menu
|
||||
const menuHeight = 200; // height of the menu
|
||||
const pageWidth = window.innerWidth;
|
||||
const pageHeight = window.innerHeight;
|
||||
|
||||
// Ensure the menu does not render offscreen horizontally
|
||||
const adjustedX = Math.min(Math.max(0, x), pageWidth - menuWidth);
|
||||
// Ensure the menu does not render offscreen vertically, considering the offset
|
||||
const adjustedY = Math.min(Math.max(0, y), pageHeight - menuHeight);
|
||||
|
||||
setContextMenuPosition({
|
||||
x: adjustedX,
|
||||
y: adjustedY,
|
||||
show: true,
|
||||
id: id,
|
||||
scrollYPosition: window.scrollY
|
||||
});
|
||||
});
|
||||
|
||||
// const { run: onScrollListener } = useDebounceFn(
|
||||
// useMemoizedFn((e: React.UIEvent<HTMLDivElement>) => {
|
||||
// if (!contextMenu) return;
|
||||
// const newScrollY = (e.target as HTMLElement).scrollTop;
|
||||
// const scrollYDelta = newScrollY - scrollY.current;
|
||||
// const hasMoved50PixelsFromScrollYPosition =
|
||||
// Math.abs((contextMenuPosition?.scrollYPosition || 0) - newScrollY) > 35;
|
||||
// scrollY.current = newScrollY;
|
||||
// setContextMenuPosition((v) => ({
|
||||
// ...v!,
|
||||
// show: !!v?.show && !hasMoved50PixelsFromScrollYPosition,
|
||||
// y: (v?.y || 0) - scrollYDelta
|
||||
// }));
|
||||
// }),
|
||||
// { wait: 50 }
|
||||
// );
|
||||
|
||||
const itemSize = useMemoizedFn((index: number) => {
|
||||
const row = rows[index];
|
||||
return row.rowSection ? HEIGHT_OF_SECTION_ROW : HEIGHT_OF_ROW;
|
||||
});
|
||||
|
||||
const globalCheckStatus = useMemo(() => {
|
||||
if (!selectedRowKeys) return 'unchecked';
|
||||
if (selectedRowKeys.length === 0) return 'unchecked';
|
||||
if (selectedRowKeys.length === rows.length) return 'checked';
|
||||
return 'indeterminate';
|
||||
}, [selectedRowKeys?.length, rows.length]);
|
||||
|
||||
const itemData = useMemo(() => {
|
||||
return {
|
||||
columns,
|
||||
rows,
|
||||
selectedRowKeys,
|
||||
onSelectChange: onSelectChange ? onSelectChangePreflight : undefined,
|
||||
onSelectSectionChange: onSelectChange ? onSelectSectionChange : undefined,
|
||||
onContextMenuClick,
|
||||
useRowClickSelectChange
|
||||
};
|
||||
}, [
|
||||
columns,
|
||||
rows,
|
||||
useRowClickSelectChange,
|
||||
selectedRowKeys,
|
||||
onSelectChange,
|
||||
onSelectSectionChange,
|
||||
onContextMenuClick
|
||||
]);
|
||||
|
||||
//context menu click away
|
||||
useEffect(() => {
|
||||
if (contextMenu && contextMenuPosition?.show) {
|
||||
const listenForClickAwayFromContextMenu = (e: MouseEvent) => {
|
||||
if (!contextMenuRef.current?.contains(e.target as Node)) {
|
||||
setContextMenuPosition((v) => ({
|
||||
...v!,
|
||||
show: false
|
||||
}));
|
||||
}
|
||||
};
|
||||
document.addEventListener('click', listenForClickAwayFromContextMenu);
|
||||
return () => {
|
||||
document.removeEventListener('click', listenForClickAwayFromContextMenu);
|
||||
};
|
||||
}
|
||||
}, [contextMenuRef, contextMenuPosition?.show, contextMenu]);
|
||||
|
||||
return (
|
||||
<div
|
||||
className="list-container relative flex h-full w-full flex-col overflow-hidden"
|
||||
ref={containerRef}>
|
||||
{showHeader && !showEmptyState && (
|
||||
<BusterListHeader
|
||||
columns={columns}
|
||||
onGlobalSelectChange={onSelectChange ? onGlobalSelectChange : undefined}
|
||||
globalCheckStatus={globalCheckStatus}
|
||||
rowsLength={rows.length}
|
||||
showSelectAll={showSelectAll}
|
||||
rowClassName={rowClassName}
|
||||
/>
|
||||
)}
|
||||
|
||||
{!showEmptyState && (
|
||||
<div className="relative h-full w-full">
|
||||
<AutoSizer>
|
||||
{({ height, width }) => (
|
||||
<List
|
||||
height={height}
|
||||
width={width}
|
||||
estimatedItemSize={HEIGHT_OF_ROW}
|
||||
overscanCount={10}
|
||||
itemData={itemData}
|
||||
itemSize={itemSize}
|
||||
itemCount={rows.length}>
|
||||
{({ index, style, data }) => (
|
||||
<BusterListRowComponentSelector
|
||||
style={style}
|
||||
row={rows[index]}
|
||||
id={rows[index].id}
|
||||
isLastChild={index === rows.length - 1}
|
||||
{...data}
|
||||
/>
|
||||
)}
|
||||
</List>
|
||||
)}
|
||||
</AutoSizer>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{showEmptyState && (
|
||||
<div className="flex h-full items-center justify-center">{emptyState}</div>
|
||||
)}
|
||||
|
||||
{contextMenu && contextMenuPosition?.id && (
|
||||
<BusterListContentMenu
|
||||
ref={contextMenuRef}
|
||||
open={!!contextMenuPosition?.show}
|
||||
menu={contextMenu}
|
||||
id={contextMenuPosition?.id || ''}
|
||||
placement={{ x: contextMenuPosition?.x || 0, y: contextMenuPosition?.y || 0 }}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
BusterListReactWindow.displayName = 'BusterListReactWindow';
|
||||
// Add a memoized checkbox component
|
||||
Loading…
Reference in New Issue