mirror of
https://github.com/vector-im/hydrogen-web.git
synced 2024-12-23 03:25:12 +01:00
UI improvements
This commit is contained in:
parent
b1fd5f1ad5
commit
d01a95aae3
@ -111,8 +111,11 @@ export class GapTile extends SimpleTile {
|
|||||||
|
|
||||||
get error() {
|
get error() {
|
||||||
if (this._error) {
|
if (this._error) {
|
||||||
|
if (this._error instanceof ConnectionError) {
|
||||||
|
return { message: "Waiting for reconnection", showSpinner: true };
|
||||||
|
}
|
||||||
const dir = this._entry.prev_batch ? "previous" : "next";
|
const dir = this._entry.prev_batch ? "previous" : "next";
|
||||||
return `Could not load ${dir} messages: ${this._error.message}`;
|
return { message: `Could not load ${dir} messages: ${this._error.message}`, showSpinner: false };
|
||||||
}
|
}
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
@ -422,3 +422,12 @@ only loads when the top comes into view*/
|
|||||||
.GapView.isAtTop {
|
.GapView.isAtTop {
|
||||||
padding: 52px 20px 12px 20px;
|
padding: 52px 20px 12px 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.GapView__container {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.GapView__container .spinner {
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
@ -29,10 +29,24 @@ export class GapView extends TemplateView {
|
|||||||
isLoading: vm => vm.isLoading,
|
isLoading: vm => vm.isLoading,
|
||||||
isAtTop: vm => vm.isAtTop,
|
isAtTop: vm => vm.isAtTop,
|
||||||
};
|
};
|
||||||
return t.li({className}, [
|
return t.li({ className }, [
|
||||||
spinner(t),
|
t.map(vm => vm.error,
|
||||||
t.div(vm => vm.isLoading ? vm.i18n`Loading more messages …` : vm.i18n`Not loading!`),
|
(error, t, vm) => {
|
||||||
t.if(vm => vm.error, t => t.strong(vm => vm.error))
|
let elements;
|
||||||
|
if (error) {
|
||||||
|
elements = [t.strong(() => error.message)];
|
||||||
|
if (error.showSpinner) {
|
||||||
|
elements.unshift(spinner(t));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else if (vm.isLoading) {
|
||||||
|
elements = [spinner(t), t.span(vm.i18n`Loading more messages …`)];
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
elements = t.span(vm.i18n`Not loading!`);
|
||||||
|
}
|
||||||
|
return t.div({ className: "GapView__container" }, elements);
|
||||||
|
})
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user