farcasclaudiu/Flowise
1
0
Fork 0
mirror of https://github.com/farcasclaudiu/Flowise.git synced 2026-06-29 11:01:18 +03:00
Code Issues Packages Projects Releases Wiki Activity

Fix error message when audio recording is not available

Browse Source
This commit is contained in:
Ilango
2024-01-30 15:30:07 +05:30
parent d61e3d53ec
commit 517c2f2916
3 changed files with 41 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui/src/views/chatmessage/ChatMessage.css
+1 -1
View File
@@ -151,7 +151,7 @@
.cloud-dialog { .cloud-dialog {
width: 100%; width: 100%;
height: auto; height: auto;
max-height: calc(100% - 72px); max-height: calc(100% - 54px);
overflow-y: scroll; overflow-y: scroll;
display: flex; display: flex;
justify-content: center; justify-content: center;
packages/ui/src/views/chatmessage/ChatMessage.js
+16 -9
View File
@@ -287,7 +287,7 @@ export const ChatMessage = ({ open, chatflowid, isDialog }) => {
} }
const onRecordingCancelled = () => { const onRecordingCancelled = () => {
cancelAudioRecording() if (!recordingNotSupported) cancelAudioRecording()
setIsRecording(false) setIsRecording(false)
setRecordingNotSupported(false) setRecordingNotSupported(false)
} }
@@ -855,8 +855,8 @@ export const ChatMessage = ({ open, chatflowid, isDialog }) => {
)} )}
{isRecording ? ( {isRecording ? (
<> <>
{recordingNotSupported && ( {recordingNotSupported ? (
<div className='overlay hide'> <div className='overlay'>
<div className='browser-not-supporting-audio-recording-box'> <div className='browser-not-supporting-audio-recording-box'>
<Typography variant='body1'> <Typography variant='body1'>
To record audio, use modern browsers like Chrome or Firefox that support audio recording. To record audio, use modern browsers like Chrome or Firefox that support audio recording.
@@ -872,14 +872,16 @@ export const ChatMessage = ({ open, chatflowid, isDialog }) => {
</Button> </Button>
</div> </div>
</div> </div>
)} ) : (
<Box <Box
sx={{ sx={{
width: '100%', width: '100%',
height: '54px', height: '54px',
px: 2, px: 2,
borderRadius: 1.5, border: '1px solid',
backgroundColor: '#32353b', borderRadius: 3,
backgroundColor: customization.isDarkMode ? '#32353b' : '#fafafa',
borderColor: 'rgba(0, 0, 0, 0.23)',
display: 'flex', display: 'flex',
alignItems: 'center', alignItems: 'center',
justifyContent: 'space-between' justifyContent: 'space-between'
@@ -894,13 +896,18 @@ export const ChatMessage = ({ open, chatflowid, isDialog }) => {
</div> </div>
<div className='recording-control-buttons-container'> <div className='recording-control-buttons-container'>
<IconButton onClick={onRecordingCancelled} size='small'> <IconButton onClick={onRecordingCancelled} size='small'>
<IconX color={loading || !chatflowid ? '#9e9e9e' : customization.isDarkMode ? 'white' : '#1e88e5'} /> <IconX
color={loading || !chatflowid ? '#9e9e9e' : customization.isDarkMode ? 'white' : '#1e88e5'}
/>
</IconButton> </IconButton>
<IconButton onClick={onRecordingStopped} size='small'> <IconButton onClick={onRecordingStopped} size='small'>
<IconSend color={loading || !chatflowid ? '#9e9e9e' : customization.isDarkMode ? 'white' : '#1e88e5'} /> <IconSend
color={loading || !chatflowid ? '#9e9e9e' : customization.isDarkMode ? 'white' : '#1e88e5'}
/>
</IconButton> </IconButton>
</div> </div>
</Box> </Box>
)}
</> </>
) : ( ) : (
<form style={{ width: '100%' }} onSubmit={handleSubmit}> <form style={{ width: '100%' }} onSubmit={handleSubmit}>
@@ -936,7 +943,7 @@ export const ChatMessage = ({ open, chatflowid, isDialog }) => {
} }
endAdornment={ endAdornment={
<> <>
{isChatFlowAvailableForUploads && ( {isChatFlowAvailableForSpeech && (
<InputAdornment position='end'> <InputAdornment position='end'>
<IconButton <IconButton
onClick={() => onMicrophonePressed()} onClick={() => onMicrophonePressed()}
packages/ui/src/views/chatmessage/audio-recording.css
+1 -1
View File
@@ -115,6 +115,7 @@
} }
.overlay { .overlay {
width: 100%; width: 100%;
height: '54px';
/*targeting Chrome & Safari*/ /*targeting Chrome & Safari*/
display: -webkit-flex; display: -webkit-flex;
/*targeting IE10*/ /*targeting IE10*/
@@ -123,7 +124,6 @@
justify-content: center; justify-content: center;
/*horizontal centering*/ /*horizontal centering*/
align-items: center; align-items: center;
margin-bottom: 12px;
} }
.overlay.hide { .overlay.hide {
display: none; display: none;