github/VRCX
1
1
Fork 0
mirror of https://github.com/vrcx-team/VRCX.git synced 2026-04-06 00:32:02 +02:00
Code Issues 51 Packages Projects Releases Wiki Activity

add tooltip

Browse Source
This commit is contained in:
pa
2026-02-28 00:29:26 +09:00
committed by Natsumi
parent e438968bc1
commit e0f7b733af
1 changed files with 76 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

144
src/views/GameLog/columns.jsx
View File

@@ -1,11 +1,7 @@
import Location from '../../components/Location.vue';
import { Badge } from '../../components/ui/badge';
import { Button } from '../../components/ui/button';
import {
Tooltip,
TooltipContent,
TooltipTrigger
} from '../../components/ui/tooltip';
import { TooltipWrapper } from '../../components/ui/tooltip';
import { ArrowUpDown, FileText, Trash2, X } from 'lucide-vue-next';
import { storeToRefs } from 'pinia';
@@ -64,14 +60,9 @@ export const createColumns = ({ getCreatedAt, onDelete, onDeletePrompt }) => {
const longText = formatDateFilter(createdAt, 'long');
return (
<Tooltip>
<TooltipTrigger asChild>
<span>{shortText}</span>
</TooltipTrigger>
<TooltipContent side="right">
<span>{longText}</span>
</TooltipContent>
</Tooltip>
<TooltipWrapper content={longText} side="right">
<span>{shortText}</span>
</TooltipWrapper>
);
}
},
@@ -160,17 +151,24 @@ export const createColumns = ({ getCreatedAt, onDelete, onDeletePrompt }) => {
if (original.type === 'Event') {
return (
<span class="block w-full min-w-0 truncate">
{original.data}
</span>
<TooltipWrapper content={original.data} side="bottom">
<span class="block w-full min-w-0 truncate">
{original.data}
</span>
</TooltipWrapper>
);
}
if (original.type === 'External') {
return (
<span class="block w-full min-w-0 truncate">
{original.message}
</span>
<TooltipWrapper
content={original.message}
side="bottom"
>
<span class="block w-full min-w-0 truncate">
{original.message}
</span>
</TooltipWrapper>
);
}
@@ -179,24 +177,31 @@ export const createColumns = ({ getCreatedAt, onDelete, onDeletePrompt }) => {
original.videoId !== 'LSMedia' &&
original.videoId !== 'PopcornPalace';
const label = original.videoName || original.videoUrl;
const tooltipText = original.videoId
? `${original.videoId}: ${label}`
: label;
return (
<span class="block w-full min-w-0 truncate cursor-pointer">
{original.videoId ? (
<span class="mr-1.5">{original.videoId}:</span>
) : null}
{showLink ? (
<span
class="cursor-pointer"
onClick={() =>
openExternalLink(original.videoUrl)
}
>
{label}
</span>
) : (
<span>{original.videoName}</span>
)}
</span>
<TooltipWrapper content={tooltipText} side="bottom">
<span class="block w-full min-w-0 truncate cursor-pointer">
{original.videoId ? (
<span class="mr-1.5">
{original.videoId}:
</span>
) : null}
{showLink ? (
<span
class="cursor-pointer"
onClick={() =>
openExternalLink(original.videoUrl)
}
>
{label}
</span>
) : (
<span>{original.videoName}</span>
)}
</span>
</TooltipWrapper>
);
}
@@ -205,16 +210,21 @@ export const createColumns = ({ getCreatedAt, onDelete, onDeletePrompt }) => {
original.type === 'StringLoad'
) {
return (
<span class="block w-full min-w-0 truncate cursor-pointer">
<span
class="cursor-pointer"
onClick={() =>
openExternalLink(original.resourceUrl)
}
>
{original.resourceUrl}
<TooltipWrapper
content={original.resourceUrl}
side="bottom"
>
<span class="block w-full min-w-0 truncate cursor-pointer">
<span
class="cursor-pointer"
onClick={() =>
openExternalLink(original.resourceUrl)
}
>
{original.resourceUrl}
</span>
</span>
</span>
</TooltipWrapper>
);
}
@@ -227,9 +237,11 @@ export const createColumns = ({ getCreatedAt, onDelete, onDeletePrompt }) => {
}
return (
<span class="block w-full min-w-0 truncate">
{original.data}
</span>
<TooltipWrapper content={original.data} side="bottom">
<span class="block w-full min-w-0 truncate">
{original.data}
</span>
</TooltipWrapper>
);
}
},
@@ -272,26 +284,22 @@ export const createColumns = ({ getCreatedAt, onDelete, onDeletePrompt }) => {
</button>
) : null}
{canShowPrevious ? (
<Tooltip>
<TooltipTrigger asChild>
<button
type="button"
class="inline-flex h-6 items-center justify-center text-muted-foreground hover:text-foreground"
onClick={() =>
showPreviousInstancesInfoDialog(
original.location
)
}
>
<FileText class="h-4 w-4" />
</button>
</TooltipTrigger>
<TooltipContent side="top">
<span>
{t('dialog.previous_instances.info')}
</span>
</TooltipContent>
</Tooltip>
<TooltipWrapper
content={t('dialog.previous_instances.info')}
side="top"
>
<button
type="button"
class="inline-flex h-6 items-center justify-center text-muted-foreground hover:text-foreground"
onClick={() =>
showPreviousInstancesInfoDialog(
original.location
)
}
>
<FileText class="h-4 w-4" />
</button>
</TooltipWrapper>
) : null}
</div>
);