Fix bugs and improve minor UI things

This commit is contained in:
Tulir Asokan 2018-11-10 22:16:34 +02:00
parent bc97df7de8
commit 9603f59b96
5 changed files with 21 additions and 18 deletions

View File

@ -157,7 +157,7 @@ class Client extends BaseMainView {
renderPreferences = () => (
<PrefTable>
<PrefInput rowName="User ID" type="text" disabled={!this.isNew} fullWidth={true}
name={!this.isNew ? "id" : ""} value={this.state.id}
name={!this.isNew ? "id" : ""} value={this.state.id} className="id"
placeholder="@fancybot:example.com" onChange={this.inputChange}/>
<PrefInput rowName="Homeserver" type="text" name="homeserver"
value={this.state.homeserver} placeholder="https://example.com"

View File

@ -135,9 +135,9 @@ class Instance extends BaseMainView {
render() {
return <div className="instance">
<PrefTable>
<PrefInput rowName="ID" type="text" name={"id"} value={this.state.id}
<PrefInput rowName="ID" type="text" name="id" value={this.state.id}
placeholder="fancybotinstance" onChange={this.inputChange}
disabled={!this.isNew} fullWidth={true}/>
disabled={!this.isNew} fullWidth={true} className="id"/>
<PrefSwitch rowName="Enabled" active={this.state.enabled}
onToggle={enabled => this.setState({ enabled })}/>
<PrefSwitch rowName="Running" active={this.state.started}

View File

@ -67,6 +67,12 @@ class Plugin extends BaseMainView {
render() {
return <div className="plugin">
{!this.isNew && <PrefTable>
<PrefInput rowName="ID" type="text" value={this.state.id} disabled={true}
className="id"/>
<PrefInput rowName="Version" type="text" value={this.state.version}
disabled={true}/>
</PrefTable>}
<div className={`upload-box ${this.state.uploading ? "uploading" : ""}`}>
<UploadButton className="upload"/>
<input className="file-selector" type="file" accept="application/zip"
@ -75,20 +81,13 @@ class Plugin extends BaseMainView {
onDragLeave={evt => evt.target.parentElement.classList.remove("drag")}/>
{this.state.uploading && <Spinner/>}
</div>
{!this.isNew && <>
<PrefTable>
<PrefInput rowName="ID" type="text" value={this.state.id} disabled={true}/>
<PrefInput rowName="Version" type="text" value={this.state.version}
disabled={true}/>
</PrefTable>
<div className="buttons">
<button className={`delete ${this.hasInstances ? "disabled-bg" : ""}`}
onClick={this.delete} disabled={this.loading || this.hasInstances}
title={this.hasInstances ? "Can't delete plugin that is in use" : ""}>
{this.state.deleting ? <Spinner/> : "Delete"}
</button>
</div>
</>}
{!this.isNew && <div className="buttons">
<button className={`delete ${this.hasInstances ? "disabled-bg" : ""}`}
onClick={this.delete} disabled={this.loading || this.hasInstances}
title={this.hasInstances ? "Can't delete plugin that is in use" : ""}>
{this.state.deleting ? <Spinner/> : "Delete"}
</button>
</div>}
<div className="error">{this.state.error}</div>
{!this.isNew && this.renderInstances()}
</div>

View File

@ -137,7 +137,7 @@ class Dashboard extends Component {
<Route path="/client/:id" render={({ match }) =>
this.renderView("clients", Client, match.params.id)}/>
<Route path="/plugin/:id" render={({ match }) =>
this.renderView("plugin", Plugin, match.params.id)}/>
this.renderView("plugins", Plugin, match.params.id)}/>
<Route render={() => this.renderNotFound()}/>
</Switch>
</main>

View File

@ -62,6 +62,10 @@
border-bottom: 1px solid $background
&.id:disabled
font-family: "Fira Code", monospace
font-weight: bold
&:not(:disabled)
border-bottom: 1px dotted $primary