feat: improve welcome back UX by pre-filling input instead of auto-submitting

- Add shouldFillInput and inputFillText state to useWelcomeBack hook
- When user selects 'continue previous work', pre-fill input with context prompt
- Allow users to review/edit the prompt before submitting
- Move input filling logic into useWelcomeBack hook for better encapsulation
This commit is contained in:
pomelo-nwu
2025-09-10 14:58:08 +08:00
parent c826d5f330
commit ab7a3259c5
2 changed files with 29 additions and 10 deletions

View File

@@ -624,7 +624,7 @@ const App = ({ config, settings, startupWarnings = [], version }: AppProps) => {
welcomeBackChoice, welcomeBackChoice,
handleWelcomeBackSelection, handleWelcomeBackSelection,
handleWelcomeBackClose, handleWelcomeBackClose,
} = useWelcomeBack(config, submitQuery); } = useWelcomeBack(config, submitQuery, buffer);
// Message queue for handling input during streaming // Message queue for handling input during streaming
const { messageQueue, addMessage, clearQueue, getQueuedMessagesText } = const { messageQueue, addMessage, clearQueue, getQueuedMessagesText } =

View File

@@ -15,17 +15,21 @@ export interface WelcomeBackState {
welcomeBackInfo: ProjectSummaryInfo | null; welcomeBackInfo: ProjectSummaryInfo | null;
showWelcomeBackDialog: boolean; showWelcomeBackDialog: boolean;
welcomeBackChoice: 'restart' | 'continue' | null; welcomeBackChoice: 'restart' | 'continue' | null;
shouldFillInput: boolean;
inputFillText: string | null;
} }
export interface WelcomeBackActions { export interface WelcomeBackActions {
handleWelcomeBackSelection: (choice: 'restart' | 'continue') => void; handleWelcomeBackSelection: (choice: 'restart' | 'continue') => void;
handleWelcomeBackClose: () => void; handleWelcomeBackClose: () => void;
checkWelcomeBack: () => Promise<void>; checkWelcomeBack: () => Promise<void>;
clearInputFill: () => void;
} }
export function useWelcomeBack( export function useWelcomeBack(
config: Config, config: Config,
submitQuery: (query: string) => void, submitQuery: (query: string) => void,
buffer: { setText: (text: string) => void },
): WelcomeBackState & WelcomeBackActions { ): WelcomeBackState & WelcomeBackActions {
const [welcomeBackInfo, setWelcomeBackInfo] = const [welcomeBackInfo, setWelcomeBackInfo] =
useState<ProjectSummaryInfo | null>(null); useState<ProjectSummaryInfo | null>(null);
@@ -33,6 +37,8 @@ export function useWelcomeBack(
const [welcomeBackChoice, setWelcomeBackChoice] = useState< const [welcomeBackChoice, setWelcomeBackChoice] = useState<
'restart' | 'continue' | null 'restart' | 'continue' | null
>(null); >(null);
const [shouldFillInput, setShouldFillInput] = useState(false);
const [inputFillText, setInputFillText] = useState<string | null>(null);
// Check for conversation history on startup // Check for conversation history on startup
const checkWelcomeBack = useCallback(async () => { const checkWelcomeBack = useCallback(async () => {
@@ -55,19 +61,16 @@ export function useWelcomeBack(
setShowWelcomeBackDialog(false); setShowWelcomeBackDialog(false);
if (choice === 'continue' && welcomeBackInfo?.content) { if (choice === 'continue' && welcomeBackInfo?.content) {
// Load conversation history as context // Create the context message to fill in the input box
const contextMessage = `Based on our previous conversation, here's the current project status: const contextMessage = `@.qwen/PROJECT_SUMMARY.md, Based on our previous conversation,Let's continue?`;
${welcomeBackInfo.content} // Set the input fill state instead of directly submitting
setInputFillText(contextMessage);
Let's continue where we left off. What would you like to work on next?`; setShouldFillInput(true);
// Submit the context as the initial prompt
submitQuery(contextMessage);
} }
// If choice is 'restart', just close the dialog and continue normally // If choice is 'restart', just close the dialog and continue normally
}, },
[welcomeBackInfo, submitQuery], [welcomeBackInfo],
); );
const handleWelcomeBackClose = useCallback(() => { const handleWelcomeBackClose = useCallback(() => {
@@ -75,6 +78,19 @@ Let's continue where we left off. What would you like to work on next?`;
setShowWelcomeBackDialog(false); setShowWelcomeBackDialog(false);
}, []); }, []);
const clearInputFill = useCallback(() => {
setShouldFillInput(false);
setInputFillText(null);
}, []);
// Handle input filling from welcome back
useEffect(() => {
if (shouldFillInput && inputFillText) {
buffer.setText(inputFillText);
clearInputFill();
}
}, [shouldFillInput, inputFillText, buffer, clearInputFill]);
// Check for welcome back on mount // Check for welcome back on mount
useEffect(() => { useEffect(() => {
checkWelcomeBack(); checkWelcomeBack();
@@ -85,9 +101,12 @@ Let's continue where we left off. What would you like to work on next?`;
welcomeBackInfo, welcomeBackInfo,
showWelcomeBackDialog, showWelcomeBackDialog,
welcomeBackChoice, welcomeBackChoice,
shouldFillInput,
inputFillText,
// Actions // Actions
handleWelcomeBackSelection, handleWelcomeBackSelection,
handleWelcomeBackClose, handleWelcomeBackClose,
checkWelcomeBack, checkWelcomeBack,
clearInputFill,
}; };
} }