Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-09-24 17:51:14 +02:00
Code Issues Projects Releases Wiki Activity

refactor: simplify ItemContainer styling by removing borders prop

Browse Source
This commit is contained in:
Tymoteusz Czech 2025-09-05 12:04:57 +02:00
parent 08988f7d7d
commit e156f1e486
No known key found for this signature in database
GPG Key ID: 133555230D88D75F
1 changed files with 4 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
frontend/src/component/impact-metrics/GridLayoutWrapper.tsx
View File

@ -53,10 +53,8 @@ type GridLayoutWrapperProps = {
borders?: boolean; borders?: boolean;
}; };
const ItemContainer = styled('div', { const ItemContainer = styled('div')(({ theme }) => ({
shouldForwardProp: (prop) => prop !== 'borders', border: `1px solid ${theme.palette.divider}`,
})<{ borders: boolean }>(({ theme, borders }) => ({
...(borders && { border: `1px solid ${theme.palette.divider}` }),
})); }));
export const GridLayoutWrapper: FC<GridLayoutWrapperProps> = ({ export const GridLayoutWrapper: FC<GridLayoutWrapperProps> = ({
@ -64,7 +62,6 @@ export const GridLayoutWrapper: FC<GridLayoutWrapperProps> = ({
onLayoutChange, onLayoutChange,
cols = { lg: 12, md: 12, sm: 6, xs: 4, xxs: 2 }, cols = { lg: 12, md: 12, sm: 6, xs: 4, xxs: 2 },
rowHeight = 180, rowHeight = 180,
borders = false,
}) => { }) => {
const theme = useTheme(); const theme = useTheme();
const isMobileBreakpoint = useMediaQuery(theme.breakpoints.down('md')); const isMobileBreakpoint = useMediaQuery(theme.breakpoints.down('md'));
@ -112,11 +109,9 @@ export const GridLayoutWrapper: FC<GridLayoutWrapperProps> = ({
const children = useMemo( const children = useMemo(
() => () =>
items.map((item) => ( items.map((item) => (
<ItemContainer key={item.id} borders={borders}> <ItemContainer key={item.id}>{item.component}</ItemContainer>
{item.component}
</ItemContainer>
)), )),
[items, borders], [items],
); );
const handleLayoutChange = useCallback( const handleLayoutChange = useCallback(