Upload components/StarField.jsx with huggingface_hub

components/StarField.jsx

@@ -0,0 +1,51 @@
+import React from 'react';
+import * as THREE from 'three';
+
+const StarField = ({ count = 1000 }) => {
+  const starRef = React.useRef();
+  
+  React.useEffect(() => {
+    const geometry = new THREE.BufferGeometry();
+    const positions = [];
+    const colors = [];
+    
+    const color = new THREE.Color();
+    
+    for (let i = 0; i < count; i++) {
+      // Random position in a large cube
+      const x = (Math.random() - 0.5) * 2000;
+      const y = (Math.random() - 0.5) * 2000;
+      const z = (Math.random() - 0.5) * 2000;
+      
+      positions.push(x, y, z);
+      
+      // Random colors for stars
+      color.setHSL(Math.random(), 0.8, Math.random() * 0.5 + 0.5);
+      colors.push(color.r, color.g, color.b);
+    }
+    
+    geometry.setAttribute('position', new THREE.Float32BufferAttribute(positions, 3));
+    geometry.setAttribute('color', new THREE.Float32BufferAttribute(colors, 3));
+    
+    const material = new THREE.PointsMaterial({
+      size: 2,
+      vertexColors: true,
+      transparent: true,
+      opacity: 0.8,
+    });
+    
+    const stars = new THREE.Points(geometry, material);
+    starRef.current = stars;
+    
+    return () => {
+      if (starRef.current) {
+        starRef.current.geometry.dispose();
+        starRef.current.material.dispose();
+      }
+    };
+  }, [count]);
+  
+  return <primitive ref={starRef} />;
+};
+
+export default StarField;