Dwinzo-Beta/Dwinzo_Demo
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/dev-collaboration' into main-dev

Browse Source
This commit is contained in:
Jerald-Golden-B
2025-06-24 11:57:37 +05:30
parent a5afcd5757 3fe52e3e7c
commit 81eb2d8193
8 changed files with 99 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/src/components/layout/scenes/MainScene.tsx
View File

@@ -3,6 +3,7 @@ import {
useLoadingProgress,
useRenameModeStore,
useSaveVersion,
useSelectedComment,
useSelectedFloorItem,
useSocketStore,
useWidgetSubOption,
@@ -39,6 +40,7 @@ import { useVersionHistoryStore } from "../../../store/builder/useVersionHistory
import { useVersionContext } from "../../../modules/builder/version/versionContext";
import VersionSaved from "../sidebarRight/versionHisory/VersionSaved";
import Footer from "../../footer/Footer";
import ThreadChat from "../../ui/collaboration/ThreadChat";
function MainScene() {
const { setMainProduct } = useMainProduct();
@@ -64,6 +66,7 @@ function MainScene() {
const { versionHistory } = useVersionHistoryStore();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion, setSelectedVersion } = selectedVersionStore();
const { selectedComment, commentPositionState } = useSelectedComment();
useEffect(() => {
if (activeModule !== 'simulation') {
@@ -185,6 +188,7 @@ function MainScene() {
{activeModule !== "market" && !selectedUser && <Footer />}
<VersionSaved />
{(commentPositionState !== null || selectedComment !== null) && <ThreadChat/>}
</>
);

40
app/src/components/ui/collaboration/Messages.tsx
View File

@@ -10,6 +10,7 @@ import { useCommentStore } from "../../../store/collaboration/useCommentStore";
import { useSelectedComment, useSocketStore } from "../../../store/builder/store";
import { getRelativeTime } from "./function/getRelativeTime";
import { editThreadTitleApi } from "../../../services/factoryBuilder/comments/editThreadTitleApi";
import { useVersionContext } from "../../../modules/builder/version/versionContext";
interface MessageProps {
@@ -34,8 +35,9 @@ const Messages: React.FC<MessageProps> = ({ val, i, setMessages, mode, setIsEdit
const { threadSocket } = useSocketStore();
const { userName, userId, organization } = getUserData();
const [isEditComment, setIsEditComment] = useState(false)
const { selectedComment, setCommentPositionState } = useSelectedComment();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
// input
const [value, setValue] = useState<string>(
@@ -59,11 +61,11 @@ const Messages: React.FC<MessageProps> = ({ val, i, setMessages, mode, setIsEdit
const handleSaveAction = async () => {
if (!projectId) return
if (!projectId || !selectedVersion) return
if (isEditableThread && editedThread) {
try {
// const editThreadTitle = await editThreadTitleApi(projectId, (val as CommentSchema).threadId, value)
// const editThreadTitle = await editThreadTitleApi(projectId, (val as CommentSchema).threadId, value, selectedVersion?.versionId || "")
// if (editThreadTitle.message == "ThreadTitle updated Successfully") {
// const editedThread: CommentSchema = {
// state: 'active',
@@ -74,7 +76,8 @@ const Messages: React.FC<MessageProps> = ({ val, i, setMessages, mode, setIsEdit
// lastUpdatedAt: new Date().toISOString(),
// position: editThreadTitle.data.position,
// rotation: [0, 0, 0],
// comments: []
// comments: [],
// versionId: selectedVersion?.versionId || ""
// }
// updateComment((val as CommentSchema).threadId, editedThread)
// }
@@ -84,17 +87,17 @@ const Messages: React.FC<MessageProps> = ({ val, i, setMessages, mode, setIsEdit
userId,
threadTitle: value,
organization,
threadId: (val as CommentSchema).threadId
threadId: (val as CommentSchema).threadId || selectedComment.threadId,
versionId: selectedVersion?.versionId || ""
}
threadSocket.emit('v1:thread:updateTitle', threadEdit)
} catch {
}
} else {
if (mode === "edit") {
try {
// const editComments = await addCommentsApi(projectId, value, selectedComment?.threadId, (val as Reply).replyId)
// const editComments = await addCommentsApi(projectId, value, selectedComment?.threadId, (val as Reply).replyId, selectedVersion?.versionId || "")
//
// const commentData = {
// replyId: `${editComments.data?.replyId}`,
@@ -102,6 +105,7 @@ const Messages: React.FC<MessageProps> = ({ val, i, setMessages, mode, setIsEdit
// createdAt: getRelativeTime(editComments.data?.createdAt),
// lastUpdatedAt: "2 hrs ago",
// comment: value,
// versionId: selectedVersion?.versionId || ""
// }
// updateReply((val as CommentSchema).threadId, (val as Reply)?.replyId, commentData);
@@ -114,7 +118,8 @@ const Messages: React.FC<MessageProps> = ({ val, i, setMessages, mode, setIsEdit
comment: value,
organization,
threadId: selectedComment?.threadId,
commentId: (val as Reply).replyId ?? ""
commentId: (val as Reply).replyId ?? "",
versionId: selectedVersion?.versionId || ""
}
@@ -133,10 +138,10 @@ const Messages: React.FC<MessageProps> = ({ val, i, setMessages, mode, setIsEdit
}
const handleDeleteAction = async (replyID: any) => {
if (!projectId) return
if (!projectId || !selectedVersion) return
setOpenOptions(false);
try {
// const deletedComment = await deleteCommentApi(projectId, selectedComment?.threadId, (val as Reply).replyId)
// const deletedComment = await deleteCommentApi(projectId, selectedComment?.threadId, (val as Reply).replyId , selectedVersion?.versionId || "")
//
// if (deletedComment === "'Thread comment deleted Successfully'") {
// setMessages && setMessages(prev => prev.filter(message => message.replyId !== replyID));
@@ -151,13 +156,16 @@ const Messages: React.FC<MessageProps> = ({ val, i, setMessages, mode, setIsEdit
userId,
commentId: (val as Reply).replyId,
organization,
threadId: selectedComment?.threadId
threadId: selectedComment?.threadId,
versionId: selectedVersion?.versionId || ""
}
setMessages(prev => prev.filter(message => message.replyId !== (val as Reply).replyId))
setMessages(prev => {
console.log("Previous messages:", prev.map((val) => val)); // 👈 logs the current state
return prev.filter(message => message.replyId !== (val as Reply).replyId);
});
removeReply(selectedComment?.threadId, (val as Reply).replyId); // Remove listener after response
console.log('(val as Reply).replyId: ', (val as Reply).replyId);
threadSocket.emit("v1-Comment:delete", deleteComment);
}
} catch {
@@ -173,7 +181,7 @@ const Messages: React.FC<MessageProps> = ({ val, i, setMessages, mode, setIsEdit
}
});
};
return (
<>
{isEditComment ? (

37
app/src/components/ui/collaboration/ThreadChat.tsx
View File

@@ -12,6 +12,7 @@ import { addCommentsApi } from "../../../services/factoryBuilder/comments/addCom
import { deleteThreadApi } from "../../../services/factoryBuilder/comments/deleteThreadApi";
import { createThreadApi } from "../../../services/factoryBuilder/comments/createThreadApi";
import { getRelativeTime } from "./function/getRelativeTime";
import { useVersionContext } from "../../../modules/builder/version/versionContext";
const ThreadChat: React.FC = () => {
const { userId, organization } = getUserData();
@@ -34,6 +35,8 @@ const ThreadChat: React.FC = () => {
const { threadSocket } = useSocketStore();
const modeRef = useRef<'create' | 'edit' | null>(null);
const messagesRef = useRef<HTMLDivElement>(null);
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
useEffect(() => {
modeRef.current = mode;
@@ -48,12 +51,12 @@ const ThreadChat: React.FC = () => {
)
.map((c) => {
return {
replyId: c._id ?? "",
replyId: c._id ?? c.replyId,
creatorId: c.creatorId || c.userId,
createdAt: c.createdAt,
lastUpdatedAt: "1 hr ago",
comment: c.comment,
_id: c._id ?? "",
_id: c._id ?? c.replyId,
};
});
@@ -61,7 +64,7 @@ const ThreadChat: React.FC = () => {
}
}, [selectedComment])
}, [])
useEffect(() => {
if (textareaRef.current) adjustHeight(textareaRef.current);
@@ -143,7 +146,7 @@ const ThreadChat: React.FC = () => {
const handleCreateComments = async (e: any) => {
e.preventDefault();
try {
// const createComments = await addCommentsApi(projectId, value, selectedComment?.threadId)/
// const createComments = await addCommentsApi(projectId, value, selectedComment?.threadId, selectedVersion?.versionId || "")/
// if (createComments.message === 'Thread comments add Successfully' && createComments.data) {
// const commentData = {
// replyId: `${createComments.data?._id}`,
@@ -151,6 +154,7 @@ const ThreadChat: React.FC = () => {
// createdAt: "2 hrs ago",
// lastUpdatedAt: "2 hrs ago",
// comment: value,
// versionId: selectedVersion?.versionId || ""
// }
// setMessages((prevMessages) => [
// ...prevMessages,
@@ -162,11 +166,13 @@ const ThreadChat: React.FC = () => {
if (threadSocket && mode === "create") {
const addComment = {
versionId: selectedVersion?.versionId || "",
projectId,
userId,
comment: value,
organization,
threadId: selectedComment?.threadId
threadId: selectedComment?.threadId,
}
threadSocket.emit("v1-Comment:add", addComment);
@@ -179,19 +185,21 @@ const ThreadChat: React.FC = () => {
const handleDeleteThread = async () => {
if (!projectId) return;
try {
// const deleteThread = await deleteThreadApi(projectId, selectedComment?.threadId)
// const deleteThread = await deleteThreadApi(projectId, selectedComment?.threadId, selectedVersion?.versionId || "")
//
// if (deleteThread.message === "Thread deleted Successfully") {
// removeComment(selectedComment?.threadId)
// setSelectedComment([])
// }
console.log('threadSocket:threadChat ', threadSocket);
if (threadSocket) {
// projectId, userId, organization, threadId
const deleteThread = {
projectId,
userId,
organization,
threadId: selectedComment?.threadId
threadId: selectedComment?.threadId,
versionId: selectedVersion?.versionId || ""
}
setSelectedComment(null)
@@ -211,11 +219,12 @@ const ThreadChat: React.FC = () => {
try {
// try {
// const thread = await createThreadApi(
// projectId,
// "active",
// commentPositionState[0].position,
// [0, 0, 0],
// value
// projectId,
// "active",
// commentPositionState[0].position,
// [0, 0, 0],
// value,
// selectedVersion?.versionId || ""
// );
//
//
@@ -241,15 +250,17 @@ const ThreadChat: React.FC = () => {
const createThread = {
projectId,
versionId: selectedVersion?.versionId || "",
userId,
organization,
state: "active",
position: commentPositionState.position,
rotation: [0, 0, 0],
threadTitle: value
threadTitle: value,
};
if (threadSocket) {
console.log('createThread: ', createThread);
setInputActive(false);
threadSocket.emit("v1:thread:create", createThread);

9
app/src/modules/collaboration/comments/instances/commentInstances.tsx
View File

@@ -5,16 +5,19 @@ import { getAllThreads } from '../../../../services/factoryBuilder/comments/getA
import { useParams } from 'react-router-dom';
import { getUserData } from '../../../../functions/getUserData';
import { getRelativeTime } from '../../../../components/ui/collaboration/function/getRelativeTime';
import { useVersionContext } from '../../../builder/version/versionContext';
function CommentInstances() {
const { comments, setComments } = useCommentStore();
const { projectId } = useParams();
const { userId } = getUserData()
const { userId } = getUserData();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const getThreads = async () => {
if (!projectId) return;
if (!projectId || !selectedVersion) return;
try {
const getComments = await getAllThreads(projectId);
const getComments = await getAllThreads(projectId, selectedVersion?.versionId);
const formattedThreads = Array.isArray(getComments.data)
? getComments.data.map((thread: any) => ({

48
app/src/modules/collaboration/socket/threadSocketResponses.dev.tsx
View File

@@ -14,12 +14,13 @@ interface ThreadSocketProps {
const ThreadSocketResponsesDev = ({ setMessages, modeRef, messages }: ThreadSocketProps) => {
const { threadSocket } = useSocketStore();
const { selectedComment, setSelectedComment, setCommentPositionState, commentPositionState } = useSelectedComment();
const { comments, addComment, addReply, updateComment, updateReply } = useCommentStore();
const { comments, removeReply, addComment, addReply, updateComment, updateReply } = useCommentStore();
const { userId } = getUserData();
useEffect(() => {
if (!threadSocket) return;
// --- Add Comment Handler ---
// const handleAddComment = (data: any) => {
//
@@ -55,52 +56,56 @@ const ThreadSocketResponsesDev = ({ setMessages, modeRef, messages }: ThreadSock
// };
// threadSocket.on('v1-Comment:response:add', handleAddComment);
const handleAddComment = (data: any) => {
// console.log('Add: ', data);
const commentData = {
replyId: data.data?._id,
creatorId: data.data?.userId,
createdAt: getRelativeTime(data.data?.createdAt),
lastUpdatedAt: "2 hrs ago",
comment: data.data.comment,
comment: data.data?.comment,
};
if (modeRef.current === "create") {
addReply(selectedComment?.threadId, commentData);
setMessages((prevMessages) => [...prevMessages, commentData]);
} else if (modeRef.current === "edit") {
updateReply(selectedComment?.threadId, data.data?._id, commentData);
setMessages((prev) =>
prev.map((message) => {
// 👈 log each message
return message.replyId === data.data?._id
? { ...message, comment: data.data?.comment }
: message;
})
);
// console.log('data.data?.comment: ', data.data?.comment);
} else {
}
threadSocket.off("v1-Comment:response:add", handleAddComment);
};
threadSocket.on('v1-Comment:response:add', handleAddComment);
// --- Delete Comment Handler ---
const handleDeleteComment = (data: any) => {
// console.log('delete: ', data);
threadSocket.off('v1-Comment:response:delete', handleDeleteComment);
// setMessages(prev => {
// // 👈 logs the current state
// return prev.filter(message => message.replyId !== data.data._id);
// });
// removeReply(selectedComment?.threadId, data.data._id);
//
};
threadSocket.on('v1-Comment:response:delete', handleDeleteComment);
// --- Create Thread Handler ---
const handleCreateThread = (data: any) => {
// console.log('createThread: ', data);
const comment: CommentSchema = {
state: 'active',
@@ -117,20 +122,28 @@ const ThreadSocketResponsesDev = ({ setMessages, modeRef, messages }: ThreadSock
addComment(comment);
setCommentPositionState(null);
// setSelectedComment(null);
threadSocket.off('v1-thread:response:create', handleCreateThread);
};
threadSocket.on('v1-thread:response:create', handleCreateThread);
// --- Delete Thread Handler ---
// const handleDeleteThread = (data: any) => {
//
// };
// threadSocket.on("v1-thread:response:delete", handleDeleteThread);
console.log(
"del"
);
const handleDeleteThread = (data: any) => {
threadSocket.off('v1-thread:response:delete', handleDeleteThread);
};
threadSocket.on('v1-thread:response:delete', handleDeleteThread);
threadSocket.on("v1-thread:response:delete", handleDeleteThread);
const handleEditThread = (data: any) => {
const editedThread: CommentSchema = {
state: 'active',
threadId: data.data?._id,
@@ -138,17 +151,16 @@ const ThreadSocketResponsesDev = ({ setMessages, modeRef, messages }: ThreadSock
createdAt: data.data?.createdAt,
threadTitle: data.data?.threadTitle,
lastUpdatedAt: new Date().toISOString(),
position: data.data.position,
position: data.data?.position,
rotation: [0, 0, 0],
comments: data.data.comments,
comments: data.data?.comments,
};
// console.log('data.data?._id: ', data.data?._id);
//
updateComment(data.data?._id, editedThread);
setSelectedComment(editedThread)
// setSelectedComment(null);
};
threadSocket.on('v1-thread:response:updateTitle', handleEditThread);

5
app/src/pages/Project.tsx
View File

@@ -29,7 +29,6 @@ import { SceneProvider } from "../modules/scene/sceneContext";
import { getVersionHistoryApi } from "../services/factoryBuilder/versionControl/getVersionHistoryApi";
import { useVersionHistoryStore } from "../store/builder/useVersionHistoryStore";
import { VersionProvider } from "../modules/builder/version/versionContext";
import ThreadChat from "../components/ui/collaboration/ThreadChat";
const Project: React.FC = () => {
let navigate = useNavigate();
@@ -47,7 +46,7 @@ const Project: React.FC = () => {
const { selectedUser } = useSelectedUserStore();
const { isLogListVisible } = useLogger();
const { setVersions } = useVersionHistoryStore();
const { selectedComment, commentPositionState } = useSelectedComment();
useEffect(() => {
if (!email || !userId) {
@@ -132,7 +131,7 @@ const Project: React.FC = () => {
<LogList />
</RenderOverlay>
)}
{(commentPositionState !== null || selectedComment !== null) && <ThreadChat />}
</div>
);
};

7
app/src/services/factoryBuilder/comments/deleteThreadApi.ts
View File

@@ -1,10 +1,15 @@
let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
export const deleteThreadApi = async (projectId: string, threadId: string) => {
export const deleteThreadApi = async (
projectId: string,
threadId: string,
versionId: string
) => {
const body: any = {
projectId,
threadId,
versionId,
};
try {

6
app/src/services/factoryBuilder/comments/getAllThreads.ts
View File

@@ -1,9 +1,10 @@
let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
export const getAllThreads = async (projectId: string) => {
export const getAllThreads = async (projectId: string, versionId: string) => {
console.log("projectId: ", projectId, versionId);
try {
const response = await fetch(
`${url_Backend_dwinzo}/api/v1/Threads/${projectId}`,
`${url_Backend_dwinzo}/api/v1/Threads/${projectId}/${versionId}`,
{
method: "GET",
headers: {
@@ -21,7 +22,6 @@ export const getAllThreads = async (projectId: string) => {
}
const result = await response.json();
console.log('result: ', result);
return result;
} catch (error) {