Shape Shape.tsx

68.75% Statements 11/16

50% Branches 1/2

50% Functions 1/2

68.75% Lines 11/16

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31 1x
1x
1x
1x
1x
 
 
 
 
 
 
1x
28800x
28800x
 
28800x
 
 
 
 
 
 
 
 
28800x
 
 
 
 
1x
  import {FC, useRef} from 'react';
import styles from './Shape.module.scss';
import cn from 'clsx';
import {gameToggleShape} from '../../../redux/gameSlice';
import {useDispatch} from 'react-redux';
 
interface Props {
    id: string
    isActive: boolean;
}
 
const Shape: FC<Props> = ({ id, isActive }) => {
    const dispatch = useDispatch();
    const shapeElement = useRef<HTMLDivElement>(null);
 
    const onToggleShape = (): void => {
        const el = shapeElement.current as HTMLDivElement;
        const cellId = el?.id.split('_');
        const row = +cellId[0];
        const col = +cellId[1];
 
        dispatch(gameToggleShape({row, col}));
    };
 
    return (
        <div ref={shapeElement} id={id} className={cn(styles.shape, isActive && styles.isActive, 'shape')} onClick={onToggleShape}></div>
    );
};
 
export default Shape;