chore: mark RAG as experimental feature

web/screens/Chat/ChatInput/index.tsx

@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import { useEffect, useRef, useState } from 'react'
+import { useContext, useEffect, useRef, useState } from 'react'
 
 import { InferenceEvent, MessageStatus, events } from '@janhq/core'
 
@@ -24,6 +24,8 @@ import { twMerge } from 'tailwind-merge'
 
 import { currentPromptAtom, fileUploadAtom } from '@/containers/Providers/Jotai'
 
+import { FeatureToggleContext } from '@/context/FeatureToggle'
+
 import { useActiveModel } from '@/hooks/useActiveModel'
 import { useClickOutside } from '@/hooks/useClickOutside'
 
@@ -53,7 +55,8 @@ const ChatInput: React.FC = () => {
   const textareaRef = useRef<HTMLTextAreaElement>(null)
   const fileInputRef = useRef<HTMLInputElement>(null)
   const imageInputRef = useRef<HTMLInputElement>(null)
-  const [ShowAttacmentMenus, setShowAttacmentMenus] = useState(false)
+  const [showAttacmentMenus, setShowAttacmentMenus] = useState(false)
+  const { experimentalFeature } = useContext(FeatureToggleContext)
 
   const onPromptChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
     setCurrentPrompt(e.target.value)
@@ -147,7 +150,7 @@ const ChatInput: React.FC = () => {
           value={currentPrompt}
           onChange={onPromptChange}
         />
-
+        {experimentalFeature && (
           <Tooltip>
             <TooltipTrigger asChild>
               <PaperclipIcon
@@ -161,7 +164,7 @@ const ChatInput: React.FC = () => {
                   ) {
                     e.stopPropagation()
                   } else {
-                  setShowAttacmentMenus(!ShowAttacmentMenus)
+                    setShowAttacmentMenus(!showAttacmentMenus)
                   }
                 }}
               />
@@ -173,7 +176,8 @@ const ChatInput: React.FC = () => {
                     <TooltipContent side="top" className="max-w-[154px] px-3">
                       {fileUpload.length !== 0 && (
                         <span>
-                        Currently, we only support 1 attachment at the same time
+                          Currently, we only support 1 attachment at the same
+                          time
                         </span>
                       )}
                       {activeThread?.assistants[0].tools &&
@@ -189,8 +193,9 @@ const ChatInput: React.FC = () => {
                   ))}
             </TooltipPortal>
           </Tooltip>
+        )}
 
-        {ShowAttacmentMenus && (
+        {showAttacmentMenus && (
           <div
             ref={refAttachmentMenus}
             className="absolute bottom-10 right-0 w-36 cursor-pointer rounded-lg border border-border bg-background py-1 shadow"

web/screens/Chat/Sidebar/index.tsx

@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import React from 'react'
+import React, { useContext } from 'react'
 
 import { InferenceEngine } from '@janhq/core'
 import { Input, Textarea, Switch } from '@janhq/uikit'
@@ -15,6 +15,8 @@ import DropdownListSidebar, {
   selectedModelAtom,
 } from '@/containers/DropdownListSidebar'
 
+import { FeatureToggleContext } from '@/context/FeatureToggle'
+
 import { useCreateNewThread } from '@/hooks/useCreateNewThread'
 
 import { getConfigurationsData } from '@/utils/componentSettings'
@@ -39,6 +41,7 @@ const Sidebar: React.FC = () => {
   const activeModelParams = useAtomValue(getActiveThreadModelParamsAtom)
   const selectedModel = useAtomValue(selectedModelAtom)
   const { updateThreadMetadata } = useCreateNewThread()
+  const { experimentalFeature } = useContext(FeatureToggleContext)
 
   const modelEngineParams = toSettingParams(activeModelParams)
   const modelRuntimeParams = toRuntimeParams(activeModelParams)
@@ -131,7 +134,7 @@ const Sidebar: React.FC = () => {
                 }}
               />
             </div>
-
+            {experimentalFeature && (
               <div>
                 {activeThread?.assistants[0]?.tools &&
                   componentDataAssistantSetting.length > 0 && (
@@ -143,7 +146,9 @@ const Sidebar: React.FC = () => {
                           <Switch
                             name="retrieval"
                             className="mr-2"
-                          checked={activeThread?.assistants[0].tools[0].enabled}
+                            checked={
+                              activeThread?.assistants[0].tools[0].enabled
+                            }
                             onCheckedChange={(e) => {
                               if (activeThread)
                                 updateThreadMetadata({
@@ -157,8 +162,8 @@ const Sidebar: React.FC = () => {
                                           enabled: e,
                                           settings:
                                             (activeThread.assistants[0].tools &&
-                                            activeThread.assistants[0].tools[0]
+                                              activeThread.assistants[0]
-                                              ?.settings) ??
+                                                .tools[0]?.settings) ??
                                             {},
                                         },
                                       ],
@@ -196,6 +201,7 @@ const Sidebar: React.FC = () => {
                     </div>
                   )}
               </div>
+            )}
           </div>
         </CardSidebar>
         <CardSidebar title="Model">

web/screens/Chat/index.tsx

@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/naming-convention */
-import React, { useEffect, useState } from 'react'
+import React, { useContext, useEffect, useState } from 'react'
 
 import { useDropzone } from 'react-dropzone'
 
@@ -17,6 +17,8 @@ import { showLeftSideBarAtom } from '@/containers/Providers/KeyListener'
 
 import { snackbar } from '@/containers/Toast'
 
+import { FeatureToggleContext } from '@/context/FeatureToggle'
+
 import { queuedMessageAtom, reloadModelAtom } from '@/hooks/useSendChatMessage'
 
 import ChatBody from '@/screens/Chat/ChatBody'
@@ -59,6 +61,8 @@ const ChatScreen: React.FC = () => {
   const reloadModel = useAtomValue(reloadModelAtom)
   const [dragRejected, setDragRejected] = useState({ code: '' })
   const setFileUpload = useSetAtom(fileUploadAtom)
+  const { experimentalFeature } = useContext(FeatureToggleContext)
+
   const { getRootProps, isDragReject } = useDropzone({
     noClick: true,
     multiple: false,
@@ -67,6 +71,8 @@ const ChatScreen: React.FC = () => {
     },
 
     onDragOver: (e) => {
+      // Retrieval file drag and drop is experimental feature
+      if (!experimentalFeature) return
       if (
         e.dataTransfer.items.length === 1 &&
         activeThread?.assistants[0].tools &&
@@ -84,6 +90,8 @@ const ChatScreen: React.FC = () => {
     },
     onDragLeave: () => setDragOver(false),
     onDrop: (files, rejectFiles) => {
+      // Retrieval file drag and drop is experimental feature
+      if (!experimentalFeature) return
       if (
         !files ||
         files.length !== 1 ||