Add bell icon and use better notif icon

frontend/src/test/sidebar.test.tsx

@@ -41,6 +41,7 @@ function renderSidebar(overrides?: {
   favorites?: Favorite[];
   lastMessageTimes?: ConversationTimes;
   channels?: Channel[];
+  isConversationNotificationsEnabled?: (type: 'channel' | 'contact', id: string) => boolean;
 }) {
   const aliceName = 'Alice';
   const publicChannel = makeChannel('AA'.repeat(16), 'Public');
@@ -76,6 +77,7 @@ function renderSidebar(overrides?: {
       favorites={favorites}
       sortOrder="recent"
       onSortOrderChange={vi.fn()}
+      isConversationNotificationsEnabled={overrides?.isConversationNotificationsEnabled}
     />
   );
 
@@ -218,4 +220,37 @@ describe('Sidebar section summaries', () => {
     const selectedIds = onSelectConversation.mock.calls.map(([conv]) => conv.id);
     expect(new Set(selectedIds)).toEqual(new Set([channelA.key, channelB.key]));
   });
+
+  it('shows a notification bell for conversations with notifications enabled', () => {
+    const { aliceName } = renderSidebar({
+      unreadCounts: {},
+      isConversationNotificationsEnabled: (type, id) =>
+        (type === 'contact' && id === '11'.repeat(32)) ||
+        (type === 'channel' && id === 'BB'.repeat(16)),
+    });
+
+    const aliceRow = screen.getByText(aliceName).closest('div');
+    const flightRow = screen.getByText('#flight').closest('div');
+    if (!aliceRow || !flightRow) throw new Error('Missing sidebar rows');
+
+    expect(within(aliceRow).getByLabelText('Notifications enabled')).toBeInTheDocument();
+    expect(within(flightRow).getByLabelText('Notifications enabled')).toBeInTheDocument();
+  });
+
+  it('keeps the notification bell to the left of the unread pill when both are present', () => {
+    const { aliceName } = renderSidebar({
+      unreadCounts: {
+        [getStateKey('contact', '11'.repeat(32))]: 3,
+      },
+      isConversationNotificationsEnabled: (type, id) =>
+        type === 'contact' && id === '11'.repeat(32),
+    });
+
+    const aliceRow = screen.getByText(aliceName).closest('div');
+    if (!aliceRow) throw new Error('Missing Alice row');
+
+    const bell = within(aliceRow).getByLabelText('Notifications enabled');
+    const unread = within(aliceRow).getByText('3');
+    expect(bell.compareDocumentPosition(unread) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
+  });
 });

frontend/src/test/useBrowserNotifications.test.ts

@@ -81,7 +81,7 @@ describe('useBrowserNotifications', () => {
     );
     expect(window.Notification).toHaveBeenCalledWith('New message in #flightless', {
       body: 'Notifications will look like this. These require the tab to stay open, and will not be reliable on mobile.',
-      icon: '/apple-touch-icon.png',
+      icon: '/favicon-256x256.png',
       tag: `meshcore-notification-preview-channel-${incomingChannelMessage.conversation_key}`,
     });
   });
@@ -110,7 +110,7 @@ describe('useBrowserNotifications', () => {
     expect(window.Notification).toHaveBeenCalledTimes(2);
     expect(window.Notification).toHaveBeenNthCalledWith(2, 'New message in #flightless', {
       body: 'hello room',
-      icon: '/apple-touch-icon.png',
+      icon: '/favicon-256x256.png',
       tag: 'meshcore-message-42',
     });
   });