All files / src/entities/line/ui LineFloatingPalette.tsx

100% Statements 5/5
100% Branches 0/0
100% Functions 3/3
100% Lines 5/5

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                2x 7x 7x                   1x 2x          
import React from 'react';
import { useAppDispatch, useAppSelector } from '@/store/hooks';
import { setLineColor, setLineThickness } from '@/entities/line/model/slice';
import { TOOL_COLORS, TOOL_SIZES } from '@/shared/constants/toolPresets';
import { ToolFloatingPalette } from '@/widgets/toolbar/ui';
import { selectLineState } from '@/entities/line/model';
import { UI_LABELS } from '@/shared/constants';
 
export const LineFloatingPalette = React.memo(function LineFloatingPalette() {
	const dispatch = useAppDispatch();
	const { color, thickness } = useAppSelector(selectLineState);
 
	return (
		<ToolFloatingPalette
			title={UI_LABELS.LINE_TOOL}
			subtitle={UI_LABELS.LINE_TOOL_SUB}
			values={TOOL_SIZES}
			colors={TOOL_COLORS}
			selectedValue={thickness}
			selectedColor={color}
			onValueChange={(v) => dispatch(setLineThickness(v))}
			onColorChange={(c) => dispatch(setLineColor(c))}
			position="bottom-19"
		/>
	);
});