Skip to content

Commit

Permalink
room
Browse files Browse the repository at this point in the history
  • Loading branch information
@imdeveshshukla
imdeveshshukla committed Sep 8, 2024
1 parent 473ec32 commit dae5c66
Show file tree
Hide file tree
Showing 5 changed files with 79 additions and 127 deletions.
2 changes: 1 addition & 1 deletion frontend/src/pages/CreatePost.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -309,7 +309,7 @@ export const CreatePoll = () => {
const dispatch = useDispatch()
const Navigate = useNavigate()
const { roomTitle,roomCreatorId } = useOutletContext()
const [selectedOption, setSelectedOption] = useState(null);
const [selectedOption, setSelectedOption] = useState('');

const handleSelectChange = (event) => {
setSelectedOption(event.target.value);
Expand Down
140 changes: 16 additions & 124 deletions frontend/src/pages/Room.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,19 +2,12 @@ import axios from "axios";
import { useEffect, useRef, useState } from "react";
import baseAddress from "../utils/localhost";
import { Link, Navigate, useAsyncError, useLocation, useNavigate, useParams } from 'react-router-dom'
import bg from '../assets/unnamed.png'
import NotUploaded from '../assets/NotUploaded.jpg'
import { MdFileUpload } from "react-icons/md";
import q from '../assets/q.svg'
import { setRoomDetail, changeBgImg, changeDpImg } from "../redux/roomSlice";
import toast from "react-hot-toast";
import { useDispatch, useSelector } from "react-redux";
import SmoothLoader from "../assets/SmoothLoader";
import Loader from "../components/Loader";
import { addNewRoom, setRooms } from "../redux/userRooms";
import CreatePost from "./CreatePost";
import { clearHotPostsInfo, setHotPost } from "../redux/Hotposts";
import { setSkeltonLoader } from "../redux/skelton";
import { addNewRoom, setRooms } from "../redux/userRooms"
import Postskelton, { PollSkelton } from "../components/Postskelton";
import Posts from "../components/Posts";
import InfiniteScroll from "react-infinite-scroll-component";
Expand Down Expand Up @@ -42,6 +35,7 @@ import getRoomsPolls from "../utils/getRoomPolls";
import { clearPollInfo, setPoll } from '../redux/userpolls';
import Polls from "../components/Polls";
import ConfirmWindow from "../components/ConfirmWindow";
import { clearRoomPostsInfo, setRoomPost } from "../redux/RoomPosts";



Expand Down Expand Up @@ -82,7 +76,6 @@ const Room = function () {



// console.log("Out Side ",hasMore," ",hasMore2);
const [showChangeTitleBox, setBox] = useState(false);
function handleToggle() {
setisOpen((isOpen) => !isOpen)
Expand Down Expand Up @@ -157,120 +150,29 @@ const Room = function () {
}
}



const getPost = async () => {
// console.log("In Side getPost ",hasMore," ",hasMore2," ",joined," ",privateRoom);
if (!joined && privateRoom) {
// setHasMore(false);
setisLoading2(false);
dispatch(setHotPost([]))
return;
}
else {
if (page == 0) {
dispatch(clearHotPostsInfo())
}
try {
// dispatch(setSkeltonLoader())
const res = await axios.get(`${baseAddress}posts/getPost?title=${title}`, {
params: {
offset: page,
limit: 10,
},
});

if (res.status === 200) {
const fetchedPosts = res.data.posts;

dispatch(setHotPost(fetchedPosts));

if (fetchedPosts.length < 10) {
setHasMore(false);
}
// dispatch(setSkeltonLoader())
setisLoading2(false);
}
} catch (error) {
console.log(error);
setHasMore(false); // Stop fetching if there's an error
setisLoading2(false);
// dispatch(setSkeltonLoader())
}

}
};

// console.clear();

async function refresh() {
dispatch(roomsApi.util.invalidateTags([{ type: 'Room', id: title }]));
if (joined || !privateRoom)
{
setPage(0);
setPage2(0);
setHasMore(true);
setHasMore2(true);
// getPost();
// getRoomsPolls(joined,privateRoom,dispatch,setPoll,clearPollInfo,setSkeltonLoader,setHasMore2,page2,title);
}
}

async function onStart() {
// console.log("Mai aa gaya on start par lol ",isLoading);
if (isLoading) return;
setisLoading2(true);
dispatch(setRoomDetail(data?.room));
setPrivateRoom(data?.room?.privateRoom);

setJoined(data?.joined);
if (data?.joined || !(data?.room?.privateRoom)) {
// dispatch(clearPollInfo());
// dispatch(clearHotPostsInfo());
setdisVal("post");
// getPost();
// getRoomsPolls(joined,privateRoom,dispatch,setPoll,clearPollInfo,setSkeltonLoader,setHasMore2,page2,title);
}
setisLoading2(false);
}
useEffect(() => {
// console.log("Main data and title value useEffect");
setisLoading2(true);
setPage2(0)
setPage(0);
// dispatch(clearPollInfo());
// dispatch(clearHotPostsInfo());
setHasMore(true);
setHasMore2(true);
onStart();
setisLoading2(false);
return () => {
setPage(0);
setPage2(0);
setHasMore(true);
setHasMore2(true);
// dispatch(clearHotPostsInfo());
// dispatch(clearPollInfo());
}

}, [data, title])

// useEffect(()=>{
// // console.log("Mai dis Value wala use Effect " ,disVal);
// if(disVal==='poll') console.log("Changed To Poll LOL");
// else console.log("Changed To Post LOL");//getPost(true);
// },[disVal])

useEffect(() => {
// console.log("Mai joined or privateROom val useEffect",joined, privateRoom);
if (joined || !privateRoom) {
setPage(0);
setPage2(0);
setHasMore(true);
setHasMore2(true);
// getPost();
// getRoomsPolls(joined,privateRoom,dispatch,setPoll,clearPollInfo,setSkeltonLoader,setHasMore2,page2,title);
}
}, [joined, privateRoom])


const handleClickOutside = (event) => {
Expand All @@ -279,27 +181,20 @@ const Room = function () {
}
};
useEffect(() => {
// console.log("Mai Khali useEffect");

document.addEventListener('mousedown', handleClickOutside);
return () => {
setPage(0);
setPage2(0);
setHasMore(true);
setHasMore2(true);
dispatch(clearRoomPostsInfo());
dispatch(clearPollInfo());
document.removeEventListener('mousedown', handleClickOutside);
};
}, []);


function onNewPost(){
setPage(0);
setPage2(0);
dispatch(clearHotPostsInfo())
dispatch(clearRoomPostsInfo())
dispatch(clearPollInfo())
setHasMore(true);
dispatch(roomsApi.util.invalidateTags([{ type: 'Room', id: title }]));
// refresh();
//refresh()
}

useEffect(()=>{
Expand Down Expand Up @@ -509,7 +404,7 @@ export default Room;

export const RoomPost = ({title,privateRoom,joined,data})=>{

const hotposts = useSelector((state) => state.hotpost.hotposts);
const hotposts = useSelector((state) => state.roomPosts.hotposts);
const [hasMore,setHasMore] = useState(true);
const [isLoading,setisLoading] = useState(false)
const [page,setPage] = useState(0);
Expand All @@ -521,20 +416,19 @@ export const RoomPost = ({title,privateRoom,joined,data})=>{
cancelTokenSource.cancel('Previous request canceled due to new topic.');
}

const source = axios.CancelToken.source();
const source =axios.CancelToken.source();
setCancelTokenSource(source);

setisLoading(true);
if (!joined && privateRoom) {
// console.log("setHasMOre ",joined,privateRoom);
setHasMore(false);
setisLoading(false);
dispatch(setHotPost([]))
dispatch(setRoomPost([]))
return;
}
else {
if (page == 0 || initial) {
dispatch(clearHotPostsInfo())
dispatch(clearRoomPostsInfo())
setPage(0);
}
try {
Expand All @@ -550,10 +444,9 @@ export const RoomPost = ({title,privateRoom,joined,data})=>{
if (res.status === 200) {
const fetchedPosts = res.data.posts;

dispatch(setHotPost(fetchedPosts));
dispatch(setRoomPost(fetchedPosts));

if (fetchedPosts.length < 10) {
// console.log("setHasMOre ",fetchedPosts.length)
setHasMore(false);
}
setisLoading(false);
Expand All @@ -571,12 +464,11 @@ export const RoomPost = ({title,privateRoom,joined,data})=>{
};

useEffect(()=>{
// console.log("Inside useeffect")
dispatch(clearHotPostsInfo());
dispatch(clearRoomPostsInfo());
setPage(0);
setHasMore(true);
setisLoading(true);
const timeID = setTimeout(getPost(true),1500);
const timeID = setTimeout(() => {getPost(true)} , 1500);
return ()=> clearTimeout(timeID);
},[title,data,joined,privateRoom])

Expand All @@ -588,7 +480,7 @@ export const RoomPost = ({title,privateRoom,joined,data})=>{
}, [page])

const fetchMoreData = () => {
if (!hasMore) return;
if (isLoading || !hasMore) return;

setPage((prevPage) => prevPage + 10);
};
Expand Down Expand Up @@ -658,7 +550,7 @@ export const RoomPolls = ({title,privateRoom,joined,data})=>{
}, [page])

const fetchMoreData = () => {
if (!hasMore) return;
if (isLoading || !hasMore) return;
setPage((prevPage) => prevPage + 10);
};
return <div className='min-h-fit xs:pl-8 sm:pl-16'>
Expand Down
58 changes: 58 additions & 0 deletions frontend/src/redux/RoomPosts.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
import { createSlice } from "@reduxjs/toolkit";

const initialState = {
hotposts: [],
};

export const RoomPostState = createSlice({
name: "roomPosts",
initialState,
reducers: {
setRoomPost: (state, action) => {
Array.from(action.payload).map(item=>{
let elm= state.hotposts.find(it=> it.id==item.id )
if(!elm)
state.hotposts.push(item);
})
},
setRoomPostComment: (state, action) => {
let post = state.hotposts.find((post) => post.id == action.payload.postId);

if(post){
post.comments = [action.payload, ...post.comments];
}

},
toggleUserRoomUpvote: (state, action) => {
let post = state.hotposts.find((post) => post.id == action.payload.postId);
let upvotes;
if (post) {
upvotes = post.upvotes;

let index = upvotes.findIndex(
(vote) => vote.userId == action.payload.userId
);

if (index != -1) {
upvotes[index] = action.payload;

} else {

upvotes[upvotes.length] = action.payload;

}
}
},
deleteRoomPostsInfo:(state,action)=>{
let posts = state.hotposts.filter((post)=> post.id != action.payload);
state.hotposts = [...posts];
},
clearRoomPostsInfo: (state) => {
state.hotposts = [];
},
},
});

export const { setRoomPost, setRoomPostComment, toggleUserRoomUpvote, clearRoomPostsInfo, deleteRoomPostsInfo } = RoomPostState.actions;

export default RoomPostState.reducer;
5 changes: 3 additions & 2 deletions frontend/src/redux/store.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ import offsetReducer from './offset'
import userPollReducer from './userpolls'
import roomCreatePostReducer from './RoomCreatePosts'
import roomOffsetReducer from './roomOffset'

import roomPostsReducer from './RoomPosts'


export const store = configureStore({
Expand All @@ -48,7 +48,8 @@ export const store = configureStore({
onNewPost: onNewPostReducer,
offset: offsetReducer,
roomCreatePost:roomCreatePostReducer,
roomOffset : roomOffsetReducer
roomOffset : roomOffsetReducer,
roomPosts : roomPostsReducer
},

middleware: (getDefaultMiddleware) =>
Expand Down
1 change: 1 addition & 0 deletions frontend/src/utils/getRoomPolls.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ const getRoomsPolls = async(joined,privateRoom,dispatch,setHotPost,clearHotPosts
if (fetchedPosts?.length < 10) {
setHasMore(false);
}
console.log("Inside function ",isLoading);

setisLoading(false);
console.log("InsidegetPolls ",isLoading)
Expand Down

0 comments on commit dae5c66

Please sign in to comment.