fix(totp): make TOTP field detectable by KeePassXC

[Sarthakkad05]

Currently, the TOTP input field is not recognized by KeePassXC due to missing autocomplete attribute and incorrect size.

Changes:

• Added autocomplete="one-time-code" to TOTP input field.
• Removed size="1" to allow detection by KeePassXC.

This makes the field detectable by password managers that support TOTP.

Closes #30025

Summary by CodeRabbit

• New Features
  • The 2FA (TOTP) verification field now supports browser and device autofill for one-time codes, making verification faster and more convenient—especially on mobile where code suggestions are available.
  • Works seamlessly with supported password managers and authenticator apps; manual entry remains available.
  • No changes to the overall 2FA flow or settings.

[changeset-bot]

⚠️ No Changeset found

Latest commit: f10c826

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[dionisio-bot]

Looks like this PR is not ready to merge, because of the following issues:

• This PR is missing the 'stat: QA assured' label
• This PR is missing the required milestone or project

Please fix the issues and try again

If you have any trouble, please check the PR guidelines

[CLAassistant]

All committers have signed the CLA.

[coderabbitai]

Walkthrough

Added autoComplete="one-time-code" to the TOTP authentication code TextInput in the 2FA security screen to support browser autofill for one-time codes. No other changes or API modifications.

Changes

Cohort / File(s)	Summary of Changes
2FA TOTP UI apps/meteor/client/views/account/security/TwoFactorTOTP.tsx	Set TextInput prop autoComplete="one-time-code" for the TOTP code field; no other logic or API changes.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~2 minutes

Poem

I sniff the breeze of one-time code,
A carrot-quick autofill, easing the load.
Tap-tap, hop—no typing spree,
The digits bloom for bun and me.
In fields of forms, I twirl with glee—
Two-factor safe, swift as can be. 🥕✨

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title Check	✅ Passed	The title is concise and accurately describes the primary change: making the TOTP input detectable by KeePassXC, which matches the PR edits to add autocomplete="one-time-code" and remove size="1" to improve password-manager detection.
Docstring Coverage	✅ Passed	No functions found in the changes. Docstring coverage check skipped.

✨ Finishing touches

• 📝 Generate Docstrings

🧪 Generate unit tests

• Create PR with unit tests
• Post copyable unit tests in a comment

---

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

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (3)

apps/meteor/client/views/account/security/TwoFactorTOTP.tsx (3)

161-161: Good fix: adds OTP autofill support.

KeePassXC and modern browsers key off autocomplete="one-time-code". Change looks correct.

Consider mobile UX and avoiding mis-parsing leading zeros. Add numeric hints without switching to type="number":

-<TextInput id={totpCodeId} mie='8px' {...register('authCode')} autoComplete="one-time-code"/>
+<TextInput
+  id={totpCodeId}
+  mie='8px'
+  {...register('authCode')}
+  autoComplete='one-time-code'
+  inputMode='numeric'
+  pattern='[0-9]*'
+  autoCapitalize='off'
+  autoCorrect='off'
+  spellCheck={false}
+/>

---

161-161: Minor: quote style consistency.

Elsewhere props use single quotes; switch "one-time-code" to 'one-time-code' for consistency.

---

161-161: Add autoComplete='one-time-code' to OTP inputs

Apply autoComplete="one-time-code" to the TextInput fields so platform OTP autofill works consistently:

• apps/meteor/client/components/TwoFactorModal/TwoFactorTotpModal.tsx — add autoComplete="one-time-code" to the TextInput.
• apps/meteor/client/components/TwoFactorModal/TwoFactorEmailModal.tsx — add autoComplete="one-time-code" to the TextInput.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

• Jira integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between e8b9f27 and f10c826.

📒 Files selected for processing (1)

• apps/meteor/client/views/account/security/TwoFactorTOTP.tsx (1 hunks)