diff --git a/src/chat/components/ConversationSession.tsx b/src/chat/components/ConversationSession.tsx index 45f93c88e..54c575483 100644 --- a/src/chat/components/ConversationSession.tsx +++ b/src/chat/components/ConversationSession.tsx @@ -1514,18 +1514,22 @@ export function ConversationSession({
{pendingSend.busy - ? 'Checking send…' + ? pendingSend.checking + ? 'Checking send…' + : 'Sending…' : pendingSend.pending ? 'Send not confirmed.' : 'Send recovery unavailable.'} - + {(!pendingSend.busy || pendingSend.checking) && ( + + )}
)} {readOnly ? ( diff --git a/src/chat/components/RetryComposer.tsx b/src/chat/components/RetryComposer.tsx index f5ebc3714..9cef9737e 100644 --- a/src/chat/components/RetryComposer.tsx +++ b/src/chat/components/RetryComposer.tsx @@ -545,19 +545,23 @@ export function RetryComposer({
{pending.busy - ? 'Checking send…' + ? pending.checking + ? 'Checking send…' + : 'Sending…' : pending.pending ? 'Send not confirmed.' : 'Send recovery unavailable.'} - + {(!pending.busy || pending.checking) && ( + + )}
)} {draft.draft && ( diff --git a/src/chat/components/usePendingSend.ts b/src/chat/components/usePendingSend.ts index 5dd208f62..954da9b53 100644 --- a/src/chat/components/usePendingSend.ts +++ b/src/chat/components/usePendingSend.ts @@ -31,6 +31,7 @@ export function usePendingSend( pending: null as SendEnvelope | null, ready: false, busy: true, + checking: true, error: '', }) const [submitted, setSubmitted] = useState(null) @@ -86,6 +87,7 @@ export function usePendingSend( return (service.current = { key, store, coordinator }) } async function perform( + action: 'send' | 'retry' | 'check', operation: (coordinator: PendingSendCoordinator) => Promise, ) { if (!enabled) return @@ -93,7 +95,12 @@ export function usePendingSend( working.current = true const acknowledge = accepted.current if (mounted.current) - setState((previous) => ({ ...previous, busy: true, error: '' })) + setState((previous) => ({ + ...previous, + busy: true, + checking: action === 'check', + error: '', + })) try { const { coordinator, store } = getService() const pending = store.read() @@ -111,6 +118,7 @@ export function usePendingSend( pending: nextPending, ready: true, busy: false, + checking: false, error: 'error' in result ? (result.error ?? '') : '', }) } catch (error) { @@ -125,6 +133,7 @@ export function usePendingSend( pending, ready: false, busy: false, + checking: false, error: error instanceof Error ? error.message @@ -137,10 +146,10 @@ export function usePendingSend( useEffect(() => { if (!enabled) return mounted.current = true - void perform((coordinator) => coordinator.check()) + void perform('check', (coordinator) => coordinator.check()) const changed = (event: StorageEvent) => { if (event.key === key || event.key === null) - void perform((coordinator) => coordinator.check()) + void perform('check', (coordinator) => coordinator.check()) } window.addEventListener('storage', changed) return () => { @@ -153,8 +162,8 @@ export function usePendingSend( submitted, forgetSubmitted: () => setSubmitted(null), submit: (input: NewSend) => - perform((coordinator) => coordinator.submit(input)), - retry: () => perform((coordinator) => coordinator.retry()), - check: () => perform((coordinator) => coordinator.check()), + perform('send', (coordinator) => coordinator.submit(input)), + retry: () => perform('retry', (coordinator) => coordinator.retry()), + check: () => perform('check', (coordinator) => coordinator.check()), } }