1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

Not showing api errors in icon

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2020-10-01 15:01:36 +03:00
parent 0b903201a4
commit 5ab4740573
2 changed files with 12 additions and 55 deletions

View File

@ -12,37 +12,12 @@
> .controls { > .controls {
white-space: nowrap; white-space: nowrap;
flex: 1 1;
&:empty {
display: none;
}
&:not(:empty) + .info { &:not(:empty) + .info {
border: 1px solid $borderColor;
border-top: 0;
border-bottom: 0;
min-height: 25px; min-height: 25px;
padding-left: $padding; padding-left: $padding;
padding-right: $padding; padding-right: $padding;
} }
} }
> .info {
@include hidden-scrollbar;
min-width: 40px; // min-space for icon
flex: 1 1;
white-space: nowrap;
text-overflow: ellipsis;
> div {
padding-right: $padding;
flex-shrink: 0;
}
.Icon {
margin: 0;
margin-right: $padding;
}
}
} }

View File

@ -38,35 +38,29 @@ export class InfoPanel extends Component<Props> {
showNotifications: true, showNotifications: true,
} }
@observable.ref result: ReactNode;
@observable error = ""; @observable error = "";
@observable waiting = false; @observable waiting = false;
componentDidMount() { componentDidMount() {
disposeOnUnmount(this, [ disposeOnUnmount(this, [
reaction(() => this.props.tabId, () => { reaction(() => this.props.tabId, () => {
this.result = ""
this.error = ""
this.waiting = false this.waiting = false
}) })
]) ])
} }
@computed get errorInfo() { @computed get errorInfo() {
return this.error || this.props.error; return this.props.error;
} }
submit = async () => { submit = async () => {
const { showNotifications } = this.props; const { showNotifications } = this.props;
this.result = "";
this.error = "";
this.waiting = true; this.waiting = true;
try { try {
this.result = await this.props.submit() const result = await this.props.submit();
if (showNotifications) Notifications.ok(this.result); if (showNotifications) Notifications.ok(result);
} catch (error) { } catch (error) {
this.error = error.toString(); if (showNotifications) Notifications.error(error.toString());
if (showNotifications) Notifications.error(this.error);
} finally { } finally {
this.waiting = false this.waiting = false
} }
@ -81,27 +75,15 @@ export class InfoPanel extends Component<Props> {
dockStore.closeTab(this.props.tabId); dockStore.closeTab(this.props.tabId);
} }
renderInfo() { renderErrorIcon() {
if (!this.props.showInlineInfo) { if (!this.props.showInlineInfo || !this.errorInfo) {
return; return;
} }
const { result, errorInfo } = this;
return ( return (
<> <div className="error">
{result && ( <Icon material="error_outline" tooltip={this.errorInfo}/>
<div className="success flex align-center"> </div>
<Icon material="done" /> );
<span>{result}</span>
</div>
)}
{errorInfo && (
<div className="error flex align-center">
<Icon material="error_outline" />
<span>{errorInfo}</span>
</div>
)}
</>
)
} }
render() { render() {
@ -114,7 +96,7 @@ export class InfoPanel extends Component<Props> {
{controls} {controls}
</div> </div>
<div className="info flex gaps align-center"> <div className="info flex gaps align-center">
{waiting ? <><Spinner /> {submittingMessage}</> : this.renderInfo()} {waiting ? <><Spinner /> {submittingMessage}</> : this.renderErrorIcon()}
</div> </div>
<Button plain label={<Trans>Cancel</Trans>} onClick={close} /> <Button plain label={<Trans>Cancel</Trans>} onClick={close} />
<Button <Button