gymnastjs/gymnast

View on GitHub
src/useGrid/index.tsx

Summary

Maintainability
A
2 hrs
Test Coverage
import * as React from 'react'
import { compact } from 'lodash'
import { combineSpacing, getValues, getValue } from '../utils'
import { GridProps } from '../types'
import { styles, getCol } from './grid.styles'
import useResolution from '../useResolution'
import Context from '../gymnastProvider/context'
 
const resolutionProperties = [
'align',
'direction',
'justify',
'margin',
'marginBottom',
'marginLeft',
'marginRight',
'marginTop',
'padding',
'paddingBottom',
'paddingLeft',
'paddingRight',
'paddingTop',
'size',
]
 
Function `useGrid` has 66 lines of code (exceeds 25 allowed). Consider refactoring.
export default function useGrid<A extends {}>(
props: GridProps & A
): [
boolean,
A & { className: string | undefined; style: React.CSSProperties }
] {
const [
shouldRender,
{
align,
base,
className,
direction,
justify,
margin,
marginBottom,
marginLeft,
marginRight,
marginTop,
padding,
paddingBottom,
paddingLeft,
paddingRight,
paddingTop,
size,
style,
...restProps
},
] = useResolution(resolutionProperties, props)
 
const context = React.useContext(Context)
 
if (!shouldRender) {
return [false, { style: {}, className, ...(restProps as any) }]
}
const {
gutter,
verticalGutter,
base: contextBase,
spacingAliases,
} = getValues(context, props)
 
const spacing = combineSpacing({
spacingProps: {
margin,
padding,
marginTop,
marginRight,
marginBottom,
marginLeft,
paddingTop,
paddingRight,
paddingBottom,
paddingLeft,
},
base: contextBase,
spacingAliases,
gutter,
verticalGutter,
})
 
return [
true,
{
style: { ...style, ...spacing },
className: compact([
styles.grid,
getCol(size, getValue(context, 'columns')),
className,
align && styles[`${align}Align`],
justify && styles[`${justify}Justify`],
direction && styles[`${direction}Direction`],
]).join(' '),
...(restProps as any),
},
]
}