mirror of
https://github.com/MrUnknownDE/VRCX.git
synced 2026-04-22 00:03:51 +02:00
Relocate sidebar settings from the Appearance tab to a new popover within the Sidebar
This commit is contained in:
pa
@@ -224,123 +224,7 @@
|
||||
:value="dtIsoFormat"
|
||||
@change="setDtIsoFormat" />
|
||||
</div>
|
||||
<div class="options-container">
|
||||
<span class="header">{{ t('view.settings.appearance.side_panel.header') }}</span>
|
||||
<br />
|
||||
<div class="options-container-item">
|
||||
<span class="name">{{ t('view.settings.appearance.side_panel.sorting.header') }}</span>
|
||||
<Select :model-value="sidebarSortMethod1" @update:modelValue="setSidebarSortMethod1">
|
||||
<SelectTrigger style="width: 170px" size="sm">
|
||||
<SelectValue :placeholder="t('view.settings.appearance.side_panel.sorting.placeholder')" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="Sort Alphabetically">{{
|
||||
t('view.settings.appearance.side_panel.sorting.alphabetical')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort by Status">{{
|
||||
t('view.settings.appearance.side_panel.sorting.status')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort Private to Bottom">{{
|
||||
t('view.settings.appearance.side_panel.sorting.private_to_bottom')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort by Last Active">{{
|
||||
t('view.settings.appearance.side_panel.sorting.last_active')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort by Last Seen">{{
|
||||
t('view.settings.appearance.side_panel.sorting.last_seen')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort by Time in Instance">{{
|
||||
t('view.settings.appearance.side_panel.sorting.time_in_instance')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort by Location">{{
|
||||
t('view.settings.appearance.side_panel.sorting.location')
|
||||
}}</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<ArrowRight style="margin: 5px" />
|
||||
<Select
|
||||
:model-value="sidebarSortMethod2"
|
||||
:disabled="!sidebarSortMethod1"
|
||||
@update:modelValue="(v) => setSidebarSortMethod2(v === SELECT_CLEAR_VALUE ? '' : v)">
|
||||
<SelectTrigger style="width: 170px" size="sm">
|
||||
<SelectValue :placeholder="t('view.settings.appearance.side_panel.sorting.placeholder')" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem :value="SELECT_CLEAR_VALUE">{{ t('dialog.gallery_select.none') }}</SelectItem>
|
||||
<SelectItem value="Sort Alphabetically">{{
|
||||
t('view.settings.appearance.side_panel.sorting.alphabetical')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort by Status">{{
|
||||
t('view.settings.appearance.side_panel.sorting.status')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort Private to Bottom">{{
|
||||
t('view.settings.appearance.side_panel.sorting.private_to_bottom')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort by Last Active">{{
|
||||
t('view.settings.appearance.side_panel.sorting.last_active')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort by Last Seen">{{
|
||||
t('view.settings.appearance.side_panel.sorting.last_seen')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort by Time in Instance">{{
|
||||
t('view.settings.appearance.side_panel.sorting.time_in_instance')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort by Location">{{
|
||||
t('view.settings.appearance.side_panel.sorting.location')
|
||||
}}</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<ArrowRight style="margin: 5px" />
|
||||
<Select
|
||||
:model-value="sidebarSortMethod3"
|
||||
:disabled="!sidebarSortMethod2"
|
||||
@update:modelValue="(v) => setSidebarSortMethod3(v === SELECT_CLEAR_VALUE ? '' : v)">
|
||||
<SelectTrigger style="width: 170px" size="sm">
|
||||
<SelectValue :placeholder="t('view.settings.appearance.side_panel.sorting.placeholder')" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem :value="SELECT_CLEAR_VALUE">{{ t('dialog.gallery_select.none') }}</SelectItem>
|
||||
<SelectItem value="Sort Alphabetically">{{
|
||||
t('view.settings.appearance.side_panel.sorting.alphabetical')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort by Status">{{
|
||||
t('view.settings.appearance.side_panel.sorting.status')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort Private to Bottom">{{
|
||||
t('view.settings.appearance.side_panel.sorting.private_to_bottom')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort by Last Active">{{
|
||||
t('view.settings.appearance.side_panel.sorting.last_active')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort by Last Seen">{{
|
||||
t('view.settings.appearance.side_panel.sorting.last_seen')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort by Time in Instance">{{
|
||||
t('view.settings.appearance.side_panel.sorting.time_in_instance')
|
||||
}}</SelectItem>
|
||||
<SelectItem value="Sort by Location">{{
|
||||
t('view.settings.appearance.side_panel.sorting.location')
|
||||
}}</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<simple-switch
|
||||
:label="t('view.settings.appearance.side_panel.group_by_instance')"
|
||||
:value="isSidebarGroupByInstance"
|
||||
:tooltip="t('view.settings.appearance.side_panel.group_by_instance_tooltip')"
|
||||
@change="setIsSidebarGroupByInstance"></simple-switch>
|
||||
<simple-switch
|
||||
v-if="isSidebarGroupByInstance"
|
||||
:label="t('view.settings.appearance.side_panel.hide_friends_in_same_instance')"
|
||||
:value="isHideFriendsInSameInstance"
|
||||
:tooltip="t('view.settings.appearance.side_panel.hide_friends_in_same_instance_tooltip')"
|
||||
@change="setIsHideFriendsInSameInstance"></simple-switch>
|
||||
<simple-switch
|
||||
:label="t('view.settings.appearance.side_panel.split_favorite_friends')"
|
||||
:value="isSidebarDivideByFriendGroup"
|
||||
:tooltip="t('view.settings.appearance.side_panel.split_favorite_friends_tooltip')"
|
||||
@change="setIsSidebarDivideByFriendGroup"></simple-switch>
|
||||
</div>
|
||||
|
||||
<div class="options-container">
|
||||
<span class="header">{{ t('view.settings.appearance.user_dialog.header') }}</span>
|
||||
<simple-switch
|
||||
@@ -457,9 +341,9 @@
|
||||
TagsInputItemDelete,
|
||||
TagsInputItemText
|
||||
} from '@/components/ui/tags-input';
|
||||
import { ArrowRight, CheckIcon, ChevronDown, Info } from 'lucide-vue-next';
|
||||
import { Popover, PopoverAnchor, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
|
||||
import { computed, onBeforeUnmount, ref, watch } from 'vue';
|
||||
import { CheckIcon, ChevronDown, Info } from 'lucide-vue-next';
|
||||
import { useAppearanceSettingsStore, useFavoriteStore, useVrStore } from '@/stores';
|
||||
import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
|
||||
import { getLanguageName, languageCodes } from '@/localization';
|
||||
@@ -490,12 +374,6 @@
|
||||
instanceUsersSortAlphabetical,
|
||||
dtHour12,
|
||||
dtIsoFormat,
|
||||
sidebarSortMethod1,
|
||||
sidebarSortMethod2,
|
||||
sidebarSortMethod3,
|
||||
isSidebarGroupByInstance,
|
||||
isHideFriendsInSameInstance,
|
||||
isSidebarDivideByFriendGroup,
|
||||
hideUserNotes,
|
||||
hideUserMemos,
|
||||
hideUnfriends,
|
||||
@@ -519,12 +397,6 @@
|
||||
setInstanceUsersSortAlphabetical,
|
||||
setDtHour12,
|
||||
setDtIsoFormat,
|
||||
setSidebarSortMethod1,
|
||||
setSidebarSortMethod2,
|
||||
setSidebarSortMethod3,
|
||||
setIsSidebarGroupByInstance,
|
||||
setIsHideFriendsInSameInstance,
|
||||
setIsSidebarDivideByFriendGroup,
|
||||
setHideUserNotes,
|
||||
setHideUserMemos,
|
||||
setHideUnfriends,
|
||||
@@ -592,8 +464,6 @@
|
||||
}
|
||||
});
|
||||
|
||||
const SELECT_CLEAR_VALUE = '__clear__';
|
||||
|
||||
const TABLE_PAGE_SIZE_SUGGESTIONS = Object.freeze([5, 10, 15, 20, 25, 30, 50, 75, 100, 150, 200, 250, 500, 1000]);
|
||||
|
||||
const tablePageSizesOpen = ref(false);
|
||||
|
||||
Reference in New Issue
Block a user