Summary
Add support for custom tags on workspaces with global tag definitions, allowing users to categorize and visually identify workspaces with custom icons and labels.
Motivation
Users need a way to categorize and visually distinguish workspaces beyond just names. Tags provide a flexible system for organizing workspaces by domain, status, or any custom categorization scheme.
Proposed API
Global Tag Definitions
// zpress.config.ts
export default defineConfig({
tags: {
payments: {
text: 'Payments',
icon: 'simple-icons:stripe'
},
experimental: {
text: 'Beta',
icon: { type: 'emoji', value: '🧪' }
},
deprecated: {
text: 'Deprecated',
icon: { type: 'svg', value: '<svg>...</svg>' }
}
},
workspaces: [
{
path: './apps/billing',
tags: ['payments', 'experimental']
}
]
})
Icon Configuration
Support multiple icon formats:
type IconConfig =
| string // Icon set reference: 'simple-icons:stripe'
| { type: 'emoji', value: string } // Emoji: { type: 'emoji', value: '💰' }
| { type: 'svg', value: string } // Inline SVG
| { type: 'iconify', icon: string } // Iconify reference
type Tag = {
readonly text: string
readonly icon?: IconConfig
readonly color?: string // Optional theme color
}
TypeScript Support
Global tag definitions should provide autocomplete when applying tags to workspaces:
export default defineConfig({
tags: {
payments: { text: 'Payments' },
auth: { text: 'Authentication' }
},
workspaces: [
{
path: './apps/checkout',
tags: ['payments'] // ← Autocomplete suggests: 'payments' | 'auth'
}
]
})
Implementation Checklist
Acceptance Criteria
Related
Part of workspace organization and navigation improvements.
Summary
Add support for custom tags on workspaces with global tag definitions, allowing users to categorize and visually identify workspaces with custom icons and labels.
Motivation
Users need a way to categorize and visually distinguish workspaces beyond just names. Tags provide a flexible system for organizing workspaces by domain, status, or any custom categorization scheme.
Proposed API
Global Tag Definitions
Icon Configuration
Support multiple icon formats:
TypeScript Support
Global tag definitions should provide autocomplete when applying tags to workspaces:
Implementation Checklist
tagsat root levelTagtype withtext,icon, and optionalcolorpropertiestags: readonly string[]to workspace config schemaAcceptance Criteria
Related
Part of workspace organization and navigation improvements.