added : info panel

src/App.js

@@ -3,7 +3,7 @@ import { OrbitControls } from "@react-three/drei";
 import { Canvas } from "@react-three/fiber";
 import { Suspense } from "react";
 import { LinearToneMapping } from "three";
-import { Scene } from "./components";
+import { InfoPanel, Scene } from "./components";
 
 function App() {
   return (
@@ -29,6 +29,7 @@ function App() {
           <OrbitControls />
         </Suspense>
       </Canvas>
+      <InfoPanel />
     </div>
   );
 }

src/components/InfoPanel.jsx

@@ -0,0 +1,19 @@
+import React from "react";
+
+export const InfoPanel = () => {
+  return (
+    <div
+      style={{
+        position: "absolute",
+        zIndex: "1000",
+        top: 0,
+        left: 0,
+        fontFamily: "sans-serif",
+        padding: "10px",
+        width: "200px",
+      }}
+    >
+      Use panel on right top corner to customize the Lego Bricks Properties
+    </div>
+  );
+};

src/components/index.js

@@ -4,3 +4,4 @@ export * from "./Brick";
 export * from "./BrickCursor";
 export * from "./Lights";
 export * from "./Workspace";
+export * from "./InfoPanel";