Spaces:
Runtime error
Runtime error
File size: 1,983 Bytes
de234b1 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 | import React from 'react';
import { TextField, Button, Box, IconButton, CircularProgress } from '@mui/material';
import PaperPlaneIcon from '@mui/icons-material/Send';
import RefreshIcon from '@mui/icons-material/Refresh';
import { grey } from '@mui/material/colors';
const ChatInput = ({
inputText,
handleInputChange,
handleKeyDown,
handleFormSubmit,
loading,
clearChatHistory,
}) => {
return (
<Box
component="form"
onSubmit={handleFormSubmit}
sx={{
position: 'flex',
bottom: 0,
left: 0,
right: 0,
backgroundColor: '#1D5B79',
borderTop: '1px solid #DDD',
py: 1,
px: 2,
display: 'flex',
justifyContent: 'space-between',
minHeight: 80,
borderRadius:'15px'
}}
>
<TextField
value={inputText}
onChange={handleInputChange}
onKeyDown={(e) => handleKeyDown(e, handleFormSubmit)}
placeholder="Type your message here and press Command+Enter to send"
multiline
rows={2}
rowsmax={2}
variant="outlined"
disabled={loading}
sx={{ flexGrow: 1, maxHeight: '80%', mr: 1, ml: -1, backgroundColor: 'rgba(255, 255, 255, 0.8)',
borderRadius:'15px'}}
/>
<Box sx={{ display: 'flex', alignItems: 'center' }}>
<Button type="submit" color="primary" variant="contained" disabled={loading} sx={{ backgroundColor:'#5499de' , height: '100%', mr: 1, borderRadius:'15px'}}>
{loading ? <CircularProgress size={24} /> : <PaperPlaneIcon />}
</Button>
<IconButton
color="primary"
onClick={clearChatHistory}
disabled={loading}
sx={{
height: '100%',
width: 50,
backgroundColor: grey[300],
borderRadius:'15px'
}}
>
<RefreshIcon />
</IconButton>
</Box>
</Box>
);
};
export default ChatInput;
|