fix(ui): Format item type label when it contians underscore

This commit is contained in:
Richard Palethorpe
2025-04-01 08:42:38 +01:00
parent f70985362d
commit 1f8c601795

View File

@@ -76,11 +76,12 @@ const ConfigForm = ({
// Find the field group that matches this item's type // Find the field group that matches this item's type
const fieldGroup = fieldGroups.find(group => group.name === itemTypeName); const fieldGroup = fieldGroups.find(group => group.name === itemTypeName);
const itemTypeLabel = itemType.charAt(0).toUpperCase() + itemType.slice(1).replace('_', ' ');
return ( return (
<div key={index} className="config-item mb-4 card"> <div key={index} className="config-item mb-4 card">
<div className="config-header" style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '1rem' }}> <div className="config-header" style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '1rem' }}>
<h4 style={{ margin: 0 }}>{itemType.charAt(0).toUpperCase() + itemType.slice(1)} #{index + 1}</h4> <h4 style={{ margin: 0 }}>{itemTypeLabel} #{index + 1}</h4>
<button <button
type="button" type="button"
className="action-btn delete-btn" className="action-btn delete-btn"
@@ -91,7 +92,7 @@ const ConfigForm = ({
</div> </div>
<div className="config-type mb-3"> <div className="config-type mb-3">
<label htmlFor={`${itemType}Type${index}`}>{itemType.charAt(0).toUpperCase() + itemType.slice(1)} Type</label> <label htmlFor={`${itemType}Type${index}`}>{itemTypeLabel} Type</label>
<select <select
id={`${itemType}Type${index}`} id={`${itemType}Type${index}`}
value={safeItem[typeField] || ''} value={safeItem[typeField] || ''}