Use __STATIC_PATH__ in more places so the supervisor panel can reach paths (#16665)

Use __STATIC_PATH__ in more places so the supervisor panel can reach paths
This commit is contained in:
Joakim Sørensen 2023-05-30 10:45:58 +02:00 committed by GitHub
parent d9d38efd93
commit 5006dfc138
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 29 additions and 35 deletions

View File

@ -259,6 +259,7 @@ module.exports.config = {
isHassioBuild: true, isHassioBuild: true,
defineOverlay: { defineOverlay: {
__SUPERVISOR__: true, __SUPERVISOR__: true,
__STATIC_PATH__: `"${paths.hassio_publicPath}/static/"`,
}, },
}; };
}, },

View File

@ -111,9 +111,10 @@ gulp.task("copy-translations-supervisor", async () => {
copyTranslations(staticDir); copyTranslations(staticDir);
}); });
gulp.task("copy-locale-data-supervisor", async () => { gulp.task("copy-static-supervisor", async () => {
const staticDir = paths.hassio_output_static; const staticDir = paths.hassio_output_static;
copyLocaleData(staticDir); copyLocaleData(staticDir);
copyFonts(staticDir);
}); });
gulp.task("copy-static-app", async () => { gulp.task("copy-static-app", async () => {

View File

@ -21,7 +21,7 @@ gulp.task(
"build-supervisor-translations", "build-supervisor-translations",
"copy-translations-supervisor", "copy-translations-supervisor",
"build-locale-data", "build-locale-data",
"copy-locale-data-supervisor", "copy-static-supervisor",
env.useRollup() ? "rollup-watch-hassio" : "webpack-watch-hassio" env.useRollup() ? "rollup-watch-hassio" : "webpack-watch-hassio"
) )
); );
@ -37,7 +37,7 @@ gulp.task(
"build-supervisor-translations", "build-supervisor-translations",
"copy-translations-supervisor", "copy-translations-supervisor",
"build-locale-data", "build-locale-data",
"copy-locale-data-supervisor", "copy-static-supervisor",
env.useRollup() ? "rollup-prod-hassio" : "webpack-prod-hassio", env.useRollup() ? "rollup-prod-hassio" : "webpack-prod-hassio",
"gen-pages-hassio-prod", "gen-pages-hassio-prod",
...// Don't compress running tests ...// Don't compress running tests

View File

@ -98,11 +98,7 @@ export class SupervisorBaseElement extends urlSyncMixin(
} }
private async _initializeLocalize() { private async _initializeLocalize() {
const { language, data } = await getTranslation( const { language, data } = await getTranslation(null, this._language);
null,
this._language,
"/api/hassio/app/static/translations"
);
this._updateSupervisor({ this._updateSupervisor({
localize: await computeLocalize<SupervisorKeys>( localize: await computeLocalize<SupervisorKeys>(

View File

@ -15,7 +15,7 @@ export const polyfillLocaleData = async (language: string) => {
typeof Intl.NumberFormat.__addLocaleData === "function" typeof Intl.NumberFormat.__addLocaleData === "function"
) { ) {
const result = await fetch( const result = await fetch(
`/static/locale-data/intl-numberformat/${language}.json` `${__STATIC_PATH__}locale-data/intl-numberformat/${language}.json`
); );
// @ts-ignore // @ts-ignore
Intl.NumberFormat.__addLocaleData(await result.json()); Intl.NumberFormat.__addLocaleData(await result.json());
@ -26,7 +26,7 @@ export const polyfillLocaleData = async (language: string) => {
typeof Intl.RelativeTimeFormat.__addLocaleData === "function" typeof Intl.RelativeTimeFormat.__addLocaleData === "function"
) { ) {
const result = await fetch( const result = await fetch(
`/static/locale-data/intl-relativetimeformat/${language}.json` `${__STATIC_PATH__}locale-data/intl-relativetimeformat/${language}.json`
); );
// @ts-ignore // @ts-ignore
Intl.RelativeTimeFormat.__addLocaleData(await result.json()); Intl.RelativeTimeFormat.__addLocaleData(await result.json());
@ -37,7 +37,7 @@ export const polyfillLocaleData = async (language: string) => {
typeof Intl.DateTimeFormat.__addLocaleData === "function" typeof Intl.DateTimeFormat.__addLocaleData === "function"
) { ) {
const result = await fetch( const result = await fetch(
`/static/locale-data/intl-datetimeformat/${language}.json` `${__STATIC_PATH__}locale-data/intl-datetimeformat/${language}.json`
); );
// @ts-ignore // @ts-ignore
Intl.DateTimeFormat.__addLocaleData(await result.json()); Intl.DateTimeFormat.__addLocaleData(await result.json());
@ -48,7 +48,7 @@ export const polyfillLocaleData = async (language: string) => {
typeof Intl.DisplayNames.__addLocaleData === "function" typeof Intl.DisplayNames.__addLocaleData === "function"
) { ) {
const result = await fetch( const result = await fetch(
`/static/locale-data/intl-displaynames/${language}.json` `${__STATIC_PATH__}locale-data/intl-displaynames/${language}.json`
); );
// @ts-ignore // @ts-ignore
Intl.DisplayNames.__addLocaleData(await result.json()); Intl.DisplayNames.__addLocaleData(await result.json());

View File

@ -9,7 +9,7 @@ font-family: "Roboto";
src: src:
local("Roboto Thin"), local("Roboto Thin"),
local("Roboto-Thin"), local("Roboto-Thin"),
url(/static/fonts/roboto/Roboto-Thin.woff2) format("woff2"); url(${__STATIC_PATH__}fonts/roboto/Roboto-Thin.woff2) format("woff2");
font-weight: 100; font-weight: 100;
font-style: normal; font-style: normal;
} }
@ -18,7 +18,7 @@ font-family: "Roboto";
src: src:
local("Roboto Thin Italic"), local("Roboto Thin Italic"),
local("Roboto-ThinItalic"), local("Roboto-ThinItalic"),
url(/static/fonts/roboto/Roboto-ThinItalic.woff2) format("woff2"); url(${__STATIC_PATH__}fonts/roboto/Roboto-ThinItalic.woff2) format("woff2");
font-weight: 100; font-weight: 100;
font-style: italic; font-style: italic;
} }
@ -27,7 +27,7 @@ font-family: "Roboto";
src: src:
local("Roboto Light"), local("Roboto Light"),
local("Roboto-Light"), local("Roboto-Light"),
url(/static/fonts/roboto/Roboto-Light.woff2) format("woff2"); url(${__STATIC_PATH__}fonts/roboto/Roboto-Light.woff2) format("woff2");
font-weight: 300; font-weight: 300;
font-style: normal; font-style: normal;
} }
@ -36,7 +36,7 @@ font-family: "Roboto";
src: src:
local("Roboto Light Italic"), local("Roboto Light Italic"),
local("Roboto-LightItalic"), local("Roboto-LightItalic"),
url(/static/fonts/roboto/Roboto-LightItalic.woff2) format("woff2"); url(${__STATIC_PATH__}fonts/roboto/Roboto-LightItalic.woff2) format("woff2");
font-weight: 300; font-weight: 300;
font-style: italic; font-style: italic;
} }
@ -45,7 +45,7 @@ font-family: "Roboto";
src: src:
local("Roboto Regular"), local("Roboto Regular"),
local("Roboto-Regular"), local("Roboto-Regular"),
url(/static/fonts/roboto/Roboto-Regular.woff2) format("woff2"); url(${__STATIC_PATH__}fonts/roboto/Roboto-Regular.woff2) format("woff2");
font-weight: 400; font-weight: 400;
font-style: normal; font-style: normal;
} }
@ -54,7 +54,7 @@ font-family: "Roboto";
src: src:
local("Roboto Italic"), local("Roboto Italic"),
local("Roboto-Italic"), local("Roboto-Italic"),
url(/static/fonts/roboto/Roboto-RegularItalic.woff2) format("woff2"); url(${__STATIC_PATH__}fonts/roboto/Roboto-RegularItalic.woff2) format("woff2");
font-weight: 400; font-weight: 400;
font-style: italic; font-style: italic;
} }
@ -63,7 +63,7 @@ font-family: "Roboto";
src: src:
local("Roboto Medium"), local("Roboto Medium"),
local("Roboto-Medium"), local("Roboto-Medium"),
url(/static/fonts/roboto/Roboto-Medium.woff2) format("woff2"); url(${__STATIC_PATH__}fonts/roboto/Roboto-Medium.woff2) format("woff2");
font-weight: 500; font-weight: 500;
font-style: normal; font-style: normal;
} }
@ -72,7 +72,7 @@ font-family: "Roboto";
src: src:
local("Roboto Medium Italic"), local("Roboto Medium Italic"),
local("Roboto-MediumItalic"), local("Roboto-MediumItalic"),
url(/static/fonts/roboto/Roboto-MediumItalic.woff2) format("woff2"); url(${__STATIC_PATH__}fonts/roboto/Roboto-MediumItalic.woff2) format("woff2");
font-weight: 500; font-weight: 500;
font-style: italic; font-style: italic;
} }
@ -81,7 +81,7 @@ font-family: "Roboto";
src: src:
local("Roboto Bold"), local("Roboto Bold"),
local("Roboto-Bold"), local("Roboto-Bold"),
url(/static/fonts/roboto/Roboto-Bold.woff2) format("woff2"); url(${__STATIC_PATH__}fonts/roboto/Roboto-Bold.woff2) format("woff2");
font-weight: 700; font-weight: 700;
font-style: normal; font-style: normal;
} }
@ -90,7 +90,7 @@ font-family: "Roboto";
src: src:
local("Roboto Bold Italic"), local("Roboto Bold Italic"),
local("Roboto-BoldItalic"), local("Roboto-BoldItalic"),
url(/static/fonts/roboto/Roboto-BoldItalic.woff2) format("woff2"); url(${__STATIC_PATH__}fonts/roboto/Roboto-BoldItalic.woff2) format("woff2");
font-weight: 700; font-weight: 700;
font-style: italic; font-style: italic;
} }
@ -99,7 +99,7 @@ font-family: "Roboto";
src: src:
local("Roboto Black"), local("Roboto Black"),
local("Roboto-Black"), local("Roboto-Black"),
url(/static/fonts/roboto/Roboto-Black.woff2) format("woff2"); url(${__STATIC_PATH__}fonts/roboto/Roboto-Black.woff2) format("woff2");
font-weight: 900; font-weight: 900;
font-style: normal; font-style: normal;
} }
@ -108,7 +108,7 @@ font-family: "Roboto";
src: src:
local("Roboto Black Italic"), local("Roboto Black Italic"),
local("Roboto-BlackItalic"), local("Roboto-BlackItalic"),
url(/static/fonts/roboto/Roboto-BlackItalic.woff2) format("woff2"); url(${__STATIC_PATH__}fonts/roboto/Roboto-BlackItalic.woff2) format("woff2");
font-weight: 900; font-weight: 900;
font-style: italic; font-style: italic;
} }

