Skip to content

dashboard/app: migrate to bootstrap #7586

Description

@tarasmadan

dashboard/app: migrate to bootstrap

Justification

The Syzkaller dashboard currently relies on custom, vanilla CSS and JavaScript for common UI components (dropdowns, collapsible panels, tables, navigation). This leads to:

  • Maintenance Overhead: We are reinventing the wheel for standard components, making the codebase harder to maintain.
  • Rigid UI: The current design lacks responsiveness and modern visual standards.
  • Barrier to Entry: Contributors without deep frontend experience find it difficult to make UI improvements.
    Migrating to Bootstrap 5 will allow us to delete significant amounts of custom CSS/JS, leverage a robust and responsive grid system, and utilize standard, well-tested components (cards, navs, tables, collapse) to quickly improve the user experience.
    To minimize risk and ensure easy reviews, the migration will be done in very small, incremental steps.

Migration Plan

  • Phase 1: Infrastructure & Setup
  • Phase 2: Global Layout & Navigation
  • Phase 3: Page-by-Page Migration
    • Migrate subsystems.html (simple table layout).
    • Migrate manager.html.
    • Migrate the main dashboard page (main.html and its sub-templates like bug_list, manager_list).
    • Migrate the bug details page (bug.html and bisect_results, crash_list).
  • Phase 4: Migrate syz-manager
    • TODO
  • Phase 5: Cleanup & Optimization
    • Audit and delete redundant custom styles from style.css.
    • (Optional) Switch from CDN to locally served Bootstrap assets for offline support.

Metadata

Metadata

Assignees

No one assigned

    Labels

    cleanupCodebase cleanup related issues/PRs.enhancement

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions