components LayerVisibilityToggle.tsx

33.33% Statements 1/3

0% Branches 0/3

0% Functions 0/2

33.33% Lines 1/3

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
32
33  
 
 
 
 
 
 
 
 
 
1x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import { Eye as EyeIcon, EyeOff as EyeOffIcon } from 'lucide-react';
import React from 'react';
import { UI_LABELS } from '@/shared/constants';
 
interface LayerVisibilityToggleProps {
	layerId: string;
	isVisible: boolean;
	onToggle: (id: string, visible: boolean) => void;
}
 
export const LayerVisibilityToggle = React.memo(function LayerVisibilityToggle({
	layerId,
	isVisible,
	onToggle,
}: LayerVisibilityToggleProps) {
	return (
		<button
			onClick={(mouseEvent) => {
				mouseEvent.stopPropagation();
				onToggle(layerId, isVisible);
			}}
			className="w-8 h-8 flex items-center justify-center rounded hover:bg-gray-100"
			aria-label={isVisible ? UI_LABELS.LAYER_HIDE : UI_LABELS.LAYER_SHOW}
		>
			{isVisible ? (
				<EyeIcon className="w-4 h-4" />
			) : (
				<EyeOffIcon className="w-4 h-4" />
			)}
		</button>
	);
});