[BUG] Auto-Approval Enabled checkbox located in the Auto-Approve settings tab

[EzekielTay]

Problem (one or two sentences)

Either ticking or unticking the Auto-Approval Enabled' checkbox in the Auto-Approve settings tab does not enable the save button.
User must select or deselect a specific configuration eg. read/write before the save button becomes available.
I reported this since this checkbox behaves differently to other checkboxes in the other settings tabs.

Context (who is affected and when)

This bug affects the user when the user attempts to activate or deactivate auto-approval via the auto-approval enabled checkbox.

Reproduction steps

1. Click 'settings' option for Roo Code
2. Navigate to "Auto-Approve" settings tab
3. Tick or Untick Auto-Approve Enabled box (Save button will remain unselectable)

Expected result

Save button should be made selectable for user to save configuration. Configuration should not be saved until the user clicks the "save" button

Actual result

Save button remains unselectable for user. However, the settings are updated automatically.

Variations tried (optional)

No response

App Version

v3.40.1

API Provider (optional)

None

Model Used (optional)

No response

Roo Code Task Links (optional)

No response

Relevant logs or errors (optional)

[roomote]

I've analyzed this issue and here's my proposed implementation plan:

Root Cause

The 'Auto-Approve Enabled' checkbox in AutoApproveSettings.tsx (lines 119-126) is handled differently from other settings:

1. It reads autoApprovalEnabled directly from useExtensionState() instead of the cached state
2. It immediately saves via vscode.postMessage({ type: "autoApprovalEnabled", bool: newValue }) on toggle
3. It does NOT call setCachedStateField, so the save button never becomes enabled

Proposed Fix

1. Modify AutoApproveSettings.tsx

• Change the checkbox onChange handler to use setCachedStateField instead of directly calling setAutoApprovalEnabled and vscode.postMessage
• Accept autoApprovalEnabled as a prop from the cached state instead of getting it from useExtensionState()

2. Modify SettingsView.tsx

• Pass autoApprovalEnabled from cachedState to AutoApproveSettings
• Add autoApprovalEnabled to the handleSubmit function to persist the setting when the Save button is clicked

This approach ensures:

• The checkbox toggle enables the Save button (consistent with other settings)
• The setting is only persisted when the user clicks Save
• The behavior matches user expectations

Please mention @roomote in a comment saying that you approve this plan, and I'll proceed with the implementation.

[bngfavored]

@roomote Will this also stop any timers that are running?

[roomote]

Good question! I have investigated the timer behavior.

Current behavior: When you toggle the Auto-Approval Enabled checkbox, it calls setAutoApprovalEnabled() which immediately updates the React context state. The FollowUpSuggest component reads autoApprovalEnabled from this context, and its countdown timer effect has autoApprovalEnabled in its dependency array. So when you disable auto-approval, the countdown timer stops immediately (even though the Save button does not activate).

With my proposed fix: There are two approaches I could take:

1. Deferred timer cancellation (strict Save button pattern): Timer only stops after clicking Save. This is consistent with "changes only apply on Save" but means there is a brief period where timers could still be running after unchecking the box.

2. Hybrid approach (immediate timer cancellation + Save button): Keep the immediate state update for timers (current UX preserved), but also track the change for the Save button. Timer stops immediately on toggle, and the setting is persisted when Save is clicked.

I am going to implement Option 2 (hybrid approach) as it preserves the current UX where unchecking the box immediately stops any active countdown timers, while still enabling the Save button. This seems like the safest approach. I will open a PR shortly with this implementation.

[roomote]

Opened PR #10754 with my attempt at addressing this issue using the hybrid approach I described above.

To summarize the implementation:

• The "Auto-Approval Enabled" checkbox now enables the Save button when toggled (consistent with other settings)
• Countdown timers will still stop immediately when the checkbox is unchecked (preserving current UX)
• The setting is persisted when the user clicks Save

Feedback welcome!