Skip to content

Commit

Permalink
wip: push temporary work
Browse files Browse the repository at this point in the history
  • Loading branch information
@jelly
jelly committed Sep 13, 2022
1 parent ce83281 commit bed7a1b
Show file tree
Hide file tree
Showing 2 changed files with 65 additions and 34 deletions.
97 changes: 64 additions & 33 deletions src/Containers.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,9 +11,10 @@ import {
LabelGroup,
List, ListItem,
Text, TextVariants, FormSelect, FormSelectOption,
Toolbar, ToolbarContent, ToolbarItem,
Tooltip, Toolbar, ToolbarContent, ToolbarItem,
} from '@patternfly/react-core';
import { cellWidth } from '@patternfly/react-table';
import { MicrochipIcon, MemoryIcon, PortIcon, VolumeIcon, } from '@patternfly/react-icons';

import cockpit from 'cockpit';
import { ListingTable } from "cockpit-components-table.jsx";
Expand Down Expand Up @@ -59,6 +60,25 @@ const render_container_published_ports = (ports) => {
return <List isPlain>{result}</List>;
};

const render_container_volumes = (volumes) => {
if (!volumes.length)
return null;

const result = volumes.map(volume => {
return (
<ListItem key={volume.Source + volume.Destination}>
{volume.Source}
{volume.RW
? <Tooltip content={_("Read-write access")}><span> &harr; </span></Tooltip>
: <Tooltip content={_("Read-only access")}><span> &rarr; </span></Tooltip>}
{volume.Destination}
</ListItem>
);
});

return <List isPlain>{result}</List>;
};

const ContainerActions = ({ container, healthcheck, onAddNotification, version, localImages, updateContainerAfterEvent }) => {
const Dialogs = useDialogs();
const [isActionsKebabOpen, setActionsKebabOpen] = useState(false);
Expand Down Expand Up @@ -492,25 +512,6 @@ class Containers extends React.Component {
};
}

podDetails(pod) {
const { containers } = this.props;
if (!containers) {
return null;
}

// The infra container binds all networking/mount together and contains all networking/mount information.
const container = containers[pod.InfraId + pod.isSystem.toString()];
console.log(container);

const ports = "";
const mounts = "";

return {
ports,
mounts,
};
}

render() {
const Dialogs = this.context;
const columnTitles = [
Expand Down Expand Up @@ -697,13 +698,17 @@ class Containers extends React.Component {
let podStats;
let podStatus;
let infraContainer = null;
let infraContainerDetails = null;
if (section !== 'no-pod') {
const pod = this.props.pods[section];
tableProps['aria-label'] = cockpit.format("Containers of pod $0", pod.Name);
podStatus = pod.Status;
caption = pod.Name;
podStats = this.podStats(pod);
infraContainer = this.props.containers[pod.InfraId + pod.isSystem.toString()];
infraContainerDetails = this.props.containersDetails[pod.InfraId + pod.isSystem.toString()];
console.log(infraContainer);
console.log("Details", infraContainerDetails);
} else {
tableProps['aria-label'] = _("Containers");
}
Expand All @@ -720,22 +725,48 @@ class Containers extends React.Component {
<span>{_("pod group")}</span>
{podStats && podStatus === "Running" &&
<>
<Text component={TextVariants.p}>{_("CPU") + " " + podStats.cpu}</Text>
<Text component={TextVariants.p}>{_("Memory") + " " + podStats.mem}</Text>
<>
<Tooltip content={_("CPU")}>
<MicrochipIcon />
</Tooltip>
<Text component={TextVariants.p}>{podStats.cpu}</Text>
</>
<>
<Tooltip content={_("Memory")}>
<MemoryIcon />
</Tooltip>
<Text component={TextVariants.p}>{podStats.mem}</Text>
</>
</>
}
{infraContainer && podStatus === "Running" &&
{infraContainer && infraContainerDetails && podStatus === "Running" &&
<>
{infraContainer.Ports && infraContainer.Ports.length !== 0 &&
<Popover
enableFlip
bodyContent={render_container_published_ports(infraContainer.Ports)}
>
<Button isInline variant="link" className="pod-ports-popover-button">
{cockpit.format(cockpit.ngettext("$0 port", "$0 ports", infraContainer.Ports.length), infraContainer.Ports.length)}
</Button>
</Popover>
}
<>
{infraContainer.Ports && infraContainer.Ports.length !== 0 &&
<Popover
enableFlip
bodyContent={render_container_published_ports(infraContainer.Ports)}
>
<Button variant="link" icon={<PortIcon className="pod-details-button-color" />}>
{infraContainer.Ports.length}
</Button>

</Popover>
}
</>
<>
{infraContainerDetails.Mounts && infraContainerDetails.Mounts.length !== 0 &&
<Popover
enableFlip
bodyContent={render_container_volumes(infraContainerDetails.Mounts)}
>
<Button variant="link" icon={<VolumeIcon className="pod-details-button-color" />}>
{infraContainer.Mounts.length}
</Button>

</Popover>
}
</>
</>
}
</Flex>
Expand Down
2 changes: 1 addition & 1 deletion src/Containers.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
margin-right: var(--pf-global--spacer--md);
}

.pod-ports-popover-button {
.pod-details-button-color {
color: var(--pf-c-button--m-secondary--Color);
}

Expand Down

0 comments on commit bed7a1b

Please sign in to comment.