73 lines
1.9 KiB
TypeScript
73 lines
1.9 KiB
TypeScript
import React, { useEffect } from "react";
|
|
import { useParams, useNavigate } from "react-router-dom";
|
|
import { useUser } from "../components/UserContext";
|
|
import { User } from "../types/types";
|
|
import { Box } from "@mui/material";
|
|
import { connectionBase } from "../Global";
|
|
import { SetSnackType } from '../components/Snack';
|
|
import { LoadingComponent } from "../components/LoadingComponent";
|
|
|
|
interface UserRouteProps {
|
|
sessionId?: string | null;
|
|
setSnack: SetSnackType,
|
|
};
|
|
|
|
const UserRoute: React.FC<UserRouteProps> = (props: UserRouteProps) => {
|
|
const { sessionId, setSnack } = props;
|
|
const { username } = useParams<{ username: string }>();
|
|
const { user, setUser } = useUser();
|
|
const navigate = useNavigate();
|
|
|
|
useEffect(() => {
|
|
if (!sessionId) {
|
|
return;
|
|
}
|
|
|
|
const fetchUser = async (username: string): Promise<User | null> => {
|
|
try {
|
|
let response;
|
|
response = await fetch(`${connectionBase}/api/u/${username}/${sessionId}`, {
|
|
method: 'POST',
|
|
credentials: 'include',
|
|
});
|
|
if (!response.ok) {
|
|
throw new Error('Session not found');
|
|
}
|
|
const user: User = await response.json();
|
|
console.log("Loaded user:", user);
|
|
setUser(user);
|
|
navigate('/chat');
|
|
} catch (err) {
|
|
setSnack("" + err);
|
|
setUser(null);
|
|
navigate('/');
|
|
}
|
|
return null;
|
|
};
|
|
|
|
if (user?.username !== username && username) {
|
|
fetchUser(username);
|
|
} else {
|
|
if (user?.username) {
|
|
navigate('/chat');
|
|
} else {
|
|
navigate('/');
|
|
}
|
|
}
|
|
}, [user, username, setUser, sessionId, setSnack, navigate]);
|
|
|
|
if (sessionId === undefined || !user) {
|
|
return (<Box>
|
|
<LoadingComponent
|
|
loadingText="Fetching user information..."
|
|
loaderType="linear"
|
|
withFade={true}
|
|
fadeDuration={1200} />
|
|
</Box>);
|
|
} else {
|
|
return (<></>);
|
|
}
|
|
};
|
|
|
|
export { UserRoute };
|