hydration boundary for the metric and asset stores

This commit is contained in:
Nate Kelley 2025-04-07 21:39:42 -06:00
parent 023ac538e2
commit 80f8ce86fd
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
3 changed files with 9 additions and 31 deletions

View File

@ -1,8 +1,4 @@
import { prefetchGetMetric } from '@/api/buster_rest/metrics';
import { metricsQueryKeys } from '@/api/query_keys/metric';
import { HydrationBoundaryMetricStore } from '@/context/Metrics/useOriginalMetricStore';
import { AppAssetCheckLayout } from '@/layouts/AppAssetCheckLayout';
import { dehydrate, HydrationBoundary } from '@tanstack/react-query';
export default async function MetricLayout({
children,
@ -12,18 +8,10 @@ export default async function MetricLayout({
params: Promise<{ metricId: string }>;
}) {
const { metricId } = await params;
const queryClient = await prefetchGetMetric({ id: metricId });
const metric = queryClient.getQueryData(metricsQueryKeys.metricsGetMetric(metricId).queryKey);
// const state = queryClient.getQueryState(queryKeys.metricsGetMetric(metricId).queryKey);
return (
<HydrationBoundary state={dehydrate(queryClient)}>
<HydrationBoundaryMetricStore metric={metric}>
<AppAssetCheckLayout assetId={metricId} type="metric">
{children}
</AppAssetCheckLayout>
</HydrationBoundaryMetricStore>
</HydrationBoundary>
<AppAssetCheckLayout assetId={metricId} type="metric">
{children}
</AppAssetCheckLayout>
);
}

View File

@ -25,16 +25,3 @@ export const HydrationBoundaryAssetStore: React.FC<{
return <>{children}</>;
};
// export const HydrationBoundaryMetricStore: React.FC<{
// children: React.ReactNode;
// metric?: OriginalMetricStore['originalMetrics'][string];
// }> = ({ children, metric }) => {
// const setOriginalMetrics = useOriginalMetricStore((x) => x.setOriginalMetric);
// useMount(() => {
// if (metric) setOriginalMetrics(metric);
// });
// return <>{children}</>;
// };

View File

@ -10,6 +10,7 @@ import { prefetchGetMetric } from '@/api/buster_rest/metrics/queryReqestsServer'
import { prefetchGetDashboard } from '@/api/buster_rest/dashboards/queryServerRequests';
import { metricsQueryKeys } from '@/api/query_keys/metric';
import { dashboardQueryKeys } from '@/api/query_keys/dashboard';
import { HydrationBoundaryAssetStore } from '@/context/Assets/HydrationBoundaryAssetStore';
export type AppAssetCheckLayoutProps = {
assetId: string;
@ -53,9 +54,11 @@ export const AppAssetCheckLayout: React.FC<
return (
<HydrationBoundary state={dehydratedState}>
<AppAssetLoadingContainer assetId={assetId} type={type}>
{Component}
</AppAssetLoadingContainer>
<HydrationBoundaryAssetStore asset={queryData}>
<AppAssetLoadingContainer assetId={assetId} type={type}>
{Component}
</AppAssetLoadingContainer>
</HydrationBoundaryAssetStore>
</HydrationBoundary>
);
};