diff --git a/packages/components/nodes/agents/ConversationalAgent/ConversationalAgent.ts b/packages/components/nodes/agents/ConversationalAgent/ConversationalAgent.ts
index b2019a317..db6b37c6a 100644
--- a/packages/components/nodes/agents/ConversationalAgent/ConversationalAgent.ts
+++ b/packages/components/nodes/agents/ConversationalAgent/ConversationalAgent.ts
@@ -95,7 +95,6 @@ class ConversationalAgent_Agents implements INode {
             { sessionId: this.sessionId, chatId: options.chatId, input },
             options.chatHistory
         )
-        // injectAgentExecutorNodeData(executor, nodeData, options)
 
         const loggerHandler = new ConsoleCallbackHandler(options.logger)
         const callbacks = await additionalCallbacks(nodeData, options)
diff --git a/packages/components/nodes/agents/MRKLAgentChat/MRKLAgentChat.ts b/packages/components/nodes/agents/MRKLAgentChat/MRKLAgentChat.ts
index 0d3b612cb..d59de5400 100644
--- a/packages/components/nodes/agents/MRKLAgentChat/MRKLAgentChat.ts
+++ b/packages/components/nodes/agents/MRKLAgentChat/MRKLAgentChat.ts
@@ -99,7 +99,6 @@ class MRKLAgentChat_Agents implements INode {
             tools,
             verbose: process.env.DEBUG === 'true'
         })
-        // injectLcAgentExecutorNodeData(executor, nodeData, options)
 
         const callbacks = await additionalCallbacks(nodeData, options)
 
