diff --git a/ui/webui/src/components/app.jsx b/ui/webui/src/components/app.jsx
index 22d0393731df..a2b3ba875f98 100644
--- a/ui/webui/src/components/app.jsx
+++ b/ui/webui/src/components/app.jsx
@@ -35,8 +35,7 @@ import { PayloadsClient } from "../apis/payloads";
import { readBuildstamp, getIsFinal } from "../helpers/betanag.js";
import { readConf } from "../helpers/conf.js";
-
-const _ = cockpit.gettext;
+import { getOsReleaseByKey } from "../helpers/product.js";
export const Application = () => {
const [address, setAddress] = useState();
@@ -46,6 +45,7 @@ export const Application = () => {
const [notifications, setNotifications] = useState({});
const [isHelpExpanded, setIsHelpExpanded] = useState(false);
const [helpContent, setHelpContent] = useState("");
+ const [prettyName, setPrettyName] = useState("");
useEffect(() => {
cockpit.file("/run/anaconda/bus.address").watch(address => {
@@ -69,6 +69,10 @@ export const Application = () => {
buildstamp => setBeta(!getIsFinal(buildstamp)),
ex => console.error("Failed to parse anaconda buildstamp file")
);
+
+ getOsReleaseByKey("PRETTY_NAME").then(
+ setPrettyName
+ );
}, []);
const onAddNotification = (notificationProps) => {
@@ -95,7 +99,7 @@ export const Application = () => {
}
console.info("conf: ", conf);
- const title = _("Anaconda installer");
+ const title = cockpit.format("$0 installation", prettyName);
const page = (
.
*/
-import React from "react";
+import React, { useEffect, useState } from "react";
import cockpit from "cockpit";
import {
@@ -53,6 +53,7 @@ import {
setLangCookie
} from "../../helpers/language.js";
import { AnacondaPage } from "../AnacondaPage.jsx";
+import { getOsReleaseByKey } from "../../helpers/product.js";
import "./InstallationLanguage.scss";
@@ -317,9 +318,16 @@ LanguageSelector.contextType = AddressContext;
export const InstallationLanguage = ({ idPrefix, setIsFormValid, onAddErrorNotification }) => {
const [nativeName, setNativeName] = React.useState(false);
const { setLanguage } = React.useContext(LanguageContext);
+ const [distributionName, setDistributionName] = useState("");
+
+ useEffect(() => {
+ getOsReleaseByKey("NAME").then(
+ setDistributionName
+ );
+ }, []);
return (
-
+
diff --git a/ui/webui/src/helpers/product.js b/ui/webui/src/helpers/product.js
new file mode 100644
index 000000000000..8e6fc647296c
--- /dev/null
+++ b/ui/webui/src/helpers/product.js
@@ -0,0 +1,33 @@
+/*
+ * Copyright (C) 2022 Red Hat, Inc.
+ *
+ * This program is free software; you can redistribute it and/or modify it
+ * under the terms of the GNU Lesser General Public License as published by
+ * the Free Software Foundation; either version 2.1 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful, but
+ * WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with This program; If not, see .
+ */
+import cockpit from "cockpit";
+
+export const getOsReleaseByKey = (key) => {
+ const confFile = cockpit.file("/etc/os-release");
+ console.log(confFile);
+
+ return confFile
+ .read()
+ .then((content) =>
+ content
+ .split(/\r?\n/)
+ ?.find((item) => item?.includes(key))
+ .split("=")[1]
+ .replace(/['"]+/g, "")
+ )
+ .finally(confFile.close);
+};