mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-27 03:06:41 +00:00
Improve landingpage translation loading (#25148)
This commit is contained in:
parent
94b5ed97c6
commit
b2044e88b6
@ -2,6 +2,8 @@ import "@material/mwc-linear-progress";
|
|||||||
import { type PropertyValues, css, html, nothing } from "lit";
|
import { type PropertyValues, css, html, nothing } from "lit";
|
||||||
import { customElement, property, state } from "lit/decorators";
|
import { customElement, property, state } from "lit/decorators";
|
||||||
import "../../src/components/ha-alert";
|
import "../../src/components/ha-alert";
|
||||||
|
import "../../src/components/ha-fade-in";
|
||||||
|
import "../../src/components/ha-spinner";
|
||||||
import { haStyle } from "../../src/resources/styles";
|
import { haStyle } from "../../src/resources/styles";
|
||||||
import "../../src/onboarding/onboarding-welcome-links";
|
import "../../src/onboarding/onboarding-welcome-links";
|
||||||
import "./components/landing-page-network";
|
import "./components/landing-page-network";
|
||||||
@ -40,6 +42,14 @@ class HaLandingPage extends LandingPageBaseElement {
|
|||||||
render() {
|
render() {
|
||||||
const networkIssue = this._networkInfo && !this._networkInfo.host_internet;
|
const networkIssue = this._networkInfo && !this._networkInfo.host_internet;
|
||||||
|
|
||||||
|
if (!this.localize) {
|
||||||
|
return html`
|
||||||
|
<ha-fade-in>
|
||||||
|
<ha-spinner size="large"></ha-spinner>
|
||||||
|
</ha-fade-in>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
|
||||||
return html`
|
return html`
|
||||||
<ha-card>
|
<ha-card>
|
||||||
<div class="card-content">
|
<div class="card-content">
|
||||||
@ -229,6 +239,12 @@ class HaLandingPage extends LandingPageBaseElement {
|
|||||||
margin-inline-end: 16px;
|
margin-inline-end: 16px;
|
||||||
margin-inline-start: initial;
|
margin-inline-start: initial;
|
||||||
}
|
}
|
||||||
|
ha-fade-in {
|
||||||
|
min-height: calc(100vh - 64px - 88px);
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
`,
|
`,
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
|
@ -6,23 +6,23 @@ import {
|
|||||||
type LandingPageKeys,
|
type LandingPageKeys,
|
||||||
type LocalizeFunc,
|
type LocalizeFunc,
|
||||||
} from "../../src/common/translations/localize";
|
} from "../../src/common/translations/localize";
|
||||||
|
import { computeDirectionStyles } from "../../src/common/util/compute_rtl";
|
||||||
import { ProvideHassLitMixin } from "../../src/mixins/provide-hass-lit-mixin";
|
import { ProvideHassLitMixin } from "../../src/mixins/provide-hass-lit-mixin";
|
||||||
|
import { translationMetadata } from "../../src/resources/translations-metadata";
|
||||||
|
import type { HassBaseEl } from "../../src/state/hass-base-mixin";
|
||||||
|
import themesMixin from "../../src/state/themes-mixin";
|
||||||
import type { Constructor, Resources } from "../../src/types";
|
import type { Constructor, Resources } from "../../src/types";
|
||||||
import {
|
import {
|
||||||
getLocalLanguage,
|
getLocalLanguage,
|
||||||
getTranslation,
|
getTranslation,
|
||||||
} from "../../src/util/common-translation";
|
} from "../../src/util/common-translation";
|
||||||
import { computeDirectionStyles } from "../../src/common/util/compute_rtl";
|
|
||||||
import themesMixin from "../../src/state/themes-mixin";
|
|
||||||
import { translationMetadata } from "../../src/resources/translations-metadata";
|
|
||||||
import type { HassBaseEl } from "../../src/state/hass-base-mixin";
|
|
||||||
|
|
||||||
export class LandingPageBaseElement extends themesMixin(
|
export class LandingPageBaseElement extends themesMixin(
|
||||||
ProvideHassLitMixin(LitElement) as unknown as Constructor<HassBaseEl>
|
ProvideHassLitMixin(LitElement) as unknown as Constructor<HassBaseEl>
|
||||||
) {
|
) {
|
||||||
// Initialized to empty will prevent undefined errors if called before connected to DOM.
|
// Initialized to empty will prevent undefined errors if called before connected to DOM.
|
||||||
@property({ attribute: false })
|
@property({ attribute: false })
|
||||||
public localize: LocalizeFunc<LandingPageKeys> = () => "";
|
public localize?: LocalizeFunc<LandingPageKeys>;
|
||||||
|
|
||||||
// Use browser language setup before login.
|
// Use browser language setup before login.
|
||||||
@property() public language?: string = getLocalLanguage();
|
@property() public language?: string = getLocalLanguage();
|
||||||
|
Loading…
x
Reference in New Issue
Block a user