Ling0925
/
buster
mirror of https://github.com/buster-so/buster.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

abstract dataset provider away

This commit is contained in:
Nate Kelley 2025-02-13 16:16:03 -07:00
parent 692f3d36ad
commit b0519d4625
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
4 changed files with 79 additions and 83 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
web/src/app/app/datasets/DatasetsPageContent.tsx
View File

@ -6,10 +6,12 @@ import { useUserConfigContextSelector } from '@/context/Users';
import { useMemo, useState } from 'react'; import { useMemo, useState } from 'react';
import { DatasetListContent } from './_DatasetListContent'; import { DatasetListContent } from './_DatasetListContent';
import { DatasetHeader } from './_DatasetsHeader'; import { DatasetHeader } from './_DatasetsHeader';
import { NewDatasetModal } from '../_components/NewDatasetModal';
export const DatasetsPageContent: React.FC<{}> = ({}) => { export const DatasetsPageContent: React.FC<{}> = ({}) => {
const isAdmin = useUserConfigContextSelector((state) => state.isAdmin); const isAdmin = useUserConfigContextSelector((state) => state.isAdmin);
const [datasetFilter, setDatasetFilter] = useState<'all' | 'published' | 'drafts'>('all'); const [datasetFilter, setDatasetFilter] = useState<'all' | 'published' | 'drafts'>('all');
const [openDatasetModal, setOpenDatasetModal] = useState<boolean>(false);
const datasetsParams: Parameters<typeof useGetDatasets>[0] = useMemo(() => { const datasetsParams: Parameters<typeof useGetDatasets>[0] = useMemo(() => {
if (datasetFilter === 'drafts') { if (datasetFilter === 'drafts') {
@ -35,12 +37,20 @@ export const DatasetsPageContent: React.FC<{}> = ({}) => {
return ( return (
<> <>
<DatasetHeader datasetFilter={datasetFilter} setDatasetFilter={setDatasetFilter} /> <DatasetHeader
datasetFilter={datasetFilter}
setDatasetFilter={setDatasetFilter}
openNewDatasetModal={openDatasetModal}
setOpenNewDatasetModal={setOpenDatasetModal}
/>
<DatasetListContent <DatasetListContent
datasetsList={datasetsList || []} datasetsList={datasetsList || []}
isFetchedDatasets={isFetchedDatasets} isFetchedDatasets={isFetchedDatasets}
isAdmin={isAdmin} isAdmin={isAdmin}
setOpenNewDatasetModal={setOpenDatasetModal}
/> />
<NewDatasetModal open={openDatasetModal} onClose={() => setOpenDatasetModal(false)} />
</> </>
); );
}; };

6
web/src/app/app/datasets/_DatasetListContent.tsx
View File

@ -8,7 +8,6 @@ import { BusterList, BusterListColumn, BusterListRow } from '@/components/list';
import { BusterRoutes, createBusterRoute } from '@/routes'; import { BusterRoutes, createBusterRoute } from '@/routes';
import type { BusterDatasetListItem } from '@/api/asset_interfaces'; import type { BusterDatasetListItem } from '@/api/asset_interfaces';
import { ListEmptyStateWithButton } from '../../../components/list'; import { ListEmptyStateWithButton } from '../../../components/list';
import { useDatasetContextSelector } from '@/context/Datasets';
import { useMemoizedFn } from 'ahooks'; import { useMemoizedFn } from 'ahooks';
import { DatasetSelectedOptionPopup } from './_DatasetSelectedPopup'; import { DatasetSelectedOptionPopup } from './_DatasetSelectedPopup';
@ -60,9 +59,8 @@ export const DatasetListContent: React.FC<{
datasetsList: BusterDatasetListItem[]; datasetsList: BusterDatasetListItem[];
isFetchedDatasets: boolean; isFetchedDatasets: boolean;
isAdmin: boolean; isAdmin: boolean;
}> = React.memo(({ datasetsList, isFetchedDatasets, isAdmin }) => { setOpenNewDatasetModal: (open: boolean) => void;
const setOpenNewDatasetModal = useDatasetContextSelector((state) => state.setOpenNewDatasetModal); }> = React.memo(({ datasetsList, isFetchedDatasets, isAdmin, setOpenNewDatasetModal }) => {
const [selectedRowKeys, setSelectedRowKeys] = useState<string[]>([]); const [selectedRowKeys, setSelectedRowKeys] = useState<string[]>([]);
const rows: BusterListRow[] = useMemo(() => { const rows: BusterListRow[] = useMemo(() => {

132
web/src/app/app/datasets/_DatasetsHeader.tsx
View File

@ -1,13 +1,13 @@
'use client'; 'use client';
import React, { useMemo } from 'react'; import React, { useMemo, useState } from 'react';
import { Breadcrumb, Button } from 'antd'; import { Breadcrumb, Button } from 'antd';
import Link from 'next/link'; import Link from 'next/link';
import { BusterRoutes, createBusterRoute } from '@/routes'; import { BusterRoutes, createBusterRoute } from '@/routes';
import { AppMaterialIcons, AppSegmented, AppTooltip } from '@/components'; import { AppMaterialIcons, AppSegmented, AppTooltip } from '@/components';
import { NewDatasetModal } from '@appComponents/NewDatasetModal'; import { NewDatasetModal } from '@appComponents/NewDatasetModal';
import { AppContentHeader } from '../../../components/layout/AppContentHeader'; import { AppContentHeader } from '../../../components/layout/AppContentHeader';
import { useDatasetContextSelector, useIndividualDataset } from '@/context/Datasets'; import { useIndividualDataset } from '@/context/Datasets';
import { useHotkeys } from 'react-hotkeys-hook'; import { useHotkeys } from 'react-hotkeys-hook';
import { useUserConfigContextSelector } from '@/context/Users'; import { useUserConfigContextSelector } from '@/context/Users';
import { useMemoizedFn } from 'ahooks'; import { useMemoizedFn } from 'ahooks';
@ -15,79 +15,75 @@ import { useMemoizedFn } from 'ahooks';
export const DatasetHeader: React.FC<{ export const DatasetHeader: React.FC<{
datasetFilter: 'all' | 'published' | 'drafts'; datasetFilter: 'all' | 'published' | 'drafts';
setDatasetFilter: (filter: 'all' | 'published' | 'drafts') => void; setDatasetFilter: (filter: 'all' | 'published' | 'drafts') => void;
}> = React.memo(({ datasetFilter, setDatasetFilter }) => { datasetId?: string;
const openedDatasetId = useDatasetContextSelector((state) => state.openedDatasetId); setOpenNewDatasetModal: (open: boolean) => void;
const openNewDatasetModal = useDatasetContextSelector((state) => state.openNewDatasetModal); openNewDatasetModal: boolean;
const setOpenNewDatasetModal = useDatasetContextSelector((state) => state.setOpenNewDatasetModal); }> = React.memo(
const isAdmin = useUserConfigContextSelector((state) => state.isAdmin); ({ datasetFilter, setDatasetFilter, datasetId, setOpenNewDatasetModal, openNewDatasetModal }) => {
const { dataset } = useIndividualDataset({ datasetId: openedDatasetId }); const isAdmin = useUserConfigContextSelector((state) => state.isAdmin);
const datasetTitle = dataset?.data?.name || 'Datasets'; const { dataset } = useIndividualDataset({ datasetId: datasetId || '' });
const datasetTitle = dataset?.data?.name || 'Datasets';
const breadcrumbItems = useMemo( const breadcrumbItems = useMemo(
() => () =>
[ [
{ {
title: ( title: (
<Link <Link
suppressHydrationWarning suppressHydrationWarning
href={ href={
openedDatasetId datasetId
? createBusterRoute({ ? createBusterRoute({
route: BusterRoutes.APP_DATASETS_ID_OVERVIEW, route: BusterRoutes.APP_DATASETS_ID_OVERVIEW,
datasetId: openedDatasetId datasetId: datasetId
}) })
: createBusterRoute({ route: BusterRoutes.APP_DATASETS }) : createBusterRoute({ route: BusterRoutes.APP_DATASETS })
}> }>
{datasetTitle} {datasetTitle}
</Link> </Link>
) )
} }
].filter((item) => item.title), ].filter((item) => item.title),
[openedDatasetId, datasetTitle] [datasetId, datasetTitle]
); );
const onCloseNewDatasetModal = useMemoizedFn(() => { const onCloseNewDatasetModal = useMemoizedFn(() => {
setOpenNewDatasetModal(false); setOpenNewDatasetModal(false);
}); });
const onOpenNewDatasetModal = useMemoizedFn(() => { const onOpenNewDatasetModal = useMemoizedFn(() => {
setOpenNewDatasetModal(true); setOpenNewDatasetModal(true);
}); });
useHotkeys('d', onOpenNewDatasetModal); useHotkeys('d', onOpenNewDatasetModal);
return ( return (
<> <>
<AppContentHeader className="items-center justify-between space-x-2"> <AppContentHeader className="items-center justify-between space-x-2">
<div className="flex space-x-3"> <div className="flex space-x-3">
<Breadcrumb className="flex items-center" items={breadcrumbItems} /> <Breadcrumb className="flex items-center" items={breadcrumbItems} />
<DatasetFilters datasetFilter={datasetFilter} setDatasetFilter={setDatasetFilter} /> <DatasetFilters datasetFilter={datasetFilter} setDatasetFilter={setDatasetFilter} />
</div> </div>
<div className="flex items-center"> <div className="flex items-center">
{isAdmin && ( {isAdmin && (
<AppTooltip title={'Create new dashboard'} shortcuts={['D']}> <AppTooltip title={'Create new dashboard'} shortcuts={['D']}>
<Button <Button
type="default" type="default"
icon={<AppMaterialIcons icon="add" />} icon={<AppMaterialIcons icon="add" />}
onClick={onOpenNewDatasetModal}> onClick={onOpenNewDatasetModal}>
New Dataset New Dataset
</Button> </Button>
</AppTooltip> </AppTooltip>
)} )}
</div> </div>
</AppContentHeader> </AppContentHeader>
{isAdmin && ( {isAdmin && <NewDatasetModal open={openNewDatasetModal} onClose={onCloseNewDatasetModal} />}
<NewDatasetModal </>
open={openNewDatasetModal} );
onClose={onCloseNewDatasetModal} }
datasourceId={openedDatasetId} );
/>
)}
</>
);
});
DatasetHeader.displayName = 'DatasetHeader'; DatasetHeader.displayName = 'DatasetHeader';
const DatasetFilters: React.FC<{ const DatasetFilters: React.FC<{

12
web/src/context/Datasets/DatasetProvider.tsx
View File

@ -1,5 +1,4 @@
import React, { PropsWithChildren, useState } from 'react'; import React, { PropsWithChildren } from 'react';
import { useParams } from 'next/navigation';
import { import {
ContextSelector, ContextSelector,
createContext, createContext,
@ -7,14 +6,7 @@ import {
} from '@fluentui/react-context-selector'; } from '@fluentui/react-context-selector';
export const useDatasets = () => { export const useDatasets = () => {
const { openedDatasetId } = useParams<{ openedDatasetId: string }>(); return {};
const [openNewDatasetModal, setOpenNewDatasetModal] = useState(false);
return {
openedDatasetId,
openNewDatasetModal,
setOpenNewDatasetModal
};
}; };
const BusterDatasets = createContext<ReturnType<typeof useDatasets>>( const BusterDatasets = createContext<ReturnType<typeof useDatasets>>(