🚀 Auto-deploy: melhoria no snap e medição AR em 30/05/2026 14:52:07

src/pages/Index.tsx

@@ -1,6 +1,7 @@
 import { useEffect, useRef, useCallback, useState } from 'react';
 import { useNavigate } from 'react-router-dom';
-import { Upload, Glasses, CheckCircle, XCircle, Loader2, Box, Package, Users } from 'lucide-react';
+import { Upload, Glasses, CheckCircle, XCircle, Loader2, Box, Package, Users, Info } from 'lucide-react';
+import { LandingContent } from '@/components/LandingContent';
 import { Button } from '@/components/ui/button';
 import { useModelStore } from '@/stores/useModelStore';
 import { toast } from 'sonner';
@@ -20,6 +21,7 @@ const Index = () => {
   const fileInputRef = useRef<HTMLInputElement>(null);
   const [loadingDemoIFC, setLoadingDemoIFC] = useState(false);
   const [loadingDemoCotovelo, setLoadingDemoCotovelo] = useState(false);
+  const [showLanding, setShowLanding] = useState(false);
   
   const [converting, setConverting] = useState(false);
   const { model, addModel, models, maxModels, xrSupported, setXrSupported } = useModelStore();
@@ -209,18 +211,23 @@ const Index = () => {
 
 
       {/* Logo area */}
-      <div className="mb-12 text-center">
+      <div className="mb-8 text-center">
         <div className="mb-4 flex items-center justify-center gap-3">
           <Box className="h-10 w-10 text-primary" />
           <h1 className="text-3xl font-bold tracking-tight text-foreground md:text-4xl">
             TrackSteel<span className="text-primary">XR</span>
           </h1>
+          <Button variant="ghost" size="icon" className="ml-2" onClick={() => setShowLanding(!showLanding)} title="Sobre">
+            <Info className="h-5 w-5" />
+          </Button>
         </div>
         <p className="font-mono text-sm uppercase tracking-widest text-muted-foreground">
           Inspeção de Qualidade Industrial
         </p>
       </div>
 
+      {showLanding && <LandingContent />}
+
       {/* Main card */}
       <div className="w-full max-w-md space-y-4">
         {/* Import button */}

src/pages/MeetingRoom.tsx

@@ -531,6 +531,7 @@ function HologramModel({ model, presentationState, isPresenter, onPresentationCh
   const { scene } = useGLTF(model.url);
   const clone = useMemo(() => scene.clone(), [scene]);
   const presentationGroupRef = useRef<THREE.Group>(null);
+  const [presenterGroup, setPresenterGroup] = useState<THREE.Group | null>(null);
   const baseScaleRef = useRef<number>(1);
   const centerRef = useRef<THREE.Vector3>(new THREE.Vector3());
   const [isDragging, setIsDragging] = useState(false);
@@ -590,13 +591,14 @@ function HologramModel({ model, presentationState, isPresenter, onPresentationCh
 
   // Aplica transformações de Rotação e Escala compartilhadas no grupo externo de apresentação
   useFrame(() => {
-    if (presentationGroupRef.current && presentationState && !isDragging) {
+    const targetGroup = presentationGroupRef.current || presenterGroup;
+    if (targetGroup && presentationState && !isDragging) {
       const { rotation, scale } = presentationState;
       if (rotation) {
-        presentationGroupRef.current.rotation.set(rotation[0], rotation[1], rotation[2]);
+        targetGroup.rotation.set(rotation[0], rotation[1], rotation[2]);
       }
       if (scale) {
-        presentationGroupRef.current.scale.setScalar(baseScaleRef.current * scale);
+        targetGroup.scale.setScalar(baseScaleRef.current * scale);
       }
     }
   });
@@ -666,20 +668,20 @@ function HologramModel({ model, presentationState, isPresenter, onPresentationCh
 
   return (
     <>
-      {isPresenter && (
+      {isPresenter && presenterGroup && (
         <TransformControls
-          object={presentationGroupRef}
+          object={presenterGroup}
           mode="rotate"
           size={0.6}
           onMouseDown={() => setIsDragging(true)}
           onMouseUp={() => setIsDragging(false)}
           onChange={() => {
-            if (isDragging && presentationGroupRef.current) {
+            if (isDragging && presenterGroup) {
                onPresentationChange({
                  rotation: [
-                   presentationGroupRef.current.rotation.x,
-                   presentationGroupRef.current.rotation.y,
-                   presentationGroupRef.current.rotation.z
+                   presenterGroup.rotation.x,
+                   presenterGroup.rotation.y,
+                   presenterGroup.rotation.z
                  ]
                });
             }
@@ -687,7 +689,11 @@ function HologramModel({ model, presentationState, isPresenter, onPresentationCh
         />
       )}
       {/* Grupo Externo de Apresentação Compartilhada */}
-      <group ref={presentationGroupRef}>
+      <group ref={(node) => {
+        // @ts-ignore
+        presentationGroupRef.current = node;
+        setPresenterGroup(node);
+      }}>
         {/* Ignoramos fineTuning.posX/Y/Z para ancorar perfeitamente à mesa */}
         <group>
           {/* Grupo de Rotação Fina e Escala Fina */}