amy/donetick-fe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Handle Adaptive freqtype, improve emoji name handling, styling around labels

Browse source
This commit is contained in:
Mo Tarbin 2024-07-07 00:54:43 -04:00
parent e039b732a8
commit b64df1ab15
1 changed files with 14 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
src/views/Chores/ChoreCard.jsx
View file

@ -284,6 +284,8 @@ const ChoreCard = ({ chore, performers, onChoreUpdate, onChoreRemove, sx }) => {
return 'Trigger' return 'Trigger'
} else if (chore.frequencyType === 'daily') { } else if (chore.frequencyType === 'daily') {
return 'Daily' return 'Daily'
} else if (chore.frequencyType === 'adaptive') {
return 'Adaptive'
} else if (chore.frequencyType === 'weekly') { } else if (chore.frequencyType === 'weekly') {
return 'Weekly' return 'Weekly'
} else if (chore.frequencyType === 'monthly') { } else if (chore.frequencyType === 'monthly') {
@ -318,6 +320,14 @@ const ChoreCard = ({ chore, performers, onChoreUpdate, onChoreRemove, sx }) => {
return <Repeat /> return <Repeat />
} }
} }
const getName = name => {
const split = Array.from(chore.name)
// if the first character is emoji then remove it from the name
if (/\p{Emoji}/u.test(split[0])) {
return split.slice(2).join('')
}
return name
}
return ( return (
<> <>
@ -385,7 +395,7 @@ const ChoreCard = ({ chore, performers, onChoreUpdate, onChoreRemove, sx }) => {
{Array.from(chore.name)[0]} {Array.from(chore.name)[0]}
</Avatar> </Avatar>
<Box display='flex' flexDirection='column'> <Box display='flex' flexDirection='column'>
<Typography level='title-md'>{chore.name}</Typography> <Typography level='title-md'>{getName(chore.name)}</Typography>
<Typography level='body-md' color='text.disabled'> <Typography level='body-md' color='text.disabled'>
Assigned to{' '} Assigned to{' '}
<Chip variant='outlined'> <Chip variant='outlined'>
@ -396,17 +406,16 @@ const ChoreCard = ({ chore, performers, onChoreUpdate, onChoreRemove, sx }) => {
</Chip> </Chip>
</Typography> </Typography>
<Box> <Box>
{chore.labels?.split(',').map(label => ( {chore.labels?.split(',').map((label, index) => (
<Chip <Chip
variant='solid' variant='solid'
key={label} key={label}
color='primary' color='primary'
sx={{ sx={{
position: 'relative', position: 'relative',
ml: 0.5, ml: index === 0 ? 0 : 0.5,
top: 10, top: 2,
zIndex: 1, zIndex: 1,
left: 10,
}} }}
startDecorator={getIconForLabel(label)} startDecorator={getIconForLabel(label)}
> >