Trendyol · armagandalkiran · Mar 6, 2025
@@ -23,18 +23,6 @@ const ConnectingInfo = ({ roomId }: IProps) => {
     setRoomStatus(ROOM_STATUS.FOUND);
   };
 
-  useEffect(() => {
-    fetchRoomId();
-  }, []);
-
-  if (roomStatus === ROOM_STATUS.NOT_FOUND) {
-    notFound();
-  }
-
-  if (roomStatus === ROOM_STATUS.FOUND) {
-    return null;
-  }
-
   return (
     <div className="connecting-info">
       <p className="connecting-info__message">Connecting to the room...</p>

@@ -25,8 +25,6 @@ const GroomingBoardLogs = ({ roomId }: Props) => {
 
   return (
     <section className={classNames("grooming-board__logs-section", {"score-grooming": isScoreGrooming})}>
-      {isGroomingInfoLoaded && (
-        <>
           <ul className="grooming-board__metrics">
             <div className="grooming-board__participants-text">
               <span>Participants ({Object.keys(groomingInfo?.participants || {}).length || "0"})</span>
@@ -55,8 +53,6 @@ const GroomingBoardLogs = ({ roomId }: Props) => {
                 roomId={roomId}
               />
             )}
-        </>
-      )}
     </section>
   );
 };

@@ -22,9 +22,6 @@ const GroomingBoardParticipant = ({ participantKey }: Props) => {
     [createAvatarSvg, serializedAvatar]
   );
 
-  if (!participant) {
-    return null;
-  }
   const { isAdmin, sockets, votes = {}, nickname } = participant;
   const hasSockets = sockets.length > 0;
   const hasMaxVotes =
@@ -45,12 +42,7 @@ const GroomingBoardParticipant = ({ participantKey }: Props) => {
   const noVote = isResultShown && vote === 0;
 
   return (
-    <motion.li
-      layout
-      initial={{ opacity: 0, scale: 0.9 }}
-      animate={{ opacity: 1, scale: 1 }}
-      exit={{ opacity: 0, scale: 0.9 }}
-      transition={{ duration: 0.3, ease: "easeInOut" }}
+    <li
       key={participantKey}
       className={classNames({
         "vote-above-average": isVoteAboveAverage,
@@ -121,7 +113,7 @@ const GroomingBoardParticipant = ({ participantKey }: Props) => {
           );
         })}
       </div>
-    </motion.li>
+    </li>
   );
 };
 

