fix: clicking DM entries actually navigates to conversation
ConversationList was only setting activeConversationId in the store but never navigating. If the Outlet was still showing ChatArea from a server channel route, DMChat never mounted. Now every click navigates to /dm/:conversationId so the router mounts DMChat.
This commit is contained in:
@@ -1,4 +1,5 @@
|
|||||||
import { useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
|
import { useNavigate } from "react-router-dom";
|
||||||
import { useConversationStore } from "../stores/conversation.ts";
|
import { useConversationStore } from "../stores/conversation.ts";
|
||||||
import { useAuthStore } from "../stores/auth.ts";
|
import { useAuthStore } from "../stores/auth.ts";
|
||||||
import { NewConversationModal } from "./NewConversationModal.tsx";
|
import { NewConversationModal } from "./NewConversationModal.tsx";
|
||||||
@@ -16,30 +17,36 @@ export function ConversationList() {
|
|||||||
const conversations = useConversationStore((s) => s.conversations);
|
const conversations = useConversationStore((s) => s.conversations);
|
||||||
const activeId = useConversationStore((s) => s.activeConversationId);
|
const activeId = useConversationStore((s) => s.activeConversationId);
|
||||||
const fetchConversations = useConversationStore((s) => s.fetchConversations);
|
const fetchConversations = useConversationStore((s) => s.fetchConversations);
|
||||||
const setActive = useConversationStore((s) => s.setActiveConversation);
|
|
||||||
const createConversation = useConversationStore((s) => s.createConversation);
|
const createConversation = useConversationStore((s) => s.createConversation);
|
||||||
const currentUser = useAuthStore((s) => s.user);
|
const currentUser = useAuthStore((s) => s.user);
|
||||||
|
const navigate = useNavigate();
|
||||||
const [showNew, setShowNew] = useState(false);
|
const [showNew, setShowNew] = useState(false);
|
||||||
|
const [notesError, setNotesError] = useState<string | null>(null);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
fetchConversations();
|
fetchConversations();
|
||||||
}, [fetchConversations]);
|
}, [fetchConversations]);
|
||||||
|
|
||||||
const [notesError, setNotesError] = useState<string | null>(null);
|
const openConversation = (convId: string) => {
|
||||||
|
navigate(`/dm/${convId}`);
|
||||||
|
};
|
||||||
|
|
||||||
const openNotes = async () => {
|
const openNotes = async () => {
|
||||||
setNotesError(null);
|
setNotesError(null);
|
||||||
// Find existing self-DM or create one
|
// Find existing self-DM or create one
|
||||||
const existing = conversations.find((c) => isSelfDM(c, currentUser?.id || ""));
|
const existing = conversations.find((c) => isSelfDM(c, currentUser?.id || ""));
|
||||||
if (existing) {
|
if (existing) {
|
||||||
setActive(existing.id);
|
navigate(`/dm/${existing.id}`);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
try {
|
try {
|
||||||
await createConversation([]);
|
const conv = await createConversation([]);
|
||||||
|
if (conv) {
|
||||||
|
navigate(`/dm/${conv.id}`);
|
||||||
|
}
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.error('Failed to create notes:', err);
|
console.error("Failed to create notes:", err);
|
||||||
setNotesError(err instanceof Error ? err.message : 'Failed to create notes');
|
setNotesError(err instanceof Error ? err.message : "Failed to create notes");
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -78,7 +85,7 @@ export function ConversationList() {
|
|||||||
return (
|
return (
|
||||||
<button
|
<button
|
||||||
key={conv.id}
|
key={conv.id}
|
||||||
onClick={() => setActive(conv.id)}
|
onClick={() => openConversation(conv.id)}
|
||||||
className={`w-full text-left px-2 py-1 rounded-sm flex items-center gap-2 ${
|
className={`w-full text-left px-2 py-1 rounded-sm flex items-center gap-2 ${
|
||||||
conv.id === activeId
|
conv.id === activeId
|
||||||
? "terminal-active"
|
? "terminal-active"
|
||||||
|
|||||||
Reference in New Issue
Block a user