feat: 분기로직

src/feature/photo-entry/components/ScreenPhotoShareEntry.tsx

@@ -6,9 +6,10 @@ import CheckNoImgModal from '@/feature/upload/components/CheckNoImgModal';
 import CustomHeader from '@/global/components/header/CustomHeader';
 import LongButton from '@/global/components/LongButton';
 import BubbleTooltip from '@/global/components/tooltip/BubbleTooltip';
+import { useABTestGroup } from '@/global/hooks/useABTestGroup';
 import { useQueryClient } from '@tanstack/react-query';
 import { useRouter, useSearchParams } from 'next/navigation';
-import { useEffect, useRef } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import AlbumSharePreviewSection from './AlbumSharePreviewSection';
 
 interface ScreenPhotoShareEntryProps {
@@ -25,12 +26,56 @@ export default function ScreenPhotoShareEntry({
 
   const { mutateAsync } = useAlbumEnterMutation();
   const { data } = useGetAlbumAvailableCount(albumId);
+  const abGroup = useABTestGroup();
 
+  // A/B 그룹의 실시간 반응과 예외 방지를 위한 로컬 상태
+  const [activeGroup, setActiveGroup] = useState<'A' | 'B' | null>(null);
+
+  // 쿠키에서 ab_test_group을 직접 가져오는 헬퍼 함수
+  const getCookieGroup = (): 'A' | 'B' | null => {
+    if (typeof document === 'undefined') return null;
+    const match = document.cookie.match(/(^| )ab_test_group=([^;]+)/);
+    return match ? (match[2] as 'A' | 'B') : null;
+  };
+
+  // 1. 초기 마운트 및 abGroup 훅 업데이트 시 로컬 상태와 동기화
   useEffect(() => {
-    if (!isInvite) return;
+    const currentCookie = getCookieGroup();
+    if (currentCookie) {
+      setActiveGroup(currentCookie);
+    } else if (abGroup) {
+      setActiveGroup(abGroup);
+    } else {
+      // 마운트 되었으나 쿠키도 훅도 null인 경우, 화면 갇힘 방지를 위해 기본 'A' 그룹으로 즉시 세팅
+      setActiveGroup('A');
+    }
+  }, [abGroup]);
 
-    mutateAsync({ albumId });
-  }, []);
+  // 2. 가입 처리 및 그룹에 따른 리다이렉트 실행
+  useEffect(() => {
+    if (!isInvite) {
+      if (activeGroup === 'B') {
+        router.replace(`/album/detail/${albumId}`);
+      }
+      return;
+    }
+
+    // 초대 유입의 경우 앨범 진입(enter) 완료 후 최종 쿠키 기준으로 B그룹 여부 판단
+    mutateAsync({ albumId })
+      .then(() => {
+        const finalGroup = getCookieGroup() || activeGroup || 'A';
+        if (finalGroup === 'B') {
+          router.replace(`/album/detail/${albumId}`);
+        } else {
+          setActiveGroup('A');
+        }
+      })
+      .catch((err) => {
+        console.error('초대 수락 및 앨범 진입 실패:', err);
+        // 에러 발생 시에도 빈 화면에 갇히지 않도록 기본 A그룹 화면을 띄워줌
+        setActiveGroup('A');
+      });
+  }, [isInvite, activeGroup, albumId, router, mutateAsync]);
 
   const handleUpload = () => {
     fileInputRef.current?.click();
@@ -42,6 +87,11 @@ export default function ScreenPhotoShareEntry({
     await handleFileUpload(e, albumId, router, { queryClient });
   };
 
+  // 결정된 activeGroup 기준으로 렌더링 여부 결정
+  if (activeGroup === null || activeGroup === 'B') {
+    return null;
+  }
+
   return (
     <>
       <CustomHeader title='앨범 채우기' />