normalize tooltips

This commit is contained in:
jeffvli
2025-12-03 16:00:41 -08:00
parent c738725d94
commit a7e6a75c68
12 changed files with 129 additions and 59 deletions
@@ -7,12 +7,14 @@ import styles from './item-card-controls.module.css';
import { ItemListStateActions } from '/@/renderer/components/item-list/helpers/item-list-state';
import { ItemControls } from '/@/renderer/components/item-list/types';
import { PlayButton } from '/@/renderer/features/shared/components/play-button';
import { PlayTooltip } from '/@/renderer/features/shared/components/play-button-group';
import { useIsMutatingCreateFavorite } from '/@/renderer/features/shared/mutations/create-favorite-mutation';
import { useIsMutatingDeleteFavorite } from '/@/renderer/features/shared/mutations/delete-favorite-mutation';
import { useIsMutatingRating } from '/@/renderer/features/shared/mutations/set-rating-mutation';
import { animationVariants } from '/@/shared/components/animations/animation-variants';
import { AppIcon, Icon, IconProps } from '/@/shared/components/icon/icon';
import { Rating } from '/@/shared/components/rating/rating';
import { Tooltip } from '/@/shared/components/tooltip/tooltip';
import {
Album,
AlbumArtist,
@@ -234,25 +236,31 @@ export const ItemCardControls = ({
return (
<motion.div className={clsx(styles.container)} {...containerProps[type]}>
{controls?.onPlay && (
<>
<PlayButton
classNames={clsx(styles.playButton, styles.primary)}
onClick={playNowHandler}
onLongPress={playShuffleHandler}
/>
<PlayButton
classNames={clsx(styles.playButton, styles.secondary, styles.left)}
icon="mediaPlayNext"
onClick={playNextHandler}
onLongPress={playNextShuffleHandler}
/>
<PlayButton
classNames={clsx(styles.playButton, styles.secondary, styles.right)}
icon="mediaPlayLast"
onClick={playLastHandler}
onLongPress={playLastShuffleHandler}
/>
</>
<Tooltip.Group>
<PlayTooltip type={Play.NOW}>
<PlayButton
classNames={clsx(styles.playButton, styles.primary)}
onClick={playNowHandler}
onLongPress={playShuffleHandler}
/>
</PlayTooltip>
<PlayTooltip type={Play.NEXT}>
<PlayButton
classNames={clsx(styles.playButton, styles.secondary, styles.left)}
icon="mediaPlayNext"
onClick={playNextHandler}
onLongPress={playNextShuffleHandler}
/>
</PlayTooltip>
<PlayTooltip type={Play.LAST}>
<PlayButton
classNames={clsx(styles.playButton, styles.secondary, styles.right)}
icon="mediaPlayLast"
onClick={playLastHandler}
onLongPress={playLastShuffleHandler}
/>
</PlayTooltip>
</Tooltip.Group>
)}
{controls?.onFavorite && (
<FavoriteButton isFavorite={isFavorite} onClick={favoriteHandler} />