fix: add local error/success display for test email button

Error and success messages were only shown at page top, not visible
when scrolled to Email tab. Now shows feedback directly below button.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-01-05 22:59:49 +01:00
parent c41cbd30dc
commit ed4ea72f35
2 changed files with 16 additions and 7 deletions

View File

@@ -555,6 +555,13 @@
<span x-show="sendingTestEmail">Sending...</span>
</button>
</div>
<!-- Local feedback for test email -->
<div x-show="testEmailError" x-transition class="mt-3 p-3 bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded-lg">
<p class="text-sm text-red-700 dark:text-red-400" x-text="testEmailError"></p>
</div>
<div x-show="testEmailSuccess" x-transition class="mt-3 p-3 bg-green-50 dark:bg-green-900/20 border border-green-200 dark:border-green-800 rounded-lg">
<p class="text-sm text-green-700 dark:text-green-400" x-text="testEmailSuccess"></p>
</div>
<p class="mt-2 text-xs text-gray-500 dark:text-gray-400">
Send a test email to verify the platform email configuration is working.
</p>

View File

@@ -78,6 +78,8 @@ function adminSettings() {
emailEditMode: false,
testEmailAddress: '',
sendingTestEmail: false,
testEmailError: null,
testEmailSuccess: null,
async init() {
// Guard against multiple initialization
@@ -464,13 +466,13 @@ function adminSettings() {
async sendTestEmail() {
if (!this.testEmailAddress) {
this.error = 'Please enter a test email address';
this.testEmailError = 'Please enter a test email address';
return;
}
this.sendingTestEmail = true;
this.error = null;
this.successMessage = null;
this.testEmailError = null;
this.testEmailSuccess = null;
try {
const data = await apiClient.post('/admin/settings/email/test', {
@@ -478,16 +480,16 @@ function adminSettings() {
});
if (data.success) {
this.successMessage = `Test email sent to ${this.testEmailAddress}`;
this.testEmailSuccess = `Test email sent to ${this.testEmailAddress}`;
setTimeout(() => {
this.successMessage = null;
this.testEmailSuccess = null;
}, 5000);
} else {
this.error = data.message || 'Failed to send test email';
this.testEmailError = data.message || 'Failed to send test email';
}
} catch (error) {
settingsLog.error('Failed to send test email:', error);
this.error = error.message || 'Failed to send test email';
this.testEmailError = error.message || 'Failed to send test email';
} finally {
this.sendingTestEmail = false;
}