FIX (#94)

Wadie-ess · Nov 14, 2023 · 4651f7d · 4651f7d
2 parents 29710d9 + 1ec7fce
commit 4651f7d
Show file tree

Hide file tree

Showing 13 changed files with 331 additions and 138 deletions.
diff --git a/backend/code/src/game/game.ts b/backend/code/src/game/game.ts
@@ -172,16 +172,16 @@ export class Game {
  this.x += this.dx;
  this.y += this.dy;
 
- if (
- parseFloat((this.p1Res.w / this.p1Res.h).toFixed(1)) !== 1.8 &&
- parseFloat((this.p2Res.w / this.p2Res.h).toFixed(1)) !== 1.9
- ) {
- this.p1socket.emit('screen Error');
-
- this.emitGameEnd('p1Leave');
- this.p1socket.emit('lose', 'trying cheat');
- this.p2socket.emit('win', 'you win other player try to cheat');
- } else {
+ // if (
+ //  parseFloat((this.p1Res.w / this.p1Res.h).toFixed(1)) !== 1.8 &&
+ //  parseFloat((this.p2Res.w / this.p2Res.h).toFixed(1)) !== 1.9
+ // ) {
+ //  this.p1socket.emit('screen Error');
+
+ //  this.emitGameEnd('p1Leave');
+ //  this.p1socket.emit('lose', 'trying cheat');
+ //  this.p2socket.emit('win', 'you win other player try to cheat');
+ // } else {
  this.p1socket.emit(
  'ball',
  this.screenAdapter(this.p1Res, this.x, this.y, this.ballSize),
@@ -196,18 +196,18 @@ export class Game {
  true,
  ),
  );
- }
+ // }
 
- if (
- parseFloat((this.p2Res.w / this.p2Res.h).toFixed(1)) !== 1.8 &&
- parseFloat((this.p2Res.w / this.p2Res.h).toFixed(1)) !== 1.9
- ) {
- this.p1socket.emit('screen Error');
+ // if (
+ //  parseFloat((this.p2Res.w / this.p2Res.h).toFixed(1)) !== 1.8 &&
+ //  parseFloat((this.p2Res.w / this.p2Res.h).toFixed(1)) !== 1.9
+ // ) {
+ //  this.p1socket.emit('screen Error');
 
- this.emitGameEnd('p2Leave');
- this.p1socket.emit('win', 'you win other player try to cheat');
- this.p2socket.emit('lose', 'trying cheat');
- } else {
+ //  this.emitGameEnd('p2Leave');
+ //  this.p1socket.emit('win', 'you win other player try to cheat');
+ //  this.p2socket.emit('lose', 'trying cheat');
+ // } else {
  this.p2socket.emit(
  'ball',
  this.screenAdapter(this.p2Res, this.x, this.y, this.ballSize),
@@ -222,7 +222,7 @@ export class Game {
  true,
  ),
  );
- }
+ // }
 
  await this.sleep(this.frames);
 
@@ -262,6 +262,7 @@ export class Game {
  this.server.emit('players', [p1Data, p2Data]);
  console.log('newfunc');
 
+
  setInterval(() => {
  this.frames -= 1;
  }, 2000);
@@ -290,12 +291,14 @@ export class Game {
  this.p2Res = data;
  });
  this.p1socket.on('disconnect', () => {
- console.log('p1 disconnected');
- this.emitGameEnd('p1 disconnected');
+ this.emitGameEnd('p1Leave');
+ this.p2socket.emit('win', 'you win other player leave the game');
+ this.p1socket.emit('lose', 'you win other player leave the game');
  });
  this.p2socket.on('disconnect', () => {
- console.log('p2 disconnected');
- this.emitGameEnd('p2 disconnected');
+ this.emitGameEnd('p2Leave');
+ this.p1socket.emit('win', 'you win other player leave the game');
+ this.p2socket.emit('lose', 'you lost other player leave the game');
  });
  this.p1socket.on('leave', () => {
  this.emitGameEnd('p1Leave');

diff --git a/frontend/code/src/Components/Chat/Components/Conversation.tsx b/frontend/code/src/Components/Chat/Components/Conversation.tsx
@@ -12,7 +12,7 @@ import { ChatType, useChatStore } from "../Controllers/RoomChatControllers";
 
 import { ChatPlaceHolder, ConfirmationModal } from "./RoomChatHelpers";
 import { KeyboardEvent } from "react";
-import { leaveRoomCall } from "../Services/ChatServices";
+import { createNewRoomCall, leaveRoomCall } from "../Services/ChatServices";
 import toast from "react-hot-toast";
 import { useModalStore } from "../Controllers/LayoutControllers";
 import {
@@ -23,6 +23,7 @@ import {
 import { useUserStore } from "../../../Stores/stores";
 import { formatTime } from "./tools/utils";
 import { useSocketStore } from "../Services/SocketsServices";
+import { useNavigate } from "react-router-dom";
 
 export interface ChatPaceHolderProps {
  username: string;
@@ -90,6 +91,7 @@ export const CurrentUserMessage = ({
 export const ConversationHeader: React.FC<ConversationProps> = ({
  onRemoveUserPreview,
 }) => {
+ const navigate = useNavigate();
  const LayoutState = useModalStore((state) => state);
  const ChatState = useChatStore((state) => state);
  const SelectedChat = useChatStore((state) => state.selectedChatID);
@@ -141,15 +143,23 @@ export const ConversationHeader: React.FC<ConversationProps> = ({
  </div>
 
  <div className="pr-1">
- <img
- className="w-12 rounded-full "
- alt=""
- src={
- selectedChatType === ChatType.Chat
- ? currentUser?.avatar.large
- : groupIcon
- }
- />
+ <button
+ onClick={async () => {
+ if (ChatState.selectedChatType === ChatType.Chat) {
+ navigate(`/profile/${currentUser.secondUserId}`);
+ }
+ }}
+ >
+ <img
+ className="w-12 rounded-full "
+ alt=""
+ src={
+ selectedChatType === ChatType.Chat
+ ? currentUser?.avatar.large
+ : groupIcon
+ }
+ />
+ </button>
  </div>
  <div className="flex flex-col pl-2 ">
  <p className="text-white font-poppins text-base font-medium leading-normal">

diff --git a/frontend/code/src/Components/Chat/Components/RecentChat.tsx b/frontend/code/src/Components/Chat/Components/RecentChat.tsx
@@ -24,16 +24,20 @@ import { useSocketStore } from "../Services/SocketsServices";
 
 import { useNavigate } from "react-router-dom";
 import toast from "react-hot-toast";
+import { useInView } from "react-intersection-observer";
 
 export const RecentConversations = () => {
  const [isLoading, setLoading] = useState(false);
  const selectedChatType = useChatStore((state) => state.selectedChatType);
  const ChatRoomsState = useChatStore((state) => state);
 
+ const [ref, inView] = useInView();
+ const [EndOfFetching, setEndOfFetching] = useState(false);
  useEffect(() => {
  const fetch = async () => {
- setLoading(true);
- await fetchDmsCall(0, 20).then((res) => {
+ const offset = ChatRoomsState.recentDms.length;
+ offset === 0 && setLoading(true);
+ await fetchDmsCall(offset, 7).then((res) => {
  setLoading(false);
  if (res?.status !== 200 && res?.status !== 201) {
  } else {
@@ -68,15 +72,26 @@ export const RecentConversations = () => {
  });
  }
  );
- // setIsLoading(false);
- ChatRoomsState.fillRecentDms(rooms);
- // ChatRoomsState.changeChatType(ChatType.Room);
+
+ if (res.data.length > 0) {
+ ChatRoomsState.fillRecentDms([
+ ...ChatRoomsState.recentDms,
+ ...rooms,
+ ]);
+ } else {
+ setEndOfFetching(true);
+ }
  }
  });
  };
- fetch();
+ if (!EndOfFetching) {
+ fetch();
+ }
+ return () => {
+ setEndOfFetching(false);
+ };
  // eslint-disable-next-line
- }, [ChatRoomsState.selectedChatID, ChatRoomsState.selectedChatType]);
+ }, [ChatRoomsState.selectedChatID, ChatRoomsState.selectedChatType, inView]);
 
  return selectedChatType === ChatType.Chat ? (
  <div className="h-full flex flex-col ">
@@ -97,6 +112,15 @@ export const RecentConversations = () => {
  userImage={friend.avatar.medium}
  />
  ))}
+ <div
+ ref={ref}
+ className="flex justify-center items-center h-2 py-5 
+ "
+ >
+ <span className="text-xs font-light font-poppins text-gray-400">
+ {EndOfFetching ? "No more Dms" : "Loading..."}
+ </span>
+ </div>
  </div>
  ) : (
  <>
@@ -202,7 +226,14 @@ export const OnlineNowUsers = () => {
  const setModalState = useModalStore((state) => state.setShowExploreModal);
 
  const handleListOfOnline = (ids: string[]) => {
- chatState.fillOnlineFriendsIds(ids);
+ ids.forEach((id) => {
+ if (
+ !chatState.onlineFriendsIds.includes(id) &&
+ Users.find((u) => u.id === id)
+ ) {
+ chatState.addOnlineFriend(id);
+ }
+ });
  };
 
  useEffect(() => {