Skip to content

Commit

Permalink
WIP - crossref tables
Browse files Browse the repository at this point in the history
  • Loading branch information
mvollmer committed Nov 1, 2023
1 parent 0530a78 commit cfaa6d0
Show file tree
Hide file tree
Showing 4 changed files with 69 additions and 77 deletions.
10 changes: 6 additions & 4 deletions pkg/storaged/pages.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -267,26 +267,26 @@ const PageTable = ({ emptyCaption, aria_label, pages, crossrefs }) => {
}

function make_row(page, crossref, level, key, border) {
console.log("P", page.name, border);
let info = null;
if (page.has_danger || container_has_danger(page.container))
info = <>{"\n"}<ExclamationCircleIcon className="ct-icon-times-circle" /></>;
else if (page.has_warning || container_has_warning(page.container))
info = <>{"\n"}<ExclamationTriangleIcon className="ct-icon-exclamation-triangle" /></>;
const type_colspan = page.columns[1] ? 1 : 2;
const type_colspan = (crossref ? crossref.extra : page.columns[1]) ? 1 : 2;
const cols = [
<Td key="1"><span>{page.name}{info}</span></Td>,
<Td key="2" colSpan={type_colspan}>{crossref ? page_stored_on(page) : page_type(page)}</Td>,
];
if (type_colspan == 1)
cols.push(<Td key="3">{crossref ? null : page.columns[1]}</Td>);
cols.push(<Td key="3">{crossref ? crossref.extra : page.columns[1]}</Td>);
cols.push(
<Td key="4" className="pf-v5-u-text-align-right">
{crossref ? crossref.size : page.columns[2]}
</Td>);
const actions = crossref ? make_actions_kebab(crossref.actions) : make_page_kebab(page);
cols.push(
<Td key="5" className="pf-v5-c-table__action content-action">
{crossref ? make_actions_kebab(crossref.actions) : make_page_kebab(page)}
{actions || <div /> }
</Td>);

function onRowClick(event) {
Expand Down Expand Up @@ -339,6 +339,7 @@ const PageTable = ({ emptyCaption, aria_label, pages, crossrefs }) => {
return (
<Table aria-label={aria_label}
variant="compact">
{ pages &&
<Thead>
<Tr>
<Th>{_("ID")}</Th>
Expand All @@ -347,6 +348,7 @@ const PageTable = ({ emptyCaption, aria_label, pages, crossrefs }) => {
<Th>{_("Size")}</Th>
</Tr>
</Thead>
}
<Tbody>
{rows}
</Tbody>
Expand Down
66 changes: 32 additions & 34 deletions pkg/storaged/pages/lvm2-physical-volume.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,10 +22,12 @@ import React from "react";
import client from "../client";

import { Button } from "@patternfly/react-core/dist/esm/components/Button/index.js";
import { Card, CardHeader, CardTitle, CardBody } from "@patternfly/react-core/dist/esm/components/Card/index.js";
import { CardBody } from "@patternfly/react-core/dist/esm/components/Card/index.js";
import { Stack, StackItem } from "@patternfly/react-core/dist/esm/layouts/Stack/index.js";
import { DescriptionList, DescriptionListDescription, DescriptionListGroup, DescriptionListTerm } from "@patternfly/react-core/dist/esm/components/DescriptionList/index.js";
import { DescriptionList } from "@patternfly/react-core/dist/esm/components/DescriptionList/index.js";

import { SCard } from "../utils/card.jsx";
import { SDesc } from "../utils/desc.jsx";
import {
ParentPageLink, PageContainerStackItems,
new_page, block_location, ActionButtons, page_type,
Expand All @@ -34,7 +36,7 @@ import {
import { format_dialog } from "../format-dialog.jsx";
import { block_name, fmt_size } from "../utils.js";
import { std_lock_action } from "../actions.jsx";
import { StorageSize } from "../storage-controls.jsx";
import { StorageSize, StorageUsageBar } from "../storage-controls.jsx";

const _ = cockpit.gettext;

Expand All @@ -53,7 +55,9 @@ export function make_lvm2_physical_volume_page(parent, backing_block, content_bl
columns: [
_("LVM2 physical volume"),
vgroup ? vgroup.Name : null,
<StorageSize key="s" size={backing_block.Size} />,
(block_pvol
? <StorageUsageBar key="s" stats={[block_pvol.Size - block_pvol.FreeSize, block_pvol.Size]} short />
: <StorageSize key="s" size={backing_block.Size} />),
],
component: LVM2PhysicalVolumePage,
props: { backing_block, content_block },
Expand Down Expand Up @@ -105,7 +109,8 @@ export function make_lvm2_physical_volume_page(parent, backing_block, content_bl
excuse: remove_excuse,
},
],
size: cockpit.format(_("$0, $1 free"), fmt_size(block_pvol.Size), fmt_size(block_pvol.FreeSize)),
size: <StorageUsageBar stats={[block_pvol.Size - block_pvol.FreeSize, block_pvol.Size]} short />,
extra: content_block.IdUUID,
});
}
}
Expand All @@ -117,39 +122,32 @@ export const LVM2PhysicalVolumePage = ({ page, backing_block, content_block }) =
return (
<Stack hasGutter>
<StackItem>
<Card>
<CardHeader actions={{ actions: <ActionButtons page={page} /> }}>
<CardTitle component="h2">{page_type(page)}</CardTitle>
</CardHeader>
<SCard title={page_type(page)} actions={<ActionButtons page={page} />}>
<CardBody>
<DescriptionList className="pf-m-horizontal-on-sm">
<DescriptionListGroup>
<DescriptionListTerm>{_("Stored on")}</DescriptionListTerm>
<DescriptionListDescription>
<ParentPageLink page={page} />
</DescriptionListDescription>
</DescriptionListGroup>
<DescriptionListGroup>
<DescriptionListTerm>{_("Volume group")}</DescriptionListTerm>
<DescriptionListDescription>
{vgroup
? <Button variant="link" isInline role="link"
onClick={() => cockpit.location.go(["vg", vgroup.Name])}>
{vgroup.Name}
</Button>
: "-"
}
</DescriptionListDescription>
</DescriptionListGroup>
<DescriptionListGroup>
<DescriptionListTerm>{_("Free")}</DescriptionListTerm>
<DescriptionListDescription>
{block_pvol ? fmt_size(block_pvol.FreeSize) : "-"}
</DescriptionListDescription>
</DescriptionListGroup>
<SDesc title={_("Stored on")}>
<ParentPageLink page={page} />
</SDesc>
<SDesc title={_("Volume group")}>
{vgroup
? <Button variant="link" isInline role="link"
onClick={() => cockpit.location.go(["vg", vgroup.Name])}>
{vgroup.Name}
</Button>
: "-"
}
</SDesc>
<SDesc title={_("UUID")} value={content_block.IdUUID} />
{ block_pvol &&
<SDesc title={_("Usage")}>
<StorageUsageBar key="s"
stats={[block_pvol.Size - block_pvol.FreeSize,
block_pvol.Size]} />
</SDesc>
}
</DescriptionList>
</CardBody>
</Card>
</SCard>
</StackItem>
<PageContainerStackItems page={page} />
</Stack>);
Expand Down
5 changes: 3 additions & 2 deletions pkg/storaged/pages/mdraid-disk.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ import {
register_crossref,
} from "../pages.jsx";
import { format_dialog } from "../format-dialog.jsx";
import { block_name, mdraid_name } from "../utils.js";
import { block_name, fmt_size, mdraid_name } from "../utils.js";
import { std_lock_action } from "../actions.jsx";
import { StorageSize } from "../storage-controls.jsx";

Expand Down Expand Up @@ -124,7 +124,8 @@ export function make_mdraid_disk_page(parent, backing_block, content_block, cont
actions: [
remove_action
],
size: states,
size: fmt_size(content_block.Size),
extra: states,
});
}
}
Expand Down
65 changes: 28 additions & 37 deletions pkg/storaged/pages/stratis-blockdev.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,10 +22,12 @@ import React from "react";
import client from "../client";

