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

Merge branch 'v2-ui' of http://185.100.212.76:7776/Dwinzo-Beta/Dwinzo_dev into v2-ui

This commit is contained in:
Nalvazhuthi 2025-05-22 18:04:06 +05:30
parent ac51f6f498 5c6116a01c
commit e836c96c23
9 changed files with 86 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

73
app/src/components/ui/collaboration/CommentThreads.tsx
View File

@ -1,22 +1,48 @@
import React, { useState } from "react";
import { getAvatarColor } from "../../../modules/collaboration/functions/getAvatarColor";
const CommentThreads: React.FC = () => {
interface CommentThreadsProps {
commentClicked: () => void;
}
const CommentThreads: React.FC<CommentThreadsProps> = ({ commentClicked }) => {
const [expand, setExpand] = useState(false);
const commentsedUsers = [
{
userId: "1",
userName: "user",
},
{
userId: "2",
userName: "Admin",
},
];
const commentsedUsers = [{ creatorId: "1" }];
const CommentDetails = {
state: "active",
commentId: "c-1",
creatorId: "12",
createdAt: "2 hours ago",
comment: "Thread check",
lastUpdatedAt: "string",
replies: [
{
replyId: 'string',
creatorId: 'string',
createdAt: 'string',
lastUpdatedAt: 'string',
reply: 'string',
},
{
replyId: 'string',
creatorId: 'string',
createdAt: 'string',
lastUpdatedAt: 'string',
reply: 'string',
}
],
};
function getUsername(userId: string) {
const UserName = "username";
return UserName;
}
function getDetails(type?: "clicked") {
if (type === "clicked") {
setExpand(true);
commentClicked();
} else {
setExpand((prev) => !prev);
}
@ -28,28 +54,33 @@ const CommentThreads: React.FC = () => {
onPointerEnter={() => getDetails()}
onPointerLeave={() => getDetails()}
onClick={() => getDetails("clicked")}
className={`comments-threads-container ${
expand ? "open" : "closed"
} unread`}
className={`comments-threads-container ${expand ? "open" : "closed"
} unread`}
>
<div className="users-commented">
{commentsedUsers.map((val, i) => (
<div
className="users"
key={val.userId}
style={{ background: getAvatarColor(i, val.userName) }}
key={val.creatorId}
style={{
background: getAvatarColor(i, getUsername(val.creatorId)),
}}
>
{val.userName[0]}
{getUsername(val.creatorId)[0]}
</div>
))}
</div>
<div className={`last-comment-details ${expand ? "expand" : ""}`}>
<div className="header">
<div className="user-name">user</div>
<div className="time">4 mins, ago</div>
<div className="user-name">
{getUsername(CommentDetails.creatorId)}
</div>
<div className="time">{CommentDetails.createdAt}</div>
</div>
<div className="message">hello</div>
<div className="replies">0 replies</div>
<div className="message">{CommentDetails.comment}</div>
{CommentDetails.replies.length > 0 && (
<div className="replies">{CommentDetails.replies.length} reply(s)</div>
)}
</div>
</button>
</div>

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

@ -3,14 +3,7 @@ import { getAvatarColor } from "../../../modules/collaboration/functions/getAvat
import { KebabIcon } from "../../icons/ExportCommonIcons";
interface MessageProps {
val: {
userName: string;
userId: string;
message: string;
creationTime: string;
idEdited: boolean;
modifiedTime: string;
};
val: Reply;
i: number;
}
@ -18,22 +11,25 @@ const Messages: React.FC<MessageProps> = ({ val, i }) => {
const [isEditing, setIsEditing] = useState(false);
const [openOptions, setOpenOptions] = useState(false);
const currentUser = "1";
const UserName = "username";
return (
<>
{isEditing ? (
<>
<div
className="profile"
style={{ background: getAvatarColor(i, val.userName) }}
style={{ background: getAvatarColor(i, UserName) }}
>
{val.userName[0]}
{UserName[0]}
</div>
<div className="content">
<div className="user-details">
<div className="user-name">{val.userName}</div>
<div className="time">{val.creationTime}</div>
<div className="user-name">{UserName}</div>
<div className="time">{val.createdAt}</div>
</div>
{val.userId === currentUser && (
{val.creatorId === currentUser && (
<div className="more-options">
<button
className="more-options-button"

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

@ -6,20 +6,18 @@ import { ExpandIcon } from "../../icons/SimulationIcons";
const ThreadChat: React.FC = () => {
const messages = [
{
userName: "user 1",
userId: "1",
message: "hello, thread check",
creationTime: "2 hrs ago",
idEdited: true,
modifiedTime: "5 mins ago",
replyId: "user 1",
creatorId: "1",
createdAt: "hello, thread check",
lastUpdatedAt: "2 hrs ago",
reply: "true",
},
{
userName: "user 2",
userId: "2",
message: "hello, thread check",
creationTime: "2 hrs ago",
idEdited: true,
modifiedTime: "5 mins ago",
idEdited: "true",
},
];
@ -44,7 +42,7 @@ const ThreadChat: React.FC = () => {
</div>
<div className="messages-wrapper">
{messages.map((val, i) => (
<Messages val={val} i={i} key={val.userId} />
<Messages val={val as Reply} i={i} key={val.userId} />
))}
</div>
<div className="send-message-wrapper">

2
app/src/modules/builder/geomentries/lines/updateDistanceText.ts
View File

@ -10,7 +10,7 @@ function updateDistanceText(
////////// Updating the Distance Texts of the lines that are affected during drag //////////
const DistanceGroup = scene.children.find((child) => child.name === "Distance_Text") as THREE.Group;
const DistanceGroup = scene.getObjectByName('Distance_Text') as THREE.Group;
affectedLines.forEach((lineIndex) => {
const mesh = floorPlanGroupLine.current.children[lineIndex] as THREE.Mesh;

28
app/src/modules/collaboration/comments/instances/commentInstance/commentInstance.tsx
View File

@ -10,7 +10,6 @@ function CommentInstance({ comment }: { comment: CommentSchema }) {
const [selectedComment, setSelectedComment] = useState<CommentSchema | null>(null);
const [transformMode, setTransformMode] = useState<"translate" | "rotate" | null>(null);
useEffect(() => {
const handleKeyDown = (e: KeyboardEvent) => {
const keyCombination = detectModifierKeys(e);
@ -22,13 +21,18 @@ function CommentInstance({ comment }: { comment: CommentSchema }) {
setTransformMode((prev) => (prev === "rotate" ? null : "rotate"));
}
};
window.addEventListener("keydown", handleKeyDown);
return () => window.removeEventListener("keydown", handleKeyDown);
}, [selectedComment]);
const commentClicked = () => {
console.log('hii');
setSelectedComment(comment);
}
if (comment.state === 'inactive' || isPlaying) return null;
return (
<>
@ -42,21 +46,7 @@ function CommentInstance({ comment }: { comment: CommentSchema }) {
rotation={comment.rotation}
className='comments-main-wrapper'
>
<CommentThreads />
{/* <div
className='outer'
onClick={(e) => {
e.stopPropagation();
setSelectedComment(comment);
console.log("down");
}}
onPointerOver={(e) => {
e.stopPropagation();
}}>
<div>
hii
</div>
</div> */}
<CommentThreads commentClicked={commentClicked} />
</Html>
{CommentRef.current && transformMode && (
<TransformControls

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

@ -6,7 +6,7 @@ function CommentInstances() {
const { comments } = useCommentStore();
useEffect(() => {
console.log('comments: ', comments);
// console.log('comments: ', comments);
}, [comments])
return (

2
app/src/modules/scene/tools/measurementTool.tsx
View File

@ -218,7 +218,7 @@ const MeasurementTool = () => {
sprite
>
<div>
{startConePosition.distanceTo(endConePosition).toFixed(2)} m
{(startConePosition.distanceTo(endConePosition) + (coneSize.height)).toFixed(2)} m
</div>
</Html>
)}

11
app/src/styles/scene/comments.scss
View File

@ -1,22 +1,22 @@
@use "../abstracts/variables" as *;
@use "../abstracts/mixins" as *;
.comments-main-wrapper{
.comments-main-wrapper {
position: relative;
}
.comments-threads-wrapper {
position: absolute;
top: 0;
left: 0;
padding: 4px;
background: var(--background-color);
border-radius: #{$border-radius-large} #{$border-radius-large} #{$border-radius-large} 0;
border-radius: #{$border-radius-extra-large} #{$border-radius-extra-large} #{$border-radius-extra-large}
0;
backdrop-filter: blur(12px);
z-index: 1000;
transform: translateY(-100%);
outline: 1px solid var(--border-color);
transition: all 0.2s ease-out;
.comments-threads-container {
display: flex;
align-items: start;
@ -39,8 +39,7 @@
align-items: start;
flex-direction: column;
overflow: hidden;
transition: all 0.2s;
transition: all 0.2s ease-in;
.header {
@include flex-center;
gap: 10px;

2
app/src/types/collaborationTypes.d.ts vendored
View File

@ -18,4 +18,4 @@ interface Reply {
reply: string;
}
type CommentsSchema = CommentSchema[];
type CommentsSchema = CommentSchema[];