Currently, the Dev Center doesn't display app categories in its interface. We should add category display both in the main app list and individual app settings pages to help developers better organize and identify their apps.
UI Changes Required
Main App List:
- Add a category label/badge next to each app name in the list
- Consider using subtle visual differentiation (like muted colors) to maintain readability
- Handle cases where category is undefined/empty gracefully (e.g., display "Uncategorized" or simply omit)
- Ensure proper alignment and spacing with existing app name and metadata
Individual App Settings Page:
- Add category field to the app's title or heading
- Real-time update of category display when edited
Technical Implementation
Data Structure:
- App categories are stored in the
metadata attribute of app objects
- Example app object structure:
{
name: "my-app",
metadata: {
category: "productivity"
},
// ... other app properties
}
Code Changes Required:
-
Dev Center App List Component:
- Update app list item rendering to include category
- Add category styling/components
- Handle category data fetching/display
-
App Update Logic:
- Update local state/UI after successful category changes
UX Considerations
- Clear visual hierarchy: category should be visible but not dominate the app name
- Consistent styling across both list view and settings page
- Graceful handling of empty/undefined categories
Implementation Notes
- Files to modify are in
src/dev-center/:
Testing Requirements
- Verify category display in app list
- Test category updates in settings
- Ensure proper handling of apps without categories
- Test UI responsiveness and layout
- Verify real-time updates after category changes
Currently, the Dev Center doesn't display app categories in its interface. We should add category display both in the main app list and individual app settings pages to help developers better organize and identify their apps.
UI Changes Required
Main App List:
Individual App Settings Page:
Technical Implementation
Data Structure:
metadataattribute of app objectsCode Changes Required:
Dev Center App List Component:
App Update Logic:
UX Considerations
Implementation Notes
src/dev-center/:Testing Requirements