byGalax
a04ecf7a19
- Voice messages: MediaRecorder → encrypted attachment, custom waveform player via OfflineAudioContext, 60s limit + live mic-level meter - Offline message queue: localStorage outbox, exponential backoff retries, optimistic pending bubble with retry/discard - Delivery indicator: message_deliveries table + RLS (reciprocal receipts), ✓ / ✓✓ / ✓✓-blue tick states, group-aware (all members must ack) - Per-participant volume slider in calls via right-click tile menu, persisted to localStorage, applied to attached audio elements - Group call scaling: grid up to 12 tiles with pagination, active-speaker auto-promotion in fullscreen - Push notifications scaffolding: service worker, VAPID subscription registration, notify-push edge function skeleton - Backup recovery code: 24-char base32 code (~120 bits entropy) as alternative decrypt path, restore UI with mode toggle - Admin panel: conversations list, audit log (admin_audit_log table + admin_log_action RPC), audit entry on user flag toggle - Search v2: sender filter, attachment-only toggle, date range - Reactions pop animation (scale 0.4→1.15→1 on count change) - Message list windowing (150 default, expand via IntersectionObserver) - Stub cleanup: removed dead ScreenshareStub from CallParticipantTile Fixes: - Focus-triggered flicker: dropped window.focus listeners in three spots, throttled visibilitychange/online wake-refreshes to 30s, keep existing data visible during background re-syncs (no more spinner on every click) - Voice attachment audio element collapsed to 0px on peer side — now forces 280px min-width on bubble Migrations (push required): 20260421000001_message_deliveries.sql 20260421000002_admin_audit_log.sql Server TODO: VAPID keys + notify-push edge function deploy
76 lines
2.2 KiB
TypeScript
76 lines
2.2 KiB
TypeScript
import { type Friendship, listFriendships } from '@chat-app/shared/friends';
|
|
import { useCallback, useEffect, useState } from 'react';
|
|
|
|
import { supabase } from './supabase';
|
|
|
|
interface FriendshipsState {
|
|
friendships: Friendship[];
|
|
loading: boolean;
|
|
error: string | null;
|
|
}
|
|
|
|
// Subscribes to the `friendships` realtime channel and re-pulls the typed
|
|
// list whenever an INSERT/UPDATE/DELETE touches one of the caller's rows.
|
|
export function useFriendships(userId: string | undefined): FriendshipsState & {
|
|
refresh: () => Promise<void>;
|
|
} {
|
|
const [state, setState] = useState<FriendshipsState>({
|
|
friendships: [],
|
|
loading: true,
|
|
error: null,
|
|
});
|
|
|
|
const refresh = useCallback(async () => {
|
|
try {
|
|
const items = await listFriendships(supabase);
|
|
setState({ friendships: items, loading: false, error: null });
|
|
} catch (err: unknown) {
|
|
setState((prev) => ({
|
|
...prev,
|
|
loading: false,
|
|
error: err instanceof Error ? err.message : 'failed to load friendships',
|
|
}));
|
|
}
|
|
}, []);
|
|
|
|
useEffect(() => {
|
|
if (!userId) return;
|
|
void refresh();
|
|
|
|
const channel = supabase
|
|
.channel('friendships:' + userId)
|
|
.on('postgres_changes', { event: '*', schema: 'public', table: 'friendships' }, () => {
|
|
void refresh();
|
|
})
|
|
.subscribe();
|
|
|
|
// Windows WebView2 throttles background sockets — refresh on wake.
|
|
// Throttled + visibility-only so a normal click into the window does not
|
|
// re-fetch on every focus.
|
|
let lastAwakeRefresh = 0;
|
|
const AWAKE_THROTTLE_MS = 30_000;
|
|
const onAwake = () => {
|
|
if (document.visibilityState !== 'visible') return;
|
|
const now = Date.now();
|
|
if (now - lastAwakeRefresh < AWAKE_THROTTLE_MS) return;
|
|
lastAwakeRefresh = now;
|
|
void refresh();
|
|
try {
|
|
channel.subscribe();
|
|
} catch {
|
|
/* already live */
|
|
}
|
|
};
|
|
document.addEventListener('visibilitychange', onAwake);
|
|
window.addEventListener('online', onAwake);
|
|
|
|
return () => {
|
|
document.removeEventListener('visibilitychange', onAwake);
|
|
window.removeEventListener('online', onAwake);
|
|
void supabase.removeChannel(channel);
|
|
};
|
|
}, [userId, refresh]);
|
|
|
|
return { ...state, refresh };
|
|
}
|