Uh oh!
There was an error while loading. Please reload this page.
fix: clear modal input and error state on close - #3091
Conversation
The latest updates on your projects. Learn more about Vercel for GitHub.
2 Skipped Deployments
|
📝 WalkthroughSummary by CodeRabbit
WalkthroughAuthentication and connector modals now clear transient form state when closed. Connector disconnection also resets token, connection-attempt, and error state through a new ChangesModal Form State Reset
Suggested reviewers: 🚥 Pre-merge checks | ✅ 4✅ Passed checks (4 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Codecov Report❌ Patch coverage is 📢 Thoughts on this report? Let us know! |
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@app/components/Header/ConnectorModal.vue`:
- Around line 27-31: Update the isConnected watcher in ConnectorModal so
resetForm() does not clear an existing connector error from refreshState(), such
as “Connection lost”; only reset the form for intentional close/manual
disconnect or when no connector error is present.
🪄 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: CHILL
Plan: Pro Plus
Run ID: 9db44543-8a59-4662-8058-74fc412cd344
📒 Files selected for processing (3)
app/components/Header/AuthModal.client.vueapp/components/Header/ConnectorModal.vueapp/composables/useConnector.ts
| watch(isConnected, connected => { | ||
| if (!connected) { | ||
| tokenInput.value = '' | ||
| hasAttemptedConnect.value = false | ||
| resetForm() | ||
| } | ||
| }) |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟠 Major | ⚡ Quick win
🧩 Analysis chain
🏁 Script executed:
#!/bin/bashset -euo pipefail
echo"Locate file and related symbols"
fd -p 'app/components/Header/ConnectorModal.vue'.||true
wc -l app/components/Header/ConnectorModal.vue
echoecho"Relevant file sections"
cat -n app/components/Header/ConnectorModal.vue | sed -n '1,260p'echoecho"Search for clearError and error propagation"
rg -n "clearError|error\.value|useConnector|resetForm|refreshState|connection lost|Connection lost" app -SRepository: npmx-dev/npmx.dev
Length of output: 13586
🏁 Script executed:
#!/bin/bashset -euo pipefail
echo"Relevant useConnector sections"
cat -n app/composables/useConnector.ts | sed -n '1,220p'
cat -n app/composables/useConnector.ts | sed -n '410,450p'echoecho"Shared composable usage of clearError"
rg -n "function clearError|clearError\(|error\.(value|= null)|\.error\s*=\s*null" app/composables/useConnector.ts app -S | sed -n '1,120p'echoecho"Static read-only invariant probe: parse resetForm callers and clearError order"
python3 - <<'PY'from pathlib import Pathp = Path('app/components/Header/ConnectorModal.vue')s = p.read_text()checks = { "resetForm_has_clearError": "function resetForm() {\n tokenInput.value = ''\n hasAttemptedConnect.value = false\n clearError()\n}" in s, "watch_calls_resetForm_on_disconnect": "if (!connected) {\n resetForm()\n }" in s, "watch_has_error_guard": "!error.value" in s and "if (!connected && !error.value)" in s,}print(checks)for name, ok in checks.items(): print(f"{name}: {ok}")PYRepository: npmx-dev/npmx.dev
Length of output: 11898
Preserve connection-loss errors in the watcher.
refreshState() sets state.value.error to 'Connection lost' when /state fails and also exposes this via error. The isConnected watcher then calls resetForm(), which sets state.value.error = null; this clears the shared connector error before the UI can report it. Only clear errors for intentional close/manual disconnect, or skip the form reset when a connector error is already present.
Suggested fix
watch(isConnected, connected => {
- if (!connected) {+ if (!connected && !error.value) {
resetForm()
}
})📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| watch(isConnected, connected => { | |
| if (!connected) { | |
| tokenInput.value = '' | |
| hasAttemptedConnect.value = false | |
| resetForm() | |
| } | |
| }) | |
| watch(isConnected, connected => { | |
| if (!connected && !error.value) { | |
| resetForm() | |
| } | |
| }) |
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@app/components/Header/ConnectorModal.vue` around lines 27 - 31, Update the
isConnected watcher in ConnectorModal so resetForm() does not clear an existing
connector error from refreshState(), such as “Connection lost”; only reset the
form for intentional close/manual disconnect or when no connector error is
present.
Uh oh!
There was an error while loading. Please reload this page.
iiio2
commented
Jul 30, 2026
Thanks @ghostdevv . 😊 |
ghostdevv
commented
Jul 30, 2026
np! |
Both the Local Connector and Atmosphere modals kept their form state after being dismissed. If a connection attempt failed, closing the modal and reopening it showed the previously entered token/handle still populated, along with the stale error message from the last attempt. Now, both modals now reset their form state when the dialog closes.
Before:
when we write on input fieldn closes it and opens it again, we can still see the input and error message.
After:
Now we cannot see.