/** 상태막대 — AutoCAD 하단 제도 보조 토글 */
import type { FC } from 'react';
import {
	getAngleStep,
	getGridEnabled,
	getSnapEnabled,
	getSnapTrackingEnabled,
	setAngleStep,
	setGridEnabled,
	setSnapEnabled,
	setSnapTrackingEnabled,
} from '../state';

interface StatusBarProps {
	commandLineVisible: boolean;
	onToggleCommandLine: () => void;
}

export const StatusBar: FC<StatusBarProps> = ({ commandLineVisible, onToggleCommandLine }) => {
	const snap = getSnapEnabled();
	const grid = getGridEnabled();
	const ortho = getAngleStep() === 90;
	const polar = getAngleStep() === 45;
	const snapTracking = getSnapTrackingEnabled();

	return (
		<footer className="cad-statusbar controls">
			<button
				type="button"
				data-active={snap}
				title="객체 스냅 (OSNAP)"
				onClick={() => setSnapEnabled(!snap)}
			>
				객체 스냅
			</button>
			<button
				type="button"
				data-active={ortho}
				title="직교 모드 (F8) — 90° 간격 각도 가이드"
				onClick={() => setAngleStep(ortho ? 0 : 90)}
			>
				직교
			</button>
			<button
				type="button"
				data-active={polar}
				title="극좌표 추적 (F10) — 45° 간격 각도 가이드"
				onClick={() => setAngleStep(polar ? 0 : 45)}
			>
				극좌표 추적
			</button>
			<button
				type="button"
				data-active={snapTracking}
				title="객체 스냅 추적 — 스냅점에 잠시 머물면 그 점에서 정렬선이 뻗는다"
				onClick={() => setSnapTrackingEnabled(!snapTracking)}
			>
				스냅 추적
			</button>
			<button
				type="button"
				data-active={grid}
				title="그리드 표시"
				onClick={() => setGridEnabled(!grid)}
			>
				그리드
			</button>
			<button
				type="button"
				data-active={commandLineVisible}
				title="명령행 표시/숨기기"
				onClick={onToggleCommandLine}
			>
				명령행
			</button>
			<span className="cad-statusbar__hint">휠: 줌 · 휠 드래그: 초점이동 · Esc: 취소</span>
		</footer>
	);
};