feat: add option to prioritize same instance friends in sidebar (#1238)

src/localization/en.json

@@ -178,6 +178,7 @@
             "group_by_instance": "Group by Instance",
             "split_favorite_friends": "Show Favorite Groups",
             "hide_friends_in_same_instance": "Hide Grouped Friends",
+            "same_instance_above_favorites": "Prioritize Same Instance",
             "sort_primary": "Sort by",
             "sort_secondary": "Then by",
             "sort_tertiary": "Then by",

src/stores/settings/appearance.js

@@ -81,6 +81,7 @@ export const useAppearanceSettingsStore = defineStore(
         const navWidth = ref(240);
         const isSidebarGroupByInstance = ref(true);
         const isHideFriendsInSameInstance = ref(false);
+        const isSameInstanceAboveFavorites = ref(false);
         const isSidebarDivideByFriendGroup = ref(false);
         const sidebarFavoriteGroups = ref([]);
         const sidebarFavoriteGroupOrder = ref([]);
@@ -158,6 +159,7 @@ export const useAppearanceSettingsStore = defineStore(
                 navWidthConfig,
                 isSidebarGroupByInstanceConfig,
                 isHideFriendsInSameInstanceConfig,
+                isSameInstanceAboveFavoritesConfig,
                 isSidebarDivideByFriendGroupConfig,
                 sidebarFavoriteGroupsConfig,
                 sidebarFavoriteGroupOrderConfig,
@@ -214,6 +216,10 @@ export const useAppearanceSettingsStore = defineStore(
                     'VRCX_hideFriendsInSameInstance',
                     false
                 ),
+                configRepository.getBool(
+                    'VRCX_sameInstanceAboveFavorites',
+                    false
+                ),
                 configRepository.getBool(
                     'VRCX_sidebarDivideByFriendGroup',
                     true
@@ -326,6 +332,8 @@ export const useAppearanceSettingsStore = defineStore(
             isSidebarGroupByInstance.value = isSidebarGroupByInstanceConfig;
             isHideFriendsInSameInstance.value =
                 isHideFriendsInSameInstanceConfig;
+            isSameInstanceAboveFavorites.value =
+                isSameInstanceAboveFavoritesConfig;
             isSidebarDivideByFriendGroup.value =
                 isSidebarDivideByFriendGroupConfig;
             sidebarFavoriteGroups.value = JSON.parse(
@@ -792,6 +800,17 @@ export const useAppearanceSettingsStore = defineStore(
                 isHideFriendsInSameInstance.value
             );
         }
+        /**
+         *
+         */
+        function setIsSameInstanceAboveFavorites() {
+            isSameInstanceAboveFavorites.value =
+                !isSameInstanceAboveFavorites.value;
+            configRepository.setBool(
+                'VRCX_sameInstanceAboveFavorites',
+                isSameInstanceAboveFavorites.value
+            );
+        }
         /**
          *
          */
@@ -1134,6 +1153,7 @@ export const useAppearanceSettingsStore = defineStore(
             navWidth,
             isSidebarGroupByInstance,
             isHideFriendsInSameInstance,
+            isSameInstanceAboveFavorites,
             isSidebarDivideByFriendGroup,
             sidebarFavoriteGroups,
             sidebarFavoriteGroupOrder,
@@ -1173,6 +1193,7 @@ export const useAppearanceSettingsStore = defineStore(
             setNavWidth,
             setIsSidebarGroupByInstance,
             setIsHideFriendsInSameInstance,
+            setIsSameInstanceAboveFavorites,
             setIsSidebarDivideByFriendGroup,
             setSidebarFavoriteGroups,
             setSidebarFavoriteGroupOrder,

src/views/Sidebar/Sidebar.vue

@@ -76,6 +76,12 @@
                                     :model-value="isHideFriendsInSameInstance"
                                     @update:modelValue="setIsHideFriendsInSameInstance" />
                             </Field>
+                            <Field v-if="isSidebarGroupByInstance" orientation="horizontal">
+                                <FieldLabel>{{ t('side_panel.settings.same_instance_above_favorites') }}</FieldLabel>
+                                <Switch
+                                    :model-value="isSameInstanceAboveFavorites"
+                                    @update:modelValue="setIsSameInstanceAboveFavorites" />
+                            </Field>
                             <Field orientation="horizontal">
                                 <FieldLabel>{{ t('side_panel.settings.split_favorite_friends') }}</FieldLabel>
                                 <Switch
@@ -322,6 +328,7 @@
         sidebarSortMethod3,
         isSidebarGroupByInstance,
         isHideFriendsInSameInstance,
+        isSameInstanceAboveFavorites,
         isSidebarDivideByFriendGroup,
         sidebarFavoriteGroups
     } = storeToRefs(appearanceSettingsStore);
@@ -331,6 +338,7 @@
         setSidebarSortMethod3,
         setIsSidebarGroupByInstance,
         setIsHideFriendsInSameInstance,
+        setIsSameInstanceAboveFavorites,
         setIsSidebarDivideByFriendGroup,
         setSidebarFavoriteGroups
     } = appearanceSettingsStore;

src/views/Sidebar/components/FriendsSidebar.vue

@@ -253,6 +253,7 @@
     const {
         isSidebarGroupByInstance,
         isHideFriendsInSameInstance,
+        isSameInstanceAboveFavorites,
         isSidebarDivideByFriendGroup,
         sidebarFavoriteGroups,
         sidebarFavoriteGroupOrder,
@@ -403,23 +404,7 @@
         });
     });
 
-    const virtualRows = computed(() => {
+    function buildFavoriteRows(rows) {
-        const rows = [];
-
-        rows.push(
-            buildToggleRow({
-                key: 'me-header',
-                label: t('side_panel.me'),
-                expanded: isFriendsGroupMe.value,
-                headerPadding: '0 0 5px',
-                onClick: toggleFriendsGroupMe
-            })
-        );
-
-        if (isFriendsGroupMe.value) {
-            rows.push({ type: 'me-item', key: `me:${currentUser.value?.id ?? 'me'}` });
-        }
-
         const vipFriendCount = isSidebarDivideByFriendGroup.value
             ? vipFriendsDivideByGroup.value.reduce((sum, group) => sum + group.length, 0)
             : visibleFavoriteOnlineFriends.value.length;
@@ -476,7 +461,9 @@
                 });
             }
         }
+    }
 
+    function buildSameInstanceRows(rows) {
         if (isSidebarGroupByInstance.value && friendsInSameInstance.value.length) {
             rows.push(
                 buildToggleRow({
@@ -512,6 +499,32 @@
                 });
             }
         }
+    }
+
+    const virtualRows = computed(() => {
+        const rows = [];
+
+        rows.push(
+            buildToggleRow({
+                key: 'me-header',
+                label: t('side_panel.me'),
+                expanded: isFriendsGroupMe.value,
+                headerPadding: '0 0 5px',
+                onClick: toggleFriendsGroupMe
+            })
+        );
+
+        if (isFriendsGroupMe.value) {
+            rows.push({ type: 'me-item', key: `me:${currentUser.value?.id ?? 'me'}` });
+        }
+
+        if (isSameInstanceAboveFavorites.value) {
+            buildSameInstanceRows(rows);
+            buildFavoriteRows(rows);
+        } else {
+            buildFavoriteRows(rows);
+            buildSameInstanceRows(rows);
+        }
 
         if (onlineFriendsByGroupStatus.value.length) {
             rows.push(