feat: full title of download item on hover with tooltip (#3296)

Co-authored-by: Ryan Cohen <ryan@sct.dev>
This commit is contained in:
Brandon Cohen
2023-02-11 05:30:53 -05:00
committed by GitHub
parent d7b83d22ce
commit 33e7691b94

View File

@@ -1,6 +1,7 @@
import Button from '@app/components/Common/Button'; import Button from '@app/components/Common/Button';
import ConfirmButton from '@app/components/Common/ConfirmButton'; import ConfirmButton from '@app/components/Common/ConfirmButton';
import SlideOver from '@app/components/Common/SlideOver'; import SlideOver from '@app/components/Common/SlideOver';
import Tooltip from '@app/components/Common/Tooltip';
import DownloadBlock from '@app/components/DownloadBlock'; import DownloadBlock from '@app/components/DownloadBlock';
import IssueBlock from '@app/components/IssueBlock'; import IssueBlock from '@app/components/IssueBlock';
import RequestBlock from '@app/components/RequestBlock'; import RequestBlock from '@app/components/RequestBlock';
@@ -144,20 +145,24 @@ const ManageSlideOver = ({
<div className="overflow-hidden rounded-md border border-gray-700 shadow"> <div className="overflow-hidden rounded-md border border-gray-700 shadow">
<ul> <ul>
{data.mediaInfo?.downloadStatus?.map((status, index) => ( {data.mediaInfo?.downloadStatus?.map((status, index) => (
<li <Tooltip
key={`dl-status-${status.externalId}-${index}`} key={`dl-status-${status.externalId}-${index}`}
className="border-b border-gray-700 last:border-b-0" content={status.title}
> >
<li className="border-b border-gray-700 last:border-b-0">
<DownloadBlock downloadItem={status} /> <DownloadBlock downloadItem={status} />
</li> </li>
</Tooltip>
))} ))}
{data.mediaInfo?.downloadStatus4k?.map((status, index) => ( {data.mediaInfo?.downloadStatus4k?.map((status, index) => (
<li <Tooltip
key={`dl-status-${status.externalId}-${index}`} key={`dl-status-${status.externalId}-${index}`}
className="border-b border-gray-700 last:border-b-0" content={status.title}
> >
<li className="border-b border-gray-700 last:border-b-0">
<DownloadBlock downloadItem={status} is4k /> <DownloadBlock downloadItem={status} is4k />
</li> </li>
</Tooltip>
))} ))}
</ul> </ul>
</div> </div>