diff --git a/src/components/chat/ChatFab.jsx b/src/components/chat/ChatFab.jsx index 4b2194f..cd48ff5 100644 --- a/src/components/chat/ChatFab.jsx +++ b/src/components/chat/ChatFab.jsx @@ -13,9 +13,9 @@ import chatAutomat, { selectPendingAskUser, selectHasPendingAsk } from '../../au import { CHAT_BUSY, CHAT_FAB_BUSY, - CHAT_FAB_PENDING, CHAT_FAB_SHADOW_BUSY, + CHAT_FAB_PENDING, CHAT_FAB_SHADOW_BUSY, CHAT_FAB_SHADOW_IDLE, - CHAT_FAB_SHADOW_PENDING, RED, + CHAT_FAB_SHADOW_PENDING, RED, RED_GLOW, WHITE, } from '../../colors'; @@ -59,18 +59,12 @@ export default class ChatFab extends PureComponent { const { isOpen, conversationState, streamPhase, isSending, hasPendingAsk, pendingAsk } = this.state; const isBusy = conversationState === 'busy' || streamPhase === 'thinking' || streamPhase === 'working' || isSending; - let tooltipTitle = 'KI-Chat öffnen'; let ariaLabel = 'KI-Chat'; if (isOpen) { - tooltipTitle = 'KI-Chat schließen'; ariaLabel = 'KI-Chat schließen'; } else if (hasPendingAsk) { - tooltipTitle = pendingAsk?.question - ? `Antwort erforderlich: „${pendingAsk.question}“` - : 'Antwort erforderlich: Das Modell wartet auf Ihre Eingabe'; ariaLabel = 'KI-Chat: Antwort erforderlich'; } else if (isBusy) { - tooltipTitle = 'Modell antwortet gerade…'; ariaLabel = 'KI-Chat: Modell antwortet'; } @@ -143,77 +137,75 @@ export default class ChatFab extends PureComponent { /> )} - - - ({ - width: 54, - height: 54, - boxShadow: hasPendingAsk - ? CHAT_FAB_SHADOW_PENDING - : isBusy + + ({ + width: 54, + height: 54, + boxShadow: hasPendingAsk + ? CHAT_FAB_SHADOW_PENDING + : isBusy ? CHAT_FAB_SHADOW_BUSY : CHAT_FAB_SHADOW_IDLE, - background: hasPendingAsk - ? CHAT_FAB_PENDING - : isBusy + background: hasPendingAsk + ? CHAT_FAB_PENDING + : isBusy ? CHAT_FAB_BUSY : `linear-gradient(135deg, ${theme.palette.primary.main} 0%, ${theme.palette.primary.dark} 100%)`, - })} - > - {isOpen ? ( - - ) : hasPendingAsk ? ( - - ) : isBusy ? ( - - ) : ( - - )} - - - + })} + > + {isOpen ? ( + + ) : hasPendingAsk ? ( + + ) : isBusy ? ( + + ) : ( + + )} + + );