Files
backspace/packages/web/src/components/chat/ImagePreview.tsx
T
Jannis Braun 435d12e5b8 feat: unread indicators + DM bug fixes + data-driven isDmChannel
- Fix stale message cache: add force param to loadMessages, clearAllMessages action
- Fix reload race condition: URL-based isDmChannel fallback before WS ready
- Add read_states DB table for persistent unread tracking
- Add channel_ack WS event (client→server→echo) with BigInt comparison
- Wire up unread state in chatStore (readStates, unreadChannels, ackChannel)
- Auto-ack channels on MessageList view (200ms debounced)
- Unread pill indicators on server icons in ServerSidebar
- Bold text + white dot on unread channels/DMs in ChannelSidebar
- Replace all showDms reads with data-driven isDmChannel() across 8 files
- Design system, UI polish, and component fixes from previous sessions
2026-02-18 20:48:48 +01:00

33 lines
1.1 KiB
TypeScript

import React from 'react';
import { useUIStore } from '../../stores/uiStore';
export function ImagePreview() {
const imageUrl = useUIStore((s) => s.imagePreviewUrl);
const closeImagePreview = useUIStore((s) => s.closeImagePreview);
const activeModal = useUIStore((s) => s.activeModal);
if (activeModal !== 'imagePreview' || !imageUrl) return null;
return (
<div
className="fixed inset-0 z-[60] flex items-center justify-center bg-discord-bg-overlay animate-fade-in cursor-pointer"
onClick={closeImagePreview}
>
<button
className="absolute top-4 right-4 text-white/70 hover:text-white transition-colors z-10"
onClick={closeImagePreview}
>
<svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor">
<path d="M18.4 4L12 10.4L5.6 4L4 5.6L10.4 12L4 18.4L5.6 20L12 13.6L18.4 20L20 18.4L13.6 12L20 5.6L18.4 4Z" />
</svg>
</button>
<img
src={imageUrl}
alt="Preview"
className="max-w-[90vw] max-h-[90vh] object-contain rounded shadow-elevation-high"
onClick={(e) => e.stopPropagation()}
/>
</div>
);
}