mirror of https://github.com/buster-so/buster.git
web(memory): load Monaco editor lazily via DynamicAppCodeEditor in all consumers; use dynamic BusterChart in test playground
Co-Authored-By: nate@buster.so <nate@buster.so>
This commit is contained in:
parent
9713237819
commit
b979e208f7
|
@ -1,5 +1,5 @@
|
|||
import React from 'react';
|
||||
import { AppCodeEditor } from '@/components/ui/inputs/AppCodeEditor';
|
||||
import { DynamicAppCodeEditor as AppCodeEditor } from '@/components/ui/inputs/AppCodeEditor/DynamicAppCodeEditor';
|
||||
import { cn } from '@/lib/classMerge';
|
||||
|
||||
export const MetadataContainer: React.FC<{
|
||||
|
|
|
@ -2,10 +2,10 @@
|
|||
|
||||
import { useMemo, useState } from 'react';
|
||||
import { useHotkeys } from 'react-hotkeys-hook';
|
||||
import { AppCodeEditor } from '@/components/ui/inputs/AppCodeEditor';
|
||||
import { DynamicAppCodeEditor as AppCodeEditor } from '@/components/ui/inputs/AppCodeEditor/DynamicAppCodeEditor';
|
||||
import { yamlToJson } from '@/lib/yaml-to-json';
|
||||
import { useRunSQL } from '@/api/buster_rest/sql/queryRequests';
|
||||
import { BusterChart } from '@/components/ui/charts/BusterChart';
|
||||
import { BusterChartDynamic } from '@/components/ui/charts/BusterChartDynamic';
|
||||
import {
|
||||
ChartConfigPropsSchema,
|
||||
type ChartConfigProps,
|
||||
|
@ -232,7 +232,7 @@ export default function ChartPlayground() {
|
|||
<h4 className="text-sm font-semibold text-green-800">Chart Ready</h4>
|
||||
</div>
|
||||
<div className="rounded-lg bg-white p-4 shadow-sm">
|
||||
<BusterChart {...chartConfig} data={data} columnMetadata={columnMetadata} />
|
||||
<BusterChartDynamic {...chartConfig} data={data} columnMetadata={columnMetadata} />
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
|
|
@ -5,7 +5,7 @@ import { Button } from '@/components/ui/buttons/Button';
|
|||
import { FileCard } from '@/components/ui/card/FileCard';
|
||||
import { ErrorClosableContainer } from '@/components/ui/error/ErrorClosableContainer';
|
||||
import { Command, ReturnKey } from '@/components/ui/icons';
|
||||
import { AppCodeEditor } from '@/components/ui/inputs/AppCodeEditor';
|
||||
import { DynamicAppCodeEditor as AppCodeEditor } from '@/components/ui/inputs/AppCodeEditor/DynamicAppCodeEditor';
|
||||
import { useBusterNotifications } from '@/context/BusterNotifications';
|
||||
import { useMemoizedFn } from '@/hooks';
|
||||
import type { AppVerticalCodeSplitterProps } from './AppVerticalCodeSplitter';
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
import React from 'react';
|
||||
import { AppCodeEditor } from '@/components/ui/inputs/AppCodeEditor';
|
||||
import { DynamicAppCodeEditor as AppCodeEditor } from '@/components/ui/inputs/AppCodeEditor/DynamicAppCodeEditor';
|
||||
import { useBusterNotifications } from '@/context/BusterNotifications';
|
||||
import { useMemoizedFn } from '@/hooks';
|
||||
import { Button } from '../buttons/Button';
|
||||
|
|
|
@ -0,0 +1,12 @@
|
|||
import dynamic from 'next/dynamic';
|
||||
import { CircleSpinnerLoaderContainer } from '../../loaders/CircleSpinnerLoaderContainer';
|
||||
|
||||
export const DynamicAppCodeEditor = dynamic(
|
||||
() => import('./AppCodeEditor').then((mod) => mod.AppCodeEditor),
|
||||
{
|
||||
ssr: false,
|
||||
loading: () => <CircleSpinnerLoaderContainer className="animate-in fade-in-0 duration-300" />
|
||||
}
|
||||
);
|
||||
|
||||
export default DynamicAppCodeEditor;
|
|
@ -8,7 +8,7 @@ import { Button } from '@/components/ui/buttons';
|
|||
import { Card, CardContent, CardHeader } from '@/components/ui/card/CardBase';
|
||||
import { Dropdown, type DropdownItems } from '@/components/ui/dropdown';
|
||||
import { CircleQuestion, Dots, EditSquare, Trash } from '@/components/ui/icons';
|
||||
import { AppCodeEditor } from '@/components/ui/inputs/AppCodeEditor';
|
||||
import { DynamicAppCodeEditor as AppCodeEditor } from '@/components/ui/inputs/AppCodeEditor/DynamicAppCodeEditor';
|
||||
import { InputTextArea } from '@/components/ui/inputs/InputTextArea';
|
||||
import { Text } from '@/components/ui/typography';
|
||||
import { EditableTitle } from '@/components/ui/typography/EditableTitle';
|
||||
|
|
Loading…
Reference in New Issue