Separated session checker and page login verifier into components

This commit is contained in:
Keannu Christian Bernasol 2023-03-06 20:09:14 +08:00
parent b12f205efd
commit c3ae196b6c
10 changed files with 101 additions and 65 deletions

View file

@ -6,26 +6,21 @@ import AddIcon from "../../Components/Icons/AddIcon/AddIcon";
import { Button } from "@mui/material";
import { SampleProducts } from "../../Components/SampleData/SampleData";
import ViewManager from "../../Components/ProductsPage/ViewManager";
import { Navigate } from "react-router-dom";
import { LoginState } from "../../Interfaces/Interfaces";
import { useSelector } from "react-redux";
import { useQuery } from "react-query";
import { GetProducts } from "../../Components/Api/Api";
import LoginChecker from "../../Components/LoginChecker/LoginChecker";
export default function Products() {
const navigate = useNavigate();
const logged_in = useSelector((state: LoginState) => state.logged_in.value);
const {
data: products,
isLoading,
error,
} = useQuery("products", GetProducts, { retry: 0 });
if (!logged_in) {
return <Navigate to="/Login" replace />;
}
if (isLoading) {
return (
<div>
<LoginChecker />
<div style={styles.content_row}>
<div style={{ ...styles.content_row, ...{ flex: 1 } }}>
<div style={{ display: "flex", alignItems: "center", gap: 16 }}>