diff --git a/packages/ui/src/ui-component/dialog/SpeechToTextDialog.js b/packages/ui/src/ui-component/dialog/SpeechToTextDialog.js
index 7f30d14be..1366ea1ad 100644
--- a/packages/ui/src/ui-component/dialog/SpeechToTextDialog.js
+++ b/packages/ui/src/ui-component/dialog/SpeechToTextDialog.js
@@ -272,8 +272,9 @@ const SpeechToTextDialog = ({ show, dialogProps, onCancel }) => {
                                 </div>
                                 {inputParam.type === 'credential' && (
                                     <CredentialInputHandler
+                                        key={speechToText[selectedProvider]?.credentialId}
                                         data={
-                                            speechToText[selectedProvider]
+                                            speechToText[selectedProvider]?.credentialId
                                                 ? { credential: speechToText[selectedProvider].credentialId }
                                                 : {}
                                         }
@@ -321,7 +322,11 @@ const SpeechToTextDialog = ({ show, dialogProps, onCancel }) => {
                 )}
             </DialogContent>
             <DialogActions>
-                <StyledButton variant='contained' onClick={onSave}>
+                <StyledButton
+                    disabled={selectedProvider !== 'none' && !speechToText[selectedProvider]?.credentialId}
+                    variant='contained'
+                    onClick={onSave}
+                >
                     Save
                 </StyledButton>
             </DialogActions>
diff --git a/packages/ui/src/ui-component/dropdown/AsyncDropdown.js b/packages/ui/src/ui-component/dropdown/AsyncDropdown.js
index 84c11e254..b24fa02b5 100644
--- a/packages/ui/src/ui-component/dropdown/AsyncDropdown.js
+++ b/packages/ui/src/ui-component/dropdown/AsyncDropdown.js
@@ -105,7 +105,7 @@ export const AsyncDropdown = ({
         })()
 
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [credentialNames])
+    }, [])
 
     return (
         <>
diff --git a/packages/ui/src/views/settings/index.js b/packages/ui/src/views/settings/index.js
index 8d76cc0d7..f7019b681 100644
--- a/packages/ui/src/views/settings/index.js
+++ b/packages/ui/src/views/settings/index.js
@@ -1,9 +1,11 @@
-import { useState, useEffect } from 'react'
+import { useState, useEffect, useRef } from 'react'
 import PropTypes from 'prop-types'
+import { useSelector } from 'react-redux'
 
 // material-ui
 import { useTheme } from '@mui/material/styles'
-import { Box, List, Paper, Popper, ClickAwayListener } from '@mui/material'
+import { ListItemButton, ListItemIcon, ListItemText, Typography, Box, List, Paper, Popper, ClickAwayListener } from '@mui/material'
+import FiberManualRecordIcon from '@mui/icons-material/FiberManualRecord'
 
 // third-party
 import PerfectScrollbar from 'react-perfect-scrollbar'
@@ -11,8 +13,6 @@ import PerfectScrollbar from 'react-perfect-scrollbar'
 // project imports
 import MainCard from 'ui-component/cards/MainCard'
 import Transitions from 'ui-component/extended/Transitions'
-import NavItem from 'layout/MainLayout/Sidebar/MenuList/NavItem'
-
 import settings from 'menu-items/settings'
 
 // ==============================|| SETTINGS ||============================== //
@@ -20,9 +20,26 @@ import settings from 'menu-items/settings'
 const Settings = ({ chatflow, isSettingsOpen, anchorEl, onSettingsItemClick, onUploadFile, onClose }) => {
     const theme = useTheme()
     const [settingsMenu, setSettingsMenu] = useState([])
-
+    const customization = useSelector((state) => state.customization)
+    const inputFile = useRef(null)
     const [open, setOpen] = useState(false)
 
+    const handleFileUpload = (e) => {
+        if (!e.target.files) return
+
+        const file = e.target.files[0]
+
+        const reader = new FileReader()
+        reader.onload = (evt) => {
+            if (!evt?.target?.result) {
+                return
+            }
+            const { result } = evt.target
+            onUploadFile(result)
+        }
+        reader.readAsText(file)
+    }
+
     useEffect(() => {
         if (chatflow && !chatflow.id) {
             const settingsMenu = settings.children.filter((menu) => menu.id === 'loadChatflow')
@@ -39,16 +56,40 @@ const Settings = ({ chatflow, isSettingsOpen, anchorEl, onSettingsItemClick, onU
 
     // settings list items
     const items = settingsMenu.map((menu) => {
-        return (
-            <NavItem
-                key={menu.id}
-                item={menu}
-                level={1}
-                navType='SETTINGS'
-                onClick={(id) => onSettingsItemClick(id)}
-                onUploadFile={onUploadFile}
+        const Icon = menu.icon
+        const itemIcon = menu?.icon ? (
+            <Icon stroke={1.5} size='1.3rem' />
+        ) : (
+            <FiberManualRecordIcon
+                sx={{
+                    width: customization.isOpen.findIndex((id) => id === menu?.id) > -1 ? 8 : 6,
+                    height: customization.isOpen.findIndex((id) => id === menu?.id) > -1 ? 8 : 6
+                }}
+                fontSize={level > 0 ? 'inherit' : 'medium'}
             />
         )
+        return (
+            <ListItemButton
+                key={menu.id}
+                sx={{
+                    borderRadius: `${customization.borderRadius}px`,
+                    mb: 0.5,
+                    alignItems: 'flex-start',
+                    py: 1.25,
+                    pl: `24px`
+                }}
+                onClick={() => {
+                    if (menu.id === 'loadChatflow' && inputFile) {
+                        inputFile?.current.click()
+                    } else {
+                        onSettingsItemClick(menu.id)
+                    }
+                }}
+            >
+                <ListItemIcon sx={{ my: 'auto', minWidth: !menu?.icon ? 18 : 36 }}>{itemIcon}</ListItemIcon>
+                <ListItemText primary={<Typography color='inherit'>{menu.title}</Typography>} />
+            </ListItemButton>
+        )
     })
 
     return (
@@ -82,6 +123,14 @@ const Settings = ({ chatflow, isSettingsOpen, anchorEl, onSettingsItemClick, onU
                                             <List>{items}</List>
                                         </Box>
                                     </PerfectScrollbar>
+                                    <input
+                                        type='file'
+                                        hidden
+                                        accept='.json'
+                                        ref={inputFile}
+                                        style={{ display: 'none' }}
+                                        onChange={(e) => handleFileUpload(e)}
+                                    />
                                 </MainCard>
                             </ClickAwayListener>
                         </Paper>