Implement UXD feedback for Admin UI version (#1602)

* Implement UXD feedback for Admin UI version

* Align text further
This commit is contained in:
Jon Koops 2021-11-26 11:28:00 +01:00 committed by GitHub
parent 177e9eb985
commit 74af12b2e2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 8 deletions

View file

@ -21,8 +21,8 @@ import {
Title, Title,
} from "@patternfly/react-core"; } from "@patternfly/react-core";
import React from "react"; import React from "react";
import { useTranslation } from "react-i18next"; import { Trans, useTranslation } from "react-i18next";
import _ from "lodash"; import { xor } from "lodash";
import { useRealm } from "../context/realm-context/RealmContext"; import { useRealm } from "../context/realm-context/RealmContext";
import { useServerInfo } from "../context/server-info/ServerInfoProvider"; import { useServerInfo } from "../context/server-info/ServerInfoProvider";
@ -60,7 +60,7 @@ const Dashboard = () => {
const { realm } = useRealm(); const { realm } = useRealm();
const serverInfo = useServerInfo(); const serverInfo = useServerInfo();
const enabledFeatures = _.xor( const enabledFeatures = xor(
serverInfo.profileInfo?.disabledFeatures, serverInfo.profileInfo?.disabledFeatures,
serverInfo.profileInfo?.experimentalFeatures, serverInfo.profileInfo?.experimentalFeatures,
serverInfo.profileInfo?.previewFeatures serverInfo.profileInfo?.previewFeatures
@ -78,7 +78,15 @@ const Dashboard = () => {
<> <>
<PageSection variant="light"> <PageSection variant="light">
<TextContent className="pf-u-mr-sm"> <TextContent className="pf-u-mr-sm">
<Text component="h1">{toUpperCase(realm)} realm</Text> <Text component="h1">
{t("realmName", { name: toUpperCase(realm) })}
</Text>
<Text>
<Trans t={t} i18nKey="adminUiVersion">
<strong>Admin UI version</strong>
{{ version: environment.commitHash }}
</Trans>
</Text>
</TextContent> </TextContent>
</PageSection> </PageSection>
<PageSection> <PageSection>
@ -160,9 +168,6 @@ const Dashboard = () => {
</Card> </Card>
</GridItem> </GridItem>
</Grid> </Grid>
<Text className="pf-u-font-size-sm pf-u-color-200 pf-u-mt-sm">
{t("adminUiVersion", { version: environment.commitHash })}
</Text>
</PageSection> </PageSection>
</> </>
); );

View file

@ -1,5 +1,6 @@
export default { export default {
dashboard: { dashboard: {
realmName: "{{name}} realm",
welcome: "Welcome to", welcome: "Welcome to",
introduction: introduction:
"If you want to leave this page and mange this realm, please click the corresponding menu items in the left navigation bar.", "If you want to leave this page and mange this realm, please click the corresponding menu items in the left navigation bar.",
@ -13,6 +14,6 @@ export default {
infoEnabledFeatures: "Something about what enabled features are.", infoEnabledFeatures: "Something about what enabled features are.",
infoDisabledFeatures: "Something about what disabled features are.", infoDisabledFeatures: "Something about what disabled features are.",
disabledFeatures: "Disabled features", disabledFeatures: "Disabled features",
adminUiVersion: "Admin UI version: {{version}}", adminUiVersion: '<0 class="pf-u-mr-md">Admin UI version</0>{{version}}',
}, },
}; };