fix: sync on click inspector

src/components/Armor/components/ShotDisplay.tsx

@@ -4,6 +4,7 @@ import { useFrame } from '@react-three/fiber';
 import { useEffect, useRef } from 'react';
 import { Mesh } from 'three';
 import { radToDeg } from 'three/src/math/MathUtils';
+import { canSplash } from '../../../core/blitz/canSplash';
 import { isExplosive } from '../../../core/blitz/isExplosive';
 import { NaNFallback } from '../../../core/math/NaNFallback';
 import { normalToEuler } from '../../../core/math/normalToEuler';
@@ -42,6 +43,7 @@ export function ShotDisplay() {
   );
   const { shell } = useDuel.getState().antagonist!;
   const explosive = isExplosive(shell.type);
+  const splashing = canSplash(shell.type);
   const midPointLayer = (shot?.layers.findLast(
     (layer) => layer.type !== null && layer.status === 'ricochet',
   ) ?? shot?.layers.findLast((layer) => layer.type !== null)) as ShotLayerBase;
@@ -64,6 +66,18 @@ export function ShotDisplay() {
         return accumulator;
       }, 0) + LENGTH_INFINITY
     : undefined;
+  const preMidPointThickness = shot
+    ? preMidPointLayers!.reduce(
+        (accumulator, layer) =>
+          accumulator +
+          (layer.type === null
+            ? 0
+            : layer.type === ArmorType.External
+              ? layer.thickness
+              : layer.thicknessAngled),
+        0,
+      )
+    : undefined;
   const postMidPointGap = shot
     ? postMidPointLayers!.reduce((accumulator, layer) => {
         if (layer.type === null) return accumulator + layer.distance;
@@ -246,8 +260,9 @@ export function ShotDisplay() {
                         (1 -
                           distanceFromSpacedArmor! / shell.explosionRadius!) -
                         1.1 *
-                          (midPointLayer as ShotLayerNonExternal)
-                            .thicknessAngled,
+                          ((midPointLayer as ShotLayerNonExternal)
+                            .thicknessAngled +
+                            preMidPointThickness!),
                     ),
                   ),
                   0,
@@ -255,7 +270,7 @@ export function ShotDisplay() {
             </Text>
 
             {shot.layers.map((layer, index) => {
-              if (layer.type === null && !explosive) return null;
+              if (layer.type === null && (!explosive || splashing)) return null;
 
               return (
                 <Flex key={index} align="center" gap="2">

src/components/Armor/components/SpacedArmorSceneComponent/index.tsx

@@ -179,7 +179,7 @@ export function SpacedArmorSceneComponent({
                 const distance = (
                   shot.layers.at(-1) as ShotLayerBase
                 ).point.distanceTo(intersections[0].point);
-                if (explosive)
+                if (explosive && !splashing)
                   remainingPenetration -= 0.5 * remainingPenetration * distance;
                 const blocked = remainingPenetration < 0;
 
@@ -205,7 +205,7 @@ export function SpacedArmorSceneComponent({
                   const previousIntersection = intersections[layerIndex - 1];
                   const distance =
                     intersection.distance - previousIntersection.distance;
-                  if (explosive)
+                  if (explosive && !splashing)
                     remainingPenetration -=
                       0.5 * remainingPenetration * distance;
                   const wasted = remainingPenetration < 0;
@@ -216,7 +216,7 @@ export function SpacedArmorSceneComponent({
                     distance,
                   });
 
-                  if (wasted) return;
+                  if (wasted && !splashing) return;
                 }
 
                 if (intersection.object.userData.type === ArmorType.External) {
@@ -233,7 +233,11 @@ export function SpacedArmorSceneComponent({
                     status: blocked ? 'blocked' : 'penetration',
                   });
 
-                  if (blocked) break;
+                  if (splashing) {
+                    remainingPenetration = Math.max(0, remainingPenetration);
+                  } else if (blocked) {
+                    break;
+                  }
                 } else {
                   const type = intersection.object.userData.type;
                   const angle = surfaceNormal.angleTo(shellNormal);