1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-05-08 01:15:49 +02:00

fix: grids needs containers and items

This commit is contained in:
Christopher Kolstad 2021-10-15 12:26:50 +02:00
parent 3f7e43c599
commit e9a63197cf
2 changed files with 12 additions and 11 deletions

View File

@ -27,18 +27,20 @@ const EnvironmentMetricComponent: React.FC = () => {
const metricComponents = featureMetrics.map(metric => { const metricComponents = featureMetrics.map(metric => {
return ( return (
<Grid item sm={6}> <Grid item sm={4}>
<FeatureEnvironmentMetrics key={metric.environment} metric={metric} /> <FeatureEnvironmentMetrics key={metric.environment} metric={metric} />
</Grid>) </Grid>)
}) })
return ( return (
<> <>
<Grid sm={12} data-loading> <Grid container data-loading spacing={1}>
<Grid item xs={12}>
<h2>{'Environments'}</h2> <h2>{'Environments'}</h2>
<hr /> <hr />
</Grid>
{metricComponents} {metricComponents}
</Grid> </Grid>
<Grid sm={12} data-loading> <Grid container data-loading>
<h2>Applications</h2> <h2>Applications</h2>
<hr /> <hr />
<FeatureSeenApplications /> <FeatureSeenApplications />

View File

@ -1,7 +1,7 @@
import useFeatureMetrics from '../../../../hooks/api/getters/useFeatureMetrics/useFeatureMetrics'; import useFeatureMetrics from '../../../../hooks/api/getters/useFeatureMetrics/useFeatureMetrics';
import { Link, useParams } from 'react-router-dom'; import { Link, useParams } from 'react-router-dom';
import { IFeatureViewParams } from '../../../../interfaces/params'; import { IFeatureViewParams } from '../../../../interfaces/params';
import { Grid, List, ListItem, ListItemText } from '@material-ui/core'; import { Grid } from '@material-ui/core';
import React from 'react'; import React from 'react';
import { useStyles } from './FeatureSeenApplications.styles'; import { useStyles } from './FeatureSeenApplications.styles';
@ -12,7 +12,7 @@ const FeatureSeenApplications: React.FC = () => {
let seenApplications; let seenApplications;
if (metrics?.seenApplications?.length > 0) { if (metrics?.seenApplications?.length > 0) {
seenApplications = metrics.seenApplications.map(appName => { seenApplications = metrics.seenApplications.map(appName => {
return (<ListItem><ListItemText primary={ return (<Grid item xs={4}>
<Link <Link
to={`/applications/${appName}`} to={`/applications/${appName}`}
className={[ className={[
@ -22,17 +22,16 @@ const FeatureSeenApplications: React.FC = () => {
> >
{appName} {appName}
</Link> </Link>
} /></ListItem>) </Grid>)
}); });
} else { } else {
seenApplications = (<ListItem><ListItemText primary={'Not seen in any applications'} /></ListItem>); seenApplications = (<Grid item xs={12}><div>{'Not seen in any applications'}</div></Grid>);
} }
return ( return (
<Grid sm={12}> <Grid container spacing={1}>
<List> <hr />
{seenApplications} {seenApplications}
</List>
</Grid> </Grid>
); );
} }