mirrors/object-browser
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Rework Tenant Details as two columns (#1360)

Browse Source 
* Rework Tenant Details as two columns

Signed-off-by: Daniel Valdivia <18384552+dvaldivia@users.noreply.github.com>

* remove placeholder

Signed-off-by: Daniel Valdivia <18384552+dvaldivia@users.noreply.github.com>
This commit is contained in:
Daniel Valdivia
2022-01-03 18:42:21 -08:00
committed by GitHub
parent 9b12f5a41e
commit 68ffd0814b
1 changed files with 124 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

233
portal-ui/src/screens/Console/Tenants/TenantDetails/TenantSummary.tsx
View File

@@ -24,7 +24,7 @@ import {
containerForHeader, containerForHeader,
tenantDetailsStyles, tenantDetailsStyles,
} from "../../Common/FormComponents/common/styleLibrary"; } from "../../Common/FormComponents/common/styleLibrary";
import { Box, Button, Stack } from "@mui/material"; import { Box, Button, Grid, Stack } from "@mui/material";
import Paper from "@mui/material/Paper"; import Paper from "@mui/material/Paper";
import { niceBytes } from "../../../../common/utils"; import { niceBytes } from "../../../../common/utils";
import { ITenant } from "../ListTenants/types"; import { ITenant } from "../ListTenants/types";
@@ -36,8 +36,8 @@ import AButton from "../../Common/AButton/AButton";
import { styled } from "@mui/styles"; import { styled } from "@mui/styles";
import SummaryUsageBar from "../../Common/UsageBarWrapper/SummaryUsageBar"; import SummaryUsageBar from "../../Common/UsageBarWrapper/SummaryUsageBar";
import LabelValuePair from "../../Common/UsageBarWrapper/LabelValuePair"; import LabelValuePair from "../../Common/UsageBarWrapper/LabelValuePair";
import StackRow from "../../Common/UsageBarWrapper/StackRow";
import FormSwitchWrapper from "../../Common/FormComponents/FormSwitchWrapper/FormSwitchWrapper"; import FormSwitchWrapper from "../../Common/FormComponents/FormSwitchWrapper/FormSwitchWrapper";
import StackRow from "../../Common/UsageBarWrapper/StackRow";
interface ITenantsSummary { interface ITenantsSummary {
classes: any; classes: any;
@@ -257,113 +257,128 @@ const TenantSummary = ({
<StorageSummary tenant={tenant} classes={classes} /> <StorageSummary tenant={tenant} classes={classes} />
<Stack> <Grid container>
<StackRow> <Grid xs={12} sm={12} md={8} container>
<LabelValuePair label={"Instances:"} value={instances} /> <Grid xs={12}>
<LabelValuePair <LabelValuePair label={"State:"} value={tenant?.currentState} />
label={"Clusters:"} </Grid>
value={poolCount} <Grid xs={12}>
stkProps={{ <LabelValuePair
style: { label="MinIO:"
marginRight: 47, value={
}, <AButton
}} style={{
/> overflow: "hidden",
</StackRow> textOverflow: "ellipsis",
<StackRow> whiteSpace: "normal",
<LabelValuePair wordBreak: "break-all",
label={"Endpoint:"} }}
value={ onClick={() => {
<a setUpdateMinioVersion(true);
href={tenant?.endpoints?.minio} }}
target="_blank" >
rel="noopener noreferrer" {tenant ? tenant.image : ""}
className={classes.linkedSection} </AButton>
> }
{tenant?.endpoints?.minio || "-"} />
</a> </Grid>
} <Grid xs={12}>
/> <LabelValuePair
label={"Endpoint:"}
<LabelValuePair value={
label="Volumes:" <a
value={volumes} href={tenant?.endpoints?.minio}
stkProps={{ target="_blank"
style: { rel="noopener noreferrer"
marginRight: 43, className={classes.linkedSection}
}, >
}} {tenant?.endpoints?.minio || "-"}
/> </a>
</StackRow> }
<StackRow> />
<LabelValuePair </Grid>
label="MinIO:" <Grid xs={12}>
value={ <LabelValuePair
<AButton label={"Console:"}
style={{ value={
overflow: "hidden", <a
textOverflow: "ellipsis", href={tenant?.endpoints?.console}
whiteSpace: "normal", target="_blank"
wordBreak: "break-all", rel="noopener noreferrer"
}} className={classes.linkedSection}
onClick={() => { >
setUpdateMinioVersion(true); {tenant?.endpoints?.console || "-"}
}} </a>
> }
{tenant ? tenant.image : ""} />
</AButton> </Grid>
} </Grid>
/> <Grid xs={12} sm={12} md={4} container>
<LabelValuePair <Grid xs={12}>
label={"Drives Online:"} <LabelValuePair label={"Instances:"} value={instances} />
value={ </Grid>
tenant?.status?.drives_online ? tenant?.status?.drives_online : 0 <Grid xs={12}>
} <LabelValuePair
stkProps={{ label={"Clusters:"}
style: { value={poolCount}
marginRight: 8, stkProps={{
}, style: {
}} marginRight: 47,
/> },
</StackRow> }}
<StackRow> />
<LabelValuePair </Grid>
label={"Console:"} <Grid xs={12}>
value={ <LabelValuePair
<a label="Total Drives:"
href={tenant?.endpoints?.console} value={volumes}
target="_blank" stkProps={{
rel="noopener noreferrer" style: {
className={classes.linkedSection} marginRight: 43,
> },
{tenant?.endpoints?.console || "-"} }}
</a> />
} </Grid>
/> <Grid xs={12}>
<LabelValuePair <LabelValuePair
label={"Drives Offline:"} label={"Write Quorum:"}
value={ value={
tenant?.status?.drives_offline tenant?.status?.write_quorum ? tenant?.status?.write_quorum : 0
? tenant?.status?.drives_offline }
: 0 />
} </Grid>
stkProps={{ <Grid xs={12}>
style: { <LabelValuePair
marginRight: 7, label={"Drives Online:"}
}, value={
}} tenant?.status?.drives_online
/> ? tenant?.status?.drives_online
</StackRow> : 0
<StackRow> }
<LabelValuePair label={"State:"} value={tenant?.currentState} /> stkProps={{
<LabelValuePair style: {
label={"Write Quorum:"} marginRight: 8,
value={ },
tenant?.status?.write_quorum ? tenant?.status?.write_quorum : 0 }}
} />
/> </Grid>
</StackRow> <Grid xs={12}>
</Stack> <LabelValuePair
label={"Drives Offline:"}
value={
tenant?.status?.drives_offline
? tenant?.status?.drives_offline
: 0
}
stkProps={{
style: {
marginRight: 7,
},
}}
/>
</Grid>
</Grid>
</Grid>
<Stack> <Stack>
<StackRow <StackRow