update drag and drop logic for dashboard

This commit is contained in:
Nate Kelley 2025-04-02 09:19:29 -06:00
parent b0699bf5be
commit c85d51b7d2
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
8 changed files with 9 additions and 96 deletions

View File

@ -1,47 +0,0 @@
'use client';
import React from 'react';
import { FileIndeterminateLoader } from '@/components/features/FileIndeterminateLoader';
import { DashboardFileView, useChatLayoutContextSelector } from '@/layouts/ChatLayout';
import { DashboardViewComponents } from './config';
import { useGetDashboard } from '@/api/buster_rest/dashboards';
import { useDashboardContentStore } from '@/context/Dashboards';
import { AddToDashboardModal } from '@/components/features/modal/AddToDashboardModal';
import { canEdit } from '@/lib/share';
export const DashboardController: React.FC<{ dashboardId: string }> = ({ dashboardId }) => {
const { isFetched: isFetchedDashboard, data: permission } = useGetDashboard(
{ id: dashboardId },
(x) => x.permission
);
const chatId = useChatLayoutContextSelector((x) => x.chatId);
const selectedFileView = useChatLayoutContextSelector((x) => x.selectedFileView) || 'dashboard';
const isEditor = canEdit(permission);
const Component =
selectedFileView && isFetchedDashboard && selectedFileView in DashboardViewComponents
? DashboardViewComponents[selectedFileView as DashboardFileView]
: () => null;
return (
<>
{!isFetchedDashboard && <FileIndeterminateLoader />}
<Component dashboardId={dashboardId} readOnly={!isEditor} chatId={chatId} />
{isEditor && <MemoizedAddToDashboardModal dashboardId={dashboardId} />}
</>
);
};
const MemoizedAddToDashboardModal = React.memo(({ dashboardId }: { dashboardId: string }) => {
const { openAddContentModal, onCloseAddContentModal } = useDashboardContentStore();
return (
<AddToDashboardModal
open={openAddContentModal}
onClose={onCloseAddContentModal}
dashboardId={dashboardId}
/>
);
});
MemoizedAddToDashboardModal.displayName = 'MemoizedAddToDashboardModal';

View File

@ -39,11 +39,8 @@ export const MetricTitle: React.FC<{
});
return (
<Link className="flex" href={metricLink} prefetch>
<div
{...attributes}
{...listeners}
className={'flex cursor-pointer flex-col space-y-0.5 overflow-hidden'}>
<Link className="flex" href={metricLink} prefetch {...attributes} {...listeners}>
<div className={'flex cursor-pointer flex-col space-y-0.5 overflow-hidden'}>
<div className="flex w-full justify-between space-x-0.5 overflow-hidden">
<Title
as="h4"

View File

@ -1,6 +1,5 @@
import { useDebounceFn, useMemoizedFn } from '@/hooks';
import { EditableTitle } from '@/components/ui/typography/EditableTitle';
import { Input } from '@/components/ui/inputs';
import React from 'react';
import { type useUpdateDashboard } from '@/api/buster_rest/dashboards';
import { InputTextArea } from '@/components/ui/inputs/InputTextArea';

View File

@ -1,6 +1,5 @@
'use client';
import { DashboardViewProps } from '../config';
import React from 'react';
import { DashboardEditTitles } from './DashboardEditTitle';
import { DashboardContentController } from './DashboardContentController';
@ -11,12 +10,13 @@ import {
} from '@/api/buster_rest/dashboards';
import { useDashboardContentStore } from '@/context/Dashboards';
import { ScrollArea } from '@/components/ui/scroll-area';
import { canEdit } from '@/lib/share';
export const DashboardViewDashboardController: React.FC<DashboardViewProps> = ({
dashboardId,
chatId,
readOnly = false
}) => {
export const DashboardViewDashboardController: React.FC<{
dashboardId: string;
chatId: string | undefined;
readOnly?: boolean;
}> = ({ dashboardId, chatId, readOnly: readOnlyProp = false }) => {
const { data: dashboardResponse } = useGetDashboard({ id: dashboardId });
const { mutateAsync: onUpdateDashboard } = useUpdateDashboard();
const { mutateAsync: onUpdateDashboardConfig } = useUpdateDashboardConfig();
@ -24,6 +24,7 @@ export const DashboardViewDashboardController: React.FC<DashboardViewProps> = ({
const metrics = dashboardResponse?.metrics;
const dashboard = dashboardResponse?.dashboard;
const readOnly = readOnlyProp || !canEdit(dashboardResponse?.permission);
return (
<ScrollArea className="h-full">

View File

@ -1,15 +0,0 @@
import type { DashboardFileView } from '@/layouts/ChatLayout';
import { DashboardViewDashboardController } from './DashboardViewDashboardController';
import { DashboardViewFileController } from './DashboardViewFileController';
import React from 'react';
export interface DashboardViewProps {
dashboardId: string;
chatId: string | undefined;
readOnly?: boolean;
}
export const DashboardViewComponents: Record<DashboardFileView, React.FC<DashboardViewProps>> = {
dashboard: DashboardViewDashboardController,
file: DashboardViewFileController
};

View File

@ -1 +0,0 @@
export * from './DashboardController';

View File

@ -1,20 +0,0 @@
import { BusterMetricData, BusterChartConfigProps } from '@/api/asset_interfaces/metric';
import isEmpty from 'lodash/isEmpty';
import { isNumericColumnType } from '../messages';
export const canEditChart = (
metricId: string | undefined | null,
isFetchedMetricData: boolean,
metricData: BusterMetricData | undefined,
columnLabelFormats: BusterChartConfigProps['columnLabelFormats']
): boolean => {
return (
!!metricId &&
!isFetchedMetricData &&
!isEmpty(metricData?.data) &&
!columnLabelFormats &&
!!Object.values(columnLabelFormats! || {}).some((column) =>
isNumericColumnType(column.columnType)
)
);
};

View File

@ -1,4 +1,3 @@
export * from './resolve';
export * from './canEditChart';
export * from './upgradeToIMetric';
export * from './saveToServerHelpers';