visualizacao do exame fisico

frontend/src/routes/PhysicalExamPage.tsx

@@ -5,7 +5,7 @@ import { Scene } from "../components/viewer/Scene.js";
 import { ExamMarkers } from "../components/viewer/ExamMarkers.js";
 import { LayerToggle } from "../components/LayerToggle.js";
 import { QuickRegionNav } from "../components/QuickRegionNav.js";
-import { EXAM_POINTS, TECHNIQUES, type ExamTechnique } from "../data/physicalExam.js";
+import { EXAM_POINTS, TECHNIQUES, type ExamTechnique, type ExamSide } from "../data/physicalExam.js";
 
 // Módulo de estudo pro exame físico, sobre o corpo 3D REAL do Z-Anatomy
 // (mesmo visualizador do Atlas — camadas, navegação por região, câmera
@@ -17,9 +17,15 @@ import { EXAM_POINTS, TECHNIQUES, type ExamTechnique } from "../data/physicalExa
 // ExamMarkers.tsx) mesmo que o usuário não tenha marcado essa camada —
 // por isso é sempre buscado/carregado aqui, independente do toggle.
 const ALWAYS_LOAD = ["esqueletico"];
+// Visualmente, um corpo com a pele/regiões de superfície faz muito mais
+// sentido pra exame físico do que o esqueleto nu (é na pele que se
+// ausculta/palpa/percute) — esse é o layer mostrado por padrão ao entrar
+// nesta página; o usuário pode trocar/adicionar outras camadas no painel.
+const DEFAULT_VISIBLE = ["regioes"];
 
 export default function PhysicalExamPage() {
   const visibleSystems = useAtlasStore((s) => s.visibleSystems);
+  const setVisibleSystems = useAtlasStore((s) => s.setVisibleSystems);
   const fetchSystems = useMemo(
     () => new Set([...visibleSystems, ...ALWAYS_LOAD]),
     [visibleSystems],
@@ -31,9 +37,13 @@ export default function PhysicalExamPage() {
     () => new Set(TECHNIQUES.map((t) => t.key)),
   );
   const [selectedId, setSelectedId] = useState<string | null>(null);
+  const [viewSide, setViewSide] = useState<ExamSide>("anterior");
   const [leftOpen, setLeftOpen] = useState(false);
   const [rightOpen, setRightOpen] = useState(false);
 
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  useEffect(() => setVisibleSystems(DEFAULT_VISIBLE), []);
+
   useEffect(() => {
     if (selectedStructureId) {
       setRightOpen(true);
@@ -95,9 +105,10 @@ export default function PhysicalExamPage() {
         </div>
 
         <p className="text-[11px] text-slate-500 mt-4 leading-relaxed">
-          Ligue uma camada (ex: Esquelético) como referência, marque as
-          técnicas que quer estudar e clique nos pontos coloridos sobre o
-          corpo. Use o menu de regiões pra focar rápido numa parte do corpo.
+          Marque as técnicas que quer estudar e clique nos pontos coloridos
+          sobre o corpo. Use o menu de regiões pra focar rápido numa parte
+          do corpo, e gire o modelo pra ver os pontos da frente ou de trás
+          — só aparecem os do lado que você está olhando.
         </p>
       </aside>
 
@@ -113,13 +124,22 @@ export default function PhysicalExamPage() {
 
       <div className="relative h-full min-h-0">
         <Scene bySlug={bySlug} alwaysLoadSystems={ALWAYS_LOAD}>
-          <ExamMarkers points={visiblePoints} selectedId={selectedId} onSelect={(id) => {
-            setSelectedId(id);
-            setRightOpen(true);
-          }} />
+          <ExamMarkers
+            points={visiblePoints}
+            selectedId={selectedId}
+            onSelect={(id) => {
+              setSelectedId(id);
+              setRightOpen(true);
+            }}
+            onSideChange={setViewSide}
+          />
         </Scene>
         <QuickRegionNav />
 
+        <div className="absolute bottom-3 left-3 z-10 bg-panel/90 border border-white/10 rounded-lg px-3 py-1.5 text-xs text-slate-300 shadow-lg">
+          Vista: <span className="font-semibold text-white">{viewSide === "anterior" ? "Anterior" : "Posterior"}</span>
+        </div>
+
         <button
           onClick={() => setLeftOpen(true)}
           className="md:hidden absolute top-3 left-3 z-10 bg-panel/90 border border-white/10 rounded-lg px-3 py-2 text-xs shadow-lg"