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

refactor: ts checking conditionallyrender props (#7840)

Browse Source 
Fix issues found by TS checking after removing ConditionallyRender
This commit is contained in:
Tymoteusz Czech 2024-08-30 13:39:11 +02:00 committed by GitHub
parent a918590d1e
commit 79fccbd8f3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 48 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
frontend/src/component/admin/groups/GroupsList/GroupCard/GroupCard.tsx
View File

@ -171,16 +171,18 @@ export const GroupCard = ({
</Tooltip>
))}
elseShow={
<Tooltip
title='This group is not used in any project'
arrow
describeChild
>
<ConditionallyRender
condition={!group.rootRole}
show={<Badge>Not used</Badge>}
/>
</Tooltip>
<ConditionallyRender
condition={!group.rootRole}
show={
<Tooltip
title='This group is not used in any project'
arrow
describeChild
>
<Badge>Not used</Badge>
</Tooltip>
}
/>
}
/>
</ProjectBadgeContainer>

16
frontend/src/component/common/Badge/Badge.tsx
View File

@ -70,15 +70,17 @@ const StyledBadgeIcon = styled('span')<
: theme.palette[color].main,
}));
const BadgeIcon = (color: Color, icon: ReactElement) => (
const BadgeIcon = (color: Color, icon?: ReactElement) => (
<StyledBadgeIcon color={color}>
<ConditionallyRender
condition={Boolean(icon?.props.sx)}
show={icon}
elseShow={() =>
cloneElement(icon!, {
sx: { fontSize: '16px' },
})
elseShow={
icon
? cloneElement(icon, {
sx: { fontSize: '16px' },
})
: null
}
/>
</StyledBadgeIcon>
@ -110,7 +112,7 @@ export const Badge: FC<IBadgeProps> = forwardRef(
>
<ConditionallyRender
condition={Boolean(icon) && !iconRight}
show={BadgeIcon(color, icon!)}
show={BadgeIcon(color, icon)}
/>
<ConditionallyRender
condition={
@ -122,7 +124,7 @@ export const Badge: FC<IBadgeProps> = forwardRef(
/>
<ConditionallyRender
condition={Boolean(icon) && Boolean(iconRight)}
show={BadgeIcon(color, icon!)}
show={BadgeIcon(color, icon)}
/>
</StyledBadge>
),

1
frontend/src/component/layout/Error/Error.tsx
View File

@ -55,6 +55,7 @@ export const Error: VFC<IErrorProps> = ({ error }) => {
<ConditionallyRender
condition={showZendeskButton}
show={<ZendeskButton />}
elseShow={undefined}
/>
}
>

1
frontend/src/component/playground/Playground/PlaygroundResultsTable/FeatureResultInfoPopoverCell/FeatureStrategyList/StrategyList/StrategyItem/StrategyExecution/SegmentExecution/SegmentExecution.tsx
View File

@ -54,6 +54,7 @@ export const SegmentExecution: VFC<ISegmentExecutionProps> = ({
</span>
</SegmentResultTextWrapper>
}
elseShow={undefined}
/>
}
isExpanded

51
frontend/src/component/project/Project/ProjectHealth/ReportTable/ReportCard/ReportCard.tsx
View File

@ -80,29 +80,6 @@ export const ReportCard = ({ healthReport }: IReportCardProps) => {
? 'warning.main'
: 'success.main';
const renderActiveToggles = () => (
<StyledBoxActive>
<CheckIcon />
<span>{healthReport.activeCount} active flags</span>
</StyledBoxActive>
);
const renderStaleToggles = () => (
<StyledBoxStale>
<ReportProblemOutlinedIcon />
<span>{healthReport.staleCount} stale flags</span>
</StyledBoxStale>
);
const renderPotentiallyStaleToggles = () => (
<StyledBoxStale>
<ReportProblemOutlinedIcon />
<span>
{healthReport.potentiallyStaleCount} potentially stale flags
</span>
</StyledBoxStale>
);
const StalenessInfoIcon = () => (
<HtmlTooltip
title={
@ -157,7 +134,14 @@ export const ReportCard = ({ healthReport }: IReportCardProps) => {
<li>
<ConditionallyRender
condition={Boolean(healthReport.activeCount)}
show={renderActiveToggles}
show={
<StyledBoxActive>
<CheckIcon />
<span>
{healthReport.activeCount} active flags
</span>
</StyledBoxActive>
}
/>
</li>
<ConditionallyRender
@ -172,7 +156,14 @@ export const ReportCard = ({ healthReport }: IReportCardProps) => {
<li>
<ConditionallyRender
condition={Boolean(healthReport.staleCount)}
show={renderStaleToggles}
show={
<StyledBoxStale>
<ReportProblemOutlinedIcon />
<span>
{healthReport.staleCount} stale flags
</span>
</StyledBoxStale>
}
/>
</li>
</StyledList>
@ -190,7 +181,15 @@ export const ReportCard = ({ healthReport }: IReportCardProps) => {
condition={Boolean(
healthReport.potentiallyStaleCount,
)}
show={renderPotentiallyStaleToggles}
show={
<StyledBoxStale>
<ReportProblemOutlinedIcon />
<span>
{healthReport.potentiallyStaleCount}{' '}
potentially stale flags
</span>
</StyledBoxStale>
}
/>
</li>
</StyledList>