refactor: tooltips for time locks

This commit is contained in:
Carlos Valente
2024-10-19 13:34:01 +02:00
committed by Carlos Valente
parent ea2330e23b
commit cc5c097ddc
@@ -66,10 +66,12 @@ const TimeInputFlow = (props: EventBlockTimerProps) => {
placeholder='Start' placeholder='Start'
disabled={Boolean(linkStart)} disabled={Boolean(linkStart)}
> >
<InputRightElement className={activeStart} onClick={() => handleLink(!linkStart)}> <Tooltip label='Link start to previous end' shouldWrapChildren openDelay={0}>
<span className={style.timeLabel}>S</span> <InputRightElement className={activeStart} onClick={() => handleLink(!linkStart)}>
<span className={style.fourtyfive}>{linkStart ? <IoLink /> : <IoUnlink />}</span> <span className={style.timeLabel}>S</span>
</InputRightElement> <span className={style.fourtyfive}>{linkStart ? <IoLink /> : <IoUnlink />}</span>
</InputRightElement>
</Tooltip>
</TimeInputWithButton> </TimeInputWithButton>
<TimeInputWithButton<TimeActions> <TimeInputWithButton<TimeActions>
@@ -80,14 +82,16 @@ const TimeInputFlow = (props: EventBlockTimerProps) => {
disabled={isLockedDuration} disabled={isLockedDuration}
placeholder='End' placeholder='End'
> >
<InputRightElement <Tooltip label='Lock end' shouldWrapChildren openDelay={0}>
className={activeEnd} <InputRightElement
onClick={() => handleChangeStrategy(TimeStrategy.LockEnd)} className={activeEnd}
data-testid='lock__end' onClick={() => handleChangeStrategy(TimeStrategy.LockEnd)}
> data-testid='lock__end'
<span className={style.timeLabel}>E</span> >
{isLockedEnd ? <IoLockClosed /> : <IoLockOpenOutline />} <span className={style.timeLabel}>E</span>
</InputRightElement> {isLockedEnd ? <IoLockClosed /> : <IoLockOpenOutline />}
</InputRightElement>
</Tooltip>
</TimeInputWithButton> </TimeInputWithButton>
<TimeInputWithButton<TimeActions> <TimeInputWithButton<TimeActions>
@@ -97,14 +101,16 @@ const TimeInputFlow = (props: EventBlockTimerProps) => {
disabled={isLockedEnd} disabled={isLockedEnd}
placeholder='Duration' placeholder='Duration'
> >
<InputRightElement <Tooltip label='Lock duration' shouldWrapChildren openDelay={0}>
className={activeDuration} <InputRightElement
onClick={() => handleChangeStrategy(TimeStrategy.LockDuration)} className={activeDuration}
data-testid='lock__duration' onClick={() => handleChangeStrategy(TimeStrategy.LockDuration)}
> data-testid='lock__duration'
<span className={style.timeLabel}>D</span> >
{isLockedDuration ? <IoLockClosed /> : <IoLockOpenOutline />} <span className={style.timeLabel}>D</span>
</InputRightElement> {isLockedDuration ? <IoLockClosed /> : <IoLockOpenOutline />}
</InputRightElement>
</Tooltip>
</TimeInputWithButton> </TimeInputWithButton>
{overMidnight && ( {overMidnight && (