diff --git a/src/clients/initial-access/CreateInitialAccessToken.tsx b/src/clients/initial-access/CreateInitialAccessToken.tsx index 9f179051b4..218a99d3f2 100644 --- a/src/clients/initial-access/CreateInitialAccessToken.tsx +++ b/src/clients/initial-access/CreateInitialAccessToken.tsx @@ -51,6 +51,7 @@ export const CreateInitialAccessToken = () => { token={token} toggleDialog={() => { setToken(""); + addAlert(t("tokenSaveSuccess"), AlertVariant.success); history.push(`/${realm}/clients/initialAccessToken`); }} /> @@ -78,13 +79,14 @@ export const CreateInitialAccessToken = () => { > ( )} /> diff --git a/src/clients/initial-access/InitialAccessTokenList.tsx b/src/clients/initial-access/InitialAccessTokenList.tsx index 18281638fc..1de09066df 100644 --- a/src/clients/initial-access/InitialAccessTokenList.tsx +++ b/src/clients/initial-access/InitialAccessTokenList.tsx @@ -3,6 +3,7 @@ import { useHistory, useRouteMatch } from "react-router-dom"; import moment from "moment"; import { useTranslation } from "react-i18next"; import { AlertVariant, Button, ButtonVariant } from "@patternfly/react-core"; +import { wrappable } from "@patternfly/react-table"; import ClientInitialAccessPresentation from "keycloak-admin/lib/defs/clientInitialAccessPresentation"; import { KeycloakDataTable } from "../../components/table-toolbar/KeycloakDataTable"; @@ -84,7 +85,9 @@ export const InitialAccessTokenList = () => { name: "expiration", displayKey: "clients:expires", cellRenderer: (row) => - moment(row.timestamp! * 1000 + row.expiration! * 1000).fromNow(), + moment(row.timestamp! * 1000 + row.expiration! * 1000).format( + "LLL" + ), }, { name: "count", @@ -93,6 +96,7 @@ export const InitialAccessTokenList = () => { { name: "remainingCount", displayKey: "clients:remainingCount", + transforms: [wrappable], }, ]} emptyState={ diff --git a/src/clients/messages.json b/src/clients/messages.json index d83aaa5005..450b994833 100644 --- a/src/clients/messages.json +++ b/src/clients/messages.json @@ -92,6 +92,7 @@ "expiration": "Expiration", "noTokens": "No initial access tokens", "noTokensInstructions": "You haven't created any initial access tokens. Create an initial access token by clicking \"Create\".", + "tokenSaveSuccess": "New initial access token has been created", "tokenSaveError": "Could not create initial access token {{error}}", "initialAccessTokenDetails": "Initial access token details", "copyInitialAccessToken": "Please copy and paste the initial access token before closing as it can not be retrieved later.", diff --git a/src/components/table-toolbar/KeycloakDataTable.tsx b/src/components/table-toolbar/KeycloakDataTable.tsx index 81574ea515..4577b60a15 100644 --- a/src/components/table-toolbar/KeycloakDataTable.tsx +++ b/src/components/table-toolbar/KeycloakDataTable.tsx @@ -6,6 +6,7 @@ import { IActions, IActionsResolver, IFormatter, + ITransform, Table, TableBody, TableHeader, @@ -72,6 +73,7 @@ export type Field = { name: string; displayKey?: string; cellFormatters?: IFormatter[]; + transforms?: ITransform[]; cellRenderer?: (row: T) => ReactNode; }; diff --git a/src/components/time-selector/TimeSelector.tsx b/src/components/time-selector/TimeSelector.tsx index 2e86d254b4..7ae630ffd5 100644 --- a/src/components/time-selector/TimeSelector.tsx +++ b/src/components/time-selector/TimeSelector.tsx @@ -33,7 +33,9 @@ export const TimeSelector = ({ { unit: "days", label: t("times.days"), multiplier: 86400 }, ]; - const times = allTimes.filter((t) => units.includes(t.unit)); + const times = units.map( + (unit) => allTimes.find((time) => time.unit === unit)! + ); const defaultMultiplier = allTimes.find((time) => time.unit === units[0]) ?.multiplier;