New: Show tooltips with Custom Formats in History and Queue

(cherry picked from commit d6aee683dc4e8a8c94993b30df21fe8f6c5106b3)

Closes #3873
This commit is contained in:
Bogdan 2023-07-15 20:29:47 +03:00
parent e8d3e55b9c
commit 227217561c
3 changed files with 38 additions and 5 deletions

View File

@ -8,7 +8,8 @@ import IconButton from 'Components/Link/IconButton';
import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellConnector';
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableRow from 'Components/Table/TableRow';
import { icons } from 'Helpers/Props';
import Tooltip from 'Components/Tooltip/Tooltip';
import { icons, tooltipPositions } from 'Helpers/Props';
import formatPreferredWordScore from 'Utilities/Number/formatPreferredWordScore';
import HistoryDetailsModal from './Details/HistoryDetailsModal';
import HistoryEventTypeCell from './HistoryEventTypeCell';
@ -187,7 +188,14 @@ class HistoryRow extends Component {
key={name}
className={styles.customFormatScore}
>
{formatPreferredWordScore(customFormatScore)}
<Tooltip
anchor={formatPreferredWordScore(
customFormatScore,
customFormats.length
)}
tooltip={<AlbumFormats formats={customFormats} />}
position={tooltipPositions.BOTTOM}
/>
</TableRowCell>
);
}
@ -272,7 +280,8 @@ HistoryRow.propTypes = {
HistoryRow.defaultProps = {
track: {
title: ''
}
},
customFormats: []
};
export default HistoryRow;

View File

@ -14,6 +14,7 @@ import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableSelectCell from 'Components/Table/Cells/TableSelectCell';
import TableRow from 'Components/Table/TableRow';
import Popover from 'Components/Tooltip/Popover';
import Tooltip from 'Components/Tooltip/Tooltip';
import { icons, kinds, tooltipPositions } from 'Helpers/Props';
import InteractiveImportModal from 'InteractiveImport/InteractiveImportModal';
import formatBytes from 'Utilities/Number/formatBytes';
@ -234,7 +235,14 @@ class QueueRow extends Component {
key={name}
className={styles.customFormatScore}
>
{formatPreferredWordScore(customFormatScore)}
<Tooltip
anchor={formatPreferredWordScore(
customFormatScore,
customFormats.length
)}
tooltip={<AlbumFormats formats={customFormats} />}
position={tooltipPositions.BOTTOM}
/>
</TableRowCell>
);
}
@ -433,6 +441,7 @@ QueueRow.propTypes = {
};
QueueRow.defaultProps = {
customFormats: [],
isGrabbing: false,
isRemoving: false
};

View File

@ -2,6 +2,7 @@ import PropTypes from 'prop-types';
import React, { Component } from 'react';
import HistoryDetailsConnector from 'Activity/History/Details/HistoryDetailsConnector';
import HistoryEventTypeCell from 'Activity/History/HistoryEventTypeCell';
import AlbumFormats from 'Album/AlbumFormats';
import TrackQuality from 'Album/TrackQuality';
import Icon from 'Components/Icon';
import IconButton from 'Components/Link/IconButton';
@ -10,6 +11,7 @@ import RelativeDateCellConnector from 'Components/Table/Cells/RelativeDateCellCo
import TableRowCell from 'Components/Table/Cells/TableRowCell';
import TableRow from 'Components/Table/TableRow';
import Popover from 'Components/Tooltip/Popover';
import Tooltip from 'Components/Tooltip/Tooltip';
import { icons, kinds, tooltipPositions } from 'Helpers/Props';
import formatPreferredWordScore from 'Utilities/Number/formatPreferredWordScore';
import translate from 'Utilities/String/translate';
@ -76,6 +78,7 @@ class ArtistHistoryRow extends Component {
sourceTitle,
quality,
qualityCutoffNotMet,
customFormats,
customFormatScore,
date,
data,
@ -132,7 +135,14 @@ class ArtistHistoryRow extends Component {
</TableRowCell>
<TableRowCell className={styles.customFormatScore}>
{formatPreferredWordScore(customFormatScore)}
<Tooltip
anchor={formatPreferredWordScore(
customFormatScore,
customFormats.length
)}
tooltip={<AlbumFormats formats={customFormats} />}
position={tooltipPositions.BOTTOM}
/>
</TableRowCell>
<TableRowCell className={styles.actions}>
@ -166,6 +176,7 @@ ArtistHistoryRow.propTypes = {
sourceTitle: PropTypes.string.isRequired,
quality: PropTypes.object.isRequired,
qualityCutoffNotMet: PropTypes.bool.isRequired,
customFormats: PropTypes.arrayOf(PropTypes.object),
customFormatScore: PropTypes.number.isRequired,
date: PropTypes.string.isRequired,
data: PropTypes.object.isRequired,
@ -175,4 +186,8 @@ ArtistHistoryRow.propTypes = {
onMarkAsFailedPress: PropTypes.func.isRequired
};
ArtistHistoryRow.defaultProps = {
customFormats: []
};
export default ArtistHistoryRow;