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

Make arriving release values not re-render whole details

Browse Source 
Signed-off-by: Janne Savolainen <janne.savolainen@live.fi>
This commit is contained in:
Janne Savolainen 2022-01-21 07:39:11 +02:00
parent 68080dc2c4
commit 26cdde420f
No known key found for this signature in database
GPG Key ID: 8C6CFB2FFFE8F68A
2 changed files with 41 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
src/renderer/components/+apps-releases/release-details/release-details.tsx
View File

@ -15,7 +15,7 @@ import { HelmReleaseMenu } from "../release-menu";
import { Drawer, DrawerItem, DrawerTitle } from "../../drawer"; import { Drawer, DrawerItem, DrawerTitle } from "../../drawer";
import { Badge } from "../../badge"; import { Badge } from "../../badge";
import { cssNames, stopPropagation } from "../../../utils"; import { cssNames, stopPropagation } from "../../../utils";
import { observer } from "mobx-react"; import { Observer, observer } from "mobx-react";
import { Spinner } from "../../spinner"; import { Spinner } from "../../spinner";
import { Table, TableCell, TableHead, TableRow } from "../../table"; import { Table, TableCell, TableHead, TableRow } from "../../table";
import { Button } from "../../button"; import { Button } from "../../button";
@ -49,9 +49,7 @@ interface Dependencies {
@observer @observer
class NonInjectedReleaseDetails extends Component<Props & Dependencies> { class NonInjectedReleaseDetails extends Component<Props & Dependencies> {
@observable saving = false; @observable saving = false;
@observable error?: string = undefined;
private nonSavedValues: string; private nonSavedValues: string;
@ -68,10 +66,6 @@ class NonInjectedReleaseDetails extends Component<Props & Dependencies> {
return this.props.releaseDetails.value.get(); return this.props.releaseDetails.value.get();
} }
@computed get values() {
return this.props.releaseValues.value.get();
}
updateValues = async () => { updateValues = async () => {
const name = this.release.getName(); const name = this.release.getName();
const namespace = this.release.getNs(); const namespace = this.release.getNs();
@ -105,36 +99,43 @@ class NonInjectedReleaseDetails extends Component<Props & Dependencies> {
}; };
renderValues() { renderValues() {
const { saving } = this;
const releaseValuesArePending = this.props.releaseValues.pending.get();
this.nonSavedValues = this.values;
return ( return (
<div className="values"> <Observer>
<DrawerTitle title="Values"/> {() => {
<div className="flex column gaps"> const { saving } = this;
<Checkbox
label="User-supplied values only" const releaseValuesArePending =
value={this.props.userSuppliedValuesAreShown.value} this.props.releaseValues.pending.get();
onChange={this.props.userSuppliedValuesAreShown.toggle}
disabled={releaseValuesArePending} this.nonSavedValues = this.props.releaseValues.value.get();
/>
<MonacoEditor return (
style={{ minHeight: 300 }} <div className="values">
value={this.values} <DrawerTitle title="Values" />
onChange={text => this.nonSavedValues = text} <div className="flex column gaps">
/> <Checkbox
<Button label="User-supplied values only"
primary value={this.props.userSuppliedValuesAreShown.value}
label="Save" onChange={this.props.userSuppliedValuesAreShown.toggle}
waiting={saving} disabled={releaseValuesArePending}
disabled={releaseValuesArePending} />
onClick={this.updateValues} <MonacoEditor
/> style={{ minHeight: 300 }}
</div> value={this.nonSavedValues}
</div> onChange={(text) => (this.nonSavedValues = text)}
/>
<Button
primary
label="Save"
waiting={saving}
disabled={releaseValuesArePending}
onClick={this.updateValues}
/>
</div>
</div>
);
}}
</Observer>
); );
} }
@ -195,14 +196,6 @@ class NonInjectedReleaseDetails extends Component<Props & Dependencies> {
renderContent() { renderContent() {
if (!this.release) return null; if (!this.release) return null;
if (this.error) {
return (
<div className="loading-error">
{this.error}
</div>
);
}
if (!this.details) { if (!this.details) {
return <Spinner center/>; return <Spinner center/>;
} }

4
src/renderer/components/+apps-releases/release-details/release.injectable.ts
View File

@ -16,6 +16,10 @@ const releaseInjectable = getInjectable({
return asyncComputed(async () => { return asyncComputed(async () => {
const { name, namespace } = releaseRouteParameters.get(); const { name, namespace } = releaseRouteParameters.get();
if (!name || !namespace) {
return null;
}
return releases.value.get().find(matches({ name, namespace })); return releases.value.get().find(matches({ name, namespace }));
}); });
}, },