diff --git a/src/common/state/store-ux-labs.ts b/src/common/state/store-ux-labs.ts index c4a3d4f29..aaf8efdba 100644 --- a/src/common/state/store-ux-labs.ts +++ b/src/common/state/store-ux-labs.ts @@ -23,6 +23,9 @@ interface UXLabsStore { labsEnhanceCodeBlocks: boolean; setLabsEnhanceCodeBlocks: (labsEnhanceCodeBlocks: boolean) => void; + labsEnhanceCodeLiveFile: boolean; + setLabsEnhanceCodeLiveFile: (labsEnhanceCodeLiveFile: boolean) => void; + labsHighPerformance: boolean; setLabsHighPerformance: (labsHighPerformance: boolean) => void; @@ -58,6 +61,9 @@ export const useUXLabsStore = create()( labsEnhanceCodeBlocks: true, setLabsEnhanceCodeBlocks: (labsEnhanceCodeBlocks: boolean) => set({ labsEnhanceCodeBlocks }), + labsEnhanceCodeLiveFile: true, + setLabsEnhanceCodeLiveFile: (labsEnhanceCodeLiveFile: boolean) => set({ labsEnhanceCodeLiveFile }), + labsHighPerformance: false, setLabsHighPerformance: (labsHighPerformance: boolean) => set({ labsHighPerformance }), diff --git a/src/modules/blocks/code/EnhancedRenderCodeMenu.tsx b/src/modules/blocks/code/EnhancedRenderCodeMenu.tsx index 737fd4dc6..d52ea43cd 100644 --- a/src/modules/blocks/code/EnhancedRenderCodeMenu.tsx +++ b/src/modules/blocks/code/EnhancedRenderCodeMenu.tsx @@ -8,8 +8,8 @@ import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; import { CloseableMenu } from '~/common/components/CloseableMenu'; import { ConfirmationModal } from '~/common/components/ConfirmationModal'; +import { useLabsDevMode, useUXLabsStore } from '~/common/state/store-ux-labs'; import { useOverlayComponents } from '~/common/layout/overlays/useOverlayComponents'; -import { useUXLabsStore } from '~/common/state/store-ux-labs'; import { getCodeCollapseManager } from './codeCollapseManager'; @@ -26,9 +26,12 @@ export function EnhancedRenderCodeMenu(props: { // state const { showPromisedOverlay } = useOverlayComponents(); - const { labsEnhanceCodeBlocks, setLabsEnhanceCodeBlocks } = useUXLabsStore(useShallow(state => ({ + const labsDevMode = useLabsDevMode(); + const { labsEnhanceCodeBlocks, labsEnhanceCodeLiveFile, setLabsEnhanceCodeBlocks, setLabsEnhanceCodeLiveFile } = useUXLabsStore(useShallow(state => ({ labsEnhanceCodeBlocks: state.labsEnhanceCodeBlocks, + labsEnhanceCodeLiveFile: state.labsEnhanceCodeLiveFile, setLabsEnhanceCodeBlocks: state.setLabsEnhanceCodeBlocks, + setLabsEnhanceCodeLiveFile: state.setLabsEnhanceCodeLiveFile, }))); @@ -59,11 +62,15 @@ export function EnhancedRenderCodeMenu(props: { ).then(() => setLabsEnhanceCodeBlocks(false)).catch(() => null /* ignore closure */); }, [labsEnhanceCodeBlocks, setLabsEnhanceCodeBlocks, showPromisedOverlay]); + const toggleEnhanceCodeLiveFile = React.useCallback(() => { + setLabsEnhanceCodeLiveFile(!labsEnhanceCodeLiveFile); + }, [labsEnhanceCodeLiveFile, setLabsEnhanceCodeLiveFile]); + return ( @@ -81,12 +88,19 @@ export function EnhancedRenderCodeMenu(props: { - {/* A mix in between UxLabsSettings (labsEnhanceCodeBlocks) and the ChatDrawer MenuItems */} - - {labsEnhanceCodeBlocks && } - Enhanced Code Blocks + + {labsEnhanceCodeLiveFile && } + Enable LiveFile + {labsDevMode && ( + // A mix in between UxLabsSettings (labsEnhanceCodeBlocks) and the ChatDrawer MenuItems + + {labsEnhanceCodeBlocks && } + [DEV] Enhanced Blocks + + )} + ); } \ No newline at end of file