import { Button } from "@patternfly/react-core/dist/esm/components/Button/index.js";
import { Card, CardHeader, CardTitle, CardBody } from "@patternfly/react-core/dist/esm/components/Card/index.js";
import { CardBody } from "@patternfly/react-core/dist/esm/components/Card/index.js";
import { Stack, StackItem } from "@patternfly/react-core/dist/esm/layouts/Stack/index.js";
import { DescriptionList, DescriptionListDescription, DescriptionListGroup, DescriptionListTerm } from "@patternfly/react-core/dist/esm/components/DescriptionList/index.js";
import { DescriptionList } from "@patternfly/react-core/dist/esm/components/DescriptionList/index.js";

import { SCard } from "../utils/card.jsx";
import { SDesc } from "../utils/desc.jsx";
import {
ParentPageLink, PageContainerStackItems,
new_page, block_location, ActionButtons, page_type,
Expand Down Expand Up @@ -61,23 +63,21 @@ export function make_stratis_blockdev_page(parent, backing_block, content_block,
]
});

let desc;
if (blockdev && blockdev.Tier == 0)
desc = cockpit.format(_("$0 data"),
fmt_size(Number(blockdev.TotalPhysicalSize)));
else if (blockdev && blockdev.Tier == 1)
desc = cockpit.format(_("$0 cache"),
fmt_size(Number(blockdev.TotalPhysicalSize)));
else
desc = cockpit.format(_("$0 of unknown tier"),
fmt_size(backing_block.Size));

