add a debounce for resizing a chart

web/src/api/asset_interfaces/metric/charts/interfaces.ts

@@ -11,7 +11,6 @@ export type BusterChartProps = {
   id?: string;
   error?: string;
   columnMetadata?: ColumnMetaData[];
-  useRapidResizeObserver?: boolean;
   editable?: boolean;
   onInitialAnimationEnd?: () => void;
   onChartMounted?: (chart?: any) => void;

web/src/app/app/(primary_layout)/(chat_experience)/chats/[chatId]/page.tsx

@@ -1,5 +1,6 @@
 'use client';
 
+import { FileIndeterminateLoader } from '@/components/features/FileIndeterminateLoader';
 import { StatusCard } from '@/components/ui/card/StatusCard';
 import { ReasoningController } from '@/controllers/ReasoningController';
 import { useChatIndividualContextSelector } from '@/layouts/ChatLayout/ChatContext';
@@ -13,11 +14,14 @@ export default function Page(params: { params: { chatId: string } }) {
   }
 
   return (
+    <>
+      <FileIndeterminateLoader />
       <div className="p-5">
         <StatusCard
           title="Error"
           message="If you are seeing this, tell Nate and screenshot this whole page including the URL and logs..."
         />
       </div>
+    </>
   );
 }

web/src/components/features/layouts/AppVerticalCodeSplitter/SQLContainer.tsx

@@ -45,7 +45,7 @@ export const SQLContainer: React.FC<{
           className
         )}>
         <AppCodeEditor
-          className="overflow-hidden"
+          className="overflow-hidden border-x-0 border-t-0"
           value={sql}
           onChange={setDatasetSQL}
           onMetaEnter={onRunQueryPreflight}

web/src/components/ui/charts/BusterChart.tsx

@@ -40,7 +40,6 @@ export const BusterChart: React.FC<BusterChartProps> = React.memo(
     metricValueAggregate,
     metricValueLabel,
     onChartMounted: onChartMountedProp,
-    useRapidResizeObserver = true,
     onInitialAnimationEnd,
     editable,
     selectedChartType,
@@ -140,7 +139,6 @@ export const BusterChart: React.FC<BusterChartProps> = React.memo(
         animate,
         animateLegend,
         className,
-        useRapidResizeObserver,
         columnLabelFormats,
         selectedChartType,
         loading,

web/src/components/ui/charts/BusterChartJS/BusterChartJS.tsx

@@ -21,7 +21,6 @@ export const BusterChartJS: React.FC<BusterChartComponentProps> = ({
   loading = false,
   showLegendHeadline,
   columnMetadata = DEFAULT_COLUMN_METADATA,
-  useRapidResizeObserver = false,
   onChartMounted,
   onInitialAnimationEnd,
   columnSettings = DEFAULT_CHART_CONFIG.columnSettings,
@@ -74,7 +73,6 @@ export const BusterChartJS: React.FC<BusterChartComponentProps> = ({
         columnSettings={columnSettings}
         {...props}
         className={className}
-        useRapidResizeObserver={useRapidResizeObserver}
       />
     </BusterChartJSLegendWrapper>
   );

web/src/components/ui/charts/BusterChartJS/BusterChartJSComponent.tsx

@@ -67,7 +67,6 @@ export const BusterChartJSComponent = React.memo(
         xAxisTimeInterval,
         //TODO
         xAxisDataZoom,
-        useRapidResizeObserver = false,
         ...rest
       },
       ref

web/src/components/ui/charts/BusterChartJS/ChartJSTheme.ts

@@ -69,6 +69,7 @@ ChartJS.register(
 );
 
 ChartJS.defaults.responsive = true;
+ChartJS.defaults.resizeDelay = 100;
 ChartJS.defaults.maintainAspectRatio = false;
 ChartJS.defaults.color = color;
 ChartJS.defaults.backgroundColor = DEFAULT_CHART_THEME;

web/src/components/ui/inputs/AppCodeEditor/AppCodeEditor.tsx

@@ -8,7 +8,7 @@ import { CircleSpinnerLoaderContainer } from '../../loaders/CircleSpinnerLoaderC
 import { useMemoizedFn } from '@/hooks';
 import { cn } from '@/lib/classMerge';
 import type { editor } from 'monaco-editor/esm/vs/editor/editor.api';
-//import './MonacoWebWorker';
+import './MonacoWebWorker';
 import { configureMonacoToUseYaml } from './yamlHelper';
 
 //import GithubLightTheme from 'monaco-themes/themes/Github Light.json';

web/src/controllers/MetricController/MetricController.tsx

@@ -23,8 +23,6 @@ export const MetricController: React.FC<{
       ? MetricViewComponents[selectedFileView as MetricFileView]
       : () => <></>;
 
-  console.log(selectedFileView);
-
   return (
     <>
       {showLoader && <FileIndeterminateLoader />}

web/src/lib/chat.ts

@@ -40,7 +40,6 @@ export const updateChatToIChat = (
     chat.messages,
     isNewChat ? last(chat.message_ids) : undefined
   );
-  console.log(iChatMessages);
   return {
     iChat,
     iChatMessages