| ... | ... | @@ -1,5 +1,5 @@ |
| 1 | 1 | import { type ApprovalRequestId } from "@t3tools/contracts"; |
| 2 | | import { memo, useEffect, useEffectEvent, useRef, useState } from "react"; |
| 2 | import { memo, useCallback, useEffect, useRef, useState } from "react"; |
| 3 | 3 | import { type PendingUserInput } from "../../session-logic"; |
| 4 | 4 | import { |
| 5 | 5 | derivePendingUserInputProgress, |
| ... | ... | @@ -109,21 +109,24 @@ const ComposerPendingUserInputCard = memo(function ComposerPendingUserInputCard( |
| 109 | 109 | }; |
| 110 | 110 | }, []); |
| 111 | 111 | |
| 112 | | const handleOptionSelection = useEffectEvent((questionId: string, optionLabel: string) => { |
| 113 | | if (activeQuestion?.multiSelect) { |
| 112 | const handleOptionSelection = useCallback( |
| 113 | (questionId: string, optionLabel: string) => { |
| 114 | if (activeQuestion?.multiSelect) { |
| 115 | onToggleOption(questionId, optionLabel); |
| 116 | return; |
| 117 | } |
| 118 | setOptimisticSingleSelect({ questionId, optionLabel }); |
| 114 | 119 | onToggleOption(questionId, optionLabel); |
| 115 | | return; |
| 116 | | } |
| 117 | | setOptimisticSingleSelect({ questionId, optionLabel }); |
| 118 | | onToggleOption(questionId, optionLabel); |
| 119 | | if (autoAdvanceTimerRef.current !== null) { |
| 120 | | window.clearTimeout(autoAdvanceTimerRef.current); |
| 121 | | } |
| 122 | | autoAdvanceTimerRef.current = window.setTimeout(() => { |
| 123 | | autoAdvanceTimerRef.current = null; |
| 124 | | onAdvanceRef.current(); |
| 125 | | }, 200); |
| 126 | | }); |
| 120 | if (autoAdvanceTimerRef.current !== null) { |
| 121 | window.clearTimeout(autoAdvanceTimerRef.current); |
| 122 | } |
| 123 | autoAdvanceTimerRef.current = window.setTimeout(() => { |
| 124 | autoAdvanceTimerRef.current = null; |
| 125 | onAdvanceRef.current(); |
| 126 | }, 200); |
| 127 | }, |
| 128 | [activeQuestion, onToggleOption], |
| 129 | ); |
| 127 | 130 | |
| 128 | 131 | // Keyboard shortcut: number keys 1-9 select corresponding options when focus is |
| 129 | 132 | // outside editable fields. Multi-select prompts toggle options in place; single- |
| ... | ... | @@ -154,7 +157,7 @@ const ComposerPendingUserInputCard = memo(function ComposerPendingUserInputCard( |
| 154 | 157 | }; |
| 155 | 158 | document.addEventListener("keydown", handler); |
| 156 | 159 | return () => document.removeEventListener("keydown", handler); |
| 157 | | }, [activeQuestion, isCollapsed, isResponding]); |
| 160 | }, [activeQuestion, handleOptionSelection, isCollapsed, isResponding]); |
| 158 | 161 | |
| 159 | 162 | if (!activeQuestion) { |
| 160 | 163 | return null; |