Fix some bugs
This commit is contained in:
parent
dbb9eea25f
commit
638b3e0750
@ -11,7 +11,7 @@ import { generateGruvboxFromString } from '../../utils/generate_gruvbox';
|
||||
export const ChatRoom = () => {
|
||||
const { id } = useParams();
|
||||
const [chatRoom, setChatRoom] = useState('');
|
||||
const [connections, messages, sendMessage] = useChat(chatRoom);
|
||||
const [active, connections, messages, sendMessage] = useChat(chatRoom);
|
||||
const [message, setMessage] = useState('');
|
||||
const [color, setColor] = useState(generateGruvboxFromString('placeholder'));
|
||||
const [user, setUser] = useState({});
|
||||
@ -78,17 +78,25 @@ export const ChatRoom = () => {
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<textarea
|
||||
placeholder={'Message'}
|
||||
className="input"
|
||||
onChange={(e) => setMessage(e.target.value)}
|
||||
value={message}
|
||||
rows={1}
|
||||
cols={30}
|
||||
></textarea>
|
||||
<div className="button" onClick={sendThisMessage}>
|
||||
Send
|
||||
</div>
|
||||
{active ? (
|
||||
<>
|
||||
<textarea
|
||||
placeholder={'Message'}
|
||||
className="input"
|
||||
onChange={(e) => setMessage(e.target.value)}
|
||||
value={message}
|
||||
rows={1}
|
||||
cols={30}
|
||||
></textarea>
|
||||
<div className="button" onClick={sendThisMessage}>
|
||||
Send
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
<div>
|
||||
<p>This room has been marked inactive and has been deleted.</p>
|
||||
</div>
|
||||
)}
|
||||
<div className="button">
|
||||
<Link to="/">Back to map</Link>
|
||||
</div>
|
||||
|
@ -51,7 +51,7 @@ const haversine = (p1, p2) => {
|
||||
export const Geoman = ({ user, userPos, joinRoom }) => {
|
||||
const context = useLeafletContext();
|
||||
const api = useContext(ApiContext);
|
||||
let dontRedirect = true;
|
||||
let dontRedirect = false;
|
||||
const circleAndMarkerFromChatroom = (chatRoom) => {
|
||||
const circle = new L.Circle(chatRoom.center, chatRoom.radius);
|
||||
const marker = new L.Marker(chatRoom.center, { pmIgnore: !chatRoom.editable, icon });
|
||||
@ -64,7 +64,7 @@ export const Geoman = ({ user, userPos, joinRoom }) => {
|
||||
return;
|
||||
}
|
||||
dontRedirect = false;
|
||||
}, 500);
|
||||
}, 200);
|
||||
});
|
||||
marker.bindPopup(chatRoom.name || `Chat Room ${chatRoom.id}`);
|
||||
marker.on('mouseover', (e) => {
|
||||
@ -158,7 +158,7 @@ export const Geoman = ({ user, userPos, joinRoom }) => {
|
||||
|
||||
const { lat: latitude, lng: longitude } = shape.layer.getLatLng();
|
||||
const chatRoom = await api.post('/chat_rooms', {
|
||||
name: prompt("What's the name of the chat room?"),
|
||||
name: prompt("What's the name of the chat room?\n(Chat rooms are deleted after 2 hours of inactivity)"),
|
||||
latitude,
|
||||
longitude,
|
||||
radius: shape.layer.getRadius(),
|
||||
|
@ -5,8 +5,8 @@ import { io } from 'socket.io-client';
|
||||
export const useChat = (chatRoom) => {
|
||||
const [messages, setMessages] = useState([]);
|
||||
const [connections, setConnections] = useState([]);
|
||||
const [active, setActive] = useState(true);
|
||||
const messageRef = useRef([]);
|
||||
const connectionsRef = useRef([]);
|
||||
const [socket, setSocket] = useState({});
|
||||
const [authToken] = useContext(AuthContext);
|
||||
|
||||
@ -28,8 +28,10 @@ export const useChat = (chatRoom) => {
|
||||
setMessages([...messageRef.current]);
|
||||
});
|
||||
socket.on('userlist', ({ users }) => {
|
||||
connectionsRef.current = users;
|
||||
setConnections([...connectionsRef.current]);
|
||||
setConnections([...users]);
|
||||
});
|
||||
socket.on('inactive', (id) => {
|
||||
setActive(false);
|
||||
});
|
||||
return () => {
|
||||
socket.off('new-message');
|
||||
@ -44,5 +46,5 @@ export const useChat = (chatRoom) => {
|
||||
}
|
||||
};
|
||||
|
||||
return [connections, messages, sendMessage];
|
||||
return [active, connections, messages, sendMessage];
|
||||
};
|
||||
|
@ -19,11 +19,7 @@ const haversine = (p1, p2) => {
|
||||
};
|
||||
@Controller()
|
||||
export class ChatRoomController {
|
||||
constructor(private chatRoomService: ChatRoomService, private usersService: UsersService) {
|
||||
setInterval(() => {
|
||||
console.log('Hello');
|
||||
}, 60 * 1000);
|
||||
}
|
||||
constructor(private chatRoomService: ChatRoomService, private usersService: UsersService) {}
|
||||
|
||||
@Get('/chat_rooms')
|
||||
async get(@JwtBody() jwtBody: JwtBodyDto, @Query() query: any) {
|
||||
|
@ -44,7 +44,7 @@ export class AddChatRoom1648605030863 implements MigrationInterface {
|
||||
isNullable: true,
|
||||
},
|
||||
{
|
||||
name: 'lastConnection',
|
||||
name: 'lastModified',
|
||||
type: 'timestamp',
|
||||
default: 'now()',
|
||||
},
|
||||
|
@ -20,7 +20,7 @@ export class ChatRoom {
|
||||
name: string;
|
||||
|
||||
@Column()
|
||||
lastConnection: Date;
|
||||
lastModified: Date;
|
||||
|
||||
@ManyToOne(() => User, (user) => user.chatRooms)
|
||||
user: User;
|
||||
|
@ -28,7 +28,15 @@ export class ChatRoomGateway implements OnGatewayInit, OnGatewayConnection, OnGa
|
||||
private jwtService: JwtService,
|
||||
private userService: UsersService,
|
||||
private chatRoomService: ChatRoomService,
|
||||
) {}
|
||||
) {
|
||||
setInterval(async () => {
|
||||
const inactiveRooms = await chatRoomService.inactiveRooms();
|
||||
inactiveRooms.forEach((room) => {
|
||||
this.server.to(room.id).emit('inactive', room.id);
|
||||
chatRoomService.remove(room);
|
||||
});
|
||||
}, 5 * (1000 * 60));
|
||||
}
|
||||
|
||||
afterInit(server: Server) {
|
||||
console.log('Sockets initialized');
|
||||
@ -38,12 +46,18 @@ export class ChatRoomGateway implements OnGatewayInit, OnGatewayConnection, OnGa
|
||||
try {
|
||||
const jwtBody = this.jwtService.parseToken(client.handshake.auth.token);
|
||||
const user = await this.userService.find(jwtBody.userId);
|
||||
|
||||
const chatRoom = await this.chatRoomService.findById(client.handshake.query.chatRoomId as unknown as string);
|
||||
await this.chatRoomService.connectUser(chatRoom, user);
|
||||
client.join(chatRoom.id);
|
||||
this.server.to(chatRoom.id).emit('userlist', {
|
||||
users: await this.chatRoomService.connectedUsers(chatRoom),
|
||||
});
|
||||
if (chatRoom) {
|
||||
chatRoom.lastModified = new Date();
|
||||
this.chatRoomService.save(chatRoom);
|
||||
|
||||
await this.chatRoomService.connectUser(chatRoom, user);
|
||||
client.join(chatRoom.id);
|
||||
this.server.to(chatRoom.id).emit('userlist', {
|
||||
users: await this.chatRoomService.connectedUsers(chatRoom),
|
||||
});
|
||||
}
|
||||
} catch (e) {
|
||||
throw new WsException(e.message);
|
||||
}
|
||||
@ -53,11 +67,14 @@ export class ChatRoomGateway implements OnGatewayInit, OnGatewayConnection, OnGa
|
||||
console.log('Client Disconnected');
|
||||
const jwtBody = this.jwtService.parseToken(client.handshake.auth.token);
|
||||
const user = await this.userService.find(jwtBody.userId);
|
||||
|
||||
const chatRoom = await this.chatRoomService.findById(client.handshake.query.chatRoomId as unknown as string);
|
||||
await this.chatRoomService.disconnectUser(chatRoom, user);
|
||||
this.server.to(chatRoom.id).emit('userlist', {
|
||||
users: await this.chatRoomService.connectedUsers(chatRoom),
|
||||
});
|
||||
if (chatRoom) {
|
||||
await this.chatRoomService.disconnectUser(chatRoom, user);
|
||||
this.server.to(chatRoom.id).emit('userlist', {
|
||||
users: await this.chatRoomService.connectedUsers(chatRoom),
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@SubscribeMessage('message')
|
||||
@ -67,11 +84,18 @@ export class ChatRoomGateway implements OnGatewayInit, OnGatewayConnection, OnGa
|
||||
@GatewayJwtBody() jwtBody: JwtBodyDto,
|
||||
) {
|
||||
const user = await this.userService.find(jwtBody.userId);
|
||||
this.server.to(client.handshake.query.chatRoomId).emit('new-message', {
|
||||
id: user.id * Math.random() * Math.pow(2, 16) * Date.now(),
|
||||
content: data,
|
||||
userName: `${user.firstName} ${user.lastName}`,
|
||||
userId: user.id,
|
||||
});
|
||||
|
||||
const chatRoom = await this.chatRoomService.findById(client.handshake.query.chatRoomId as unknown as string);
|
||||
if (chatRoom) {
|
||||
chatRoom.lastModified = new Date();
|
||||
this.chatRoomService.save(chatRoom);
|
||||
|
||||
this.server.to(chatRoom.id).emit('new-message', {
|
||||
id: user.id * Math.random() * Math.pow(2, 16) * Date.now(),
|
||||
content: data,
|
||||
userName: `${user.firstName} ${user.lastName}`,
|
||||
userId: user.id,
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -1,6 +1,6 @@
|
||||
import { Injectable } from '@nestjs/common';
|
||||
import { InjectRepository } from '@nestjs/typeorm';
|
||||
import { Repository } from 'typeorm';
|
||||
import { Repository, LessThan } from 'typeorm';
|
||||
import { ChatRoom } from 'server/entities/chat_room.entity';
|
||||
import { User } from 'server/entities/user.entity';
|
||||
import { ChatRoomConnection } from 'server/entities/chat_room_connection.entity';
|
||||
@ -73,6 +73,17 @@ export class ChatRoomService {
|
||||
return false;
|
||||
};
|
||||
|
||||
async inactiveRooms() {
|
||||
const inactiveRooms = await this.chatRoomRepository.find({
|
||||
where: {
|
||||
lastModified: LessThan(new Date(Date.now() - 2 * 60 * (1000 * 60))),
|
||||
},
|
||||
});
|
||||
return inactiveRooms.filter(async (room) => {
|
||||
return !(await this.connectedUsers(room)).length;
|
||||
});
|
||||
}
|
||||
|
||||
save(chatRoom: ChatRoom) {
|
||||
return this.chatRoomRepository.save(chatRoom);
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user