Move Needed Items to Basic Event Details section in EventForm

This commit is contained in:
Ryderjj89
2025-05-26 12:51:43 -04:00
parent 47f6918b02
commit 1c6be17961

View File

@@ -249,6 +249,58 @@ const EventForm: React.FC = () => {
helperText="Set to 0 for no additional guests, -1 for unlimited" helperText="Set to 0 for no additional guests, -1 for unlimited"
inputProps={{ min: -1 }} inputProps={{ min: -1 }}
/> />
{/* Needed Items moved here */}
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
<Typography variant="subtitle1" sx={{ color: 'rgba(255, 255, 255, 0.7)' }}>
Needed Items
</Typography>
<Box sx={{ display: 'flex', gap: 1 }}>
<DarkTextField
fullWidth
label="Add Item"
value={currentItem}
onChange={handleItemChange}
variant="outlined"
size="small"
/>
<Button
variant="contained"
onClick={handleAddItem}
disabled={!currentItem.trim()}
startIcon={<AddIcon />}
sx={{
bgcolor: '#90caf9',
'&:hover': {
bgcolor: '#42a5f5',
},
'&.Mui-disabled': {
bgcolor: 'rgba(144, 202, 249, 0.3)',
}
}}
>
Add
</Button>
</Box>
<Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 1 }}>
{formData.needed_items.map((item, index) => (
<Chip
key={index}
label={item}
onDelete={() => handleRemoveItem(index)}
sx={{
bgcolor: 'rgba(144, 202, 249, 0.2)',
color: 'rgba(255, 255, 255, 0.9)',
'& .MuiChip-deleteIcon': {
color: 'rgba(255, 255, 255, 0.7)',
'&:hover': {
color: 'rgba(255, 255, 255, 0.9)',
}
}
}}
/>
))}
</Box>
</Box>
</Box> </Box>
</Box> </Box>
@@ -311,58 +363,6 @@ const EventForm: React.FC = () => {
style={{ display: 'none' }} style={{ display: 'none' }}
/> />
</Box> </Box>
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
<Typography variant="subtitle1" sx={{ color: 'rgba(255, 255, 255, 0.7)' }}>
Needed Items
</Typography>
<Box sx={{ display: 'flex', gap: 1 }}>
<DarkTextField
fullWidth
label="Add Item"
value={currentItem}
onChange={handleItemChange}
variant="outlined"
size="small"
/>
<Button
variant="contained"
onClick={handleAddItem}
disabled={!currentItem.trim()}
startIcon={<AddIcon />}
sx={{
bgcolor: '#90caf9',
'&:hover': {
bgcolor: '#42a5f5',
},
'&.Mui-disabled': {
bgcolor: 'rgba(144, 202, 249, 0.3)',
}
}}
>
Add
</Button>
</Box>
<Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 1 }}>
{formData.needed_items.map((item, index) => (
<Chip
key={index}
label={item}
onDelete={() => handleRemoveItem(index)}
sx={{
bgcolor: 'rgba(144, 202, 249, 0.2)',
color: 'rgba(255, 255, 255, 0.9)',
'& .MuiChip-deleteIcon': {
color: 'rgba(255, 255, 255, 0.7)',
'&:hover': {
color: 'rgba(255, 255, 255, 0.9)',
}
}
}}
/>
))}
</Box>
</Box>
</Box> </Box>
</Box> </Box>