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

refactor: application overview dom improvements and tests (#6325)

Browse Source
This commit is contained in:
Mateusz Kwasniewski 2024-02-23 06:56:46 +01:00 committed by GitHub
parent 0de0313563
commit 42f6843029
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 110 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
frontend/src/component/application/ApplicationOverview.test.tsx Normal file
View File

@ -0,0 +1,72 @@
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 ApplicationOverview from './ApplicationOverview';
const server = testServerSetup();
const setupApi = (application: ApplicationOverviewSchema) => {
testServerRoute(
server,
'/api/admin/metrics/applications/my-app/overview',
application,
);
testServerRoute(server, '/api/admin/ui-config', {});
};
test('Display application overview with environments', async () => {
setupApi({
environments: [
{
name: 'development',
instanceCount: 999,
lastSeen: '2024-02-22T20:20:24.740',
sdks: ['unleash-client-node:5.5.0-beta.0'],
},
],
featureCount: 1,
projects: ['default'],
});
render(
<Routes>
<Route
path={'/applications/:name'}
element={<ApplicationOverview />}
/>
</Routes>,
{
route: '/applications/my-app',
},
);
await screen.findByText('my-app');
await screen.findByText('Everything looks good!');
await screen.findByText('development environment');
await screen.findByText('999');
await screen.findByText('unleash-client-node:5.5.0-beta.0');
await screen.findByText('2024-02-22T20:20:24.740');
});
test('Display application overview without environments', async () => {
setupApi({
environments: [],
featureCount: 0,
projects: ['default'],
});
render(
<Routes>
<Route
path={'/applications/:name'}
element={<ApplicationOverview />}
/>
</Routes>,
{
route: '/applications/my-app',
},
);
await screen.findByText('my-app');
await screen.findByText('No data available.');
});

65
frontend/src/component/application/ApplicationOverview.tsx
View File

@ -202,7 +202,10 @@ export const ApplicationOverview = () => {
<StyledEnvironmentsContainer ref={elementRef}>
{data.environments.map((environment) => (
<ArcherElement id={environment.name}>
<ArcherElement
id={environment.name}
key={environment.name}
>
<StyledEnvironmentBox
mode={mode}
key={environment.name}
@ -212,32 +215,40 @@ export const ApplicationOverview = () => {
</EnvironmentHeader>
<StyledTable>
<tr>
<StyledCell>
Instances:
</StyledCell>
<StyledCell>
{environment.instanceCount}
</StyledCell>
</tr>
<tr>
<StyledCell>SDK:</StyledCell>
<StyledCell>
{environment.sdks.map(
(sdk) => (
<div>{sdk}</div>
),
)}
</StyledCell>
</tr>
<tr>
<StyledCell>
Last seen:
</StyledCell>
<StyledCell>
{environment.lastSeen}
</StyledCell>
</tr>
<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>