MrUnknownDE/VRCX
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/VRCX.git synced 2026-05-05 14:26:06 +02:00
Code Issues Packages Projects Releases Wiki Activity

replace remixicon

Browse Source
This commit is contained in:
pa
2026-01-15 10:43:56 +09:00
committed by Natsumi
parent 889302104a
commit 87dc871578
37 changed files with 370 additions and 296 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/AvatarInfo.vue
+6 -10
View File
@@ -1,13 +1,17 @@
<template>
<div @click="confirm" class="avatar-info">
<span v-if="avatarType" :class="color" class="mr-2"><i :class="avatarTypeIcons" /></span>
<span v-if="avatarType" :class="color" class="mr-2">
<Lock v-if="avatarType === '(own)'" class="h-4 w-4" />
<Unlock v-else-if="avatarType === '(public)'" class="h-4 w-4" />
</span>
<span class="mr-2">{{ avatarName }}</span>
<span v-if="avatarTags" style="color: var(--el-text-color-secondary); font-size: 12px">{{ avatarTags }}</span>
</div>
</template>
<script setup>
import { computed, ref, watch } from 'vue';
import { Lock, Unlock } from 'lucide-vue-next';
import { ref, watch } from 'vue';
import { useAvatarStore } from '../stores';
@@ -27,14 +31,6 @@
const color = ref('');
let ownerId = '';
const avatarTypeIcons = computed(() => {
return avatarType.value === '(own)'
? 'ri-lock-line'
: avatarType.value === '(public)'
? 'ri-lock-unlock-line'
: '';
});
const parse = async () => {
ownerId = '';
avatarName.value = '';
src/components/InviteYourself.vue
+6 -5
View File
@@ -7,8 +7,8 @@
variant="outline"
v-show="isVisible"
@click="confirmInvite"
><i class="ri-mail-line"></i
></Button>
><Mail class="h-4 w-4" /> ></Button
>
</TooltipWrapper>
<TooltipWrapper v-else side="top" :content="t('dialog.user.info.open_in_vrchat_tooltip')">
<Button
@@ -16,7 +16,7 @@
size="icon-sm"
variant="outline"
v-if="isOpeningInstance">
<i class="ri-loader-line"></i>
<Loader2 class="h-4 w-4 animate-spin" />
</Button>
<Button
class="rounded-full h-6 w-6 text-xs text-muted-foreground hover:text-foreground"
@@ -24,13 +24,14 @@
variant="outline"
v-else
@click="openInstance"
><i class="ri-mail-line"></i
></Button>
><Mail class="h-4 w-4"
/></Button>
</TooltipWrapper>
</div>
</template>
<script setup>
import { Loader2, Mail } from 'lucide-vue-next';
import { Button } from '@/components/ui/button';
import { computed } from 'vue';
import { storeToRefs } from 'pinia';
src/components/LastJoin.vue
+3 -1
View File
@@ -4,13 +4,15 @@
<template #content>
<span>{{ t('dialog.user.info.last_join') }} <Timer :epoch="lastJoin" /></span>
</template>
<i class="ri-map-pin-time-line text-muted-foreground"></i>
<MapPin class="h-4 w-4 text-muted-foreground" />
</TooltipWrapper>
</span>
</template>
<script setup>
// TODO(icon): time aspect lost (map pin with time)
import { ref, watch } from 'vue';
import { MapPin } from 'lucide-vue-next';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
src/components/dialogs/AvatarDialog/AvatarDialog.vue
+9 -5
View File
@@ -45,7 +45,7 @@
class="x-tag-platform-pc"
variant="outline"
style="margin-right: 5px; margin-top: 5px"
><i class="ri-computer-line"></i>
><Monitor class="h-4 w-4 x-tag-platform-pc" />
<span
v-if="avatarDialog.platformInfo.pc"
:class="['x-grey', 'x-tag-platform-pc', 'x-tag-border-left']"
@@ -63,7 +63,7 @@
class="x-tag-platform-quest"
variant="outline"
style="margin-right: 5px; margin-top: 5px"
><i class="ri-android-line"></i>
><Smartphone class="h-4 w-4 x-tag-platform-quest" />
<span
v-if="avatarDialog.platformInfo.android"
:class="['x-grey', 'x-tag-platform-quest', 'x-tag-border-left']"
@@ -81,7 +81,7 @@
class="x-tag-platform-ios"
variant="outline"
style="margin-right: 5px; margin-top: 5px"
><i class="ri-apple-line"></i>
><Apple class="h-4 w-4 x-tag-platform-ios" />
<span
v-if="avatarDialog.platformInfo.ios"
:class="['x-grey', 'x-tag-platform-ios', 'x-tag-border-left']"
@@ -420,8 +420,8 @@
size="icon-sm"
variant="outline"
@click.stop
><i class="ri-file-copy-line"></i
></Button>
><Copy class="h-4 w-4" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent>
<DropdownMenuItem @click="copyAvatarId(avatarDialog.id)">
@@ -523,15 +523,19 @@
<script setup>
import {
AlertTriangle,
Apple,
Check,
CheckCircle,
Copy,
Download,
Ellipsis,
Image,
Monitor,
Pencil,
RefreshCcw,
RefreshCw,
Share2,
Smartphone,
Star,
Trash2,
Upload,
src/components/dialogs/GroupDialog/GroupDialog.vue
+11 -10
View File
@@ -365,8 +365,8 @@
size="icon"
variant="outline"
@click="refreshInstancePlayerCount(room.tag)"
><i class="ri-refresh-line"></i
></Button>
><RefreshCw class="h-4 w-4" />
</Button>
</TooltipWrapper>
<LastJoin :location="room.tag" :currentlocation="lastLocation.location" />
<InstanceInfo
@@ -629,8 +629,8 @@
size="icon-sm"
variant="outline"
@click="copyToClipboard(groupDialog.ref.$url)"
><i class="ri-file-copy-line"></i
></Button> </TooltipWrapper
><Copy class="h-4 w-4" />
</Button> </TooltipWrapper
></span>
</div>
</div>
@@ -645,8 +645,8 @@
size="icon-sm"
variant="outline"
@click="copyToClipboard(groupDialog.id)"
><i class="ri-file-copy-line"></i
></Button> </TooltipWrapper
><Copy class="h-4 w-4" />
</Button> </TooltipWrapper
></span>
</div>
</div>
@@ -806,8 +806,8 @@
class="h-6 w-6 text-xs text-muted-foreground hover:text-foreground"
variant="ghost"
@click="showGroupPostEditDialog(groupDialog.id, post)"
><i class="ri-pencil-line"></i
></Button>
><Pencil class="h-4 w-4" />
</Button>
</TooltipWrapper>
<TooltipWrapper
side="top"
@@ -817,8 +817,8 @@
class="h-6 w-6 text-xs text-muted-foreground hover:text-foreground"
variant="ghost"
@click="confirmDeleteGroupPost(post)"
><i class="ri-delete-bin-line"></i
></Button>
><Trash2 class="h-4 w-4" />
</Button>
</TooltipWrapper>
</template>
</div>
@@ -1135,6 +1135,7 @@
BellOff,
Check,
CheckCircle,
Copy,
Download,
Eye,
Loader2,
src/components/dialogs/GroupDialog/GroupMemberModerationDialog.vue
+2 -2
View File
@@ -408,7 +408,7 @@
cursor: pointer;
"
@click="deleteSelectedGroupMember(user)">
<i class="ri-close-line" style="font-size: 12px; line-height: 1"></i>
<X class="h-3 w-3" />
</button>
</Badge>
<br />
@@ -526,7 +526,7 @@
</template>
<script setup>
import { AlertTriangle, ArrowDown, Loader2, RefreshCw, Trash2 } from 'lucide-vue-next';
import { AlertTriangle, ArrowDown, Loader2, RefreshCw, Trash2, X } from 'lucide-vue-next';
import { computed, reactive, ref, watch } from 'vue';
import { InputGroupField, InputGroupTextareaField } from '@/components/ui/input-group';
import { Button } from '@/components/ui/button';
src/components/dialogs/PreviousInstancesDialog/previousInstancesGroupColumns.jsx
+6 -4
View File
@@ -1,4 +1,4 @@
import { ArrowUpDown } from 'lucide-vue-next';
import { ArrowUpDown, Info, Trash2 } from 'lucide-vue-next';
import Location from '../../Location.vue';
import { Button } from '../../ui/button';
@@ -57,7 +57,9 @@ export const createColumns = ({ shiftHeld, onShowInfo, onDelete, onDeletePrompt
},
cell: ({ row }) => (
<Location
location={row.original?.$location?.tag ?? row.original?.location}
location={
row.original?.$location?.tag ?? row.original?.location
}
grouphint={row.original?.groupName}
hint={row.original?.worldName}
/>
@@ -95,7 +97,7 @@ export const createColumns = ({ shiftHeld, onShowInfo, onDelete, onDeletePrompt
onShowInfo?.(original?.location);
}}
>
<i class="ri-information-line"></i>
<Info class="h-4 w-4" />
</Button>
<Button
@@ -112,7 +114,7 @@ export const createColumns = ({ shiftHeld, onShowInfo, onDelete, onDeletePrompt
}
}}
>
<i class="ri-delete-bin-line"></i>
<Trash2 class="h-4 w-4" />
</Button>
</div>
);
src/components/dialogs/PreviousInstancesDialog/previousInstancesWorldColumns.jsx
+3 -3
View File
@@ -1,4 +1,4 @@
import { ArrowUpDown } from 'lucide-vue-next';
import { ArrowUpDown, Info, Trash2 } from 'lucide-vue-next';
import DisplayName from '../../DisplayName.vue';
import LocationWorld from '../../LocationWorld.vue';
@@ -116,7 +116,7 @@ export const createColumns = ({
onShowInfo?.(original?.location);
}}
>
<i class="ri-information-line"></i>
<Info class="h-4 w-4" />
</Button>
<Button
@@ -133,7 +133,7 @@ export const createColumns = ({
}
}}
>
<i class="ri-delete-bin-line"></i>
<Trash2 class="h-4 w-4" />
</Button>
</div>
);
src/components/dialogs/UserDialog/LanguageDialog.vue
+2 -1
View File
@@ -26,7 +26,7 @@
cursor: pointer;
"
@click="removeUserLanguage(item.key)">
<i class="ri-close-line" style="font-size: 12px; line-height: 1"></i>
<X class="h-3 w-3" />
</button>
</Badge>
</div>
@@ -58,6 +58,7 @@
</template>
<script setup>
import { X } from 'lucide-vue-next';
import { ref } from 'vue';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
src/components/dialogs/UserDialog/UserDialog.vue
+14 -10
View File
@@ -46,8 +46,8 @@
size="icon"
variant="outline"
@click="refreshInstancePlayerCount(userDialog.$location.tag)"
><i class="ri-refresh-line"></i
></Button>
><RefreshCw class="h-4 w-4" />
</Button>
</TooltipWrapper>
<LastJoin
:location="userDialog.$location.tag"
@@ -250,8 +250,8 @@
variant="ghost"
@click="translateBio">
<Spinner v-if="translateLoading" class="size-1" />
<i v-else class="ri-translate-2"> </i
></Button>
<Languages v-else class="h-3 w-3" />
</Button>
<Button
class="w-3 h-6 text-xs"
size="icon-sm"
@@ -259,8 +259,8 @@
v-if="userDialog.id === currentUser.id"
style="margin-left: 5px; padding: 0"
@click="showBioDialog"
><i class="ri-pencil-line"></i
></Button>
><Pencil class="h-3 w-3" />
</Button>
</div>
<div style="margin-top: 5px" class="flex items-center">
<TooltipWrapper v-for="(link, index) in userDialog.ref.bioLinks" :key="index">
@@ -511,7 +511,7 @@
size="icon-sm"
variant="outline"
@click.stop="resetHome()"
><i class="ri-delete-bin-line"></i>
><Trash2 class="h-4 w-4" />
</Button>
</span>
</div>
@@ -529,8 +529,8 @@
size="icon-sm"
variant="outline"
@click.stop
><i class="ri-file-copy-line"></i
></Button>
><Copy class="h-4 w-4" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent>
<DropdownMenuItem @click="copyUserId(userDialog.id)">
@@ -1302,14 +1302,18 @@
AlertTriangle,
ArrowDown,
ArrowUp,
Copy,
Download,
Eye,
Languages,
Loader2,
LogOut,
MoreHorizontal,
Pencil,
RefreshCcw,
RefreshCw,
Tag
Tag,
Trash2
} from 'lucide-vue-next';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
import { computed, defineAsyncComponent, nextTick, ref, watch } from 'vue';
src/components/dialogs/UserDialog/UserSummaryHeader.vue
+11 -11
View File
@@ -79,7 +79,7 @@
class="name"
:class="userDialog.ref.$trustClass"
style="margin-right: 5px; margin-top: 5px">
<i class="ri-shield-line"></i> {{ userDialog.ref.$trustLevel }}
<Shield class="mr-1 h-4 w-4 inline-block" /> {{ userDialog.ref.$trustLevel }}
</Badge>
</TooltipWrapper>
<TooltipWrapper
@@ -91,10 +91,10 @@
class="x-tag-age-verification"
style="margin-right: 5px; margin-top: 5px">
<template v-if="userDialog.ref.ageVerificationStatus === '18+'">
<i class="ri-info-card-line"></i> 18+
<IdCard class="mr-1 h-4 w-4 inline-block" /> 18+
</template>
<template v-else>
<i class="ri-info-card-line"></i>
<IdCard class="mr-1 h-4 w-4 inline-block" />
</template>
</Badge>
</TooltipWrapper>
@@ -103,7 +103,7 @@
side="top"
:content="t('dialog.user.tags.friend_number')">
<Badge variant="outline" class="x-tag-friend" style="margin-right: 5px; margin-top: 5px">
<i class="ri-user-add-line"></i>
<UserPlus class="mr-1 h-4 w-4 inline-block" />
{{ userDialog.ref.$friendNumber ? userDialog.ref.$friendNumber : '' }}
</Badge>
</TooltipWrapper>
@@ -112,7 +112,7 @@
side="top"
:content="t('dialog.user.tags.mutual_friends')">
<Badge variant="outline" class="x-tag-mutual-friend" style="margin-right: 5px; margin-top: 5px">
<i class="ri-group-line"></i>
<Users class="mr-1 h-4 w-4 inline-block" />
{{ userDialog.mutualFriendCount }}
</Badge>
</TooltipWrapper>
@@ -140,7 +140,7 @@
<TooltipWrapper v-if="userDialog.ref.$platform === 'standalonewindows'" side="top" content="PC">
<Badge variant="outline" class="x-tag-platform-pc" style="margin-right: 5px; margin-top: 5px">
<i class="ri-computer-line"></i>
<Monitor class="h-4 w-4 x-tag-platform-pc" />
</Badge>
</TooltipWrapper>
<TooltipWrapper v-else-if="userDialog.ref.$platform === 'android'" side="top" content="Android">
@@ -148,13 +148,13 @@
variant="outline"
class="x-tag-platform-quest"
style="margin-right: 5px; margin-top: 5px">
<i class="ri-android-line"></i>
<Smartphone class="h-4 w-4 x-tag-platform-quest" />
</Badge>
</TooltipWrapper>
<TooltipWrapper v-else-if="userDialog.ref.$platform === 'ios'" side="top" content="iOS">
<Badge variant="outline" class="x-tag-platform-ios" style="margin-right: 5px; margin-top: 5px"
><i class="ri-apple-line"></i
></Badge>
<Badge variant="outline" class="x-tag-platform-ios" style="margin-right: 5px; margin-top: 5px">
<Apple class="h-4 w-4 x-tag-platform-ios" />
</Badge>
</TooltipWrapper>
<Badge
v-else-if="userDialog.ref.$platform"
@@ -260,7 +260,7 @@
</template>
<script setup>
import { ChevronDown } from 'lucide-vue-next';
import { Apple, ChevronDown, IdCard, Monitor, Shield, Smartphone, UserPlus, Users } from 'lucide-vue-next';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
src/components/dialogs/UserDialog/previousInstancesUserColumns.jsx
+4 -4
View File
@@ -1,4 +1,4 @@
import { ArrowUpDown } from 'lucide-vue-next';
import { ArrowUpDown, DoorOpen, Info, Trash2 } from 'lucide-vue-next';
import DisplayName from '../../DisplayName.vue';
import Location from '../../Location.vue';
@@ -115,7 +115,7 @@ export const createColumns = ({
onLaunch?.(original?.location);
}}
>
<i class="ri-door-open-line"></i>
<DoorOpen class="h-4 w-4" />
</Button>
<Button
@@ -127,7 +127,7 @@ export const createColumns = ({
onShowInfo?.(original?.location);
}}
>
<i class="ri-information-line"></i>
<Info class="h-4 w-4" />
</Button>
<Button
@@ -144,7 +144,7 @@ export const createColumns = ({
}
}}
>
<i class="ri-delete-bin-line"></i>
<Trash2 class="h-4 w-4" />
</Button>
</div>
);
src/components/dialogs/WorldDialog/WorldDialog.vue
+14 -9
View File
@@ -58,7 +58,7 @@
class="x-tag-platform-pc"
variant="outline"
style="margin-right: 5px; margin-top: 5px">
<i class="ri-computer-line"></i
<Monitor class="h-4 w-4 x-tag-platform-pc" />
><span
v-if="worldDialog.bundleSizes['standalonewindows']"
:class="['x-grey', 'x-tag-platform-pc', 'x-tag-border-left']">
@@ -72,7 +72,7 @@
class="x-tag-platform-quest"
variant="outline"
style="margin-right: 5px; margin-top: 5px">
<i class="ri-android-line"></i
<Smartphone class="h-4 w-4 x-tag-platform-quest" />
><span
v-if="worldDialog.bundleSizes['android']"
:class="['x-grey', 'x-tag-platform-quest', 'x-tag-border-left']">
@@ -86,7 +86,7 @@
class="x-tag-platform-ios"
variant="outline"
style="margin-right: 5px; margin-top: 5px">
<i class="ri-apple-line"></i
<Apple class="h-4 w-4 x-tag-platform-ios" />
><span
v-if="worldDialog.bundleSizes['ios']"
:class="['x-grey', 'x-tag-platform-ios', 'x-tag-border-left']">
@@ -357,8 +357,8 @@
size="icon"
variant="outline"
@click="refreshInstancePlayerCount(room.tag)"
><i class="ri-refresh-line"></i
></Button>
><RefreshCw class="h-4 w-4" />
</Button>
</TooltipWrapper>
<TooltipWrapper
v-if="instanceJoinHistory.get(room.$location.tag)"
@@ -370,8 +370,8 @@
variant="outline"
style="margin-left: 5px"
@click="showPreviousInstancesInfoDialog(room.location)"
><i class="ri-history-line"></i
></Button>
><History class="h-4 w-4" />
</Button>
</TooltipWrapper>
<LastJoin :location="room.$location.tag" :currentlocation="lastLocation.location" />
<InstanceInfo
@@ -463,8 +463,8 @@
size="icon-sm"
variant="outline"
@click.stop
><i class="ri-file-copy-line"></i
></Button>
><Copy class="h-4 w-4" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent>
<DropdownMenuItem @click="copyWorldId()">
@@ -718,21 +718,26 @@
<script setup>
import {
AlertTriangle,
Apple,
ArrowDown,
Check,
Copy,
Download,
Ellipsis,
Eye,
Flag,
History,
Home,
Image,
LineChart,
Loader2,
MessageSquare,
Monitor,
Pencil,
RefreshCcw,
RefreshCw,
Share2,
Smartphone,
Star,
Trash2,
Upload,
src/views/Favorites/FavoritesAvatar.vue
+3 -3
View File
@@ -5,7 +5,7 @@
<Select :model-value="sortFavorites" @update:modelValue="handleSortFavoritesChange">
<SelectTrigger size="sm" class="favorites-toolbar__select">
<span class="flex items-center gap-2">
<i class="ri-sort-asc"></i>
<ArrowUpDown class="h-4 w-4" />
<SelectValue
:placeholder="t('view.settings.appearance.appearance.sort_favorite_by_name')" />
</span>
@@ -166,7 +166,7 @@
<span
v-if="group.visibility === visibility"
class="group-visibility-menu__check">
<i class="ri-check-line"></i>
<Check class="h-3 w-3" />
</span>
</button>
</div>
@@ -526,7 +526,7 @@
<script setup>
import { computed, markRaw, nextTick, onBeforeMount, onBeforeUnmount, onMounted, reactive, ref, watch } from 'vue';
import { Ellipsis, Loader, MoreHorizontal, Plus, RefreshCcw, RefreshCw } from 'lucide-vue-next';
import { ArrowUpDown, Check, Ellipsis, Loader, MoreHorizontal, Plus, RefreshCcw, RefreshCw } from 'lucide-vue-next';
import { InputGroupField, InputGroupSearch } from '@/components/ui/input-group';
import { Button } from '@/components/ui/button';
import { ElMessageBox } from 'element-plus';
src/views/Favorites/FavoritesFriend.vue
+14 -6
View File
@@ -5,7 +5,7 @@
<Select :model-value="sortFavorites" @update:modelValue="handleSortFavoritesChange">
<SelectTrigger size="sm" class="favorites-toolbar__select">
<span class="flex items-center gap-2">
<i class="ri-sort-asc"></i>
<ArrowUpDown class="h-4 w-4" />
<SelectValue
:placeholder="t('view.settings.appearance.appearance.sort_favorite_by_name')" />
</span>
@@ -106,7 +106,10 @@
<div
v-for="group in favoriteFriendGroups"
:key="group.key"
:class="[ 'group-item', { 'is-active': !hasSearchInput && isGroupActive('remote', group.key) } ]"
:class="[
'group-item',
{ 'is-active': !hasSearchInput && isGroupActive('remote', group.key) }
]"
@click="handleGroupClick('remote', group.key)">
<div class="group-item__top">
<span class="group-item__name">{{ group.displayName }}</span>
@@ -149,7 +152,13 @@
v-for="visibility in friendGroupVisibilityOptions"
:key="visibility"
type="button"
:class="[ 'group-visibility-menu__item', { 'is-active': group.visibility === visibility } ]"
:class="[
'group-visibility-menu__item',
{
'is-active':
group.visibility === visibility
}
]"
@click="
handleVisibilitySelection(group, visibility)
">
@@ -157,7 +166,7 @@
<span
v-if="group.visibility === visibility"
class="group-visibility-menu__check">
<i class="ri-check-line"></i>
<Check class="h-3 w-3" />
</span>
</button>
</div>
@@ -301,10 +310,9 @@
<script setup>
import { computed, nextTick, onBeforeMount, onMounted, onUnmounted, ref, watch } from 'vue';
import { MoreHorizontal, RefreshCw } from 'lucide-vue-next';
import { ArrowUpDown, Check, Ellipsis, MoreHorizontal, RefreshCw } from 'lucide-vue-next';
import { Button } from '@/components/ui/button';
import { ElMessageBox } from 'element-plus';
import { Ellipsis } from 'lucide-vue-next';
import { InputGroupSearch } from '@/components/ui/input-group';
import { Spinner } from '@/components/ui/spinner';
import { storeToRefs } from 'pinia';
src/views/Favorites/FavoritesWorld.vue
+2 -2
View File
@@ -5,7 +5,7 @@
<Select :model-value="sortFavorites" @update:modelValue="handleSortFavoritesChange">
<SelectTrigger size="sm" class="favorites-toolbar__select">
<span class="flex items-center gap-2">
<i class="ri-sort-asc"></i>
<ArrowUpDown class="h-4 w-4" />
<SelectValue
:placeholder="t('view.settings.appearance.appearance.sort_favorite_by_name')" />
</span>
@@ -437,7 +437,7 @@
<script setup>
import { computed, nextTick, onBeforeMount, onBeforeUnmount, onMounted, ref, watch } from 'vue';
import { Ellipsis, MoreHorizontal, Plus, RefreshCcw, RefreshCw } from 'lucide-vue-next';
import { ArrowUpDown, Ellipsis, MoreHorizontal, Plus, RefreshCcw, RefreshCw } from 'lucide-vue-next';
import { InputGroupField, InputGroupSearch } from '@/components/ui/input-group';
import { Button } from '@/components/ui/button';
import { ElMessageBox } from 'element-plus';
src/views/Favorites/components/FavoritesAvatarItem.vue
+11 -10
View File
@@ -13,13 +13,13 @@
v-if="favorite.deleted"
side="top"
:content="t('view.favorite.unavailable_tooltip')">
<i class="ri-error-warning-line"></i>
<AlertTriangle class="h-4 w-4" />
</TooltipWrapper>
<TooltipWrapper
v-if="!isLocalFavorite && favorite.ref?.releaseStatus === 'private'"
side="top"
:content="t('view.favorite.private')">
<i class="ri-lock-line"></i>
<Lock class="h-4 w-4" />
</TooltipWrapper>
</span>
</div>
@@ -57,7 +57,7 @@
variant="outline"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="handlePrimaryDeleteAction">
<i class="ri-delete-bin-line"></i>
<Trash2 class="h-4 w-4" />
</Button>
</TooltipWrapper>
</div>
@@ -73,8 +73,8 @@
:disabled="currentUser.currentAvatar === favorite.id"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="selectAvatarWithConfirmation(favorite.id)"
><i class="ri-check-line"></i
></Button>
><Check class="h-4 w-4"
/></Button>
</TooltipWrapper>
</div>
<div class="favorites-search-card__action">
@@ -87,8 +87,8 @@
variant="destructive"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="handlePrimaryDeleteAction"
><i class="ri-delete-bin-line"></i
></Button>
><Trash2 class="h-4 w-4"
/></Button>
</TooltipWrapper>
<TooltipWrapper v-else side="bottom" :content="t('view.favorite.edit_favorite_tooltip')">
<Button
@@ -96,8 +96,8 @@
variant="outline"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="showFavoriteDialog('avatar', favorite.id)"
><i class="ri-star-line"></i
></Button>
><Star class="h-4 w-4"
/></Button>
</TooltipWrapper>
</div>
</div>
@@ -118,7 +118,7 @@
size="icon-sm"
variant="outline"
@click.stop="handlePrimaryDeleteAction">
<i class="ri-delete-bin-line"></i>
<Trash2 class="h-4 w-4" />
</Button>
</div>
</div>
@@ -127,6 +127,7 @@
</template>
<script setup>
import { AlertTriangle, Check, Lock, Star, Trash2 } from 'lucide-vue-next';
import { Button } from '@/components/ui/button';
import { Checkbox } from '@/components/ui/checkbox';
import { computed } from 'vue';
src/views/Favorites/components/FavoritesAvatarLocalHistoryItem.vue
+5 -4
View File
@@ -21,8 +21,9 @@
:disabled="currentUser.currentAvatar === favorite.id"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="selectAvatarWithConfirmation(favorite.id)">
<i class="ri-check-line"></i
></Button>
<Check class="h-4 w-4" />
></Button
>
</TooltipWrapper>
</div>
<div class="favorites-search-card__action">
@@ -33,14 +34,14 @@
variant="outline"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="showFavoriteDialog('avatar', favorite.id)">
<i class="ri-star-line"></i>
<Star class="h-4 w-4" />
</Button>
<Button
v-else
size="icon-sm"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="showFavoriteDialog('avatar', favorite.id)">
<i class="ri-star-line"></i>
<Star class="h-4 w-4" />
</Button>
</TooltipWrapper>
</div>
src/views/Favorites/components/FavoritesFriendItem.vue
+5 -4
View File
@@ -39,7 +39,7 @@
variant="outline"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="handleDeleteFavorite">
<i class="ri-delete-bin-line"></i>
<Trash2 class="h-4 w-4" />
</Button>
</TooltipWrapper>
</div>
@@ -53,8 +53,8 @@
variant="outline"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="showFavoriteDialog('friend', favorite.id)"
><i class="ri-star-line"></i
></Button>
><Star class="h-4 w-4"
/></Button>
</TooltipWrapper>
</div>
</template>
@@ -74,7 +74,7 @@
size="icon-sm"
variant="outline"
@click.stop="handleDeleteFavorite">
<i class="ri-delete-bin-line"></i>
<Trash2 class="h-4 w-4" />
</Button>
</div>
</div>
@@ -83,6 +83,7 @@
</template>
<script setup>
import { Star, Trash2 } from 'lucide-vue-next';
import { Button } from '@/components/ui/button';
import { Checkbox } from '@/components/ui/checkbox';
import { computed } from 'vue';
src/views/Favorites/components/FavoritesMoveDropdown.vue
+3 -2
View File
@@ -2,8 +2,8 @@
<DropdownMenu v-model:open="moveDropdownOpen" style="margin-left: 5px">
<DropdownMenuTrigger as-child>
<Button class="rounded-full w-6 h-6 text-xs" size="icon-sm" variant="ghost"
><i class="ri-arrow-left-line"></i
></Button>
><ArrowLeft class="h-4 w-4"
/></Button>
</DropdownMenuTrigger>
<DropdownMenuContent class="favorites-dropdown">
<span style="font-weight: bold; display: block; text-align: center">
@@ -25,6 +25,7 @@
<script setup>
import { computed, ref } from 'vue';
import { ArrowLeft } from 'lucide-vue-next';
import { Button } from '@/components/ui/button';
import { toast } from 'vue-sonner';
import { useI18n } from 'vue-i18n';
src/views/Favorites/components/FavoritesWorldItem.vue
+15 -14
View File
@@ -19,14 +19,14 @@
<span
v-if="favorite.deleted || favorite.ref.releaseStatus === 'private'"
class="favorites-search-card__badges">
<i
<AlertTriangle
v-if="favorite.deleted"
:title="t('view.favorite.unavailable_tooltip')"
class="ri-error-warning-line"></i>
<i
class="h-4 w-4" />
<Lock
v-if="favorite.ref.releaseStatus === 'private'"
:title="t('view.favorite.private')"
class="ri-lock-line"></i>
class="h-4 w-4" />
</span>
</div>
<span class="extra">
@@ -55,7 +55,7 @@
variant="outline"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="handleDeleteFavorite">
<i class="ri-delete-bin-line"></i>
<Trash2 class="h-4 w-4" />
</Button>
</div>
</div>
@@ -69,8 +69,8 @@
variant="outline"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="newInstanceSelfInvite(favorite.id)"
><i class="ri-mail-line"></i
></Button>
><Mail class="h-4 w-4"
/></Button>
</TooltipWrapper>
</div>
<div class="favorites-search-card__action">
@@ -83,8 +83,8 @@
variant="destructive"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="handleDeleteFavorite"
><i class="ri-delete-bin-line"></i
></Button>
><Trash2 class="h-4 w-4"
/></Button>
</TooltipWrapper>
<TooltipWrapper v-else side="top" :content="t('view.favorite.edit_favorite_tooltip')">
<Button
@@ -92,8 +92,8 @@
variant="outline"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="showFavoriteDialog('world', favorite.id)"
><i class="ri-star-line"></i
></Button>
><Star class="h-4 w-4"
/></Button>
</TooltipWrapper>
</div>
</div>
@@ -105,10 +105,10 @@
<div class="favorites-search-card__avatar is-empty"></div>
<div class="favorites-search-card__detail" v-once>
<span>{{ favorite.name || favorite.id }}</span>
<i
<AlertTriangle
v-if="favorite.deleted"
:title="t('view.favorite.unavailable_tooltip')"
class="ri-error-warning-line"></i>
class="h-4 w-4" />
</div>
</div>
<div class="favorites-search-card__actions">
@@ -118,7 +118,7 @@
size="icon-sm"
variant="outline"
@click.stop="handleDeleteFavorite">
<i class="ri-delete-bin-line"></i>
<Trash2 class="h-4 w-4" />
</Button>
</div>
</div>
@@ -127,6 +127,7 @@
</template>
<script setup>
import { AlertTriangle, Lock, Mail, Star, Trash2 } from 'lucide-vue-next';
import { Button } from '@/components/ui/button';
import { Checkbox } from '@/components/ui/checkbox';
import { computed } from 'vue';
src/views/Favorites/components/FavoritesWorldLocalItem.vue
+9 -8
View File
@@ -37,7 +37,7 @@
:variant="shiftHeld ? 'destructive' : 'outline'"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="handlePrimaryDeleteAction">
<i class="ri-delete-bin-line"></i>
<Trash2 class="h-4 w-4" />
</Button>
</div>
</div>
@@ -51,8 +51,8 @@
variant="outline"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="newInstanceSelfInvite(favorite.id)"
><i class="ri-mail-line"></i
></Button>
><Mail class="h-4 w-4"
/></Button>
</TooltipWrapper>
</div>
<div class="favorites-search-card__action">
@@ -65,8 +65,8 @@
variant="destructive"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="handleDeleteFavorite"
><i class="ri-delete-bin-line"></i
></Button>
><Trash2 class="h-4 w-4"
/></Button>
</TooltipWrapper>
<TooltipWrapper v-else side="top" :content="t('view.favorite.edit_favorite_tooltip')">
<Button
@@ -74,8 +74,8 @@
variant="outline"
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
@click.stop="showFavoriteDialog('world', favorite.id)"
><i class="ri-star-line"></i
></Button>
><Star class="h-4 w-4"
/></Button>
</TooltipWrapper>
</div>
</div>
@@ -96,7 +96,7 @@
size="icon-sm"
variant="outline"
@click.stop="handleDeleteFavorite">
<i class="ri-delete-bin-line"></i>
<Trash2 class="h-4 w-4" />
</Button>
</div>
</div>
@@ -105,6 +105,7 @@
</template>
<script setup>
import { Mail, Star, Trash2 } from 'lucide-vue-next';
import { Button } from '@/components/ui/button';
import { computed } from 'vue';
import { storeToRefs } from 'pinia';
src/views/FriendList/columns.jsx
+7 -11
View File
@@ -1,4 +1,4 @@
import { ArrowUpDown } from 'lucide-vue-next';
import { ArrowUpDown, UserMinus } from 'lucide-vue-next';
import { Button } from '../../components/ui/button';
import { Checkbox } from '../../components/ui/checkbox';
@@ -154,9 +154,7 @@ export const createColumns = ({
}),
size: 100,
sortingFn: sortByNumber((row) => row?.$friendNumber ?? 0),
cell: ({ row }) => (
<span>{row.original?.$friendNumber || ''}</span>
)
cell: ({ row }) => <span>{row.original?.$friendNumber || ''}</span>
},
{
id: 'avatar',
@@ -292,10 +290,7 @@ export const createColumns = ({
{(row.original?.bioLinks ?? [])
.filter(Boolean)
.map((link, index) => (
<TooltipWrapper
key={index}
content={String(link)}
>
<TooltipWrapper key={index} content={String(link)}>
<img
src={getFaviconUrl(link)}
class="h-4 w-4 mr-1 align-middle cursor-pointer"
@@ -425,13 +420,14 @@ export const createColumns = ({
class: 'text-center'
},
cell: ({ row }) => (
<i
class="ri-user-unfollow-line text-destructive"
// TODO(icon): verify unfollow icon replacement
<UserMinus
class="h-4 w-4 text-destructive inline-block"
onClick={(event) => {
event.stopPropagation();
onConfirmDeleteFriend?.(row.original?.id);
}}
></i>
/>
)
}
);
src/views/FriendLog/columns.jsx
+6 -8
View File
@@ -6,7 +6,7 @@ import {
TooltipProvider,
TooltipTrigger
} from '../../components/ui/tooltip';
import { ArrowRight, ArrowUpDown } from 'lucide-vue-next';
import { ArrowRight, ArrowUpDown, Trash2, X } from 'lucide-vue-next';
import { storeToRefs } from 'pinia';
import { formatDateFilter } from '../../shared/utils';
@@ -136,13 +136,11 @@ export const createColumns = ({ onDelete, onDeletePrompt }) => {
: onDeletePrompt(original)
}
>
<i
class={
shiftHeld.value
? 'ri-close-line text-red-600'
: 'ri-delete-bin-line'
}
/>
{shiftHeld.value ? (
<X class="h-4 w-4 text-red-600" />
) : (
<Trash2 class="h-4 w-4" />
)}
</button>
</div>
);
src/views/FriendsLocations/components/FriendsLocationsCard.vue
+3 -2
View File
@@ -11,7 +11,7 @@
</div>
<div class="friend-card__body">
<div class="friend-card__signature" :title="friend.ref?.statusDescription">
<i v-if="friend.ref?.statusDescription" class="ri-pencil-line mr-0.5" style="opacity: 0.7"></i>
<Pencil v-if="friend.ref?.statusDescription" class="h-3.5 w-3.5 mr-0.5" style="opacity: 0.7" />
{{ friend.ref?.statusDescription || '&nbsp;' }}
</div>
<div v-if="displayInstanceInfo" @click.stop class="friend-card__world" :title="friend.worldName">
@@ -26,8 +26,9 @@
</template>
<script setup>
import { computed } from 'vue';
import { Card } from '@/components/ui/card';
import { Pencil } from 'lucide-vue-next';
import { computed } from 'vue';
import { userImage, userStatusClass } from '../../../shared/utils';
import { useUserStore } from '../../../stores';
src/views/GameLog/columns.jsx
+7 -9
View File
@@ -7,7 +7,7 @@ import {
TooltipProvider,
TooltipTrigger
} from '../../components/ui/tooltip';
import { ArrowUpDown } from 'lucide-vue-next';
import { ArrowUpDown, FileText, Trash2, X } from 'lucide-vue-next';
import { storeToRefs } from 'pinia';
import { formatDateFilter, openExternalLink } from '../../shared/utils';
@@ -268,13 +268,11 @@ export const createColumns = ({ getCreatedAt, onDelete, onDeletePrompt }) => {
: onDeletePrompt(original)
}
>
<i
class={
shiftHeld.value
? 'ri-close-line text-red-600'
: 'ri-delete-bin-line'
}
/>
{shiftHeld.value ? (
<X class="h-4 w-4 text-red-600" />
) : (
<Trash2 class="h-4 w-4" />
)}
</button>
) : null}
{canShowPrevious ? (
@@ -290,7 +288,7 @@ export const createColumns = ({ getCreatedAt, onDelete, onDeletePrompt }) => {
)
}
>
<i class="ri-file-list-2-line" />
<FileText class="h-4 w-4" />
</button>
</TooltipTrigger>
<TooltipContent side="top">
src/views/Login/Login.vue
+3 -3
View File
@@ -147,8 +147,8 @@
variant="ghost"
style="margin-left: 10px"
@click.stop="clickDeleteSavedLogin(user.user.id)"
><i class="ri-delete-bin-line h-3 w-3"></i
></Button>
><Trash2 class="h-3 w-3"
/></Button>
</div>
</div>
</div>
@@ -179,7 +179,7 @@
<script setup>
import { Field, FieldContent, FieldError, FieldGroup, FieldLabel } from '@/components/ui/field';
import { onBeforeMount, onBeforeUnmount, ref, watch } from 'vue';
import { CircleArrowDown, Route } from 'lucide-vue-next';
import { CircleArrowDown, Route, Trash2 } from 'lucide-vue-next';
import { Field as VeeField, useForm } from 'vee-validate';
import { useRoute, useRouter } from 'vue-router';
import { Button } from '@/components/ui/button';
src/views/Moderation/columns.jsx
+6 -8
View File
@@ -6,7 +6,7 @@ import {
TooltipProvider,
TooltipTrigger
} from '../../components/ui/tooltip';
import { ArrowUpDown } from 'lucide-vue-next';
import { ArrowUpDown, Trash2, X } from 'lucide-vue-next';
import { storeToRefs } from 'pinia';
import { formatDateFilter } from '../../shared/utils';
@@ -143,13 +143,11 @@ export const createColumns = ({ onDelete, onDeletePrompt }) => {
: onDeletePrompt(original)
}
>
<i
class={
shiftHeld.value
? 'ri-close-line text-red-600'
: 'ri-delete-bin-line'
}
/>
{shiftHeld.value ? (
<X class="h-4 w-4 text-red-600" />
) : (
<Trash2 class="h-4 w-4" />
)}
</button>
</div>
);
src/views/Notifications/columns.jsx
+42 -42
View File
@@ -7,7 +7,18 @@ import {
TooltipProvider,
TooltipTrigger
} from '../../components/ui/tooltip';
import { ArrowUpDown } from 'lucide-vue-next';
import {
ArrowUpDown,
Ban,
BellOff,
Check,
Link,
MessageCircle,
Reply,
Tag,
Trash2,
X
} from 'lucide-vue-next';
import { storeToRefs } from 'pinia';
import { checkCanInvite, formatDateFilter } from '../../shared/utils';
@@ -58,25 +69,23 @@ export const createColumns = ({
);
};
const getResponseIconClass = (response, notificationType) => {
const getResponseIcon = (response, notificationType) => {
if (response?.type === 'link') {
return 'ri-link-m';
return Link;
}
switch (response?.icon) {
case 'check':
return 'ri-check-line';
return Check;
case 'cancel':
return 'ri-close-line';
return X;
case 'ban':
return 'ri-forbid-2-line';
return Ban;
case 'bell-slash':
return 'ri-notification-off-line';
return BellOff;
case 'reply':
return notificationType === 'boop'
? 'ri-chat-1-line'
: 'ri-reply-line';
return notificationType === 'boop' ? MessageCircle : Reply;
default:
return 'ri-price-tag-3-line';
return Tag;
}
};
@@ -532,7 +541,7 @@ export const createColumns = ({
)
}
>
<i class="ri-check-line" />
<Check class="h-4 w-4" />
</button>
</TooltipTrigger>
<TooltipContent side="top">
@@ -555,7 +564,7 @@ export const createColumns = ({
)
}
>
<i class="ri-chat-1-line" />
<MessageCircle class="h-4 w-4" />
</button>
</TooltipTrigger>
<TooltipContent side="top">
@@ -582,7 +591,7 @@ export const createColumns = ({
)
}
>
<i class="ri-check-line" />
<Check class="h-4 w-4" />
</button>
</TooltipTrigger>
<TooltipContent side="top">
@@ -603,7 +612,7 @@ export const createColumns = ({
)
}
>
<i class="ri-chat-1-line" />
<MessageCircle class="h-4 w-4" />
</button>
</TooltipTrigger>
<TooltipContent side="top">
@@ -641,11 +650,10 @@ export const createColumns = ({
);
};
const iconClass =
getResponseIconClass(
response,
original.type
);
const ResponseIcon = getResponseIcon(
response,
original.type
);
return (
<TooltipProvider
@@ -658,11 +666,7 @@ export const createColumns = ({
class="inline-flex h-6 ml-1 items-center justify-center text-muted-foreground hover:text-foreground"
onClick={onClick}
>
<i
class={
iconClass
}
/>
<ResponseIcon class="h-4 w-4" />
</button>
</TooltipTrigger>
<TooltipContent side="top">
@@ -693,11 +697,11 @@ export const createColumns = ({
)
}
>
<i
<X
class={
shiftHeld.value
? 'ri-close-line text-red-600'
: 'ri-close-line'
? 'h-4 w-4 text-red-600'
: 'h-4 w-4'
}
/>
</button>
@@ -726,13 +730,11 @@ export const createColumns = ({
)
}
>
<i
class={
shiftHeld.value
? 'ri-close-line text-red-600'
: 'ri-delete-bin-line'
}
/>
{shiftHeld.value ? (
<X class="h-4 w-4 text-red-600" />
) : (
<Trash2 class="h-4 w-4" />
)}
</button>
</TooltipTrigger>
<TooltipContent side="top">
@@ -759,13 +761,11 @@ export const createColumns = ({
)
}
>
<i
class={
shiftHeld.value
? 'ri-close-line text-red-600'
: 'ri-delete-bin-line'
}
/>
{shiftHeld.value ? (
<X class="h-4 w-4 text-red-600" />
) : (
<Trash2 class="h-4 w-4" />
)}
</button>
</TooltipTrigger>
<TooltipContent side="top">
src/views/PlayerList/PlayerList.vue
+4 -4
View File
@@ -59,7 +59,7 @@
</Badge>
<TooltipWrapper v-if="currentInstanceWorld.isPC" side="top" content="PC">
<Badge class="x-tag-platform-pc" variant="outline" style="margin-right: 5px"
><i class="ri-computer-line"></i>
><Monitor class="h-4 w-4" />
<span
v-if="currentInstanceWorld.bundleSizes['standalonewindows']"
:class="['x-grey', 'x-tag-platform-pc', 'x-tag-border-left']"
@@ -69,7 +69,7 @@
</TooltipWrapper>
<TooltipWrapper v-if="currentInstanceWorld.isQuest" side="top" content="Android">
<Badge class="x-tag-platform-quest" variant="outline" style="margin-right: 5px"
><i class="ri-android-line"></i>
><Smartphone class="h-4 w-4" />
<span
v-if="currentInstanceWorld.bundleSizes['android']"
:class="['x-grey', 'x-tag-platform-quest', 'x-tag-border-left']"
@@ -79,7 +79,7 @@
</TooltipWrapper>
<TooltipWrapper v-if="currentInstanceWorld.isIos" side="top" content="iOS">
<Badge class="x-tag-platform-ios" variant="outline" style="margin-right: 5px"
><i class="ri-apple-line"></i>
><Apple class="h-4 w-4" />
<span
v-if="currentInstanceWorld.bundleSizes['ios']"
:class="['x-grey', 'x-tag-platform-ios', 'x-tag-border-left']"
@@ -167,7 +167,7 @@
<script setup>
import { computed, defineAsyncComponent, onActivated, onMounted, ref, watch } from 'vue';
import { Home } from 'lucide-vue-next';
import { Apple, Home, Monitor, Smartphone } from 'lucide-vue-next';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
src/views/PlayerList/columns.jsx
+11 -5
View File
@@ -1,7 +1,13 @@
import Timer from '../../components/Timer.vue';
import { Button } from '../../components/ui/button';
import { TooltipWrapper } from '../../components/ui/tooltip';
import { ArrowUpDown } from 'lucide-vue-next';
import {
Apple,
ArrowUpDown,
IdCard,
Monitor,
Smartphone
} from 'lucide-vue-next';
import {
getFaviconUrl,
@@ -285,7 +291,7 @@ export const createColumns = ({
) : null}
{r?.ageVerified ? (
<TooltipWrapper side="left" content="18+ Verified">
<i class="ri-id-card-line x-tag-age-verification"></i>
<IdCard class="h-4 w-4 x-tag-age-verification" />
</TooltipWrapper>
) : null}
</div>
@@ -304,11 +310,11 @@ export const createColumns = ({
const platformIcon =
platform === 'standalonewindows' ? (
<i class="ri-computer-line x-tag-platform-pc" />
<Monitor class="h-4 w-4 x-tag-platform-pc" />
) : platform === 'android' ? (
<i class="ri-android-line x-tag-platform-quest" />
<Smartphone class="h-4 w-4 x-tag-platform-quest" />
) : platform === 'ios' ? (
<i class="ri-apple-line x-tag-platform-ios" />
<Apple class="h-4 w-4 x-tag-platform-ios" />
) : platform ? (
<span>{String(platform)}</span>
) : null;
src/views/PlayerList/dialogs/ChatboxBlacklistDialog.vue
+2 -1
View File
@@ -47,7 +47,7 @@
cursor: pointer;
"
@click="deleteChatboxUserBlacklist(user[0])">
<i class="ri-close-line" style="font-size: 12px; line-height: 1"></i>
<X class="h-3 w-3" style="line-height: 1" />
</button>
</Badge>
</div>
@@ -57,6 +57,7 @@
<script setup>
import { Button } from '@/components/ui/button';
import { InputGroupAction } from '@/components/ui/input-group';
import { X } from 'lucide-vue-next';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
src/views/Settings/components/Tabs/AdvancedTab.vue
+5 -5
View File
@@ -159,10 +159,10 @@
:long-label="true"
@change="changeTranslationAPI('VRCX_translationAPI')" />
<div class="options-container-item">
<Button size="sm" variant="outline" @click="showTranslationApiDialog"
><i class="ri-translate-2" style="margin-right: 5px"></i
>{{ t('view.settings.advanced.advanced.translation_api.translation_api_key') }}</Button
>
<Button size="sm" variant="outline" @click="showTranslationApiDialog">
<Languages class="h-4 w-4" style="margin-right: 5px" />
{{ t('view.settings.advanced.advanced.translation_api.translation_api_key') }}
</Button>
</div>
</div>
<div class="options-container">
@@ -384,7 +384,7 @@
</template>
<script setup>
import { Folder, Package, RefreshCcw, Settings, Trash2 } from 'lucide-vue-next';
import { Folder, Languages, Package, RefreshCcw, Settings, Trash2 } from 'lucide-vue-next';
import { computed, reactive, ref } from 'vue';
import { Button } from '@/components/ui/button';
import { ButtonGroup } from '@/components/ui/button-group';
src/views/Sidebar/components/FriendItem.vue
+2 -2
View File
@@ -41,7 +41,7 @@
variant="ghost"
class="mr-1 w-6 h-6 text-xs"
@click.stop="$emit('confirm-delete-friend', friend.id)"
><i class="ri-delete-bin-2-line"></i>
><Trash2 class="h-4 w-4" />
</Button>
</template>
@@ -60,7 +60,7 @@
</template>
<script setup>
import { Loader2, AlertTriangle } from 'lucide-vue-next';
import { AlertTriangle, Loader2, Trash2 } from 'lucide-vue-next';
import { Button } from '@/components/ui/button';
import { computed } from 'vue';
import { storeToRefs } from 'pinia';
src/views/Tools/Tools.vue
+29 -14
View File
@@ -6,14 +6,16 @@
<div class="tool-categories">
<div class="tool-category">
<div class="category-header" @click="toggleCategory('group')">
<ArrowRight class="rotation-transition" :class="{ 'is-rotated': !categoryCollapsed['group'] }" />
<ArrowRight
class="rotation-transition"
:class="{ 'is-rotated': !categoryCollapsed['group'] }" />
<span class="category-title">{{ t('view.tools.group.header') }}</span>
</div>
<div class="tools-grid" v-show="!categoryCollapsed['group']">
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="showGroupCalendarDialog">
<div class="tool-icon">
<i class="ri-calendar-event-line"></i>
<CalendarDays />
</div>
<div class="tool-info">
<div class="tool-name">{{ t('view.tools.group.calendar') }}</div>
@@ -26,14 +28,16 @@
<div class="tool-category">
<div class="category-header" @click="toggleCategory('image')">
<ArrowRight class="rotation-transition" :class="{ 'is-rotated': !categoryCollapsed['image'] }" />
<ArrowRight
class="rotation-transition"
:class="{ 'is-rotated': !categoryCollapsed['image'] }" />
<span class="category-title">{{ t('view.tools.pictures.header') }}</span>
</div>
<div class="tools-grid" v-show="!categoryCollapsed['image']">
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="showScreenshotMetadataPage">
<div class="tool-icon">
<i class="ri-screenshot-2-line"></i>
<Camera />
</div>
<div class="tool-info">
<div class="tool-name">{{ t('view.tools.pictures.screenshot') }}</div>
@@ -46,7 +50,7 @@
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="showGalleryPage">
<div class="tool-icon">
<i class="ri-multi-image-line"></i>
<Images />
</div>
<div class="tool-info">
<div class="tool-name">{{ t('view.tools.pictures.inventory') }}</div>
@@ -59,7 +63,7 @@
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="openVrcPhotosFolder">
<div class="tool-icon">
<i class="ri-folder-image-line"></i>
<FolderOpen />
</div>
<div class="tool-info">
<div class="tool-name">{{ t('view.tools.pictures.pictures.vrc_photos') }}</div>
@@ -72,7 +76,7 @@
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="openVrcScreenshotsFolder">
<div class="tool-icon">
<i class="ri-folder-image-line"></i>
<FolderOpen />
</div>
<div class="tool-info">
<div class="tool-name">
@@ -97,7 +101,7 @@
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="showExportDiscordNamesDialog">
<div class="tool-icon">
<i class="ri-discord-line"></i>
<MessageSquare />
</div>
<div class="tool-info">
<div class="tool-name">{{ t('view.tools.export.discord_names') }}</div>
@@ -110,7 +114,7 @@
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="showNoteExportDialog">
<div class="tool-icon">
<i class="ri-user-shared-line"></i>
<UserCheck />
</div>
<div class="tool-info">
<div class="tool-name">{{ t('view.tools.export.export_notes') }}</div>
@@ -124,7 +128,7 @@
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="showExportFriendsListDialog">
<div class="tool-icon">
<i class="ri-user-shared-line"></i>
<UserCheck />
</div>
<div class="tool-info">
<div class="tool-name">{{ t('view.tools.export.export_friend_list') }}</div>
@@ -137,7 +141,7 @@
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="showExportAvatarsListDialog">
<div class="tool-icon">
<i class="ri-user-shared-line"></i>
<UserCheck />
</div>
<div class="tool-info">
<div class="tool-name">{{ t('view.tools.export.export_own_avatars') }}</div>
@@ -152,14 +156,16 @@
<div class="tool-category">
<div class="category-header" @click="toggleCategory('other')">
<ArrowRight class="rotation-transition" :class="{ 'is-rotated': !categoryCollapsed['other'] }" />
<ArrowRight
class="rotation-transition"
:class="{ 'is-rotated': !categoryCollapsed['other'] }" />
<span class="category-title">{{ t('view.tools.other.header') }}</span>
</div>
<div class="tools-grid" v-show="!categoryCollapsed['other']">
<Card class="tool-card p-0 gap-0">
<div class="tool-content" @click="showEditInviteMessageDialog">
<div class="tool-icon">
<i class="ri-edit-box-line"></i>
<SquarePen />
</div>
<div class="tool-info">
<div class="tool-name">{{ t('view.tools.other.edit_invite_message') }}</div>
@@ -195,9 +201,18 @@
</template>
<script setup>
import {
ArrowRight,
CalendarDays,
Camera,
FolderOpen,
Images,
MessageSquare,
SquarePen,
UserCheck
} from 'lucide-vue-next';
import { computed, defineAsyncComponent, ref } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { ArrowRight } from 'lucide-vue-next';
import { Card } from '@/components/ui/card';
import { storeToRefs } from 'pinia';
import { toast } from 'vue-sonner';
src/vr/Vr.vue
+83 -53
View File
@@ -15,7 +15,7 @@
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<span class="name" v-text="feed.displayName"></span>
<i v-if="feed.isTraveling" class="ri-loader-line is-loading ml-5"></i>
<Loader2 v-if="feed.isTraveling" class="is-loading ml-5 h-4 w-4" />
<VrLocation
:location="feed.location"
:hint="feed.worldName"
@@ -33,7 +33,7 @@
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<span class="name" v-text="feed.displayName"></span>
<i class="ri-close-line" style="font-size: 21px"></i>
<X class="h-5 w-5" />
</span>
</div>
</div>
@@ -45,9 +45,9 @@
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<span class="name" v-text="feed.displayName"></span>
<i class="ri-check-line" style="font-size: 21px"></i>
<Check class="h-5 w-5" />
<template v-if="feed.worldName">
<i v-if="feed.isTraveling" class="ri-loader-line is-loading ml-5"></i>
<Loader2 v-if="feed.isTraveling" class="is-loading ml-5 h-4 w-4" />
<VrLocation
:location="feed.location"
:hint="feed.worldName"
@@ -68,7 +68,7 @@
<span class="name" v-text="feed.displayName" style="margin-right: 5px"></span>
<template v-if="feed.statusDescription === feed.previousStatusDescription">
<i class="x-user-status" :class="statusClass(feed.previousStatus)"></i>
<i class="ri-arrow-right-line"></i>
<ArrowRight class="mx-1 h-4 w-4 inline-block" />
<i class="x-user-status" :class="statusClass(feed.status)"></i>
</template>
<template v-else>
@@ -85,7 +85,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-play-large-line mr-5"></i>
<Play class="mr-5 h-5 w-5" />
<span
class="name"
v-text="feed.displayName"
@@ -100,7 +100,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-play-reverse-large-line mr-5"></i>
<Play class="mr-5 h-5 w-5 rotate-180" />
<span
class="name"
v-text="feed.displayName"
@@ -115,8 +115,8 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-play-large-line"></i>
<i class="ri-loader-line is-loading mr-5"></i>
<Play class="h-5 w-5" />
<Loader2 class="is-loading mr-5 h-4 w-4" />
<span class="name" v-text="feed.displayName"></span>
</span>
</div>
@@ -143,7 +143,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-youtube-line mr-5"></i>
<Youtube class="mr-5 h-5 w-5" />
<span
v-if="feed.displayName"
class="name"
@@ -166,7 +166,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-mail-send-line mr-5"></i>
<Send class="mr-5 h-5 w-5" />
<span class="name mr-5" v-text="feed.senderUsername"></span>
<VrLocation
:location="feed.details.worldId"
@@ -183,7 +183,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-mail-send-line mr-5"></i>
<Send class="mr-5 h-5 w-5" />
<span class="name mr-5" v-text="feed.senderUsername"></span>
<span v-text="feed.details.requestMessage"></span>
</span>
@@ -196,7 +196,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-mail-send-line mr-5"></i>
<Send class="mr-5 h-5 w-5" />
<span class="name mr-5" v-text="feed.senderUsername"></span>
<span v-text="feed.details.responseMessage"></span>
</span>
@@ -209,7 +209,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-mail-send-line mr-5"></i>
<Send class="mr-5 h-5 w-5" />
<span class="name mr-5" v-text="feed.senderUsername"></span>
<span v-text="feed.details.responseMessage"></span>
</span>
@@ -222,7 +222,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-heart-add-line mr-5"></i>
<HeartPlus class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.senderUsername"></span>
</span>
</div>
@@ -234,7 +234,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-hearts-line mr-5"></i>
<Heart class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.displayName"></span>
</span>
</div>
@@ -246,7 +246,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-dislike-line mr-5"></i>
<ThumbsDown class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.displayName"></span>
</span>
</div>
@@ -258,9 +258,9 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-file-edit-fill mr-5"></i>
<Pencil class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.previousDisplayName"></span>
<i class="ri-arrow-right-fill mr-5"></i>
<ArrowRight class="mr-5 h-4 w-4 inline-block" />
<span class="name" v-text="feed.displayName"></span>
</span>
</div>
@@ -272,9 +272,10 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-graduation-cap-line mr-5"></i
><span class="name" v-text="feed.displayName"></span>
{{ feed.previousTrustLevel }} <i class="ri-arrow-right-fill"></i>
<GraduationCap class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.displayName"></span>
{{ feed.previousTrustLevel }}
<ArrowRight class="mx-1 inline-block h-4 w-4" />
{{ feed.trustLevel }}
</span>
</div>
@@ -286,7 +287,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-hand-heart-fill mr-5"></i>
<HeartHandshake class="mr-5 h-5 w-5" />
<span class="name mr-5" v-text="feed.senderUsername"></span>
<span v-text="feed.message"></span>
</span>
@@ -299,7 +300,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-price-tag-3-line mr-5"></i>
<Tag class="mr-5 h-5 w-5" />
<span class="name mr-5" v-text="feed.senderUsername"></span>
<span v-text="feed.message"></span>
</span>
@@ -312,7 +313,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-megaphone-line mr-5"></i>
<Megaphone class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.message"></span>
</span>
</div>
@@ -324,7 +325,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-megaphone-line mr-5"></i>
<Megaphone class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.message"></span>
</span>
</div>
@@ -336,7 +337,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-price-tag-3-line mr-5"></i>
<Tag class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.message"></span>
</span>
</div>
@@ -348,7 +349,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-price-tag-3-line mr-5"></i>
<Tag class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.message"></span>
</span>
</div>
@@ -360,7 +361,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-price-tag-3-line mr-5"></i>
<Tag class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.message"></span>
</span>
</div>
@@ -372,7 +373,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-mail-send-line mr-5"></i>
<Send class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.message"></span>
</span>
</div>
@@ -384,7 +385,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-close-circle-line mr-5"></i>
<XCircle class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.message"></span>
</span>
</div>
@@ -397,7 +398,7 @@
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<template v-if="feed.displayName">
<i class="ri-bard-line mr-5"></i>
<Music class="mr-5 h-5 w-5" />
<span
class="name mr-5"
v-text="feed.displayName"
@@ -407,8 +408,8 @@
:hint="feed.worldName"
:grouphint="feed.groupName"></VrLocation>
</template>
<template v-else
><i class="ri-bard-line"></i> User has spawned a portal
<template v-else>
<Music class="mr-1 h-5 w-5 inline-block" /> User has spawned a portal
</template>
</span>
</div>
@@ -420,7 +421,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-walk-line mr-5"></i>
<Footprints class="mr-5 h-5 w-5" />
<span
class="name mr-5"
v-text="feed.displayName"
@@ -445,7 +446,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-chat-1-fill mr-5"></i>
<MessageSquare class="mr-5 h-5 w-5" />
<span
class="name"
v-text="feed.displayName"
@@ -458,7 +459,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-alert-line mr-5"></i>
<AlertTriangle class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.data"></span>
</span>
</div>
@@ -467,7 +468,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-information-line mr-5"></i>
<Info class="mr-5 h-5 w-5" />
<span
class="name mr-5"
v-text="feed.displayName"
@@ -483,7 +484,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-play-large-line"></i><i class="ri-prohibited-line mr-5"></i>
<Play class="mr-1 h-5 w-5 inline-block" /><Ban class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.displayName"></span>
</span>
</div>
@@ -495,8 +496,8 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-play-reverse-large-line"></i
><i class="ri-prohibited-line mr-5"></i>
<Play class="mr-1 inline-block h-5 w-5 rotate-180" /><Ban
class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.displayName"></span>
</span>
</div>
@@ -508,7 +509,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-play-large-line"></i><i class="ri-volume-mute-line mr-5"></i>
<Play class="mr-1 h-5 w-5 inline-block" /><VolumeX class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.displayName"></span>
</span>
</div>
@@ -520,8 +521,8 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-play-reverse-large-line"></i
><i class="ri-volume-mute-line mr-5"></i>
<Play class="mr-1 inline-block h-5 w-5 rotate-180" /><VolumeX
class="mr-5 h-5 w-5" />
<span class="name" v-text="feed.displayName"></span>
</span>
</div>
@@ -533,7 +534,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-prohibited-line mr-5"></i>
<Ban class="mr-5 h-5 w-5" />
<span
class="name"
v-text="feed.displayName"
@@ -548,7 +549,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-checkbox-blank-circle-line mr-5"></i>
<Circle class="mr-5 h-5 w-5" />
<span
class="name"
v-text="feed.displayName"
@@ -563,7 +564,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-volume-mute-line mr-5"></i>
<VolumeX class="mr-5 h-5 w-5" />
<span
class="name"
v-text="feed.displayName"
@@ -578,7 +579,7 @@
<div class="detail">
<span class="extra">
<span class="time">{{ formatDate(feed.created_at) }}</span>
<i class="ri-volume-up-line mr-5"></i>
<Volume2 class="mr-5 h-5 w-5" />
<span
class="name"
v-text="feed.displayName"
@@ -640,7 +641,9 @@
<span style="margin-left: 5px; margin-right: 5px">has logged in</span>
<template v-if="feed.worldName">
to
<i v-if="feed.isTraveling" class="ri-loader-line is-loading ml-5"></i>
<Loader2
v-if="feed.isTraveling"
class="is-loading ml-5 inline-block h-4 w-4" />
<VrLocation
:location="feed.location"
:hint="feed.worldName"
@@ -660,7 +663,7 @@
<span class="name" v-text="feed.displayName" style="margin-right: 5px"></span>
<template v-if="feed.statusDescription === feed.previousStatusDescription">
<i class="x-user-status" :class="statusClass(feed.previousStatus)"></i>
<i class="ri-arrow-right-line"></i>
<ArrowRight class="mx-1 inline-block h-4 w-4" />
<i class="x-user-status" :class="statusClass(feed.status)"></i>
</template>
<template v-else>
@@ -1301,7 +1304,7 @@
<template v-if="feed.type === 'ChangeAvatar'">
<span style="margin-left: 10px; color: #a3a3a3">ChangeAvatar</span>
<span v-if="!feed.inCache" style="color: #aaa; margin-left: 10px"
><i class="ri-download-line is-loading"></i>
><Loader2 class="is-loading inline-block h-4 w-4" />
</span>
<span v-text="feed.avatar.name" style="margin-left: 10px"></span>
<span
@@ -1323,7 +1326,7 @@
:class="statusClass(feed.previousStatus)"
style="margin-left: 10px; width: 20px; height: 20px"></i>
<span>
<i class="ri-arrow-right-line"></i>
<ArrowRight class="mx-1 inline-block h-4 w-4" />
</span>
<i
class="x-user-status"
@@ -1365,7 +1368,7 @@
>iOS</span
>
<span v-if="!feed.inCache" style="color: #aaa; margin-left: 10px"
><i class="ri-download-line"></i>
><Download class="inline-block h-4 w-4" />
</span>
<span v-text="feed.avatar.name" style="margin-left: 10px"></span>
</template>
@@ -1408,6 +1411,33 @@
</template>
<script setup>
import {
AlertTriangle,
ArrowRight,
Ban,
Check,
Circle,
Download,
Footprints,
GraduationCap,
Heart,
HeartHandshake,
HeartPlus,
Info,
Loader2,
Megaphone,
MessageSquare,
Music,
Pencil,
Play,
Send,
ThumbsDown,
VolumeX,
Volume2,
X,
XCircle,
Youtube
} from 'lucide-vue-next';
import { nextTick, onBeforeUnmount, onMounted, reactive, toRefs } from 'vue';
import { useI18n } from 'vue-i18n';
src/vr/components/VrLocation.vue
+2 -1
View File
@@ -9,12 +9,13 @@
style="display: inline-block; margin-bottom: 2px; margin-left: 5px">
</span>
<i v-if="strict" style="display: inline-block; margin-left: 5px" class="ri-lock-line"></i>
<Lock v-if="strict" class="h-4 w-4" style="display: inline-block; margin-left: 5px" />
</span>
</template>
<script setup>
import { onMounted, ref, watch } from 'vue';
import { Lock } from 'lucide-vue-next';
import { parseLocation } from '../../shared/utils/location';