devsyncwrld/backspace
1
0
Fork 0
Code Issues Pull Requests Actions 26 Packages Projects Releases Wiki Activity

fix: repair invite links, social features, messaging + Discord UI overhaul

Browse Source 
Phase 1 - Feature Repair:
- Fix member kick/leave: add missing db.delete() call in servers.ts
- Stabilize invite codes: return existing code instead of regenerating
- Fix user search: use LIKE instead of exact match in social.ts
- Wire DM button on FriendsPage to create/navigate to DM channels
- Add cancel outgoing friend request (DELETE endpoint + frontend)
- Add accept/decline friend request actions with WS real-time events
- Fix replyToId persistence in message creation
- Hydrate reactions and replyTo in message queries
- Add joinByCode to API client and serverStore
- Add friend_request_received/accepted WebSocket events

Phase 2 - Discord UI Overhaul:
- Remove stray borders between layout columns
- Replace shadow-sm with shadow-header on content headers
- Replace all bg-gray-*/text-gray-* with Discord color tokens
- Ensure flat color contrast (#1E1F22, #2B2D31, #313338)

Testing:
- Set up vitest + @testing-library/react + jsdom
- Add 17 tests across InviteModal, JoinServer, FriendsPage (all passing)
- Fix vite resolve.extensions to prefer .tsx over stale .js files
This commit is contained in:
Jannis Braun
2026-02-18 05:34:45 +01:00
parent 4fd17084a5
commit 5ef502f2e3
82 changed files with 4906 additions and 552 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/web/src/hooks/useLiveKit.js
+6 -6
View File
@@ -23,7 +23,7 @@ export function useLiveKit() {
if (!r)
return;
const allParticipants = [];
const processParticipant = (p) => {
const processParticipant = (p, isLocal) => {
const { userId, username } = parseIdentity(p.identity);
let audioTrack = null;
let videoTrack = null;
@@ -50,13 +50,14 @@ export function useLiveKit() {
isMuted: !p.isMicrophoneEnabled,
isCameraOn: p.isCameraEnabled,
isScreenSharing: p.isScreenShareEnabled,
isLocal,
audioTrack,
videoTrack,
screenTrack,
});
};
processParticipant(r.localParticipant);
r.remoteParticipants.forEach(processParticipant);
processParticipant(r.localParticipant, true);
r.remoteParticipants.forEach((p) => processParticipant(p, false));
setParticipants(allParticipants);
}, []);
const connect = useCallback(async (channelId) => {
@@ -65,8 +66,7 @@ export function useLiveKit() {
}
setIsConnecting(true);
try {
const { token } = await api.livekit.token(channelId);
const livekitUrl = 'wss://nova.ddns.net/livekit';
const { token, url } = await api.livekit.token(channelId);
const newRoom = new Room({
adaptiveStream: true,
dynacast: true,
@@ -85,7 +85,7 @@ export function useLiveKit() {
setIsConnected(false);
setParticipants([]);
});
await newRoom.connect(livekitUrl, token);
await newRoom.connect(url, token);
await newRoom.localParticipant.enableCameraAndMicrophone();
roomRef.current = newRoom;
setRoom(newRoom);
packages/web/src/hooks/useLiveKit.ts
+7 -6
View File
@@ -21,6 +21,7 @@ export interface ParticipantInfo {
isMuted: boolean;
isCameraOn: boolean;
isScreenSharing: boolean;
isLocal: boolean;
audioTrack: MediaStreamTrack | null;
videoTrack: MediaStreamTrack | null;
screenTrack: MediaStreamTrack | null;
@@ -50,7 +51,7 @@ export function useLiveKit() {
const allParticipants: ParticipantInfo[] = [];
const processParticipant = (p: Participant) => {
const processParticipant = (p: Participant, isLocal: boolean) => {
const { userId, username } = parseIdentity(p.identity);
let audioTrack: MediaStreamTrack | null = null;
let videoTrack: MediaStreamTrack | null = null;
@@ -76,14 +77,15 @@ export function useLiveKit() {
isMuted: !p.isMicrophoneEnabled,
isCameraOn: p.isCameraEnabled,
isScreenSharing: p.isScreenShareEnabled,
isLocal,
audioTrack,
videoTrack,
screenTrack,
});
};
processParticipant(r.localParticipant);
r.remoteParticipants.forEach(processParticipant);
processParticipant(r.localParticipant, true);
r.remoteParticipants.forEach((p) => processParticipant(p, false));
setParticipants(allParticipants);
}, []);
@@ -95,8 +97,7 @@ export function useLiveKit() {
setIsConnecting(true);
try {
const { token } = await api.livekit.token(channelId);
const livekitUrl = 'wss://nova.ddns.net/livekit';
const { token, url } = await api.livekit.token(channelId);
const newRoom = new Room({
adaptiveStream: true,
@@ -118,7 +119,7 @@ export function useLiveKit() {
setParticipants([]);
});
await newRoom.connect(livekitUrl, token);
await newRoom.connect(url, token);
await newRoom.localParticipant.enableCameraAndMicrophone();
roomRef.current = newRoom;
packages/web/src/hooks/useWebSocket.js
+9 -2
View File
@@ -11,12 +11,12 @@ let isInitialized = false;
function handleEvent(event) {
const { setUser } = useAuthStore.getState();
const { populateFromReady, loadServerDetail, currentServerId, updateMemberPresence, addMember, removeMember } = useServerStore.getState();
const { addMessage, updateMessage, removeMessage, setTyping } = useChatStore.getState();
const { addMessage, updateMessage, removeMessage, setTyping, onReactionAdded, onReactionRemoved } = useChatStore.getState();
const { addVoiceUser, removeVoiceUser } = useVoiceStore.getState();
switch (event.type) {
case 'ready':
setUser(event.user);
populateFromReady(event.servers);
populateFromReady(event.servers, event.folders, event.dmChannels);
if (currentServerId) {
loadServerDetail(currentServerId);
}
@@ -51,6 +51,13 @@ function handleEvent(event) {
removeMember(event.userId);
break;
case 'dm_message_created':
addMessage(event.message.dmChannelId, event.message);
break;
case 'reaction_added':
onReactionAdded(event.messageId, event.reaction);
break;
case 'reaction_removed':
onReactionRemoved(event.messageId, event.userId, event.emoji);
break;
case 'error':
console.error('WebSocket error:', event.message);
packages/web/src/hooks/useWebSocket.ts
+24 -2
View File
@@ -3,6 +3,7 @@ import { useAuthStore } from '../stores/authStore';
import { useServerStore } from '../stores/serverStore';
import { useChatStore } from '../stores/chatStore';
import { useVoiceStore } from '../stores/voiceStore';
import { useSocialStore } from '../stores/socialStore';
import type { ServerEvent, ClientEvent } from '@opencord/shared';
let globalWs: WebSocket | null = null;
@@ -14,13 +15,13 @@ let isInitialized = false;
function handleEvent(event: ServerEvent): void {
const { setUser } = useAuthStore.getState();
const { populateFromReady, loadServerDetail, currentServerId, updateMemberPresence, addMember, removeMember } = useServerStore.getState();
const { addMessage, updateMessage, removeMessage, setTyping } = useChatStore.getState();
const { addMessage, updateMessage, removeMessage, setTyping, onReactionAdded, onReactionRemoved } = useChatStore.getState();
const { addVoiceUser, removeVoiceUser } = useVoiceStore.getState();
switch (event.type) {
case 'ready':
setUser(event.user);
populateFromReady(event.servers);
populateFromReady(event.servers, event.folders, event.dmChannels);
if (currentServerId) {
loadServerDetail(currentServerId);
}
@@ -63,8 +64,29 @@ function handleEvent(event: ServerEvent): void {
break;
case 'dm_message_created':
addMessage(event.message.dmChannelId, event.message as any);
break;
case 'reaction_added':
onReactionAdded(event.messageId, event.reaction);
break;
case 'reaction_removed':
onReactionRemoved(event.messageId, event.userId, event.emoji);
break;
case 'friend_request_received': {
const { addIncomingRequest } = useSocialStore.getState();
addIncomingRequest(event.request);
break;
}
case 'friend_request_accepted': {
const { addFriendFromAccepted } = useSocialStore.getState();
addFriendFromAccepted(event.friend, event.requestId);
break;
}
case 'error':
console.error('WebSocket error:', event.message);
break;