Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-02-09 00:18:00 +01:00
Code Issues Projects Releases Wiki Activity

improvements

Browse Source
This commit is contained in:
andreas-unleash 2022-08-03 17:18:03 +03:00
parent 2858aae45e
commit f9d8c4a36a
3 changed files with 43 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
frontend/src/component/playground/Playground/PlaygroundResultsTable/FeatureResultInfoPopoverCell/PlaygroundResultFeatureDetails/PlaygroundResultFeatureDetails.tsx
View File

@ -66,16 +66,13 @@ export const PlaygroundResultFeatureDetails = ({
</Typography>
<span>
<PlaygroundResultChip
enabled={
enabled={feature.isEnabled}
label={
feature.isEnabled === 'unevaluated'
? 'unknown'
: feature.isEnabled
}
label={String(feature.isEnabled)}
size={
feature.isEnabled === 'unevaluated'
? 'large'
: 'default'
? '?'
: Boolean(feature.isEnabled)
? 'True'
: 'False'
}
/>
</span>

7
frontend/src/component/playground/Playground/PlaygroundResultsTable/FeatureStatusCell/FeatureStatusCell.tsx
View File

@ -3,7 +3,7 @@ import { Box, styled } from '@mui/material';
import { PlaygroundResultChip } from '../PlaygroundResultChip/PlaygroundResultChip';
interface IFeatureStatusCellProps {
enabled: boolean | 'unknown';
enabled: boolean | 'unevaluated';
}
const StyledCellBox = styled(Box)(({ theme }) => ({
@ -20,7 +20,10 @@ export const FeatureStatusCell = ({ enabled }: IFeatureStatusCellProps) => {
return (
<StyledCellBox>
<StyledChipWrapper data-loading>
<PlaygroundResultChip enabled={enabled} />
<PlaygroundResultChip
enabled={enabled}
label={enabled === 'unevaluated' ? '?' : Boolean(enabled) ? 'True': 'False' }
/>
</StyledChipWrapper>
</StyledCellBox>
);

63
frontend/src/component/playground/Playground/PlaygroundResultsTable/PlaygroundResultChip/PlaygroundResultChip.tsx
View File

@ -4,12 +4,13 @@ import { ConditionallyRender } from '../../../../common/ConditionallyRender/Cond
import React from 'react';
import { ReactComponent as FeatureEnabledIcon } from '../../../../../assets/icons/isenabled-true.svg';
import { ReactComponent as FeatureDisabledIcon } from '../../../../../assets/icons/isenabled-false.svg';
import { WarningOutlined } from "@mui/icons-material";
interface IResultChipProps {
enabled: boolean | 'unknown';
enabled: boolean | 'unevaluated' | 'unknown'
label: string;
// Result icon - defaults to true
showIcon?: boolean;
label?: string;
size?: 'default' | 'medium' | 'large';
}
@ -61,68 +62,68 @@ export const StyledUnknownChip = styled(StyledChip)(({ theme }) => ({
export const PlaygroundResultChip = ({
enabled,
showIcon = true,
label,
showIcon = true,
size = 'default',
}: IResultChipProps) => {
const theme = useTheme();
const icon = (
<ConditionallyRender
condition={enabled !== 'unknown' && enabled}
show={
<FeatureEnabledIcon
color={theme.palette.success.main}
strokeWidth="0.25"
/>
}
condition={enabled === 'unknown' || enabled === 'unevaluated' }
show={<WarningOutlined color={'warning'} fontSize='inherit' /> }
elseShow={
<FeatureDisabledIcon
color={theme.palette.error.main}
strokeWidth="0.25"
<ConditionallyRender
condition={typeof enabled === 'boolean' && Boolean(enabled)}
show={
<FeatureEnabledIcon
color={theme.palette.success.main}
strokeWidth="0.25"
/>
}
elseShow={
<FeatureDisabledIcon
color={theme.palette.error.main}
strokeWidth="0.25"
/>
}
/>
}
/>
);
const defaultLabel = enabled ? 'True' : 'False';
let chipWidth = 60;
if (size === 'medium') {
chipWidth = 72;
}
if (size === 'large') {
chipWidth = 100;
}
let chipWidth = 60;
if (size === 'medium') chipWidth = 72;
if (size === 'large') chipWidth = 100;
return (
<ConditionallyRender
condition={enabled !== 'unknown' && enabled}
condition={enabled === 'unknown' || enabled === 'unevaluated' }
show={
<StyledTrueChip
<StyledUnknownChip
icon={showIcon ? icon : undefined}
label={label || defaultLabel}
label={label}
width={chipWidth}
/>
}
elseShow={
<ConditionallyRender
condition={enabled === 'unknown'}
condition={typeof enabled === 'boolean' && Boolean(enabled)}
show={
<StyledUnknownChip
label={label || 'Unknown'}
<StyledTrueChip
icon={showIcon ? icon : undefined}
label={label}
width={chipWidth}
/>
}
elseShow={
<StyledFalseChip
icon={showIcon ? icon : undefined}
label={label || defaultLabel}
label={label}
width={chipWidth}
/>
}
/>
}
/>
);
)
};