Add select all / deselect all button to favorites (#1501)

src/localization/en.json

@@ -177,6 +177,8 @@
             "edit_mode": "Edit Mode",
             "copy": "Copy",
             "clear": "Clear",
+            "select_all": "Select All",
+            "deselect_all": "Deselect All",
             "bulk_unfavorite": "Bulk Unfavorite",
             "refresh_favorites_tooltip": "Refresh VRChat favorites",
             "export": "Export",

src/views/Favorites/FavoritesAvatar.vue

@@ -357,6 +357,13 @@
                         <div
                             v-if="avatarEditMode && !isSearchActive && activeRemoteGroup"
                             class="favorites-content__actions">
+                            <el-button size="small" @click="toggleSelectAllAvatars">
+                                {{
+                                    isAllAvatarsSelected
+                                        ? t('view.favorite.deselect_all')
+                                        : t('view.favorite.select_all')
+                                }}
+                            </el-button>
                             <el-button size="small" :disabled="!hasAvatarSelection" @click="clearSelectedAvatars">
                                 {{ t('view.favorite.clear') }}
                             </el-button>
@@ -709,6 +716,15 @@
         return sliceLocalAvatarFavorites.value(activeLocalGroupName.value);
     });
 
+    const isAllAvatarsSelected = computed(() => {
+        if (!activeRemoteGroup.value || !currentRemoteFavorites.value.length) {
+            return false;
+        }
+        return currentRemoteFavorites.value
+            .map((fav) => fav.id)
+            .every((id) => selectedFavoriteAvatars.value.includes(id));
+    });
+
     watch(
         () => ({
             remote: favoriteAvatarGroups.value.map((group) => group.key),
@@ -972,6 +988,17 @@
         selectedFavoriteAvatars.value = [];
     }
 
+    function toggleSelectAllAvatars() {
+        if (!activeRemoteGroup.value) {
+            return;
+        }
+        if (isAllAvatarsSelected.value) {
+            selectedFavoriteAvatars.value = [];
+        } else {
+            selectedFavoriteAvatars.value = currentRemoteFavorites.value.map((fav) => fav.id);
+        }
+    }
+
     function copySelectedAvatars() {
         if (!selectedFavoriteAvatars.value.length) {
             return;

src/views/Favorites/FavoritesFriend.vue

@@ -194,6 +194,13 @@
                     </div>
                     <div class="favorites-content__edit-actions">
                         <div v-if="friendEditMode && !isSearchActive" class="favorites-content__actions">
+                            <el-button size="small" @click="toggleSelectAllFriends">
+                                {{
+                                    isAllFriendsSelected
+                                        ? t('view.favorite.deselect_all')
+                                        : t('view.favorite.select_all')
+                                }}
+                            </el-button>
                             <el-button size="small" :disabled="!hasFriendSelection" @click="clearSelectedFriends">
                                 {{ t('view.favorite.clear') }}
                             </el-button>
@@ -426,6 +433,15 @@
         return groupedByGroupKeyFavoriteFriends.value[activeRemoteGroup.value.key] || [];
     });
 
+    const isAllFriendsSelected = computed(() => {
+        if (!activeRemoteGroup.value || !currentFriendFavorites.value.length) {
+            return false;
+        }
+        return currentFriendFavorites.value
+            .map((fav) => fav.id)
+            .every((id) => selectedFavoriteFriends.value.includes(id));
+    });
+
     watch(
         () => favoriteFriendGroups.value.map((group) => `${group.key}:${group.count}`),
         () => {
@@ -548,6 +564,17 @@
         selectedFavoriteFriends.value = [];
     }
 
+    function toggleSelectAllFriends() {
+        if (!activeRemoteGroup.value) {
+            return;
+        }
+        if (isAllFriendsSelected.value) {
+            selectedFavoriteFriends.value = [];
+        } else {
+            selectedFavoriteFriends.value = currentFriendFavorites.value.map((fav) => fav.id);
+        }
+    }
+
     function copySelectedFriends() {
         if (!selectedFavoriteFriends.value.length) {
             return;

src/views/Favorites/FavoritesWorld.vue

@@ -298,6 +298,13 @@
                     </div>
                     <div class="favorites-content__edit-actions">
                         <div v-if="worldEditMode && !isSearchActive" class="favorites-content__actions">
+                            <el-button size="small" @click="toggleSelectAllWorlds">
+                                {{
+                                    isAllWorldsSelected
+                                        ? t('view.favorite.deselect_all')
+                                        : t('view.favorite.select_all')
+                                }}
+                            </el-button>
                             <el-button size="small" :disabled="!hasWorldSelection" @click="clearSelectedWorlds">
                                 {{ t('view.favorite.clear') }}
                             </el-button>
@@ -638,6 +645,15 @@
         }
     });
 
+    const isAllWorldsSelected = computed(() => {
+        if (!activeRemoteGroup.value || !currentRemoteFavorites.value.length) {
+            return false;
+        }
+        return currentRemoteFavorites.value
+            .map((fav) => fav.id)
+            .every((id) => selectedFavoriteWorlds.value.includes(id));
+    });
+
     watch(
         () => ({
             remote: favoriteWorldGroups.value.map((group) => group.key),
@@ -855,6 +871,17 @@
         selectedFavoriteWorlds.value = [];
     }
 
+    function toggleSelectAllWorlds() {
+        if (!activeRemoteGroup.value) {
+            return;
+        }
+        if (isAllWorldsSelected.value) {
+            selectedFavoriteWorlds.value = [];
+        } else {
+            selectedFavoriteWorlds.value = currentRemoteFavorites.value.map((fav) => fav.id);
+        }
+    }
+
     function copySelectedWorlds() {
         if (!selectedFavoriteWorlds.value.length) {
             return;