lfg2025/archy
1
0
Fork 0
Code Issues 9 Pull Requests Actions Packages Projects Releases 44 Wiki Activity

fix: polish form validation and feedback across views

Browse Source 
- Server.vue: Add loading/disabled state to WiFi connect button,
  success toast on WiFi connection
- Credentials.vue: Disable verify button when input empty, add
  disabled styles

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Dorian 2026-03-11 10:49:26 +00:00
parent 1ca83f97ec
commit 112b15b4ea
3 changed files with 10 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
loop/plan.md
View File

@ -316,7 +316,7 @@
- [x] **UXP-03** — Polish error handling across entire frontend. Run `/polish-errors` on every view and store. Ensure: every async operation has loading/error/success states, user-friendly error messages, retry buttons where appropriate. **Acceptance**: No unhandled promise rejections; all errors shown to user.
- [ ] **UXP-04** — Polish all forms. Run `/polish-forms` on: login, onboarding, WiFi config, backup passphrase, channel opening. Ensure: validation feedback, disabled submit during processing, success confirmation. **Acceptance**: All forms have complete validation and feedback.
- [x] **UXP-04** — Polish all forms. Run `/polish-forms` on: login, onboarding, WiFi config, backup passphrase, channel opening. Ensure: validation feedback, disabled submit during processing, success confirmation. **Acceptance**: All forms have complete validation and feedback.
#### Sprint 26: Community Infrastructure (Week 5-8)

2
neode-ui/src/views/Credentials.vue
View File

@ -99,7 +99,7 @@
<input v-model="verifyId" type="text" placeholder="urn:uuid:..." class="credential-input w-full font-mono text-sm" />
</div>
<div class="flex items-center gap-4">
<button @click="verifyCredential" :disabled="verifying" class="glass-button px-6 py-2 text-sm font-medium">
<button @click="verifyCredential" :disabled="verifying || !verifyId" class="glass-button px-6 py-2 text-sm font-medium disabled:opacity-50 disabled:cursor-not-allowed">
{{ verifying ? 'Verifying...' : 'Verify' }}
</button>
<div v-if="verifyResult !== null" class="flex items-center gap-2">

10
neode-ui/src/views/Server.vue
View File

@ -385,8 +385,8 @@
/>
<p v-if="wifiError" class="text-sm text-red-400 mb-3">{{ wifiError }}</p>
<div class="flex gap-2">
<button @click="wifiConnecting = false; wifiPassword = ''; wifiError = ''" class="flex-1 px-3 py-2 glass-button rounded-lg text-sm">Cancel</button>
<button @click="connectToWifi" class="flex-1 px-3 py-2 glass-button rounded-lg text-sm font-medium" :disabled="!wifiPassword">Connect</button>
<button @click="wifiConnecting = false; wifiPassword = ''; wifiError = ''" :disabled="wifiSubmitting" class="flex-1 px-3 py-2 glass-button rounded-lg text-sm">Cancel</button>
<button @click="connectToWifi" class="flex-1 px-3 py-2 glass-button rounded-lg text-sm font-medium disabled:opacity-50 disabled:cursor-not-allowed" :disabled="!wifiPassword || wifiSubmitting">{{ wifiSubmitting ? 'Connecting...' : 'Connect' }}</button>
</div>
</div>
</div>
@ -583,6 +583,7 @@ const showWifiModal = ref(false)
const wifiScanning = ref(false)
const wifiNetworks = ref<WifiNetwork[]>([])
const wifiConnecting = ref(false)
const wifiSubmitting = ref(false)
const wifiSelectedSsid = ref('')
const wifiPassword = ref('')
const wifiError = ref('')
@ -676,15 +677,20 @@ function selectWifi(ssid: string) {
async function connectToWifi() {
if (!wifiPassword.value || !wifiSelectedSsid.value) return
wifiError.value = ''
wifiSubmitting.value = true
try {
await rpcClient.call({ method: 'network.configure-wifi', params: { ssid: wifiSelectedSsid.value, password: wifiPassword.value } })
showWifiModal.value = false
wifiConnecting.value = false
wifiPassword.value = ''
logsToast.value = 'WiFi connected successfully'
setTimeout(() => { logsToast.value = '' }, 4000)
loadInterfaces()
} catch (e) {
wifiError.value = e instanceof Error ? e.message : 'WiFi connection failed. Check password and try again.'
if (import.meta.env.DEV) console.warn('WiFi connection failed', e)
} finally {
wifiSubmitting.value = false
}
}