[feat]: Add Taskbar/Dock Connection Status Indicator

[millerjp]

Overview

We need to implement a visual indicator on the application's taskbar/dock icon to display the number of active database connections. This would provide users with at-a-glance visibility of connection status without opening the application.

Requirements

• Add a visual overlay/badge to the application icon in the taskbar/dock
• Indicator should update when database connections change
• Not sure which OS we can get this to work, but ideally all.

Proposed Implementation

For Windows, we can use the setOverlayIcon API:

const { BrowserWindow, nativeImage } = require('electron')
const win = new BrowserWindow()

// Create and set an overlay icon
const overlayIcon = nativeImage.createFromPath('path/to/overlay.png')
win.setOverlayIcon(overlayIcon, 'Description for overlay')

For macOS, we can use the dock badge API:

// In the main process
app.dock.setBadge('1') // Set a number
// or
app.dock.setBadge('●') // Set a dot

To clear the overlay:

win.setOverlayIcon(null, '') // Windows
app.dock.setBadge('') // macOS

Technical Considerations

• Icon overlay should be small and clearly visible
• Implementation should check operating system for platform-specific features
• Updates should occur only when connection count changes
• Should gracefully handle cases where the feature is not supported

Additional Notes

• The overlay/badge should persist until explicitly cleared
• Consider accessibility requirements for color and contrast
• Need to determine appropriate update frequency to avoid visual distraction