Fix: block file clip input when chat input are blocked

This commit is contained in:
igorrCarvalho 2024-06-07 17:50:15 -03:00
commit 0d3780826d
2 changed files with 9 additions and 3 deletions

View file

@ -5,17 +5,20 @@ const UploadFileButton = ({
fileInputRef, fileInputRef,
handleFileChange, handleFileChange,
handleButtonClick, handleButtonClick,
lockChat,
}) => { }) => {
return ( return (
<div> <div>
<input <input
disabled={lockChat}
type="file" type="file"
ref={fileInputRef} ref={fileInputRef}
style={{ display: "none" }} style={{ display: "none" }}
onChange={handleFileChange} onChange={handleFileChange}
/> />
<Button <Button
className="font-bold text-white transition-all hover:text-muted-foreground" disabled={lockChat}
className={`font-bold text-white transition-all ${lockChat ? "cursor-not-allowed" : "hover:text-muted-foreground"}`}
onClick={handleButtonClick} onClick={handleButtonClick}
variant="none" variant="none"
size="none" size="none"

View file

@ -92,8 +92,11 @@ export default function ChatInput({
/> />
</div> </div>
<div className="absolute bottom-2 left-4"> <div
className={`absolute bottom-2 left-4 ${lockChat || saveLoading ? "cursor-not-allowed" : ""}`}
>
<UploadFileButton <UploadFileButton
lockChat={lockChat || saveLoading}
fileInputRef={fileInputRef} fileInputRef={fileInputRef}
handleFileChange={handleFileChange} handleFileChange={handleFileChange}
handleButtonClick={handleButtonClick} handleButtonClick={handleButtonClick}
@ -110,7 +113,7 @@ export default function ChatInput({
key={file.id} key={file.id}
onDelete={() => { onDelete={() => {
setFiles((prev: FilePreviewType[]) => setFiles((prev: FilePreviewType[]) =>
prev.filter((f) => f.id !== file.id) prev.filter((f) => f.id !== file.id),
); );
// TODO: delete file on backend // TODO: delete file on backend
}} }}