diff --git a/src/frontend/src/customization/feature-flags.ts b/src/frontend/src/customization/feature-flags.ts index 83b2e63bb..8da0a0bfe 100644 --- a/src/frontend/src/customization/feature-flags.ts +++ b/src/frontend/src/customization/feature-flags.ts @@ -12,3 +12,4 @@ export const ENABLE_FILE_MANAGEMENT = true; export const ENABLE_PUBLISH = true; export const ENABLE_WIDGET = true; export const ENABLE_VOICE_ASSISTANT = true; +export const ENABLE_IMAGE_ON_PLAYGROUND = true; diff --git a/src/frontend/src/modals/IOModal/components/chatView/chatInput/components/input-wrapper.tsx b/src/frontend/src/modals/IOModal/components/chatView/chatInput/components/input-wrapper.tsx index 32fa031a3..4f2d517da 100644 --- a/src/frontend/src/modals/IOModal/components/chatView/chatInput/components/input-wrapper.tsx +++ b/src/frontend/src/modals/IOModal/components/chatView/chatInput/components/input-wrapper.tsx @@ -1,4 +1,7 @@ -import { ENABLE_VOICE_ASSISTANT } from "@/customization/feature-flags"; +import { + ENABLE_IMAGE_ON_PLAYGROUND, + ENABLE_VOICE_ASSISTANT, +} from "@/customization/feature-flags"; import { FilePreviewType } from "@/types/components"; import React from "react"; import { @@ -80,16 +83,16 @@ const InputWrapper: React.FC = ({ ))}
- {!playgroundPage && ( -
+
+ {!playgroundPage && ENABLE_IMAGE_ON_PLAYGROUND && ( -
- )} + )} +
{ENABLE_VOICE_ASSISTANT && ( setShowAudioInput(true)} /> diff --git a/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-drag-and-drop.ts b/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-drag-and-drop.ts index e6a2af27a..b8c137ef1 100644 --- a/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-drag-and-drop.ts +++ b/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-drag-and-drop.ts @@ -1,5 +1,8 @@ +import { ENABLE_IMAGE_ON_PLAYGROUND } from "@/customization/feature-flags"; + const useDragAndDrop = (setIsDragging: (value: boolean) => void) => { const dragOver = (e) => { + if (!ENABLE_IMAGE_ON_PLAYGROUND) return; e.preventDefault(); if (e.dataTransfer.types.some((type) => type === "Files")) { setIsDragging(true); @@ -7,6 +10,7 @@ const useDragAndDrop = (setIsDragging: (value: boolean) => void) => { }; const dragEnter = (e) => { + if (!ENABLE_IMAGE_ON_PLAYGROUND) return; if (e.dataTransfer.types.some((type) => type === "Files")) { setIsDragging(true); } diff --git a/src/frontend/src/modals/IOModal/components/chatView/components/chat-view.tsx b/src/frontend/src/modals/IOModal/components/chatView/components/chat-view.tsx index 08f715271..5a22b6b62 100644 --- a/src/frontend/src/modals/IOModal/components/chatView/components/chat-view.tsx +++ b/src/frontend/src/modals/IOModal/components/chatView/components/chat-view.tsx @@ -1,5 +1,6 @@ import LangflowLogo from "@/assets/LangflowLogo.svg?react"; import { TextEffectPerChar } from "@/components/ui/textAnimation"; +import { ENABLE_IMAGE_ON_PLAYGROUND } from "@/customization/feature-flags"; import { track } from "@/customization/utils/analytics"; import { useMessagesStore } from "@/stores/messagesStore"; import { useUtilityStore } from "@/stores/utilityStore"; @@ -150,7 +151,12 @@ export default function ChatView({ const { dragOver, dragEnter, dragLeave } = useDragAndDrop(setIsDragging); const onDrop = (e) => { + if (!ENABLE_IMAGE_ON_PLAYGROUND) { + e.stopPropagation(); + return; + } e.preventDefault(); + e.stopPropagation(); if (e.dataTransfer.files && e.dataTransfer.files.length > 0) { handleFiles(e.dataTransfer.files); e.dataTransfer.clearData();