improve mutual friends settings add clear button to virtual combobox

This commit is contained in:
pa
2026-03-25 22:12:16 +09:00
parent 6b728951fa
commit 15a7d66cf6
3 changed files with 25 additions and 6 deletions

View File

@@ -8,7 +8,14 @@
</span>
</slot>
<div class="flex items-center gap-2">
<div class="flex items-center gap-1">
<button
v-if="clearable && selectedValueSet.size > 0"
type="button"
class="flex items-center justify-center rounded-sm opacity-50 hover:opacity-100"
@click.stop.prevent="clearSelection">
<X class="size-3.5" />
</button>
<span class="opacity-60"></span>
</div>
</Button>
@@ -78,6 +85,7 @@
import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { X } from 'lucide-vue-next';
import { useVirtualizer } from '@tanstack/vue-virtual';
const props = defineProps({
@@ -131,13 +139,24 @@
if (!filteredItems.length) continue;
const selected = [];
const unselected = [];
for (const item of filteredItems) {
if (selectedValueSet.value.has(String(item.value))) {
selected.push(item);
} else {
unselected.push(item);
}
}
const sortedItems = [...selected, ...unselected];
entries.push({
type: 'group',
key: `group:${group?.key ?? ''}`,
group
});
for (const item of filteredItems) {
for (const item of sortedItems) {
entries.push({
type: 'item',
key: `item:${group?.key ?? ''}:${item?.value}`,

View File

@@ -570,7 +570,7 @@
"context_menu": {
"view_details": "View Details",
"hide_friend": "Hide from Graph",
"refresh_mutuals": "Refresh Mutuals",
"refresh_mutuals": "Refresh Their Mutuals",
"confirm_non_friend_title": "Not a Friend",
"confirm_non_friend_message": "This user is no longer your friend. Do you still want to fetch their mutual friends data?",
"refresh_success": "Mutual friends data updated for {name}",

View File

@@ -246,17 +246,17 @@
</ContextMenuTrigger>
<ContextMenuContent v-if="contextMenuNodeId" class="min-w-40">
<ContextMenuItem @click="handleNodeMenuViewDetails">
<UserIcon class="mr-2 size-4" />
<UserIcon class="size-4" />
{{ t('view.charts.mutual_friend.context_menu.view_details') }}
</ContextMenuItem>
<ContextMenuSeparator />
<ContextMenuItem @click="handleNodeMenuRefresh">
<RefreshCwIcon class="mr-2 size-4" />
<RefreshCwIcon class="size-4" />
{{ t('view.charts.mutual_friend.context_menu.refresh_mutuals') }}
</ContextMenuItem>
<ContextMenuSeparator />
<ContextMenuItem @click="handleNodeMenuHide">
<EyeOffIcon class="mr-2 size-4" />
<EyeOffIcon class="size-4" />
{{ t('view.charts.mutual_friend.context_menu.hide_friend') }}
</ContextMenuItem>
</ContextMenuContent>