View File

@ -5,15 +5,15 @@ import {
import { translationMetadata } from "../resources/translations-metadata"; import { translationMetadata } from "../resources/translations-metadata";
import { HomeAssistant } from "../types"; import { HomeAssistant } from "../types";
const DEFAULT_BASE_URL = "/static/translations"; const BASE_URL = `${__STATIC_PATH__}translations`;
const STORAGE = window.localStorage || {}; const STORAGE = window.localStorage || {};
// Store loaded translations in memory so translations are available immediately // Store loaded translations in memory so translations are available immediately
// when DOM is created in Polymer. Even a cache lookup creates noticeable latency. // when DOM is created in Polymer. Even a cache lookup creates noticeable latency.
const translations = {}; const translations = {};
async function fetchTranslation(fingerprint: string, base_url: string) { async function fetchTranslation(fingerprint: string) {
const response = await fetch(`${base_url}/${fingerprint}`, { const response = await fetch(`${BASE_URL}/${fingerprint}`, {
credentials: "same-origin", credentials: "same-origin",
}); });
if (!response.ok) { if (!response.ok) {
@ -131,13 +131,12 @@ export function getLocalLanguage() {
export async function getTranslation( export async function getTranslation(
fragment: string | null, fragment: string | null,
language: string, language: string
base_url?: string
) { ) {
const metadata = translationMetadata.translations[language]; const metadata = translationMetadata.translations[language];
if (!metadata?.hash) { if (!metadata?.hash) {
if (language !== "en") { if (language !== "en") {
return getTranslation(fragment, "en", base_url); return getTranslation(fragment, "en");
} }
throw new Error("Language en is not found in metadata"); throw new Error("Language en is not found in metadata");
} }
@ -149,16 +148,13 @@ export async function getTranslation(
// Fetch translation from the server // Fetch translation from the server
if (!translations[fingerprint]) { if (!translations[fingerprint]) {
translations[fingerprint] = fetchTranslation( translations[fingerprint] = fetchTranslation(fingerprint)
fingerprint,
base_url || DEFAULT_BASE_URL
)
.then((data) => ({ language, data })) .then((data) => ({ language, data }))
.catch((error) => { .catch((error) => {
delete translations[fingerprint]; delete translations[fingerprint];
if (language !== "en") { if (language !== "en") {
// Couldn't load selected translation. Try a fall back to en before failing. // Couldn't load selected translation. Try a fall back to en before failing.
return getTranslation(fragment, "en", base_url); return getTranslation(fragment, "en");
} }
return Promise.reject(error); return Promise.reject(error);
}); });