mirror of
https://github.com/lensapp/lens.git
synced 2025-05-20 05:10:56 +00:00
9563ead2e6
- Add distinction between `getInstance` and `getInstanceOrCreate` since it is not always possible to create an instance (since you might not know the correct arguments) - Remove all the `export const *Store = *Store.getInstance<*Store>();` calls as it defeats the purpose of `Singleton`. Plus with the typing changes the appropriate `*Store.getInstance()` is "short enough". - Special case the two extension export facades to not need to use `getInstanceOrCreate`. Plus since they are just facades it is always possible to create them. - Move some other types to be also `Singleton`'s: ExtensionLoader, ExtensionDiscovery, ThemeStore, LocalizationStore, ... - Fixed dev-run always using the same port with electron inspect - Update Store documentation with new recommendations about creating instances of singletons - Fix all unit tests to create their dependent singletons Signed-off-by: Sebastian Malton <sebastian@malton.name>
51 lines
1.7 KiB
TypeScript
51 lines
1.7 KiB
TypeScript
import React, { useContext } from "react";
|
|
import { observer } from "mobx-react";
|
|
import { IPvcMetrics, PersistentVolumeClaim } from "../../api/endpoints";
|
|
import { BarChart, ChartDataSets, memoryOptions } from "../chart";
|
|
import { isMetricsEmpty, normalizeMetrics } from "../../api/endpoints/metrics.api";
|
|
import { NoMetrics } from "../resource-metrics/no-metrics";
|
|
import { IResourceMetricsValue, ResourceMetricsContext } from "../resource-metrics";
|
|
import { ThemeStore } from "../../theme.store";
|
|
|
|
type IContext = IResourceMetricsValue<PersistentVolumeClaim, { metrics: IPvcMetrics }>;
|
|
|
|
export const VolumeClaimDiskChart = observer(() => {
|
|
const { params: { metrics }, object } = useContext<IContext>(ResourceMetricsContext);
|
|
const { chartCapacityColor } = ThemeStore.getInstance().activeTheme.colors;
|
|
const id = object.getId();
|
|
|
|
if (!metrics) return null;
|
|
if (isMetricsEmpty(metrics)) return <NoMetrics/>;
|
|
|
|
const { diskUsage, diskCapacity } = metrics;
|
|
const usage = normalizeMetrics(diskUsage).data.result[0].values;
|
|
const capacity = normalizeMetrics(diskCapacity).data.result[0].values;
|
|
|
|
const datasets: ChartDataSets[] = [
|
|
{
|
|
id: `${id}-diskUsage`,
|
|
label: `Usage`,
|
|
tooltip: `Volume disk usage`,
|
|
borderColor: "#ffc63d",
|
|
data: usage.map(([x, y]) => ({ x, y }))
|
|
},
|
|
{
|
|
id: `${id}-diskCapacity`,
|
|
label: `Capacity`,
|
|
tooltip: `Volume disk capacity`,
|
|
borderColor: chartCapacityColor,
|
|
data: capacity.map(([x, y]) => ({ x, y }))
|
|
}
|
|
];
|
|
|
|
return (
|
|
<BarChart
|
|
className="VolumeClaimDiskChart flex box grow column"
|
|
name={`pvc-${object.getName()}-disk`}
|
|
timeLabelStep={10}
|
|
options={memoryOptions}
|
|
data={{ datasets }}
|
|
/>
|
|
);
|
|
});
|