fix: cursor information show block name instead of texture name

src/components/canvas/information/Cursor.tsx

@@ -1,6 +1,9 @@
 import { CanvasContext } from "@/context/Canvas";
 import { useContext, useEffect, useState } from "react";
 
+import _blockData from "@/data/blocks/data.json";
+const blockData: BlockData = _blockData;
+
 interface Props {
 	mouseCoords: Position;
 }
@@ -11,6 +14,8 @@ function CursorInformation({ mouseCoords }: Props) {
 	const [position, setPosition] = useState<Position>({ x: 0, y: 0 });
 	const [block, setBlock] = useState<Block>();
 
+	const [blockName, setBlockName] = useState("");
+
 	useEffect(() => {
 		setPosition({
 			x: mouseCoords.x,
@@ -20,9 +25,17 @@ function CursorInformation({ mouseCoords }: Props) {
 		setBlock(blocks.find((b) => b.x === mouseCoords.x && b.y === mouseCoords.y));
 	}, [mouseCoords]);
 
+	useEffect(() => {
+		if (!block) {
+			setBlockName("Air");
+			return;
+		}
+		setBlockName(blockData[block.name].name);
+	}, [block]);
+
 	return (
 		<div className="absolute left-4 bottom-4 flex flex-col gap-1">
-			<div className="info-child">{block?.name ?? "air"}</div>
+			<div className="info-child">{blockName ?? "air"}</div>
 			<div className="info-child">
 				<span>X: {position.x} </span>
 				<span>Y: {position.y}</span>

src/types.d.ts

@@ -31,3 +31,4 @@ interface Settings {
 interface DialogProps {
 	close: () => void;
 }
+