diff --git a/src/components/grid/Cell.tsx b/src/components/grid/Cell.tsx index edfcde0..0461527 100644 --- a/src/components/grid/Cell.tsx +++ b/src/components/grid/Cell.tsx @@ -1,4 +1,3 @@ -import { useState, useEffect } from 'react' import { CharStatus } from '../../lib/statuses' import classnames from 'classnames' @@ -8,27 +7,17 @@ type Props = { } export const Cell = ({ value, status }: Props) => { - const [cellAnimation, setCellAnimation] = useState('') - - useEffect(() => { - if (value !== undefined) { - setCellAnimation('cellAnimation') - } - }, [value]) - const classes = classnames( 'w-14 h-14 border-solid border-2 flex items-center justify-center mx-0.5 text-lg font-bold rounded', { 'bg-white border-slate-200': !status, + 'border-black': value && !status, 'bg-slate-400 text-white border-slate-400': status === 'absent', 'bg-green-500 text-white border-green-500': status === 'correct', 'bg-yellow-500 text-white border-yellow-500': status === 'present', + 'cell-animation': !!value, } ) - return ( - <> -