make dynamic imports for sidebar items

This commit is contained in:
Nate Kelley 2025-03-26 00:01:39 -06:00
parent f8f6bc7a8c
commit b010fbd0e5
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
13 changed files with 16 additions and 67 deletions

View File

@ -6,7 +6,7 @@ import { DashboardViewDashboardController } from '@/controllers/DashboardControl
export default function EmbedDashboardsPage(props: { params: { dashboardId: string } }) {
const { dashboardId } = props.params;
const { isFetched: isFetchedDashboard } = useGetDashboard(dashboardId);
const { isFetched: isFetchedDashboard } = useGetDashboard({ id: dashboardId });
if (!isFetchedDashboard) {
return <CircleSpinnerLoaderContainer className="min-h-screen" />;

View File

@ -7,7 +7,7 @@ import { getShareAssetConfig } from '../ShareMenu/helpers';
import { getIsEffectiveOwner } from '@/lib/share';
export const ShareDashboardButton = React.memo(({ dashboardId }: { dashboardId: string }) => {
const { data: dashboardResponse } = useGetDashboard(dashboardId, getShareAssetConfig);
const { data: dashboardResponse } = useGetDashboard({ id: dashboardId }, getShareAssetConfig);
const isEffectiveOwner = getIsEffectiveOwner(dashboardResponse?.permission);
if (!isEffectiveOwner) {

View File

@ -11,7 +11,7 @@ export const AddToDashboardModal: React.FC<{
onClose: () => void;
dashboardId: string;
}> = React.memo(({ open, onClose, dashboardId }) => {
const { data: dashboard, isFetched: isFetchedDashboard } = useGetDashboard(dashboardId);
const { data: dashboard, isFetched: isFetchedDashboard } = useGetDashboard({ id: dashboardId });
const { data: metrics, isFetched: isFetchedMetrics } = useGetMetricsList({});
const { mutateAsync: addAndRemoveMetricsFromDashboard } = useAddAndRemoveMetricsFromDashboard();

View File

@ -11,7 +11,7 @@ import { canEdit } from '@/lib/share';
export const DashboardController: React.FC<{ dashboardId: string }> = ({ dashboardId }) => {
const { isFetched: isFetchedDashboard, data: permission } = useGetDashboard(
dashboardId,
{ id: dashboardId },
(x) => x.permission
);
const selectedFileView = useChatLayoutContextSelector((x) => x.selectedFileView) || 'dashboard';

View File

@ -16,7 +16,7 @@ export const DashboardViewDashboardController: React.FC<DashboardViewProps> = ({
dashboardId,
readOnly = false
}) => {
const { data: dashboardResponse } = useGetDashboard(dashboardId);
const { data: dashboardResponse } = useGetDashboard({ id: dashboardId });
const { mutateAsync: onUpdateDashboard } = useUpdateDashboard();
const { mutateAsync: onUpdateDashboardConfig } = useUpdateDashboardConfig();
const onOpenAddContentModal = useDashboardContentStore((x) => x.onOpenAddContentModal);

View File

@ -8,7 +8,7 @@ import { useGetDashboard, useUpdateDashboard } from '@/api/buster_rest/dashboard
export const DashboardViewFileController: React.FC<DashboardViewProps> = React.memo(
({ dashboardId }) => {
const { data: dashboard } = useGetDashboard(dashboardId, (data) => data.dashboard);
const { data: dashboard } = useGetDashboard({ id: dashboardId }, (data) => data.dashboard);
const { openSuccessMessage } = useBusterNotifications();
const { mutateAsync: onUpdateDashboard } = useUpdateDashboard();

View File

@ -1 +1,5 @@
export * from './MetricEditController';
import { MetricEditController } from './MetricEditController';
export default MetricEditController;

View File

@ -1,52 +0,0 @@
'use client';
import React, { useMemo, useRef } from 'react';
import type { MetricViewProps } from '../config';
import { AppSplitter, AppSplitterRef } from '@/components/ui/layouts';
import { MetricViewChart } from './MetricViewChart';
import { MetricEditController } from './MetricEditController';
import { useMetricLayout } from '../useMetricLayout';
import { useChatLayoutContextSelector } from '@/layouts/ChatLayout';
import { VersionHistoryPanel } from '@/components/features/versionHistory';
const autoSaveId = 'metric-edit-chart';
export const MetricViewChartController: React.FC<MetricViewProps> = React.memo(({ metricId }) => {
const appSplitterRef = useRef<AppSplitterRef>(null);
const selectedFileViewSecondary = useChatLayoutContextSelector(
(x) => x.selectedFileViewSecondary
);
const { renderSecondary, defaultLayout } = useMetricLayout({
selectedFileViewSecondary,
appSplitterRef,
autoSaveId,
type: 'chart'
});
const RightChildren = useMemo(() => {
if (!renderSecondary) return null;
if (selectedFileViewSecondary === 'chart-edit')
return <MetricEditController metricId={metricId} />;
if (selectedFileViewSecondary === 'version-history')
return <VersionHistoryPanel assetId={metricId} type="metric" />;
return null;
}, [renderSecondary, metricId]);
return (
<AppSplitter
ref={appSplitterRef}
initialReady={false}
leftChildren={<MetricViewChart metricId={metricId} />}
rightChildren={RightChildren}
rightHidden={!renderSecondary}
autoSaveId={autoSaveId}
defaultLayout={defaultLayout}
preserveSide={'right'}
rightPanelMinSize={250}
rightPanelMaxSize={360}
/>
);
});
MetricViewChartController.displayName = 'MetricViewChartController';

View File

@ -1,2 +1 @@
export * from './MetricViewChartController';
export * from './MetricViewChart';

View File

@ -1,6 +1,5 @@
import React from 'react';
import type { MetricFileView } from '@/layouts/ChatLayout';
import { MetricViewChartController } from './MetricViewChart';
import { MetricViewFile } from './MetricViewFile';
import { MetricViewResults } from './MetricViewResults';
import { MetricViewChart } from './MetricViewChart';

View File

@ -43,7 +43,7 @@ const SaveToCollectionButton = React.memo(() => {
SaveToCollectionButton.displayName = 'SaveToCollectionButton';
const AddContentToDashboardButton = React.memo(({ dashboardId }: { dashboardId: string }) => {
const { data: permission } = useGetDashboard(dashboardId, (x) => x.permission);
const { data: permission } = useGetDashboard({ id: dashboardId }, (x) => x.permission);
const isEditor = canEdit(permission);
const onOpenAddContentModal = useDashboardContentStore((x) => x.onOpenAddContentModal);

View File

@ -44,7 +44,7 @@ export const DashboardThreeDotMenu = React.memo(({ dashboardId }: { dashboardId:
const shareMenu = useShareMenuSelectMenu({ dashboardId });
const addContentToDashboardMenu = useAddContentToDashboardSelectMenu();
const filterDashboardMenu = useFilterDashboardSelectMenu();
const { data: permission } = useGetDashboard(dashboardId, (x) => x.permission);
const { data: permission } = useGetDashboard({ id: dashboardId }, (x) => x.permission);
const isOwner = getIsEffectiveOwner(permission);
const isFilter = canFilter(permission);
const isEditor = canEdit(permission);
@ -84,7 +84,7 @@ DashboardThreeDotMenu.displayName = 'ThreeDotMenuButton';
const useVersionHistorySelectMenu = ({ dashboardId }: { dashboardId: string }) => {
const DEFAULT_VERSION_HISTORY_ITEMS: DropdownItems = [];
const { data } = useGetDashboard(dashboardId, (x) => ({
const { data } = useGetDashboard({ id: dashboardId }, (x) => ({
versions: x?.dashboard?.versions,
version_number: x?.dashboard?.version_number
}));
@ -115,7 +115,7 @@ const useVersionHistorySelectMenu = ({ dashboardId }: { dashboardId: string }) =
const useCollectionSelectMenu = ({ dashboardId }: { dashboardId: string }) => {
const { mutateAsync: saveDashboardToCollection } = useAddDashboardToCollection();
const { mutateAsync: removeDashboardFromCollection } = useRemoveDashboardFromCollection();
const { data: collections } = useGetDashboard(dashboardId, (x) => x.collections);
const { data: collections } = useGetDashboard({ id: dashboardId }, (x) => x.collections);
const { openInfoMessage } = useBusterNotifications();
const selectedCollections = useMemo(() => {
@ -163,7 +163,7 @@ const useCollectionSelectMenu = ({ dashboardId }: { dashboardId: string }) => {
};
const useFavoriteDashboardSelectMenu = ({ dashboardId }: { dashboardId: string }) => {
const { data: title } = useGetDashboard(dashboardId, (x) => x?.dashboard?.name);
const { data: title } = useGetDashboard({ id: dashboardId }, (x) => x?.dashboard?.name);
const { isFavorited, onFavoriteClick } = useFavoriteStar({
id: dashboardId,
type: ShareAssetType.DASHBOARD,
@ -221,7 +221,7 @@ const useRenameDashboardSelectMenu = ({ dashboardId }: { dashboardId: string })
};
export const useShareMenuSelectMenu = ({ dashboardId }: { dashboardId: string }) => {
const { data: dashboard } = useGetDashboard(dashboardId, getShareAssetConfig);
const { data: dashboard } = useGetDashboard({ id: dashboardId }, getShareAssetConfig);
const isOwner = getIsEffectiveOwner(dashboard?.permission);
return useMemo(

View File

@ -10,7 +10,6 @@ import { useGetDashboard } from '@/api/buster_rest/dashboards';
import { useAppLayoutContextSelector } from '@/context/BusterAppLayout';
import { useMemoizedFn } from '@/hooks';
import { timeout } from '@/lib';
import { AnimatePresence, motion } from 'framer-motion';
export const FileContainerVersionHistory = React.memo(() => {
return (