refactor: make UI notifications section collapsible and simplify descriptions

Wraps the UI Notifications section in a details/summary element for progressive disclosure. Updates all setting references from containerEl to notifDetails to properly nest settings within the collapsible section. Simplifies setting descriptions to be more concise.
This commit is contained in:
2025-10-26 08:31:16 -04:00
parent 5684124815
commit cb62483e91

View File

@@ -196,19 +196,19 @@ export class MCPServerSettingTab extends PluginSettingTab {
configDisplay.textContent = JSON.stringify(mcpConfig, null, 2); configDisplay.textContent = JSON.stringify(mcpConfig, null, 2);
// Notification Settings // Notification Settings
containerEl.createEl('h3', {text: 'UI Notifications'}); const notifDetails = containerEl.createEl('details');
notifDetails.style.marginBottom = '20px';
const notifDesc = containerEl.createEl('p', { const notifSummary = notifDetails.createEl('summary');
text: 'Display notifications in Obsidian UI when MCP tools are called. Useful for monitoring API activity and debugging.' notifSummary.style.fontSize = '1.17em';
}); notifSummary.style.fontWeight = 'bold';
notifDesc.style.fontSize = '0.9em'; notifSummary.style.marginBottom = '12px';
notifDesc.style.color = 'var(--text-muted)'; notifSummary.style.cursor = 'pointer';
notifDesc.style.marginBottom = '12px'; notifSummary.setText('UI Notifications');
// Enable notifications // Enable notifications
new Setting(containerEl) new Setting(notifDetails)
.setName('Enable notifications') .setName('Enable notifications')
.setDesc('Show notifications when MCP tools are called (request only, no completion notifications)') .setDesc('Show when MCP tools are called')
.addToggle(toggle => toggle .addToggle(toggle => toggle
.setValue(this.plugin.settings.notificationsEnabled) .setValue(this.plugin.settings.notificationsEnabled)
.onChange(async (value) => { .onChange(async (value) => {
@@ -221,7 +221,7 @@ export class MCPServerSettingTab extends PluginSettingTab {
// Show notification settings only if enabled // Show notification settings only if enabled
if (this.plugin.settings.notificationsEnabled) { if (this.plugin.settings.notificationsEnabled) {
// Show parameters // Show parameters
new Setting(containerEl) new Setting(notifDetails)
.setName('Show parameters') .setName('Show parameters')
.setDesc('Include tool parameters in notifications') .setDesc('Include tool parameters in notifications')
.addToggle(toggle => toggle .addToggle(toggle => toggle
@@ -233,9 +233,9 @@ export class MCPServerSettingTab extends PluginSettingTab {
})); }));
// Notification duration // Notification duration
new Setting(containerEl) new Setting(notifDetails)
.setName('Notification duration') .setName('Notification duration')
.setDesc('How long notifications stay visible (milliseconds)') .setDesc('Duration in milliseconds')
.addText(text => text .addText(text => text
.setPlaceholder('3000') .setPlaceholder('3000')
.setValue(String(this.plugin.settings.notificationDuration)) .setValue(String(this.plugin.settings.notificationDuration))
@@ -249,9 +249,9 @@ export class MCPServerSettingTab extends PluginSettingTab {
})); }));
// Log to console // Log to console
new Setting(containerEl) new Setting(notifDetails)
.setName('Log to console') .setName('Log to console')
.setDesc('Also log tool calls to browser console') .setDesc('Log tool calls to console')
.addToggle(toggle => toggle .addToggle(toggle => toggle
.setValue(this.plugin.settings.logToConsole) .setValue(this.plugin.settings.logToConsole)
.onChange(async (value) => { .onChange(async (value) => {
@@ -261,7 +261,7 @@ export class MCPServerSettingTab extends PluginSettingTab {
})); }));
// View history button // View history button
new Setting(containerEl) new Setting(notifDetails)
.setName('Notification history') .setName('Notification history')
.setDesc('View recent MCP tool calls') .setDesc('View recent MCP tool calls')
.addButton(button => button .addButton(button => button