feat(settings): add Enable button for email with logout confirmation

[evanhutnik]

Summary

• Replace the tooltip/question-mark on the disabled email setting with an Enable button that shows an inline confirmation dialog
• Clicking "Logout" in the confirmation logs the user out and redirects to Google sign-in so they can grant email permissions
• Add a toast notification when disabling email to inform the user that data clearing may take a moment
• Fix layout shift in the GitHub settings row caused by the loading state height mismatch

[coderabbitai]

Caution

Review failed

Pull request was closed or merged during review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: ASSERTIVE

Plan: Pro

Run ID: 77e2d11e-4ed8-4006-9b8c-7c891268a21c

📥 Commits

Reviewing files that changed from the base of the PR and between 627cd26 and ae79fd9.

📒 Files selected for processing (1)

• js/app/packages/app/component/settings/Account.tsx

---

📝 Walkthrough

Summary by CodeRabbit

• UI/UX Improvements

  • Replaced tooltip-based email explanation with an explicit modal workflow that shows enablement requirements and clear "Logout" / "Cancel" choices.
  • Improved loading state layout for third-party account sections for consistent visual alignment.

• Bug Fixes

  • Confirming email disable now provides success/failure notifications instead of silently closing the dialog.

Walkthrough

Replaced the tooltip/popover email-disabled UI with an explicit enable modal and requirements panel, added logout/cancel actions, made the email-disconnect handler async and surface success/failure toasts, and adjusted GitHub "Loading..." fallback markup for consistent layout.

Changes

Cohort / File(s)	Summary
Email Management UI Refactor js/app/packages/app/component/settings/Account.tsx	Replaced tooltip/Popover/BetaTooltip flow with a showEnableEmailModal modal and requirements panel (Logout/Cancel). Made disconnectEmail confirm handler async and handle results via .match(...) to show success/failure toasts. Updated GitHub loading fallback markup with fixed height and alignment classes.

Possibly related PRs

• fix(fe): Prompts for disabled email #2124: Updates the same Account.tsx email disabled/enable UI and logout flow, touching the tooltip/modal and permission handling logic.

🚥 Pre-merge checks | ✅ 2

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title follows the conventional commits format with 'feat:' prefix, is under 72 characters (68 chars), and accurately describes the main change: adding an Enable button for email with logout confirmation.
Description check	✅ Passed	The description is directly related to the changeset, detailing the four main modifications: replacing the tooltip with an Enable button, adding logout confirmation, adding toast notifications for disabling email, and fixing layout shifts.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[github-actions]

Preview: https://evan-enable-email-prompt-e0cj9f.preview.macro.com/app (25dd29e)

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@js/app/packages/app/component/settings/Account.tsx`:
- Around line 287-290: The success toast is shown immediately after calling
disconnectEmail() which returns a ResultAsync; change the flow to await/inspect
the ResultAsync returned by disconnectEmail() (or chain its promise) and only
call toast.success('Email disabled …') and setShowEmailModal(false) after a
successful result, while handling errors by showing a toast.error or appropriate
failure handling if the ResultAsync yields an error; locate the call to
disconnectEmail() in the Account component and update it to check the resolved
Result (or use .map/.match/.mapErr) before emitting success UI changes.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: ASSERTIVE

Plan: Pro

Run ID: 5744b200-3900-4e78-94b0-fed9f63ffc75

📥 Commits

Reviewing files that changed from the base of the PR and between 0a3900c and 627cd26.

📒 Files selected for processing (1)

• js/app/packages/app/component/settings/Account.tsx