672c8738c7
Attachments
- Video: native <video controls>, decrypted blob, metadata preload
- PDF: collapsible <object> viewer with download + preview toggle
- Generic: file card with lazy decrypt, mime-to-extension map
- MessageBubble dispatch: audio/image/video/pdf/generic by mime
- Composer accept widened from image/* to any; AttachmentPreview renders
non-images as file cards
User status
- usePeerPresence returns { state, statusMessage } and tracks both fields
via realtime updates
- ConversationHeader subtitle shows custom status_message when peer is
online/idle/dnd (with message set); falls back to localized presence
label; always "Offline" when state === 'offline'
- UserBar: status_message input in dropdown (max 128 chars, save on
blur/Enter), subtitle uses same precedence as peer view
- AuthContext: auto-flip offline → online on session mount; best-effort
offline on beforeunload/pagehide; respects explicit idle/dnd/invisible
- i18n: presence.status_placeholder (DE + EN)
DND
- CallUI: incoming ring suppressed when own presence === 'dnd' (outgoing
rings stay audible — user-initiated)
- CallContext: presenceRef mirrors profile.presenceState, incoming-call
and missed-call OS notifications skipped under DND
- ConversationsContext already gated message tone + notify
Drag/drop + paste
- Page-root drag handlers feed ingestFiles; overlay shown while dragging
- Textarea onPaste extracts clipboard image items
@mentions in groups
- MentionAutocomplete: keyboard-driven dropdown, arrow/enter/tab/esc
- Composer onChange parses trailing @token, auto-open
- renderBodyWithMentions highlights @username tokens in bubbles
Link previews
- Migration 20260421000003_link_previews.sql (cache table, auth read,
service-role write via edge function)
- Edge function og-preview: POST {url}, fetches HTML (6s timeout, 1MB
cap), regex-parses OG/twitter/description, upserts cache
- useLinkPreview hook with in-memory cache + inflight dedup
- LinkPreviewCard rendered from first URL in message body
Emoji picker
- Built-in curated set (~250 emojis) across five categories
- Search by keyword/emoji char/category, recent list persisted in
localStorage
- Trigger button next to + and voice buttons in composer
Soundboard + ringtone + mic pipeline
- Pulled in (user-authored) SoundboardManagerDialog/Panel/Settings,
RingtoneSettings, mic pipeline + hotkeys + storage modules
- AuthContext imports updateOwnProfile for presence auto-flip
Fixes
- AttachmentAudio min-width so bubbles don't collapse to 0px on peer
side
- Focus flicker: visibility/online wake refresh throttled to 30s,
focus listener dropped, loading flag only on first fetch
75 lines
2.1 KiB
TypeScript
75 lines
2.1 KiB
TypeScript
import type { PresenceState } from '@chat-app/shared/supabase';
|
|
import { useEffect, useState } from 'react';
|
|
|
|
import { supabase } from './supabase';
|
|
|
|
export interface PeerPresence {
|
|
state: PresenceState;
|
|
statusMessage: string | null;
|
|
}
|
|
|
|
// Subscribe to a single peer's presence_state + status_message via Supabase
|
|
// realtime. Returns null until the first row arrives, or when userId is
|
|
// undefined.
|
|
export function usePeerPresence(userId: string | undefined): PeerPresence | null {
|
|
const [presence, setPresence] = useState<PeerPresence | null>(null);
|
|
|
|
useEffect(() => {
|
|
if (!userId) {
|
|
setPresence(null);
|
|
return;
|
|
}
|
|
let cancelled = false;
|
|
|
|
void supabase
|
|
.from('profiles')
|
|
.select('presence_state, status_message')
|
|
.eq('user_id', userId)
|
|
.maybeSingle()
|
|
.then(({ data }) => {
|
|
if (cancelled || !data) return;
|
|
setPresence({
|
|
state: (data.presence_state as PresenceState | null) ?? 'offline',
|
|
statusMessage: data.status_message ?? null,
|
|
});
|
|
});
|
|
|
|
const channel = supabase
|
|
.channel('peer-presence:' + userId)
|
|
.on(
|
|
'postgres_changes',
|
|
{
|
|
event: 'UPDATE',
|
|
schema: 'public',
|
|
table: 'profiles',
|
|
filter: 'user_id=eq.' + userId,
|
|
},
|
|
(payload: { new: Record<string, unknown> }) => {
|
|
const nextState = payload.new['presence_state'];
|
|
const nextMsg = payload.new['status_message'];
|
|
setPresence((prev) => {
|
|
const state =
|
|
typeof nextState === 'string'
|
|
? (nextState as PresenceState)
|
|
: prev?.state ?? 'offline';
|
|
const statusMessage =
|
|
nextMsg === null
|
|
? null
|
|
: typeof nextMsg === 'string'
|
|
? nextMsg
|
|
: prev?.statusMessage ?? null;
|
|
return { state, statusMessage };
|
|
});
|
|
},
|
|
)
|
|
.subscribe();
|
|
|
|
return () => {
|
|
cancelled = true;
|
|
void supabase.removeChannel(channel);
|
|
};
|
|
}, [userId]);
|
|
|
|
return presence;
|
|
}
|