35 lines
992 B
TypeScript
35 lines
992 B
TypeScript
import { useCallback } from 'react';
|
|
import styled from '@emotion/styled';
|
|
import { useSetRecoilState } from 'recoil';
|
|
|
|
import { Checkbox } from '@/ui/input/checkbox/components/Checkbox';
|
|
|
|
import { useCurrentRowSelected } from '../hooks/useCurrentRowSelected';
|
|
import { actionBarOpenState } from '../states/ActionBarIsOpenState';
|
|
|
|
const StyledContainer = styled.div`
|
|
align-items: center;
|
|
cursor: pointer;
|
|
|
|
display: flex;
|
|
height: 32px;
|
|
|
|
justify-content: center;
|
|
`;
|
|
|
|
export function CheckboxCell() {
|
|
const setActionBarOpenState = useSetRecoilState(actionBarOpenState);
|
|
const { currentRowSelected, setCurrentRowSelected } = useCurrentRowSelected();
|
|
|
|
const handleClick = useCallback(() => {
|
|
setCurrentRowSelected(!currentRowSelected);
|
|
setActionBarOpenState(true);
|
|
}, [currentRowSelected, setActionBarOpenState, setCurrentRowSelected]);
|
|
|
|
return (
|
|
<StyledContainer onClick={handleClick}>
|
|
<Checkbox checked={currentRowSelected} />
|
|
</StyledContainer>
|
|
);
|
|
}
|