Merge remote-tracking branch 'origin/FEATURE/Vision' into FEATURE/Vision
This commit is contained in:
commit
51c2a93a02
|
|
@ -1530,10 +1530,12 @@ export class App {
|
||||||
if (chatflow.speechToText) {
|
if (chatflow.speechToText) {
|
||||||
const speechToTextProviders = JSON.parse(chatflow.speechToText)
|
const speechToTextProviders = JSON.parse(chatflow.speechToText)
|
||||||
for (const provider in speechToTextProviders) {
|
for (const provider in speechToTextProviders) {
|
||||||
const providerObj = speechToTextProviders[provider]
|
if (provider !== 'none') {
|
||||||
if (providerObj.status) {
|
const providerObj = speechToTextProviders[provider]
|
||||||
isSpeechToTextEnabled = true
|
if (providerObj.status) {
|
||||||
break
|
isSpeechToTextEnabled = true
|
||||||
|
break
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -175,7 +175,16 @@ const SpeechToTextDialog = ({ show, dialogProps, onCancel }) => {
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (dialogProps.chatflow && dialogProps.chatflow.speechToText) {
|
if (dialogProps.chatflow && dialogProps.chatflow.speechToText) {
|
||||||
try {
|
try {
|
||||||
setSpeechToText(JSON.parse(dialogProps.chatflow.speechToText))
|
const speechToText = JSON.parse(dialogProps.chatflow.speechToText)
|
||||||
|
let selectedProvider = 'none'
|
||||||
|
Object.keys(speechToTextProviders).forEach((key) => {
|
||||||
|
const providerConfig = speechToText[key]
|
||||||
|
if (providerConfig.status) {
|
||||||
|
selectedProvider = key
|
||||||
|
}
|
||||||
|
})
|
||||||
|
setSelectedProvider(selectedProvider)
|
||||||
|
setSpeechToText(speechToText)
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
setSpeechToText({})
|
setSpeechToText({})
|
||||||
console.error(e)
|
console.error(e)
|
||||||
|
|
@ -193,7 +202,7 @@ const SpeechToTextDialog = ({ show, dialogProps, onCancel }) => {
|
||||||
return () => dispatch({ type: HIDE_CANVAS_DIALOG })
|
return () => dispatch({ type: HIDE_CANVAS_DIALOG })
|
||||||
}, [show, dispatch])
|
}, [show, dispatch])
|
||||||
|
|
||||||
const component = show ? (
|
const component = (
|
||||||
<Dialog
|
<Dialog
|
||||||
onClose={onCancel}
|
onClose={onCancel}
|
||||||
open={show}
|
open={show}
|
||||||
|
|
@ -210,99 +219,106 @@ const SpeechToTextDialog = ({ show, dialogProps, onCancel }) => {
|
||||||
<Typography>Speech To Text Providers</Typography>
|
<Typography>Speech To Text Providers</Typography>
|
||||||
<FormControl fullWidth>
|
<FormControl fullWidth>
|
||||||
<Select value={selectedProvider} onChange={handleProviderChange}>
|
<Select value={selectedProvider} onChange={handleProviderChange}>
|
||||||
|
<MenuItem value='none'>None</MenuItem>
|
||||||
<MenuItem value='openAIWhisper'>OpenAI Whisper</MenuItem>
|
<MenuItem value='openAIWhisper'>OpenAI Whisper</MenuItem>
|
||||||
<MenuItem value='assemblyAiTranscribe'>Assembly AI</MenuItem>
|
<MenuItem value='assemblyAiTranscribe'>Assembly AI</MenuItem>
|
||||||
</Select>
|
</Select>
|
||||||
</FormControl>
|
</FormControl>
|
||||||
</Box>
|
</Box>
|
||||||
<>
|
{selectedProvider !== 'none' && (
|
||||||
<ListItem style={{ padding: 0, margin: 0 }} alignItems='center'>
|
<>
|
||||||
<ListItemAvatar>
|
<ListItem style={{ padding: 0, margin: 0 }} alignItems='center'>
|
||||||
<div
|
<ListItemAvatar>
|
||||||
style={{
|
<div
|
||||||
width: 50,
|
|
||||||
height: 50,
|
|
||||||
borderRadius: '50%',
|
|
||||||
backgroundColor: 'white'
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
style={{
|
style={{
|
||||||
width: '100%',
|
width: 50,
|
||||||
height: '100%',
|
height: 50,
|
||||||
padding: 10,
|
borderRadius: '50%',
|
||||||
objectFit: 'contain'
|
backgroundColor: 'white'
|
||||||
}}
|
}}
|
||||||
alt='AI'
|
>
|
||||||
src={speechToTextProviders[selectedProvider].icon}
|
<img
|
||||||
/>
|
style={{
|
||||||
</div>
|
width: '100%',
|
||||||
</ListItemAvatar>
|
height: '100%',
|
||||||
<ListItemText
|
padding: 10,
|
||||||
sx={{ ml: 1 }}
|
objectFit: 'contain'
|
||||||
primary={speechToTextProviders[selectedProvider].label}
|
}}
|
||||||
secondary={
|
alt='AI'
|
||||||
<a target='_blank' rel='noreferrer' href={speechToTextProviders[selectedProvider].url}>
|
src={speechToTextProviders[selectedProvider].icon}
|
||||||
{speechToTextProviders[selectedProvider].url}
|
/>
|
||||||
</a>
|
</div>
|
||||||
}
|
</ListItemAvatar>
|
||||||
/>
|
<ListItemText
|
||||||
</ListItem>
|
sx={{ ml: 1 }}
|
||||||
{speechToTextProviders[selectedProvider].inputs.map((inputParam, index) => (
|
primary={speechToTextProviders[selectedProvider].label}
|
||||||
<Box key={index} sx={{ p: 2 }}>
|
secondary={
|
||||||
<div style={{ display: 'flex', flexDirection: 'row' }}>
|
<a target='_blank' rel='noreferrer' href={speechToTextProviders[selectedProvider].url}>
|
||||||
<Typography>
|
{speechToTextProviders[selectedProvider].url}
|
||||||
{inputParam.label}
|
</a>
|
||||||
{!inputParam.optional && <span style={{ color: 'red' }}> *</span>}
|
}
|
||||||
{inputParam.description && (
|
/>
|
||||||
<TooltipWithParser style={{ marginLeft: 10 }} title={inputParam.description} />
|
</ListItem>
|
||||||
)}
|
{speechToTextProviders[selectedProvider].inputs.map((inputParam, index) => (
|
||||||
</Typography>
|
<Box key={index} sx={{ p: 2 }}>
|
||||||
</div>
|
<div style={{ display: 'flex', flexDirection: 'row' }}>
|
||||||
{inputParam.type === 'credential' && (
|
<Typography>
|
||||||
<CredentialInputHandler
|
{inputParam.label}
|
||||||
data={speechToText[selectedProvider] ? { credential: speechToText[selectedProvider].credentialId } : {}}
|
{!inputParam.optional && <span style={{ color: 'red' }}> *</span>}
|
||||||
inputParam={inputParam}
|
{inputParam.description && (
|
||||||
onSelect={(newValue) => setValue(newValue, selectedProvider, 'credentialId')}
|
<TooltipWithParser style={{ marginLeft: 10 }} title={inputParam.description} />
|
||||||
/>
|
)}
|
||||||
)}
|
</Typography>
|
||||||
{inputParam.type === 'boolean' && (
|
</div>
|
||||||
<SwitchInput
|
{inputParam.type === 'credential' && (
|
||||||
onChange={(newValue) => setValue(newValue, selectedProvider, inputParam.name)}
|
<CredentialInputHandler
|
||||||
value={
|
data={
|
||||||
speechToText[selectedProvider]
|
speechToText[selectedProvider]
|
||||||
? speechToText[selectedProvider][inputParam.name]
|
? { credential: speechToText[selectedProvider].credentialId }
|
||||||
: inputParam.default ?? false
|
: {}
|
||||||
}
|
}
|
||||||
/>
|
inputParam={inputParam}
|
||||||
)}
|
onSelect={(newValue) => setValue(newValue, selectedProvider, 'credentialId')}
|
||||||
{(inputParam.type === 'string' || inputParam.type === 'password' || inputParam.type === 'number') && (
|
/>
|
||||||
<Input
|
)}
|
||||||
inputParam={inputParam}
|
{inputParam.type === 'boolean' && (
|
||||||
onChange={(newValue) => setValue(newValue, selectedProvider, inputParam.name)}
|
<SwitchInput
|
||||||
value={
|
onChange={(newValue) => setValue(newValue, selectedProvider, inputParam.name)}
|
||||||
speechToText[selectedProvider]
|
value={
|
||||||
? speechToText[selectedProvider][inputParam.name]
|
speechToText[selectedProvider]
|
||||||
: inputParam.default ?? ''
|
? speechToText[selectedProvider][inputParam.name]
|
||||||
}
|
: inputParam.default ?? false
|
||||||
/>
|
}
|
||||||
)}
|
/>
|
||||||
|
)}
|
||||||
|
{(inputParam.type === 'string' || inputParam.type === 'password' || inputParam.type === 'number') && (
|
||||||
|
<Input
|
||||||
|
inputParam={inputParam}
|
||||||
|
onChange={(newValue) => setValue(newValue, selectedProvider, inputParam.name)}
|
||||||
|
value={
|
||||||
|
speechToText[selectedProvider]
|
||||||
|
? speechToText[selectedProvider][inputParam.name]
|
||||||
|
: inputParam.default ?? ''
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
|
||||||
{inputParam.type === 'options' && (
|
{inputParam.type === 'options' && (
|
||||||
<Dropdown
|
<Dropdown
|
||||||
name={inputParam.name}
|
name={inputParam.name}
|
||||||
options={inputParam.options}
|
options={inputParam.options}
|
||||||
onSelect={(newValue) => setValue(newValue, selectedProvider, inputParam.name)}
|
onSelect={(newValue) => setValue(newValue, selectedProvider, inputParam.name)}
|
||||||
value={
|
value={
|
||||||
speechToText[selectedProvider]
|
speechToText[selectedProvider]
|
||||||
? speechToText[selectedProvider][inputParam.name]
|
? speechToText[selectedProvider][inputParam.name]
|
||||||
: inputParam.default ?? 'choose an option'
|
: inputParam.default ?? 'choose an option'
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
</Box>
|
</Box>
|
||||||
))}
|
))}
|
||||||
</>
|
</>
|
||||||
|
)}
|
||||||
</DialogContent>
|
</DialogContent>
|
||||||
<DialogActions>
|
<DialogActions>
|
||||||
<StyledButton variant='contained' onClick={onSave}>
|
<StyledButton variant='contained' onClick={onSave}>
|
||||||
|
|
@ -310,7 +326,7 @@ const SpeechToTextDialog = ({ show, dialogProps, onCancel }) => {
|
||||||
</StyledButton>
|
</StyledButton>
|
||||||
</DialogActions>
|
</DialogActions>
|
||||||
</Dialog>
|
</Dialog>
|
||||||
) : null
|
)
|
||||||
|
|
||||||
return createPortal(component, portalElement)
|
return createPortal(component, portalElement)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -48,6 +48,12 @@ export const Input = ({ inputParam, value, nodes, edges, nodeId, onChange, disab
|
||||||
}
|
}
|
||||||
}, [myValue])
|
}, [myValue])
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (value) {
|
||||||
|
setMyValue(value)
|
||||||
|
}
|
||||||
|
}, [value])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
{inputParam.name === 'note' ? (
|
{inputParam.name === 'note' ? (
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue