You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
29 lines
1.1 KiB
29 lines
1.1 KiB
import UsageBar from "../resources/usage-bar";
|
|
|
|
import WidgetIcon from "./widget_icon";
|
|
import ResourceValue from "./resource_value";
|
|
import ResourceLabel from "./resource_label";
|
|
import Raw from "./raw";
|
|
|
|
export default function SingleResource({ children, key, expanded = false }) {
|
|
const values = children.filter(child => child.type === ResourceValue);
|
|
const labels = children.filter(child => child.type === ResourceLabel);
|
|
|
|
return <div key={key} className="flex-none flex flex-row items-center mr-3 py-1.5">
|
|
{children.find(child => child.type === WidgetIcon)}
|
|
<div className="flex flex-col ml-3 text-left min-w-[85px]">
|
|
<div className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
|
|
{values.pop()}
|
|
{labels.pop()}
|
|
</div>
|
|
{ expanded && <div className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
|
|
{values.pop()}
|
|
{labels.pop()}
|
|
</div>
|
|
}
|
|
{children.find(child => child.type === UsageBar)}
|
|
</div>
|
|
{children.find(child => child.type === Raw)}
|
|
</div>;
|
|
}
|