Skip to content

Frontend Refactor: eliminate duplicated admin UI + decompose large components #164

Description

@IsaacGemal

Overview

The frontend has heavy duplication and several large, hard-to-maintain components.
This issue proposes a staged refactor to consolidate shared UI patterns, introduce generic admin list/view components, and split monoliths.
Goal: cut larges amounts of component code while improving clarity and maintainability.

Main issues

Admin list pages are ~80–100% duplicated across Templates / Prompts / Models / Runs / Generations.
No shared UI primitives (Button, Input, Card, etc.) → hundreds of copy-pasted patterns.
Constants duplicated (e.g. EXPERIMENTAL_STATES in 6+ files).
Large components (MCBench, ModelUtils, View* pages) mixing concerns and exceeding 1k lines.
Navigation logic duplicated for desktop/mobile in App.tsx.

Migration Strategy

Add new components alongside existing ones
Migrate pages one at a time
Delete old code only after validation

Success Criteria

A much cleaner frontend, less code, easier to maintain, no functional regressions.
This is a structural refactor only—no functional changes.

Other notes

This is primarily a maintainability + duplication cleanup, documented here for posterity and future planning.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    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