From be647242abd725c7fd9e7a35b39d25c2cc4df82a Mon Sep 17 00:00:00 2001
From: Celso Junior <130611253+CallMeLink@users.noreply.github.com>
Date: Mon, 2 Mar 2026 02:43:30 -0300
Subject: [PATCH] Iu/add favorites type colors (#1645)

* fix: correct visibility dropdown keys and add en translations

* add pt translations

* add visibility color classes for avatar groups

* add visibility color classes for favorite groups

* Remove leftover commented import from my local testing

---------

Co-authored-by: pa <maplenagisa@gmail.com>
---
 src/localization/pt.json                | 5 +++++
 src/views/Favorites/FavoritesAvatar.vue | 9 ++++++++-
 src/views/Favorites/FavoritesFriend.vue | 9 +++++++--
 src/views/Favorites/FavoritesWorld.vue  | 8 ++++++--
 4 files changed, 26 insertions(+), 5 deletions(-)

diff --git a/src/localization/pt.json b/src/localization/pt.json
index 763da120..3b60ef87 100644
--- a/src/localization/pt.json
+++ b/src/localization/pt.json
@@ -112,6 +112,11 @@
             "move_tooltip": "Mover",
             "unfavorite_tooltip": "Desfavoritar",
             "visibility_tooltip": "Alterar Visibilidade",
+            "visibility": {
+                "public": "Público",
+                "friends": "Amigos",
+                "private": "Privado"
+            },
             "rename_tooltip": "Renomear",
             "clear_tooltip": "Limpar",
             "delete_tooltip": "Excluir",
diff --git a/src/views/Favorites/FavoritesAvatar.vue b/src/views/Favorites/FavoritesAvatar.vue
index ac67c85d..3b01d31d 100644
--- a/src/views/Favorites/FavoritesAvatar.vue
+++ b/src/views/Favorites/FavoritesAvatar.vue
@@ -121,7 +121,9 @@
                                             >
                                         </div>
                                         <div class="group-item__bottom">
-                                            <Badge :variant="getBadgeVariant(group.visibility)">
+                                            <Badge
+                                                :class="avatarGroupVisibilityColors[group.visibility]"
+                                                variant="outline">
                                                 {{ t(`view.favorite.visibility.${group.visibility}`) }}
                                             </Badge>
                                             <DropdownMenu
@@ -573,6 +575,11 @@
         displayName: `Group ${index + 1}`
     }));
 
+    const avatarGroupVisibilityColors = {
+        public: 'text-green-500 border-green-500',
+        friends: 'text-cyan-500 border-cyan-500',
+        private: 'text-red-500 border-red-500'
+    };
     const avatarGroupVisibilityOptions = ref(['public', 'friends', 'private']);
     const historyGroupKey = 'local-history';
     const avatarSplitterSize = ref(260);
diff --git a/src/views/Favorites/FavoritesFriend.vue b/src/views/Favorites/FavoritesFriend.vue
index 110759eb..2ba58cc0 100644
--- a/src/views/Favorites/FavoritesFriend.vue
+++ b/src/views/Favorites/FavoritesFriend.vue
@@ -123,7 +123,7 @@
                                             >
                                         </div>
                                         <div class="group-item__bottom">
-                                            <Badge :variant="getBadgeVariant(group.visibility)">
+                                            <Badge variant="outline">
                                                 {{ t(`view.favorite.visibility.${group.visibility}`) }}
                                             </Badge>
                                             <DropdownMenu
@@ -152,7 +152,7 @@
                                                             <DropdownMenuSubContent
                                                                 side="right"
                                                                 align="start"
-                                                                class="w-[180px]">
+                                                                class="w-45">
                                                                 <DropdownMenuCheckboxItem
                                                                     v-for="visibility in friendGroupVisibilityOptions"
                                                                     :key="visibility"
@@ -462,6 +462,11 @@
     import configRepository from '../../service/config.js';
 
     const friendGroupVisibilityOptions = ref(['public', 'friends', 'private']);
+    const friendGroupVisibilitColors = {
+        public: 'text-green-500 border-green-500',
+        friends: 'text-cyan-500 border-cyan-500',
+        private: 'text-red-500 border-red-500'
+    };
 
     const friendSplitterSize = ref(260);
     const friendSplitterFallbackWidth = typeof window !== 'undefined' && window.innerWidth ? window.innerWidth : 1200;
diff --git a/src/views/Favorites/FavoritesWorld.vue b/src/views/Favorites/FavoritesWorld.vue
index 33db9c33..761ad38a 100644
--- a/src/views/Favorites/FavoritesWorld.vue
+++ b/src/views/Favorites/FavoritesWorld.vue
@@ -123,7 +123,7 @@
                                             >
                                         </div>
                                         <div class="group-item__bottom">
-                                            <Badge :variant="getBadgeVariant(group.visibility)">
+                                            <Badge variant="outline">
                                                 {{ t(`view.favorite.visibility.${group.visibility}`) }}
                                             </Badge>
                                             <DropdownMenu
@@ -578,7 +578,11 @@
             }
         }
     });
-
+    const worldGroupVisibilityColors = {
+        public: 'text-green-500 border-green-500',
+        friends: 'text-cyan-500 border-cyan-500',
+        private: 'text-red-500 border-red-500'
+    };
     const worldGroupVisibilityOptions = ref(['public', 'friends', 'private']);
     const worldSplitterSize = ref(260);
     const worldSplitterFallbackWidth = typeof window !== 'undefined' && window.innerWidth ? window.innerWidth : 1200;