mirror of
https://github.com/Unleash/unleash.git
synced 2024-12-22 19:07:54 +01:00
feat: application issues (#6347)
This commit is contained in:
Jaanus Sellin
GitHub
parent
3704956a06
commit
7cebf7b8fe
@ -0,0 +1,27 @@
|
||||
import { screen } from '@testing-library/react';
|
||||
import { render } from 'utils/testRenderer';
|
||||
import { ApplicationIssues } from './ApplicationIssues';
|
||||
import { ApplicationOverviewIssuesSchema } from 'openapi';
|
||||
|
||||
test('Display all application issues', async () => {
|
||||
const issues: ApplicationOverviewIssuesSchema[] = [
|
||||
{
|
||||
type: 'missingFeatures',
|
||||
items: ['my-app'],
|
||||
},
|
||||
{
|
||||
type: 'missingStrategies',
|
||||
items: ['defaultStrategy', 'mainStrategy'],
|
||||
},
|
||||
];
|
||||
render(<ApplicationIssues issues={issues} />);
|
||||
|
||||
await screen.findByText('my-app');
|
||||
await screen.findByText('mainStrategy');
|
||||
await screen.findByText(
|
||||
`We detected 1 feature flag defined in the SDK that does not exist in Unleash`,
|
||||
);
|
||||
await screen.findByText(
|
||||
`We detected 2 strategy types defined in the SDK that do not exist in Unleash`,
|
||||
);
|
||||
});
|
||||
@ -0,0 +1,117 @@
|
||||
import { Box, styled } from '@mui/material';
|
||||
import { ConditionallyRender } from '../../common/ConditionallyRender/ConditionallyRender';
|
||||
import { WarningAmberRounded } from '@mui/icons-material';
|
||||
import { ApplicationOverviewIssuesSchema } from 'openapi';
|
||||
|
||||
const WarningContainer = styled(Box)(({ theme }) => ({
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
paddingBottom: theme.spacing(8),
|
||||
}));
|
||||
|
||||
const WarningHeader = styled(Box)(({ theme }) => ({
|
||||
display: 'flex',
|
||||
padding: theme.spacing(2, 3, 2, 3),
|
||||
alignItems: 'flex-start',
|
||||
gap: theme.spacing(1.5),
|
||||
alignSelf: 'stretch',
|
||||
borderRadius: `${theme.shape.borderRadiusLarge}px ${theme.shape.borderRadiusLarge}px 0 0`,
|
||||
border: `1px solid ${theme.palette.warning.border}`,
|
||||
background: theme.palette.warning.light,
|
||||
}));
|
||||
|
||||
const SmallText = styled(Box)(({ theme }) => ({
|
||||
fontSize: theme.fontSizes.smallBody,
|
||||
}));
|
||||
|
||||
const WarningHeaderText = styled(SmallText)(({ theme }) => ({
|
||||
color: theme.palette.warning.dark,
|
||||
fontWeight: theme.fontWeight.bold,
|
||||
}));
|
||||
|
||||
const StyledList = styled('ul')(({ theme }) => ({
|
||||
padding: theme.spacing(0, 0, 0, 2),
|
||||
}));
|
||||
|
||||
const StyledListElement = styled('li')(({ theme }) => ({
|
||||
fontWeight: theme.fontWeight.bold,
|
||||
fontSize: theme.fontSizes.smallBody,
|
||||
}));
|
||||
|
||||
const IssueContainer = styled(Box)(({ theme }) => ({
|
||||
display: 'flex',
|
||||
padding: theme.spacing(3),
|
||||
flexDirection: 'column',
|
||||
alignItems: 'flex-start',
|
||||
alignSelf: 'stretch',
|
||||
gap: theme.spacing(3),
|
||||
borderRadius: ` 0 0 ${theme.shape.borderRadiusLarge}px ${theme.shape.borderRadiusLarge}px`,
|
||||
border: `1px solid ${theme.palette.warning.border}`,
|
||||
}));
|
||||
|
||||
const IssueTextContainer = styled(Box)(({ theme }) => ({
|
||||
display: 'flex',
|
||||
padding: theme.spacing(2),
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'flex-start',
|
||||
alignSelf: 'stretch',
|
||||
gap: theme.spacing(0.5),
|
||||
borderRadius: theme.spacing(1),
|
||||
border: `1px solid ${theme.palette.divider}`,
|
||||
}));
|
||||
|
||||
export interface IApplicationIssuesProps {
|
||||
issues: ApplicationOverviewIssuesSchema[];
|
||||
}
|
||||
|
||||
const resolveIssueText = (issue: ApplicationOverviewIssuesSchema) => {
|
||||
const issueCount = issue.items.length;
|
||||
let issueText = '';
|
||||
|
||||
switch (issue.type) {
|
||||
case 'missingFeatures':
|
||||
issueText = `feature flag${issueCount !== 1 ? 's' : ''}`;
|
||||
break;
|
||||
case 'missingStrategies':
|
||||
issueText = `strategy type${issueCount !== 1 ? 's' : ''}`;
|
||||
break;
|
||||
}
|
||||
|
||||
return `We detected ${issueCount} ${issueText} defined in the SDK that ${
|
||||
issueCount !== 1 ? 'do' : 'does'
|
||||
} not exist in Unleash`;
|
||||
};
|
||||
|
||||
export const ApplicationIssues = ({ issues }: IApplicationIssuesProps) => {
|
||||
return (
|
||||
<ConditionallyRender
|
||||
condition={issues.length > 0}
|
||||
show={
|
||||
<WarningContainer>
|
||||
<WarningHeader>
|
||||
<WarningAmberRounded />
|
||||
<WarningHeaderText>
|
||||
We detected {issues.length} issues in this
|
||||
application
|
||||
</WarningHeaderText>
|
||||
</WarningHeader>
|
||||
<IssueContainer>
|
||||
{issues.map((issue) => (
|
||||
<IssueTextContainer key={issue.type}>
|
||||
<SmallText>{resolveIssueText(issue)}</SmallText>
|
||||
<StyledList>
|
||||
{issue.items.map((item) => (
|
||||
<StyledListElement key={item}>
|
||||
{item}
|
||||
</StyledListElement>
|
||||
))}
|
||||
</StyledList>
|
||||
</IssueTextContainer>
|
||||
))}
|
||||
</IssueContainer>
|
||||
</WarningContainer>
|
||||
}
|
||||
/>
|
||||
);
|
||||
};
|
||||
@ -20,7 +20,7 @@ import { sortTypes } from 'utils/sortTypes';
|
||||
import { IconCell } from 'component/common/Table/cells/IconCell/IconCell';
|
||||
import { LinkCell } from 'component/common/Table/cells/LinkCell/LinkCell';
|
||||
import { ApplicationUsageCell } from './ApplicationUsageCell/ApplicationUsageCell';
|
||||
import { ApplicationSchema } from '../../../openapi';
|
||||
import { ApplicationSchema } from 'openapi';
|
||||
|
||||
export const ApplicationList = () => {
|
||||
const { applications: data, loading } = useApplications();
|
||||
|
||||
@ -2,7 +2,7 @@ import { TextCell } from 'component/common/Table/cells/TextCell/TextCell';
|
||||
import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
|
||||
import { styled, Typography, useTheme } from '@mui/material';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { ApplicationUsageSchema } from '../../../../openapi';
|
||||
import { ApplicationUsageSchema } from 'openapi';
|
||||
|
||||
export interface IApplicationUsageCellProps {
|
||||
usage: ApplicationUsageSchema[] | undefined;
|
||||
|
||||
@ -2,7 +2,7 @@ import { screen } from '@testing-library/react';
|
||||
import { render } from 'utils/testRenderer';
|
||||
import { testServerRoute, testServerSetup } from 'utils/testServer';
|
||||
import { PaginatedApplicationList } from './PaginatedApplicationList';
|
||||
import { ApplicationSchema } from '../../../openapi';
|
||||
import { ApplicationSchema } from 'openapi';
|
||||
|
||||
const server = testServerSetup();
|
||||
|
||||
|
||||
@ -12,7 +12,7 @@ import { PaginatedTable } from 'component/common/Table';
|
||||
import { IconCell } from 'component/common/Table/cells/IconCell/IconCell';
|
||||
import { LinkCell } from 'component/common/Table/cells/LinkCell/LinkCell';
|
||||
import { ApplicationUsageCell } from './ApplicationUsageCell/ApplicationUsageCell';
|
||||
import { ApplicationSchema } from '../../../openapi';
|
||||
import { ApplicationSchema } from 'openapi';
|
||||
import {
|
||||
encodeQueryParams,
|
||||
NumberParam,
|
||||
|
||||
@ -2,7 +2,7 @@ import { screen } from '@testing-library/react';
|
||||
import { render } from 'utils/testRenderer';
|
||||
import { testServerRoute, testServerSetup } from 'utils/testServer';
|
||||
import { Route, Routes } from 'react-router-dom';
|
||||
import { ApplicationOverviewSchema } from '../../openapi';
|
||||
import { ApplicationOverviewSchema } from 'openapi';
|
||||
import ApplicationOverview from './ApplicationOverview';
|
||||
|
||||
const server = testServerSetup();
|
||||
|
||||
@ -10,11 +10,11 @@ import {
|
||||
} from '@mui/material';
|
||||
import { useRequiredPathParam } from 'hooks/useRequiredPathParam';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import Check from '@mui/icons-material/CheckCircle';
|
||||
import Warning from '@mui/icons-material/Warning';
|
||||
import { ArcherContainer, ArcherElement } from 'react-archer';
|
||||
import { FC, useLayoutEffect, useRef, useState } from 'react';
|
||||
import { useApplicationOverview } from 'hooks/api/getters/useApplicationOverview/useApplicationOverview';
|
||||
import { WarningAmberRounded } from '@mui/icons-material';
|
||||
import { ApplicationIssues } from './ApplicationIssues/ApplicationIssues';
|
||||
|
||||
const StyledTable = styled('table')(({ theme }) => ({
|
||||
fontSize: theme.fontSizes.smallerBody,
|
||||
@ -33,41 +33,41 @@ const StyleApplicationContainer = styled(Box)(({ theme }) => ({
|
||||
justifyContent: 'center',
|
||||
}));
|
||||
|
||||
const StyledApplicationBox = styled(Box)<{ mode: 'success' | 'warning' }>(
|
||||
({ theme, mode }) => ({
|
||||
borderRadius: theme.shape.borderRadiusMedium,
|
||||
border: '1px solid',
|
||||
borderColor: theme.palette[mode].border,
|
||||
backgroundColor: theme.palette[mode].light,
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
alignItems: 'center',
|
||||
padding: theme.spacing(1.5, 3, 2, 3),
|
||||
}),
|
||||
);
|
||||
const StyledApplicationBox = styled(Box)<{
|
||||
mode: 'success' | 'warning';
|
||||
}>(({ theme, mode }) => ({
|
||||
borderRadius: theme.shape.borderRadiusMedium,
|
||||
border: '1px solid',
|
||||
borderColor: theme.palette[mode].border,
|
||||
backgroundColor: theme.palette[mode].light,
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
alignItems: 'center',
|
||||
padding: theme.spacing(1.5, 3, 2, 3),
|
||||
}));
|
||||
|
||||
const StyledStatus = styled(Typography)<{ mode: 'success' | 'warning' }>(
|
||||
({ theme, mode }) => ({
|
||||
gap: theme.spacing(1),
|
||||
fontSize: theme.fontSizes.smallBody,
|
||||
color: theme.palette[mode].dark,
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
}),
|
||||
);
|
||||
const StyledStatus = styled(Typography)<{
|
||||
mode: 'success' | 'warning';
|
||||
}>(({ theme, mode }) => ({
|
||||
gap: theme.spacing(1),
|
||||
fontSize: theme.fontSizes.smallBody,
|
||||
color: theme.palette[mode].dark,
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
}));
|
||||
|
||||
const StyledEnvironmentBox = styled(Box)<{ mode: 'success' | 'warning' }>(
|
||||
({ theme, mode }) => ({
|
||||
borderRadius: theme.shape.borderRadiusMedium,
|
||||
border: '1px solid',
|
||||
borderColor:
|
||||
theme.palette[mode === 'success' ? 'secondary' : 'warning'].border,
|
||||
backgroundColor:
|
||||
theme.palette[mode === 'success' ? 'secondary' : 'warning'].light,
|
||||
display: 'inline-block',
|
||||
padding: theme.spacing(1.5, 1.5, 1.5, 1.5),
|
||||
}),
|
||||
);
|
||||
const StyledEnvironmentBox = styled(Box)<{
|
||||
mode: 'success' | 'warning';
|
||||
}>(({ theme, mode }) => ({
|
||||
borderRadius: theme.shape.borderRadiusMedium,
|
||||
border: '1px solid',
|
||||
borderColor:
|
||||
theme.palette[mode === 'success' ? 'secondary' : 'warning'].border,
|
||||
backgroundColor:
|
||||
theme.palette[mode === 'success' ? 'secondary' : 'warning'].light,
|
||||
display: 'inline-block',
|
||||
padding: theme.spacing(1.5, 1.5, 1.5, 1.5),
|
||||
}));
|
||||
|
||||
const StyledDivider = styled(Divider)(({ theme }) => ({
|
||||
marginTop: theme.spacing(2),
|
||||
@ -88,7 +88,7 @@ const EnvironmentHeader = styled(Typography)(({ theme }) => ({
|
||||
|
||||
const SuccessStatus = () => (
|
||||
<StyledStatus mode='success'>
|
||||
<Check
|
||||
<WarningAmberRounded
|
||||
sx={(theme) => ({
|
||||
color: theme.palette.success.main,
|
||||
})}
|
||||
@ -99,7 +99,7 @@ const SuccessStatus = () => (
|
||||
|
||||
const WarningStatus: FC = ({ children }) => (
|
||||
<StyledStatus mode='warning'>
|
||||
<Warning
|
||||
<WarningAmberRounded
|
||||
sx={(theme) => ({
|
||||
color: theme.palette.warning.main,
|
||||
})}
|
||||
@ -116,7 +116,10 @@ const useElementWidth = () => {
|
||||
setWidth(`${elementRef.current?.scrollWidth}px`);
|
||||
}, [elementRef, setWidth]);
|
||||
|
||||
return { elementRef, width };
|
||||
return {
|
||||
elementRef,
|
||||
width,
|
||||
};
|
||||
};
|
||||
|
||||
export const ApplicationOverview = () => {
|
||||
@ -135,127 +138,140 @@ export const ApplicationOverview = () => {
|
||||
|
||||
const { elementRef, width } = useElementWidth();
|
||||
|
||||
const mode: 'success' | 'warning' = 'success';
|
||||
const mode: 'success' | 'warning' =
|
||||
data.issues.length === 0 ? 'success' : 'warning';
|
||||
|
||||
return (
|
||||
<ConditionallyRender
|
||||
condition={!loading && data.environments.length === 0}
|
||||
show={<Alert severity='warning'>No data available.</Alert>}
|
||||
elseShow={
|
||||
<Box sx={{ width }}>
|
||||
<ArcherContainer
|
||||
strokeColor={theme.palette.secondary.border}
|
||||
endMarker={false}
|
||||
>
|
||||
<StyleApplicationContainer>
|
||||
<ArcherElement
|
||||
id='application'
|
||||
relations={data.environments.map(
|
||||
(environment) => ({
|
||||
targetId: environment.name,
|
||||
targetAnchor: 'top',
|
||||
sourceAnchor: 'bottom',
|
||||
style: {
|
||||
strokeColor:
|
||||
mode === 'success'
|
||||
? theme.palette.secondary
|
||||
.border
|
||||
: theme.palette.warning
|
||||
.border,
|
||||
},
|
||||
}),
|
||||
)}
|
||||
>
|
||||
<StyledApplicationBox mode={mode}>
|
||||
<Typography
|
||||
sx={(theme) => ({
|
||||
fontSize:
|
||||
theme.fontSizes.smallerBody,
|
||||
})}
|
||||
color='text.secondary'
|
||||
>
|
||||
Application
|
||||
</Typography>
|
||||
<Typography
|
||||
sx={(theme) => ({
|
||||
fontSize: theme.fontSizes.bodySize,
|
||||
fontWeight: theme.fontWeight.bold,
|
||||
})}
|
||||
>
|
||||
{applicationName}
|
||||
</Typography>
|
||||
|
||||
<StyledDivider />
|
||||
|
||||
<ConditionallyRender
|
||||
condition={mode === 'success'}
|
||||
show={<SuccessStatus />}
|
||||
elseShow={
|
||||
<WarningStatus>
|
||||
3 issues detected
|
||||
</WarningStatus>
|
||||
}
|
||||
/>
|
||||
</StyledApplicationBox>
|
||||
</ArcherElement>
|
||||
</StyleApplicationContainer>
|
||||
|
||||
<StyledEnvironmentsContainer ref={elementRef}>
|
||||
{data.environments.map((environment) => (
|
||||
<>
|
||||
<ApplicationIssues issues={data.issues} />
|
||||
<Box sx={{ width }}>
|
||||
<ArcherContainer
|
||||
strokeColor={theme.palette.secondary.border}
|
||||
endMarker={false}
|
||||
>
|
||||
<StyleApplicationContainer>
|
||||
<ArcherElement
|
||||
id={environment.name}
|
||||
key={environment.name}
|
||||
id='application'
|
||||
relations={data.environments.map(
|
||||
(environment) => ({
|
||||
targetId: environment.name,
|
||||
targetAnchor: 'top',
|
||||
sourceAnchor: 'bottom',
|
||||
style: {
|
||||
strokeColor:
|
||||
mode === 'success'
|
||||
? theme.palette
|
||||
.secondary.border
|
||||
: theme.palette.warning
|
||||
.border,
|
||||
},
|
||||
}),
|
||||
)}
|
||||
>
|
||||
<StyledEnvironmentBox
|
||||
mode={mode}
|
||||
<StyledApplicationBox mode={mode}>
|
||||
<Typography
|
||||
sx={(theme) => ({
|
||||
fontSize:
|
||||
theme.fontSizes.smallerBody,
|
||||
})}
|
||||
color='text.secondary'
|
||||
>
|
||||
Application
|
||||
</Typography>
|
||||
<Typography
|
||||
sx={(theme) => ({
|
||||
fontSize:
|
||||
theme.fontSizes.bodySize,
|
||||
fontWeight:
|
||||
theme.fontWeight.bold,
|
||||
})}
|
||||
>
|
||||
{applicationName}
|
||||
</Typography>
|
||||
|
||||
<StyledDivider />
|
||||
|
||||
<ConditionallyRender
|
||||
condition={mode === 'success'}
|
||||
show={<SuccessStatus />}
|
||||
elseShow={
|
||||
<WarningStatus>
|
||||
{data.issues.length} issues
|
||||
detected
|
||||
</WarningStatus>
|
||||
}
|
||||
/>
|
||||
</StyledApplicationBox>
|
||||
</ArcherElement>
|
||||
</StyleApplicationContainer>
|
||||
|
||||
<StyledEnvironmentsContainer ref={elementRef}>
|
||||
{data.environments.map((environment) => (
|
||||
<ArcherElement
|
||||
id={environment.name}
|
||||
key={environment.name}
|
||||
>
|
||||
<EnvironmentHeader>
|
||||
{environment.name} environment
|
||||
</EnvironmentHeader>
|
||||
<StyledEnvironmentBox
|
||||
mode={mode}
|
||||
key={environment.name}
|
||||
>
|
||||
<EnvironmentHeader>
|
||||
{environment.name} environment
|
||||
</EnvironmentHeader>
|
||||
|
||||
<StyledTable>
|
||||
<tbody>
|
||||
<tr>
|
||||
<StyledCell>
|
||||
Instances:
|
||||
</StyledCell>
|
||||
<StyledCell>
|
||||
{
|
||||
environment.instanceCount
|
||||
}
|
||||
</StyledCell>
|
||||
</tr>
|
||||
<tr>
|
||||
<StyledCell>
|
||||
SDK:
|
||||
</StyledCell>
|
||||
<StyledCell>
|
||||
{environment.sdks.map(
|
||||
(sdk) => (
|
||||
<div key={sdk}>
|
||||
{sdk}
|
||||
</div>
|
||||
),
|
||||
)}
|
||||
</StyledCell>
|
||||
</tr>
|
||||
<tr>
|
||||
<StyledCell>
|
||||
Last seen:
|
||||
</StyledCell>
|
||||
<StyledCell>
|
||||
{environment.lastSeen}
|
||||
</StyledCell>
|
||||
</tr>
|
||||
</tbody>
|
||||
</StyledTable>
|
||||
</StyledEnvironmentBox>
|
||||
</ArcherElement>
|
||||
))}
|
||||
</StyledEnvironmentsContainer>
|
||||
</ArcherContainer>
|
||||
</Box>
|
||||
<StyledTable>
|
||||
<tbody>
|
||||
<tr>
|
||||
<StyledCell>
|
||||
Instances:
|
||||
</StyledCell>
|
||||
<StyledCell>
|
||||
{
|
||||
environment.instanceCount
|
||||
}
|
||||
</StyledCell>
|
||||
</tr>
|
||||
<tr>
|
||||
<StyledCell>
|
||||
SDK:
|
||||
</StyledCell>
|
||||
<StyledCell>
|
||||
{environment.sdks.map(
|
||||
(sdk) => (
|
||||
<div
|
||||
key={
|
||||
sdk
|
||||
}
|
||||
>
|
||||
{sdk}
|
||||
</div>
|
||||
),
|
||||
)}
|
||||
</StyledCell>
|
||||
</tr>
|
||||
<tr>
|
||||
<StyledCell>
|
||||
Last seen:
|
||||
</StyledCell>
|
||||
<StyledCell>
|
||||
{
|
||||
environment.lastSeen
|
||||
}
|
||||
</StyledCell>
|
||||
</tr>
|
||||
</tbody>
|
||||
</StyledTable>
|
||||
</StyledEnvironmentBox>
|
||||
</ArcherElement>
|
||||
))}
|
||||
</StyledEnvironmentsContainer>
|
||||
</ArcherContainer>
|
||||
</Box>
|
||||
</>
|
||||
}
|
||||
/>
|
||||
);
|
||||
|
||||
@ -22,7 +22,7 @@ import { MetricsSummaryChart } from './MetricsSummaryChart/MetricsSummaryChart';
|
||||
import {
|
||||
ExecutiveSummarySchemaMetricsSummaryTrendsItem,
|
||||
ExecutiveSummarySchemaProjectFlagTrendsItem,
|
||||
} from '../../openapi';
|
||||
} from 'openapi';
|
||||
import { HealthStats } from './HealthStats/HealthStats';
|
||||
import { Badge } from 'component/common/Badge/Badge';
|
||||
|
||||
|
||||
@ -12,7 +12,7 @@ import { useFeedbackContext } from './useFeedback';
|
||||
import React, { useState } from 'react';
|
||||
import CloseIcon from '@mui/icons-material/Close';
|
||||
import useToast from 'hooks/useToast';
|
||||
import { ProvideFeedbackSchema } from '../../openapi';
|
||||
import { ProvideFeedbackSchema } from 'openapi';
|
||||
import { useUserFeedbackApi } from 'hooks/api/actions/useUserFeedbackApi/useUserFeedbackApi';
|
||||
import { useUserSubmittedFeedback } from 'hooks/useSubmittedFeedback';
|
||||
import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
|
||||
|
||||
@ -13,7 +13,7 @@ import { SearchHighlightProvider } from 'component/common/Table/SearchHighlightC
|
||||
import { useSearch } from 'hooks/useSearch';
|
||||
import theme from 'themes/theme';
|
||||
import { useState } from 'react';
|
||||
import { FeedbackSchema } from '../../openapi';
|
||||
import { FeedbackSchema } from 'openapi';
|
||||
|
||||
interface IFeedbackSchemaCellProps {
|
||||
value?: string | null; // FIXME: proper type
|
||||
|
||||
@ -2,7 +2,7 @@ import { screen } from '@testing-library/react';
|
||||
import { render } from 'utils/testRenderer';
|
||||
import { testServerRoute, testServerSetup } from 'utils/testServer';
|
||||
import { ProjectApplications } from './ProjectApplications';
|
||||
import { ProjectApplicationSchema } from '../../../openapi';
|
||||
import { ProjectApplicationSchema } from 'openapi';
|
||||
import { Route, Routes } from 'react-router-dom';
|
||||
import { SEARCH_INPUT } from 'utils/testIds';
|
||||
|
||||
|
||||
@ -19,7 +19,7 @@ import useLoading from 'hooks/useLoading';
|
||||
import { createColumnHelper, useReactTable } from '@tanstack/react-table';
|
||||
import { withTableState } from 'utils/withTableState';
|
||||
import { LinkCell } from 'component/common/Table/cells/LinkCell/LinkCell';
|
||||
import { ProjectApplicationSchema } from '../../../openapi';
|
||||
import { ProjectApplicationSchema } from 'openapi';
|
||||
import mapValues from 'lodash.mapvalues';
|
||||
import {
|
||||
DEFAULT_PAGE_LIMIT,
|
||||
|
||||
@ -3,6 +3,12 @@ import { formatApiPath } from 'utils/formatPath';
|
||||
import handleErrorResponses from '../httpErrorResponseHandler';
|
||||
import { ApplicationOverviewSchema } from 'openapi';
|
||||
|
||||
const placeHolderApplication: ApplicationOverviewSchema = {
|
||||
environments: [],
|
||||
featureCount: 0,
|
||||
projects: [],
|
||||
issues: [],
|
||||
};
|
||||
export const useApplicationOverview = (
|
||||
application: string,
|
||||
options: SWRConfiguration = {},
|
||||
@ -17,7 +23,7 @@ export const useApplicationOverview = (
|
||||
);
|
||||
|
||||
return {
|
||||
data: data || { environments: [], featureCount: 0, projects: [] },
|
||||
data: data || placeHolderApplication,
|
||||
error,
|
||||
loading: !error && !data,
|
||||
};
|
||||
|
||||
Loading…
Reference in New Issue
Block a user