@@ -5,8 +5,42 @@ import { AnimatePresence } from "framer-motion";
 
 const GroomingBoardParticipants = () => {
   const { groomingInfo } = useGroomingRoom();
-  const groomingInfoParticipants = Object.keys(groomingInfo.participants || {});
-  const [sortedParticipants, setSortedParticipants] = useState<string[]>([]);
+  const groomingInfoParticipants = Object.keys({
+    "0": {
+      "userID": 0,
+      "nickname": "Armagan",
+      "roomID": "e44fabf2-fe3f-4115-885e-117d7d6355bf",
+      "sockets": [
+        "ZvbLDqyZZdoZ47lqAAAH"
+      ],
+      "isAdmin": true,
+      "connected": true,
+      "avatar": {
+        "seed": "xie3wsmnu9",
+        "scale": 150
+      },
+      "votes": {
+        "storyPoint": "2"
+      }
+    },
+    "1": {
+      "userID": 1,
+      "nickname": "HelloFigma",
+      "roomID": "e44fabf2-fe3f-4115-885e-117d7d6355bf",
+      "sockets": [
+        "NcA0GdSQRLhyWPbKAAAF"
+      ],
+      "isAdmin": false,
+      "connected": true,
+      "avatar": {
+        "seed": "yzrl7syjjdc"
+      },
+      "votes": {
+        "storyPoint": "3"
+      }
+    }
+  },);
+  const [sortedParticipants, setSortedParticipants] = useState<string[]>(["1","0"]);
 
   useEffect(() => {
     if (groomingInfo.isResultShown) {
@@ -27,17 +61,19 @@ const GroomingBoardParticipants = () => {
     }
   }, [groomingInfo]);
 
+  console.log(sortedParticipants)
+
   return (
     <>
       <ul className="grooming-board-participants">
-        <AnimatePresence>
+        {/* <AnimatePresence> */}
           {sortedParticipants.map((participantKey) => (
             <GroomingBoardParticipant
               key={participantKey}
               participantKey={participantKey}
             />
           ))}
-        </AnimatePresence>
+        {/* </AnimatePresence> */}
       </ul>
     </>
   );

@@ -141,18 +141,6 @@ const GroomingBoard = ({
     setEditVoteClicked(!editVoteClicked);
   };
 
-  if (showNickNameForm) {
-    return null;
-  }
-
-  if (encounteredError.id === ENCOUTERED_ERROR_TYPE.ROOM_EXPIRED) {
-    notFound();
-  }
-
-  if (!isGroomingInfoLoaded && roomStatus !== ROOM_STATUS.CHECKING) {
-    return <Loading />;
-  }
-
   return (
     <div className={classNames("grooming-board", {jiraSidebarExpanded: jiraSidebarExpanded, announcementBannerActive: isAnnouncementBannerVisible})}>
       {showLoader && <Loading />}

@@ -36,10 +36,6 @@ const GroomingNavbar = ({ showNickNameForm, roomId }: Props) => {
   const { groomingInfo, roomStatus, userInfo, jiraSidebarExpanded } = useGroomingRoom();
   const [isGroomingLinkCopied, setIsGroomingLinkCopied] = useState(false);
 
-  if (roomStatus !== ROOM_STATUS.FOUND || showNickNameForm) {
-    return null;
-  }
-
   const getGroomingLink = () => {
     let currentUrl: string = "";
     if (typeof window !== "undefined") {

@@ -34,8 +34,73 @@ export function useGroomingRoom() {
 
 export function GroomingRoomProvider({ children, roomId }: GroomingRoomProviderProps) {
   const [roomStatus, setRoomStatus] = useState(ROOM_STATUS.CHECKING);
-  const [userInfo, setUserinfo] = useState({} as UserInfo);
-  const [groomingInfo, setGroomingInfo] = useState({} as GroomingInfo);
+  const [userInfo, setUserinfo] = useState({lobby: {isAdmin: true },nickname: "Armagan"} as any);
+  const [groomingInfo, setGroomingInfo] = useState({
+    "mode": "0",
+    "participants": {
+      "0": {
+        "userID": 0,
+        "nickname": "Armagan",
+        "roomID": "e44fabf2-fe3f-4115-885e-117d7d6355bf",
+        "sockets": [
+          "ZvbLDqyZZdoZ47lqAAAH"
+        ],
+        "isAdmin": true,
+        "connected": true,
+        "avatar": {
+          "seed": "xie3wsmnu9",
+          "scale": 150
+        },
+        "votes": {
+          "storyPoint": "2"
+        }
+      },
+      "1": {
+        "userID": 1,
+        "nickname": "HelloFigma",
+        "roomID": "e44fabf2-fe3f-4115-885e-117d7d6355bf",
+        "sockets": [
+          "NcA0GdSQRLhyWPbKAAAF"
+        ],
+        "isAdmin": false,
+        "connected": true,
+        "avatar": {
+          "seed": "yzrl7syjjdc"
+        },
+        "votes": {
+          "storyPoint": "3"
+        }
+      }
+    },
+    "metrics": [
+      {
+        "id": 1,
+        "name": "storyPoint",
+        "displayName": "Story Point",
+        "points": [
+          "0.5",
+          "1",
+          "2",
+          "3",
+          "5",
+          "8",
+          "13",
+          "21",
+          "?",
+          "break"
+        ],
+        "text": "Story point of task"
+      }
+    ],
+    "score": "3.00",
+    "status": "ongoing",
+    "isResultShown": true,
+    "issues": [],
+    "timer": {
+      "timeLeft": 0,
+      "isRunning": false
+    }
+  } as any);
   const [userVote, setUserVote] = useState({} as UserVote);
   const [encounteredError, setEncounteredError] = useState({} as EncounteredError);
   const [showErrorPopup, setShowErrorPopup] = useState(false);

@@ -97,7 +97,6 @@ const GroomingRoomContent = ({ params }: { params: { id: string } }) => {
           [`${currentTheme}-active`]: isThemeActive,
         })}
       >
-        <ConnectingInfo roomId={params.id} />
         <GroomingNavbar
           showNickNameForm={showNickNameForm}
           roomId={params.id}