update encrypted value display on detail and form views

This commit is contained in:
John Mitchell 2020-02-19 14:57:27 -05:00
parent 0b5f892193
commit 42387166bf
2 changed files with 12 additions and 4 deletions

View File

@ -14,7 +14,7 @@ const DetailName = styled(({ fullWidth, ...props }) => (
`}
`;
const DetailValue = styled(({ fullWidth, ...props }) => (
const DetailValue = styled(({ fullWidth, isEncrypted, ...props }) => (
<TextListItem {...props} />
))`
word-break: break-all;
@ -23,6 +23,11 @@ const DetailValue = styled(({ fullWidth, ...props }) => (
`
grid-column: 2 / -1;
`}
${props => props.isEncrypted &&
`
text-transform: uppercase
color: var(--pf-global--Color--400);
`}
`;
const Detail = ({
@ -32,6 +37,7 @@ const Detail = ({
className,
dataCy,
alwaysVisible,
isEncrypted
}) => {
if (!value && typeof value !== 'number' && !alwaysVisible) {
return null;
@ -55,6 +61,7 @@ const Detail = ({
component={TextListItemVariants.dd}
fullWidth={fullWidth}
data-cy={valueCy}
isEncrypted={isEncrypted}
>
{value}
</DetailValue>

View File

@ -70,7 +70,7 @@ function CredentialDetail({ i18n, credential }) {
setHasContentLoading(false);
};
const renderDetail = ({ id, label, type, secret }) => {
const renderDetail = ({ id, label, type }) => {
let detail;
if (type === 'boolean') {
@ -81,8 +81,9 @@ function CredentialDetail({ i18n, credential }) {
value={<List>{inputs[id] && <ListItem>{label}</ListItem>}</List>}
/>
);
} else if (secret === true) {
detail = null;
} else if (inputs[id] === '$encrypted$') {
const isEncrypted = true;
detail = <Detail key={id} label={label} value={i18n._(t`Encrypted`)} isEncrypted={isEncrypted} />;
} else {
detail = <Detail key={id} label={label} value={inputs[id]} />;
}