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

feat: Last seen for toggles that have an old usage reported (#4538)

Browse Source 
Last seen for toggles that have an old usage reported and no environment

Closes: # [1-1276]
(https://linear.app/unleash/issue/1-1276/last-seen-for-toggles-that-have-an-old-usage-reported-and-that-are)

![Screenshot 2023-08-21 at 14 40
42](https://github.com/Unleash/unleash/assets/104830839/bfa20993-3d52-4c34-959d-f3e34b5c5b47)

Signed-off-by: andreas-unleash <andreas@getunleash.ai>
This commit is contained in:
andreas-unleash 2023-08-21 14:52:32 +03:00 committed by GitHub
parent d19d97cf18
commit 10c21461bd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 88 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/src/component/common/Table/cells/FeatureSeenCell/FeatureEnvironmentSeenCell.tsx
View File

@ -9,7 +9,10 @@ interface IFeatureSeenCellProps {
export const FeatureEnvironmentSeenCell: VFC<IFeatureSeenCellProps> = ({
feature,
}) => {
const environments = Object.values(feature.environments);
const environments = Boolean(feature.environments)
? Object.values(feature.environments)
: [];
return (
<FeatureEnvironmentSeen
featureLastSeen={feature.lastSeenAt}

123
frontend/src/component/common/Table/cells/FeatureSeenCell/LastSeenTooltip.tsx
View File

@ -1,4 +1,4 @@
import { styled, SxProps, Theme } from '@mui/material';
import { styled, SxProps, Theme, Typography } from '@mui/material';
import TimeAgo from 'react-timeago';
import { IEnvironments, IFeatureEnvironment } from 'interfaces/featureToggle';
import React from 'react';
@ -56,6 +56,7 @@ const StyledValue = styled('div', {
}));
interface ILastSeenTooltipProps {
featureLastSeen: string;
environments?: IEnvironments[] | IFeatureEnvironment[];
className?: string;
sx?: SxProps<Theme>;
@ -63,10 +64,14 @@ interface ILastSeenTooltipProps {
export const LastSeenTooltip = ({
environments,
featureLastSeen,
...rest
}: ILastSeenTooltipProps) => {
const getColor = useLastSeenColors();
const [, defaultTextColor] = getColor();
const environmentsHaveLastSeen = environments?.some(environment =>
Boolean(environment.lastSeenAt)
);
return (
<StyledDescription {...rest}>
<StyledDescriptionHeader sx={{ mb: 0 }}>
@ -75,46 +80,84 @@ export const LastSeenTooltip = ({
<StyledDescriptionSubHeader>
Usage is reported from connected applications through metrics
</StyledDescriptionSubHeader>
{environments &&
environments.map(({ name, lastSeenAt }) => (
<StyledDescriptionBlock key={name}>
<StyledDescriptionBlockHeader>
{name}
</StyledDescriptionBlockHeader>
<StyledValueContainer>
<ConditionallyRender
condition={Boolean(lastSeenAt)}
show={
<TimeAgo
date={lastSeenAt!}
title=""
live={false}
formatter={(
value: number,
unit: string,
suffix: string
) => {
const [, textColor] =
getColor(unit);
return (
<StyledValue color={textColor}>
{`${value} ${unit}${
value !== 1 ? 's' : ''
} ${suffix}`}
</StyledValue>
);
}}
<ConditionallyRender
condition={
Boolean(environments) && Boolean(environmentsHaveLastSeen)
}
show={
<>
{environments?.map(({ name, lastSeenAt }) => (
<StyledDescriptionBlock key={name}>
<StyledDescriptionBlockHeader>
{name}
</StyledDescriptionBlockHeader>
<StyledValueContainer>
<ConditionallyRender
condition={Boolean(lastSeenAt)}
show={
<TimeAgo
date={lastSeenAt!}
title=""
live={false}
formatter={(
value: number,
unit: string,
suffix: string
) => {
const [, textColor] =
getColor(unit);
return (
<StyledValue
color={textColor}
>
{`${value} ${unit}${
value !== 1
? 's'
: ''
} ${suffix}`}
</StyledValue>
);
}}
/>
}
elseShow={
<StyledValue
color={defaultTextColor}
>
no usage
</StyledValue>
}
/>
}
elseShow={
<StyledValue color={defaultTextColor}>
no usage
</StyledValue>
}
/>
</StyledValueContainer>
</StyledDescriptionBlock>
))}
</StyledValueContainer>
</StyledDescriptionBlock>
))}
</>
}
elseShow={
<TimeAgo
date={featureLastSeen}
title=""
live={false}
formatter={(
value: number,
unit: string,
suffix: string
) => {
const [, textColor] = getColor(unit);
return (
<Typography
fontWeight={'bold'}
color={'text.primary'}
>
{`Reported ${value} ${unit}${
value !== 1 ? 's' : ''
} ${suffix}`}
</Typography>
);
}}
/>
}
/>
</StyledDescription>
);
};

1
frontend/src/component/feature/FeatureView/FeatureEnvironmentSeen/FeatureEnvironmentSeen.tsx
View File

@ -91,6 +91,7 @@ export const FeatureEnvironmentSeen = ({
sx={sx}
tooltip={
<LastSeenTooltip
featureLastSeen={featureLastSeen}
environments={environments}
/>
}