add destructive variant to alert dialogs for destructive actions

src/views/Dashboard/Dashboard.vue

@@ -212,7 +212,8 @@
     const handleDelete = async () => {
         const { ok } = await modalStore.confirm({
             title: t('dashboard.confirmations.delete_title'),
-            description: t('dashboard.confirmations.delete_description')
+            description: t('dashboard.confirmations.delete_description'),
+            destructive: true
         });
         if (!ok) {
             return;

src/views/Favorites/FavoritesAvatar.vue

@@ -880,7 +880,8 @@
                     invalidIdsText,
                 title: t('view.favorite.avatars.confirm_delete_invalid'),
                 confirmText: t('confirm.confirm_button'),
-                cancelText: t('view.favorite.avatars.copy_removed_ids')
+                cancelText: t('view.favorite.avatars.copy_removed_ids'),
+                destructive: true
             });
 
             if (!confirmDeleteResult.ok) {
@@ -1000,7 +1001,8 @@
         modalStore
             .confirm({
                 description: t('confirm.clear_group'),
-                title: t('confirm.title')
+                title: t('confirm.title'),
+                destructive: true
             })
             .then(({ ok }) => {
                 if (ok) {
@@ -1050,7 +1052,8 @@
         modalStore
             .confirm({
                 description: t('confirm.delete_group', { name: group }),
-                title: t('confirm.title')
+                title: t('confirm.title'),
+                destructive: true
             })
             .then(({ ok }) => {
                 if (ok) {
@@ -1223,9 +1226,9 @@
         const total = selectedFavoriteAvatars.value.length;
         modalStore
             .confirm({
-                description: `Are you sure you want to unfavorite ${total} favorites?
-                This action cannot be undone.`,
-                title: `Delete ${total} favorites?`
+                description: t('confirm.bulk_unfavorite', { count: total }),
+                title: t('confirm.bulk_unfavorite_title', { count: total }),
+                destructive: true
             })
             .then(({ ok }) => {
                 if (ok) {

src/views/Sidebar/Sidebar.vue

@@ -26,7 +26,7 @@
                         <RefreshCw v-else />
                     </Button>
                 </TooltipWrapper>
-                <ContextMenu>
+                <ContextMenu v-if="hasUnseenNotifications">
                     <ContextMenuTrigger as-child>
                         <TooltipWrapper side="bottom" :content="t('side_panel.notification_center.title')">
                             <Button
@@ -36,17 +36,26 @@
                                 @click="isNotificationCenterOpen = !isNotificationCenterOpen">
                                 <Bell />
                                 <span
-                                    v-if="hasUnseenNotifications"
                                     class="absolute top-1 right-1.25 size-1.5 rounded-full bg-red-500" />
                             </Button>
                         </TooltipWrapper>
                     </ContextMenuTrigger>
                     <ContextMenuContent>
-                        <ContextMenuItem :disabled="!hasUnseenNotifications" @click="markNotificationsRead">
+                        <ContextMenuItem @click="markNotificationsRead">
                             {{ t('nav_menu.mark_all_read') }}
                         </ContextMenuItem>
                     </ContextMenuContent>
                 </ContextMenu>
+                <TooltipWrapper v-else side="bottom" :content="t('side_panel.notification_center.title')">
+                    <Button
+                        class="rounded-full relative"
+                        variant="ghost"
+                        size="icon-sm"
+                        @click="isNotificationCenterOpen = !isNotificationCenterOpen"
+                        @contextmenu.prevent="toast.info(t('side_panel.notification_center.no_unseen_notifications'))">
+                        <Bell />
+                    </Button>
+                </TooltipWrapper>
                 <Popover v-model:open="isSettingsPopoverOpen">
                     <PopoverTrigger as-child>
                         <Button class="rounded-full" variant="ghost" size="icon-sm">
@@ -246,6 +255,7 @@
         SelectValue
     } from '@/components/ui/select';
     import { Bell, RefreshCw, Search, Settings } from 'lucide-vue-next';
+    import { toast } from 'vue-sonner';
     import { ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuTrigger } from '@/components/ui/context-menu';
     import { Field, FieldContent, FieldLabel } from '@/components/ui/field';
     import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';