hendrik/lens
1
0 Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Replace deprecated <FormSwitcher/> in metrics-cluster-feature extension (#6060)

Browse Source 
* Use new <Switch/> inside deprecated material switcher

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Clean up material UI (except types) from FormSwitch

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Fix button size in Metrics Settings

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Remove material-ui references from

<Switcher/> & <FormSwitcher/>

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Change to newer <Switch/> component

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev authored and GitHub committed 2022-08-25 16:18:58 +03:00
1 parent 0c32490fb0
commit edd5d54e49
3 files changed
+65 -134
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

extensions/metrics-cluster-feature/src/metrics-settings.tsx
+40 -47
View File
@@ -15,7 +15,7 @@ const {
forCluster, StatefulSet, DaemonSet, Deployment,
},
Component: {
SubTitle, FormSwitch, Switcher, Button,
SubTitle, Switch, Button,
},
} = Renderer;
@@ -207,17 +207,14 @@ export class MetricsSettings extends React.Component<MetricsSettingsProps> {
)}
<section>
<SubTitle title="Prometheus" />
<FormSwitch
control={(
<Switcher
disabled={this.featureStates.kubeStateMetrics === undefined || !this.isTogglable}
checked={!!this.featureStates.prometheus && this.props.cluster.status.phase == "connected"}
onChange={v => this.togglePrometheus(v.target.checked)}
name="prometheus"
/>
)}
label="Enable bundled Prometheus metrics stack"
/>
<Switch
disabled={this.featureStates.kubeStateMetrics === undefined || !this.isTogglable}
checked={!!this.featureStates.prometheus && this.props.cluster.status.phase == "connected"}
onChange={checked => this.togglePrometheus(checked)}
name="prometheus"
>
Enable bundled Prometheus metrics stack
</Switch>
<small className="hint">
Enable timeseries data visualization (Prometheus stack) for your cluster.
</small>
@@ -225,17 +222,14 @@ export class MetricsSettings extends React.Component<MetricsSettingsProps> {
<section>
<SubTitle title="Kube State Metrics" />
<FormSwitch
control={(
<Switcher
disabled={this.featureStates.kubeStateMetrics === undefined || !this.isTogglable}
checked={!!this.featureStates.kubeStateMetrics && this.props.cluster.status.phase == "connected"}
onChange={v => this.toggleKubeStateMetrics(v.target.checked)}
name="node-exporter"
/>
)}
label="Enable bundled kube-state-metrics stack"
/>
<Switch
disabled={this.featureStates.kubeStateMetrics === undefined || !this.isTogglable}
checked={!!this.featureStates.kubeStateMetrics && this.props.cluster.status.phase == "connected"}
onChange={checked => this.toggleKubeStateMetrics(checked)}
name="kube-state-metrics"
>
Enable bundled kube-state-metrics stack
</Switch>
<small className="hint">
Enable Kubernetes API object metrics for your cluster.
Enable this only if you don&apos;t have existing kube-state-metrics stack installed.
@@ -244,17 +238,14 @@ export class MetricsSettings extends React.Component<MetricsSettingsProps> {
<section>
<SubTitle title="Node Exporter" />
<FormSwitch
control={(
<Switcher
disabled={this.featureStates.nodeExporter === undefined || !this.isTogglable}
checked={!!this.featureStates.nodeExporter && this.props.cluster.status.phase == "connected"}
onChange={v => this.toggleNodeExporter(v.target.checked)}
name="node-exporter"
/>
)}
label="Enable bundled node-exporter stack"
/>
<Switch
disabled={this.featureStates.nodeExporter === undefined || !this.isTogglable}
checked={!!this.featureStates.nodeExporter && this.props.cluster.status.phase == "connected"}
onChange={checked => this.toggleNodeExporter(checked)}
name="node-exporter"
>
Enable bundled node-exporter stack
</Switch>
<small className="hint">
Enable node level metrics for your cluster.
Enable this only if you don&apos;t have existing node-exporter stack installed.
@@ -262,20 +253,22 @@ export class MetricsSettings extends React.Component<MetricsSettingsProps> {
</section>
<section>
<Button
label={this.buttonLabel}
waiting={this.inProgress}
onClick={() => this.save()}
primary
disabled={!this.changed}
className="w-60 h-14"
/>
<div>
<Button
primary
label={this.buttonLabel}
waiting={this.inProgress}
onClick={() => this.save()}
disabled={!this.changed}
style={{ width: "20ch", padding: "0.5rem" }}
/>
{this.canUpgrade && (
<small className="hint">
An update is available for enabled metrics components.
</small>
)}
{this.canUpgrade && (
<small className="hint">
An update is available for enabled metrics components.
</small>
)}
</div>
</section>
</>
);