fix(web): clear revealed credential on edit and auto-hide after 30s

[devin-ai-integration]

Summary

Fixes two UX issues with credential reveal in the Credentials tab:

1. Stale value after edit: When a credential was revealed and then edited, the old plaintext remained visible until manually hidden. Now revealedValues[key] is cleared in the onSaved callback so the row immediately returns to masked dots.

2. Indefinite visibility: Revealed values previously stayed visible until manually hidden or page navigation. Now each reveal starts a 30-second auto-hide timer — the value fades back to •••••••• automatically. Manually hiding cancels the timer; re-revealing resets it.

Type of change

• Bug fix

Test plan

• Existing tests pass (TypeScript typecheck: npx tsc --noEmit passes)
• Added/updated tests for new behavior
• Manual testing (describe below)

Verified:

• Reveal a credential → edit it → save → row shows masked dots (not the old value)
• Reveal a credential → wait 30s → value auto-hides
• Reveal → manually hide before 30s → hides immediately, no ghost timer

Security checklist

• No secrets or credentials in code
• No new unauthenticated endpoints
• Input validation on new API surfaces
• Checked for OWASP top 10 (injection, XSS, etc.)

Link to Devin session: https://app.devin.ai/sessions/946ef78afe184a9fab689ee139cddd69

[devin-ai-integration]

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

• Address comments on this PR. Add '(aside)' to your comment to have me ignore it.
• Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

• Disable automatic comment, CI, and merge conflict monitoring

[greptile-apps]

Greptile Summary

This PR fixes two UX issues in the Credentials tab: stale plaintext remaining visible after editing a revealed credential, and revealed values persisting indefinitely. The change clears revealedValues[key] in the onSaved callback and introduces a 30-second auto-hide timer via useRef-tracked setTimeout calls with proper cleanup on unmount and manual hide.

• A scheduleAutoHide helper manages per-key timers, cancelling any existing timer before starting a fresh one on re-reveal, and the unmount useEffect clears all live timers.
• The onSaved callback correctly deletes the revealed state entry, but does not cancel the corresponding auto-hide timer, leaving a ghost setTimeout that will fire and cause a spurious (no-op) state update after 30 seconds.

Confidence Score: 4/5

Safe to merge; the ghost timer in the save path triggers only a no-op state update with no visible user impact.

The core logic — clearing revealed state on save and auto-hiding after 30 seconds — is correct and well-structured. The only gap is that the onSaved callback cancels the displayed value but leaves the auto-hide timer running, so it fires 30 seconds after a save and performs a redundant React state update. This is benign at runtime but is an inconsistency worth fixing before the pattern spreads to other callbacks.

web/src/pages/vault/CredentialsTab.tsx — specifically the onSaved callback where timer cancellation is missing.

Important Files Changed

Filename	Overview
web/src/pages/vault/CredentialsTab.tsx	Adds auto-hide timer (30s) for revealed credentials and clears revealed values on save; timer cleanup is missing in the onSaved path, causing a spurious state update after the timeout fires.

_{Reviews (1): Last reviewed commit: "fix(web): clear revealed credential on e..." | Re-trigger Greptile}

[greptile-apps]

The onSaved callback clears the revealed value but does not cancel the corresponding auto-hide timer. If a credential was revealed at t=0 and then saved at t=10s, the timer started by scheduleAutoHide will still fire at t=30s and call setRevealedValues unnecessarily — creating a new object via {...prev} and triggering a React re-render even though the key is already gone. The fix mirrors what the manual-hide branch already does: cancel the timer before clearing the state.

Suggested change

	onSaved={() => {
	// Clear revealed value for the edited credential so stale plaintext
	// is never shown after a value change.
	if (editingKey) {
	setRevealedValues((prev) => {
	const next = { ...prev };
	delete next[editingKey];
	return next;
	});
	}
	onSaved={() => {
	// Clear revealed value for the edited credential so stale plaintext
	// is never shown after a value change.
	if (editingKey) {
	if (revealTimers.current[editingKey]) {
	clearTimeout(revealTimers.current[editingKey]);
	delete revealTimers.current[editingKey];
	}
	setRevealedValues((prev) => {
	const next = { ...prev };
	delete next[editingKey];
	return next;
	});
	}