Improve landingpage translation loading (#25148)

This commit is contained in:
Wendelin 2025-04-24 07:33:14 +02:00 committed by GitHub
parent 94b5ed97c6
commit b2044e88b6
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 21 additions and 5 deletions

View File

@ -2,6 +2,8 @@ import "@material/mwc-linear-progress";
import { type PropertyValues, css, html, nothing } from "lit";
import { customElement, property, state } from "lit/decorators";
import "../../src/components/ha-alert";
import "../../src/components/ha-fade-in";
import "../../src/components/ha-spinner";
import { haStyle } from "../../src/resources/styles";
import "../../src/onboarding/onboarding-welcome-links";
import "./components/landing-page-network";
@ -40,6 +42,14 @@ class HaLandingPage extends LandingPageBaseElement {
render() {
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`
<ha-card>
<div class="card-content">
@ -229,6 +239,12 @@ class HaLandingPage extends LandingPageBaseElement {
margin-inline-end: 16px;
margin-inline-start: initial;
}
ha-fade-in {
min-height: calc(100vh - 64px - 88px);
display: flex;
justify-content: center;
align-items: center;
}
`,
];
}

View File

@ -6,23 +6,23 @@ import {
type LandingPageKeys,
type LocalizeFunc,
} from "../../src/common/translations/localize";
import { computeDirectionStyles } from "../../src/common/util/compute_rtl";
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 {
getLocalLanguage,
getTranslation,
} 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(
ProvideHassLitMixin(LitElement) as unknown as Constructor<HassBaseEl>
) {
// Initialized to empty will prevent undefined errors if called before connected to DOM.
@property({ attribute: false })
public localize: LocalizeFunc<LandingPageKeys> = () => "";
public localize?: LocalizeFunc<LandingPageKeys>;
// Use browser language setup before login.
@property() public language?: string = getLocalLanguage();