Skip to content

[FE-07] Create StatusBadge and ConditionBadge components #612

@yusuftomilola

Description

@yusuftomilola

Overview

Create StatusBadge and ConditionBadge components that display color-coded asset status and condition labels inside frontend/contrib/.

Location

All work must be inside frontend/contrib/components/assets/.

Acceptance Criteria

  • StatusBadge maps statuses to colors: ACTIVE→green, ASSIGNED→blue, MAINTENANCE→yellow, RETIRED→gray
  • ConditionBadge maps conditions to colors: NEW→emerald, GOOD→green, FAIR→yellow, POOR→orange, DAMAGED→red
  • Both render as pill-shaped badges with a dot indicator
  • Both accept the enum value as a prop and handle unknown values gracefully
  • Typed with the AssetStatus and AssetCondition TypeScript enums

Metadata

Metadata

Assignees

Type

No type
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