Change more things

This commit is contained in:
Tulir Asokan 2018-11-10 13:49:54 +02:00
parent 53d2264351
commit 0a406ac071
2 changed files with 11 additions and 2 deletions

View File

@ -222,10 +222,16 @@ class Client extends Component {
</PrefTable> </PrefTable>
) )
get hasInstances() {
return this.state.instances.length > 0
}
renderPrefButtons = () => <> renderPrefButtons = () => <>
<div className="buttons"> <div className="buttons">
{!this.isNew && ( {!this.isNew && (
<button className="delete" onClick={this.delete} disabled={this.loading}> <button className={`delete ${this.hasInstances ? "disabled-bg" : ""}`}
onClick={this.delete} disabled={this.loading || this.hasInstances}
title={this.hasInstances ? "Can't delete client that is in use" : ""}>
{this.state.deleting ? <Spinner/> : "Delete"} {this.state.deleting ? <Spinner/> : "Delete"}
</button> </button>
)} )}
@ -238,7 +244,7 @@ class Client extends Component {
renderInstances = () => !this.isNew && ( renderInstances = () => !this.isNew && (
<div className="instances"> <div className="instances">
<h3>{this.state.instances.length > 0 ? "Instances" : "No instances :("}</h3> <h3>{this.hasInstances ? "Instances" : "No instances :("}</h3>
{this.state.instances.map(instance => ( {this.state.instances.map(instance => (
<Link className="instance" key={instance.id} to={`/instance/${instance.id}`}> <Link className="instance" key={instance.id} to={`/instance/${instance.id}`}>
{instance.id} {instance.id}

View File

@ -26,6 +26,9 @@
box-sizing: border-box box-sizing: border-box
font-size: 1rem font-size: 1rem
&.disabled-bg
background-color: $background-dark
&:not(:disabled) &:not(:disabled)
cursor: pointer cursor: pointer