- 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
33 lines
1.1 KiB
TypeScript
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>
|
|
);
|
|
}
|