46 lines
1.7 KiB
JavaScript
46 lines
1.7 KiB
JavaScript
import {
|
|
Box,
|
|
Button,
|
|
CircularProgress,
|
|
Stack,
|
|
Typography
|
|
} from "@mui/material";
|
|
import {ServerContext} from "@/common/contexts/Server";
|
|
import {useContext, useState} from "react";
|
|
import Server from "@/states/Root/pages/Overview/components/Server/index.js";
|
|
import {CreationDialog} from "@/states/Root/pages/Overview/components/CreationDialog/CreationDialog.jsx";
|
|
import {t} from "i18next";
|
|
|
|
export const Overview = () => {
|
|
|
|
const [dialogOpen, setDialogOpen] = useState(false);
|
|
const {server} = useContext(ServerContext);
|
|
|
|
return (
|
|
<>
|
|
<Stack direction="column" gap={2}>
|
|
|
|
<Stack direction="row" gap={2} alignItems="center" justifyContent="space-between">
|
|
<Typography fontWeight={500} variant="h5">{t("server.overview")}</Typography>
|
|
<Button variant="outlined" color="primary" onClick={() => setDialogOpen(true)}>{t("server.create")}</Button>
|
|
</Stack>
|
|
|
|
{server === null && (
|
|
<Box alignItems="center" justifyContent="center" display="flex">
|
|
<CircularProgress/>
|
|
</Box>
|
|
)}
|
|
|
|
{dialogOpen && <CreationDialog dialogOpen={dialogOpen} setDialogOpen={setDialogOpen}/>}
|
|
|
|
{server !== null && server.map((server) => (
|
|
<Server key={server.uuid} uuid={server.uuid} configuration={server.configuration}
|
|
status={server.status}/>
|
|
))}
|
|
{server !== null && server.length === 0 && (
|
|
<Typography variant="body2" textAlign="center">{t("server.no_servers")}</Typography>
|
|
)}
|
|
</Stack>
|
|
</>
|
|
)
|
|
} |