Skip to content

Web UI refresh: modern design for topology visualization #74

@renecannao

Description

@renecannao

Web UI Refresh

The current web UI dates from 2014 (jQuery, Bootstrap 2). Refresh it with modern design while keeping the topology visualization that users love.

Scope

  • Update Bootstrap to v5 (or replace with Tailwind)
  • Modernize the topology tree visualization
  • Add PostgreSQL topology support in the UI
  • Add ProxySQL hostgroup view
  • Add Prometheus metrics dashboard view
  • Responsive design for mobile
  • Dark mode support
  • Improve the instance detail modal

Approach

Incremental — update CSS/JS while keeping the same HTML template structure. The web UI is served from resources/ templates and uses the existing API.

Key files

  • resources/templates/ — HTML templates
  • resources/public/css/ — stylesheets
  • resources/public/js/ — JavaScript (uses jQuery + D3 for topology)

Acceptance criteria

  • Clean, modern look
  • Topology visualization works for MySQL and PostgreSQL
  • All existing functionality preserved
  • Mobile responsive

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions