diff --git a/frontend/src/component/feature/FeatureView/FeatureMetrics/FeatureImpactMetrics.tsx b/frontend/src/component/feature/FeatureView/FeatureMetrics/FeatureImpactMetrics.tsx
index ef5ee5b45c..07b70ff89f 100644
--- a/frontend/src/component/feature/FeatureView/FeatureMetrics/FeatureImpactMetrics.tsx
+++ b/frontend/src/component/feature/FeatureView/FeatureMetrics/FeatureImpactMetrics.tsx
@@ -1,6 +1,6 @@
import { PageContent } from 'component/common/PageContent/PageContent.tsx';
import { PageHeader } from '../../../common/PageHeader/PageHeader.tsx';
-import { styled, Typography } from '@mui/material';
+import { Box, styled, Typography } from '@mui/material';
import Add from '@mui/icons-material/Add';
import { useImpactMetricsMetadata } from 'hooks/api/getters/useImpactMetricsMetadata/useImpactMetricsMetadata.ts';
import { type FC, useMemo, useState } from 'react';
@@ -151,7 +151,9 @@ export const FeatureImpactMetrics: FC = () => {
/>
{impactMetrics.configs.length > 0 && (
-
+ ({ marginTop: theme.spacing(3) })}>
+
+
)}
({
+ border: `1px solid ${theme.palette.divider}`,
+}));
+
export const GridLayoutWrapper: FC = ({
items,
onLayoutChange,
@@ -102,7 +106,10 @@ export const GridLayoutWrapper: FC = ({
}, [items, cols, isMobileBreakpoint]);
const children = useMemo(
- () => items.map((item) => {item.component}
),
+ () =>
+ items.map((item) => (
+ {item.component}
+ )),
[items],
);