onShow/onCloseAnimationEndをrefパターンに変更し不要なエフェクト再実行を防止

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: TinyKitten

src/components/CustomModal.tsx

@@ -52,6 +52,8 @@ export const CustomModal: React.FC<Props> = ({
 }) => {
   const [isMounted, setIsMounted] = useState(visible);
   const opacity = useRef(new Animated.Value(visible ? 1 : 0)).current;
+  const onShowRef = useRef(onShow);
+  const onCloseAnimationEndRef = useRef(onCloseAnimationEnd);
   const isLEDTheme = useAtomValue(isLEDThemeAtom);
   const animatedBackdropStyle = {
     opacity,
@@ -68,6 +70,14 @@ export const CustomModal: React.FC<Props> = ({
     ],
   };
 
+  useEffect(() => {
+    onShowRef.current = onShow;
+  }, [onShow]);
+
+  useEffect(() => {
+    onCloseAnimationEndRef.current = onCloseAnimationEnd;
+  }, [onCloseAnimationEnd]);
+
   useEffect(() => {
     if (visible) {
       setIsMounted(true);
@@ -77,7 +87,7 @@ export const CustomModal: React.FC<Props> = ({
         useNativeDriver: true,
       }).start(({ finished }) => {
         if (finished) {
-          onShow?.();
+          onShowRef.current?.();
         }
       });
       return;
@@ -90,10 +100,10 @@ export const CustomModal: React.FC<Props> = ({
     }).start(({ finished }) => {
       if (finished && !visible) {
         setIsMounted(false);
-        onCloseAnimationEnd?.();
+        onCloseAnimationEndRef.current?.();
       }
     });
-  }, [animationDuration, opacity, visible, onCloseAnimationEnd, onShow]);
+  }, [animationDuration, opacity, visible]);
 
   const handleBackdropPress = () => {
     Keyboard.dismiss();