if (pool || stopped_pool) {
let extra;
if (blockdev && blockdev.Tier == 0)
extra = _("data");
else if (blockdev && blockdev.Tier == 1)
extra = _("cache");
else
extra = null;

register_crossref({
key: pool || stopped_pool,
page: p,
size: desc,
actions: [],
size: fmt_size(Number(blockdev.TotalPhysicalSize)),
extra,
});
}
}
Expand All @@ -89,33 +89,24 @@ export const StratisBlockdevPage = ({ page, backing_block, content_block, pool,
return (
<Stack hasGutter>
<StackItem>
<Card>
<CardHeader actions={{ actions: <ActionButtons page={page} /> }}>
<CardTitle component="h2">{page_type(page)}</CardTitle>
</CardHeader>
<SCard title={page_type(page)} actions={<ActionButtons page={page} />}>
<CardBody>
<DescriptionList className="pf-m-horizontal-on-sm">
<DescriptionListGroup>
<DescriptionListTerm>{_("Stored on")}</DescriptionListTerm>
<DescriptionListDescription>
<ParentPageLink page={page} />
</DescriptionListDescription>
</DescriptionListGroup>
<DescriptionListGroup>
<DescriptionListTerm>{_("Stratis pool")}</DescriptionListTerm>
<DescriptionListDescription>
{(pool || stopped_pool)
? <Button variant="link" isInline role="link"
onClick={() => cockpit.location.go(["pool", pool_uuid])}>
{pool_name}
</Button>
: "-"
}
</DescriptionListDescription>
</DescriptionListGroup>
<SDesc title={_("Stored on")}>
<ParentPageLink page={page} />
</SDesc>
<SDesc title={_("Stratis pool")}>
{(pool || stopped_pool)
? <Button variant="link" isInline role="link"
onClick={() => cockpit.location.go(["pool", pool_uuid])}>
{pool_name}
</Button>
: "-"
}
</SDesc>
</DescriptionList>
</CardBody>
</Card>
</SCard>
</StackItem>
<PageContainerStackItems page={page} />
</Stack>);
Expand Down

0 comments on commit cfaa6d0

Please sign in to comment.