+
{leftSlot}
)}
diff --git a/src/features/report/components/YouTubeAudit.tsx b/src/features/report/components/YouTubeAudit.tsx
index 23a1a83..11aac07 100644
--- a/src/features/report/components/YouTubeAudit.tsx
+++ b/src/features/report/components/YouTubeAudit.tsx
@@ -1,5 +1,5 @@
import { motion } from 'motion/react';
-import { Youtube, Users, Video, Eye, TrendingUp, ExternalLink, ListVideo } from 'lucide-react';
+import { Youtube, Users, Video, Eye, TrendingUp, ExternalLink, Play } from 'lucide-react';
import { SectionWrapper } from './ui/SectionWrapper';
import { EmptyState } from './ui/EmptyState';
import { MetricCard } from './ui/MetricCard';
@@ -125,7 +125,7 @@ export default function YouTubeAudit({ data }: YouTubeAuditProps) {
key={pl}
className="inline-flex items-center gap-1.5 rounded-full bg-rose-50 border border-rose-200 px-3 py-1 text-sm font-medium text-rose-700"
>
-
+
{pl}
))}
diff --git a/src/features/report/hooks/useAnalysisPipeline.ts b/src/features/report/hooks/useAnalysisPipeline.ts
new file mode 100644
index 0000000..ea20eee
--- /dev/null
+++ b/src/features/report/hooks/useAnalysisPipeline.ts
@@ -0,0 +1,309 @@
+import { useState, useEffect, useRef, useCallback } from 'react';
+import { useNavigate, useLocation, useParams } from 'react-router';
+import { useCreateClinic } from '@/shared/api/generated/clinics/clinics';
+import { useStartAnalysis, getAnalysisStatus } from '@/shared/api/generated/analyses/analyses';
+import { getReport } from '@/shared/api/generated/reports/reports';
+
+export type ManualChannels = {
+ instagram?: string;
+ youtube?: string;
+ facebook?: string;
+ naverBlog?: string;
+ gangnamUnni?: string;
+};
+
+export type Phase =
+ | 'resuming'
+ | 'discovering'
+ | 'collecting'
+ | 'generating'
+ | 'planning'
+ | 'complete';
+
+const SESSION_KEYS = {
+ reportId: 'infinith_reportId',
+ clinicId: 'infinith_clinicId',
+ runId: 'infinith_runId',
+ url: 'infinith_url',
+};
+
+function saveSession(data: { reportId: string; clinicId?: string; runId?: string; url?: string }) {
+ sessionStorage.setItem(SESSION_KEYS.reportId, data.reportId);
+ if (data.clinicId) sessionStorage.setItem(SESSION_KEYS.clinicId, data.clinicId);
+ if (data.runId) sessionStorage.setItem(SESSION_KEYS.runId, data.runId);
+ if (data.url) sessionStorage.setItem(SESSION_KEYS.url, data.url);
+}
+
+function loadSession() {
+ return {
+ reportId: sessionStorage.getItem(SESSION_KEYS.reportId),
+ clinicId: sessionStorage.getItem(SESSION_KEYS.clinicId),
+ runId: sessionStorage.getItem(SESSION_KEYS.runId),
+ url: sessionStorage.getItem(SESSION_KEYS.url),
+ };
+}
+
+function clearSession() {
+ Object.values(SESSION_KEYS).forEach((k) => sessionStorage.removeItem(k));
+}
+
+// 백엔드 AnalysisStatus enum: discovering | collecting | analyzing | completed | failed
+// UI Phase 스텝과 매핑
+function phaseFromStatus(s: string): Phase {
+ if (s === 'discovering') return 'collecting';
+ if (s === 'collecting') return 'generating';
+ if (s === 'analyzing') return 'planning';
+ if (s === 'completed') return 'complete';
+ return 'discovering';
+}
+
+function resumePhaseFromStatus(s: string): Phase {
+ if (s === 'discovering') return 'collecting';
+ if (s === 'collecting') return 'generating';
+ if (s === 'analyzing') return 'planning';
+ return 'discovering';
+}
+
+interface UseAnalysisPipelineResult {
+ phase: Phase;
+ error: string | null;
+ errorCode: string | null;
+ errorDomain: string | null;
+ errorDetails: Record
| null;
+ url: string | undefined;
+ sessionUrl: string | null;
+ handleRetry: () => void;
+ handleAbort: () => void;
+}
+
+export function useAnalysisPipeline(): UseAnalysisPipelineResult {
+ const [phase, setPhase] = useState('discovering');
+ const [error, setError] = useState(null);
+ const [errorCode, setErrorCode] = useState(null);
+ const [errorDomain, setErrorDomain] = useState(null);
+ const [errorDetails, setErrorDetails] = useState | null>(null);
+
+ const navigate = useNavigate();
+ const location = useLocation();
+ const { reportId: urlReportId } = useParams<{ reportId?: string }>();
+
+ const locState = (location.state as { url?: string; manualChannels?: ManualChannels }) ?? {};
+ const url = locState.url;
+ const manualChannels = locState.manualChannels;
+
+ const hasStarted = useRef(false);
+ const { mutateAsync: createClinicAsync } = useCreateClinic();
+ const { mutateAsync: startAnalysisAsync } = useStartAnalysis();
+
+ const runPipeline = useCallback(
+ async (
+ startUrl?: string,
+ resumeFrom?: { reportId: string; clinicId?: string; runId?: string; phase: Phase },
+ ) => {
+ try {
+ let reportId = resumeFrom?.reportId || '';
+ let clinicId = resumeFrom?.clinicId;
+ let runId = resumeFrom?.runId;
+
+ // Phase 1: 신규 분석이면 createClinic → startAnalysis
+ if (!resumeFrom?.runId) {
+ if (!startUrl) throw new Error('No URL provided');
+ setPhase('discovering');
+
+ // 1-a) 클리닉 등록
+ const clinicRes = await createClinicAsync({ data: { url: startUrl } });
+ if (clinicRes.status !== 201) throw new Error('병원 등록에 실패했습니다.');
+ clinicId = clinicRes.data.id;
+
+ // 1-b) 분석 시작
+ const startRes = await startAnalysisAsync({
+ data: {
+ clinic_id: clinicId,
+ channels: {
+ youtube: manualChannels?.youtube ?? null,
+ instagram: manualChannels?.instagram ?? null,
+ facebook: manualChannels?.facebook ?? null,
+ naver_blog: manualChannels?.naverBlog ?? null,
+ gangnam_unni: manualChannels?.gangnamUnni ?? null,
+ },
+ },
+ });
+ if (startRes.status !== 202) throw new Error('분석 시작에 실패했습니다.');
+ runId = startRes.data.analysis_run_id;
+ reportId = runId; // 백엔드: analysis_run_id 가 report 조회 키와 동일
+
+ saveSession({ reportId, clinicId, runId, url: startUrl });
+ window.history.replaceState(null, '', `/report/loading/${reportId}`);
+ }
+
+ if (!runId) throw new Error('runId 없음');
+
+ // Phase 2-4: 상태 폴링 (1.5초 간격, 최대 ~3분)
+ const maxAttempts = 120;
+ let attempts = 0;
+ while (attempts < maxAttempts) {
+ attempts++;
+ const statusRes = await getAnalysisStatus(runId);
+ if (statusRes.status !== 200) throw new Error('분석 상태 조회에 실패했습니다.');
+ const statusData = statusRes.data;
+ setPhase(phaseFromStatus(statusData.status));
+ if (statusData.channel_errors && Object.keys(statusData.channel_errors).length > 0) {
+ console.warn('[pipeline] Partial failures:', statusData.channel_errors);
+ }
+ if (statusData.status === 'completed') break;
+ if (statusData.status === 'failed') {
+ throw new Error('파이프라인 실패: failed');
+ }
+ await new Promise((r) => setTimeout(r, 1500));
+ }
+
+ setPhase('complete');
+ clearSession();
+
+ // 최종 리포트 조회 (best effort)
+ const reportRes = await getReport(reportId).catch(() => null);
+ const reportPayload = reportRes && reportRes.status === 200 ? reportRes.data : null;
+ setTimeout(() => {
+ navigate(`/report/${reportId}`, {
+ replace: true,
+ state: reportPayload
+ ? {
+ report: reportPayload,
+ metadata: {
+ url: startUrl,
+ clinicName: '',
+ generatedAt: new Date().toISOString(),
+ },
+ reportId,
+ clinicId,
+ }
+ : undefined,
+ });
+ }, 800);
+ } catch (err) {
+ const msg = err instanceof Error ? err.message : 'An error occurred';
+ setError(msg);
+ if (err && typeof err === 'object' && 'code' in err) {
+ setErrorCode((err as { code?: string }).code || null);
+ }
+ if (err && typeof err === 'object' && 'domain' in err) {
+ setErrorDomain((err as { domain?: string }).domain || null);
+ }
+ }
+ },
+ [navigate, manualChannels, createClinicAsync, startAnalysisAsync],
+ );
+
+ const handleRetry = useCallback(() => {
+ setError(null);
+ setErrorDetails(null);
+ const session = loadSession();
+ if (session.reportId) {
+ runPipeline(undefined, {
+ reportId: session.reportId,
+ clinicId: session.clinicId || undefined,
+ runId: session.runId || undefined,
+ phase,
+ });
+ } else if (url || session.url) {
+ hasStarted.current = false;
+ runPipeline(url || session.url || undefined);
+ }
+ }, [phase, url, runPipeline]);
+
+ const handleAbort = useCallback(() => {
+ clearSession();
+ navigate('/', { replace: true });
+ }, [navigate]);
+
+ useEffect(() => {
+ if (hasStarted.current) return;
+ hasStarted.current = true;
+
+ // 1. URL 파라미터 resume (예: /report/loading/abc-123)
+ if (urlReportId) {
+ setPhase('resuming');
+ const session = loadSession();
+ const runId = session.runId || urlReportId;
+ getAnalysisStatus(runId)
+ .then((res) => {
+ if (res.status !== 200) throw new Error('status fetch failed');
+ const status = res.data;
+ if (status.status === 'completed') {
+ navigate(`/report/${urlReportId}`, { replace: true });
+ return;
+ }
+ if (status.status === 'failed') {
+ setError('Data collection failed. Please retry.');
+ setPhase('collecting');
+ return;
+ }
+ saveSession({
+ reportId: urlReportId,
+ clinicId: session.clinicId || undefined,
+ runId,
+ url: session.url || undefined,
+ });
+ runPipeline(undefined, {
+ reportId: urlReportId,
+ clinicId: session.clinicId || undefined,
+ runId,
+ phase: resumePhaseFromStatus(status.status),
+ });
+ })
+ .catch(() => {
+ setError('Could not resume analysis. Please try again.');
+ });
+ return;
+ }
+
+ // 2. sessionStorage resume
+ const session = loadSession();
+ if (session.reportId && !url) {
+ setPhase('resuming');
+ const runId = session.runId || session.reportId;
+ getAnalysisStatus(runId)
+ .then((res) => {
+ if (res.status !== 200) throw new Error('status fetch failed');
+ const status = res.data;
+ if (status.status === 'completed') {
+ clearSession();
+ navigate(`/report/${session.reportId}`, { replace: true });
+ return;
+ }
+ runPipeline(undefined, {
+ reportId: session.reportId!,
+ clinicId: session.clinicId || undefined,
+ runId,
+ phase: resumePhaseFromStatus(status.status),
+ });
+ })
+ .catch(() => {
+ clearSession();
+ navigate('/', { replace: true });
+ });
+ return;
+ }
+
+ // 3. URL 없이 진입 → 홈으로
+ if (!url) {
+ navigate('/', { replace: true });
+ return;
+ }
+
+ // 4. 신규 분석 시작
+ runPipeline(url);
+ }, [url, urlReportId, navigate, runPipeline]);
+
+ return {
+ phase,
+ error,
+ errorCode,
+ errorDomain,
+ errorDetails,
+ url,
+ sessionUrl: loadSession().url,
+ handleRetry,
+ handleAbort,
+ };
+}
diff --git a/src/features/report/hooks/useReport.ts b/src/features/report/hooks/useReport.ts
index 1127be2..892b54a 100644
--- a/src/features/report/hooks/useReport.ts
+++ b/src/features/report/hooks/useReport.ts
@@ -40,6 +40,8 @@ interface UseReportResult {
isEnriched: boolean;
/** DB 또는 API 메타데이터에서 복원한 정규화된 소셜 핸들 */
socialHandles: Record | null;
+ /** DB row의 clinic_id (FK). 게스트 페이지에서 워크스페이스 점프 버튼 노출에 사용 */
+ clinicId: string | null;
}
interface LocationState {
@@ -61,6 +63,7 @@ export function useReport(id: string | undefined): UseReportResult {
const [error, setError] = useState(null);
const [isEnriched, setIsEnriched] = useState(false);
const [socialHandles, setSocialHandles] = useState | null>(null);
+ const [clinicId, setClinicId] = useState(null);
const location = useLocation();
useEffect(() => {
@@ -69,11 +72,13 @@ export function useReport(id: string | undefined): UseReportResult {
setData(DEMO_REPORTS[id]);
setIsEnriched(true);
setSocialHandles(DEMO_HANDLES[id] ?? null);
+ setClinicId(null); // 데모는 워크스페이스 연결 없음
setIsLoading(false);
return;
}
const state = location.state as LocationState | undefined;
+ const stateClinicId = (state as Record | undefined)?.clinicId as string | undefined;
// Source 1: 네비게이션 state로 전달된 리포트 데이터 (AnalysisLoadingPage에서)
if (state?.report && state?.metadata) {
@@ -84,6 +89,7 @@ export function useReport(id: string | undefined): UseReportResult {
state.report,
state.metadata,
);
+ setClinicId(stateClinicId ?? null);
// V2 파이프라인: 리포트에 Phase 2의 channelEnrichment 이미 포함됨
const enrichment = state.report.channelEnrichment as EnrichmentData | undefined;
if (enrichment) {
@@ -112,6 +118,7 @@ export function useReport(id: string | undefined): UseReportResult {
}
const row = res.data as unknown as Record;
const reportJson = (row.report as Record) || row;
+ setClinicId((row.clinic_id as string) || stateClinicId || null);
// V2 파이프라인: 리포트가 비어있지만 status가 'complete'가 아니면 메시지 표시
if (!reportJson || Object.keys(reportJson).length === 0 || reportJson.parseError) {
@@ -191,5 +198,5 @@ export function useReport(id: string | undefined): UseReportResult {
setIsLoading(false);
}, [id, location.state]);
- return { data, isLoading, error, isEnriched, socialHandles };
+ return { data, isLoading, error, isEnriched, socialHandles, clinicId };
}
diff --git a/src/features/report/hooks/useReportPageData.ts b/src/features/report/hooks/useReportPageData.ts
index 50ee8d7..c197804 100644
--- a/src/features/report/hooks/useReportPageData.ts
+++ b/src/features/report/hooks/useReportPageData.ts
@@ -15,6 +15,8 @@ interface UseReportPageDataResult {
isLoading: boolean;
error: string | null;
enrichStatus: ReturnType['status'];
+ /** DB row 의 clinic_id — 게스트 페이지에서 워크스페이스 점프 버튼 노출에 사용 */
+ clinicId: string | null;
}
export function useReportPageData(id: string | undefined): UseReportPageDataResult {
@@ -25,6 +27,7 @@ export function useReportPageData(id: string | undefined): UseReportPageDataResu
error,
isEnriched,
socialHandles: dbSocialHandles,
+ clinicId,
} = useReport(id);
const enrichmentParams = useMemo(() => {
@@ -62,5 +65,6 @@ export function useReportPageData(id: string | undefined): UseReportPageDataResu
isLoading,
error,
enrichStatus,
+ clinicId,
};
}
diff --git a/src/features/report/pages/AnalysisLoadingPage.tsx b/src/features/report/pages/AnalysisLoadingPage.tsx
index bed8631..1063e24 100644
--- a/src/features/report/pages/AnalysisLoadingPage.tsx
+++ b/src/features/report/pages/AnalysisLoadingPage.tsx
@@ -1,266 +1,31 @@
-import { useState, useEffect, useRef, useCallback } from 'react';
-import { useNavigate, useLocation, useParams } from 'react-router';
import { motion } from 'motion/react';
import { Check, AlertCircle, RefreshCw, ShieldX } from 'lucide-react';
-import { useStartAnalysis, getAnalysisStatus } from '@/shared/api/generated/analyses/analyses';
-import { getReport } from '@/shared/api/generated/reports/reports';
+import { useAnalysisPipeline, type Phase } from '../hooks/useAnalysisPipeline';
-// 분석 파이프라인은 단일 startAnalysis + 폴링 모델로 통합됨.
-// 기존의 discoverChannels / collectChannelData / generateReportV2 / generateContentPlan
-// 단계는 백엔드(FastAPI) 비동기 워커가 수행하므로 여기서는 startAnalysis 1회 호출 후
-// /api/analyses/{run_id}/status 폴링으로 대체.
-
-export type ManualChannels = {
- instagram?: string;
- youtube?: string;
- facebook?: string;
-};
-
-type Phase = 'resuming' | 'discovering' | 'collecting' | 'generating' | 'planning' | 'complete';
-
-const PHASE_STEPS = [
- { key: 'discovering' as Phase, label: 'Scanning website & discovering channels...', labelDone: 'Channels discovered' },
- { key: 'collecting' as Phase, label: 'Collecting channel data & market analysis...', labelDone: 'Data collected' },
- { key: 'generating' as Phase, label: 'Generating AI marketing report...', labelDone: 'Report generated' },
- { key: 'planning' as Phase, label: 'Generating AI content strategy...', labelDone: 'Content plan generated' },
- { key: 'complete' as Phase, label: 'Finalizing report...', labelDone: 'Complete' },
+const PHASE_STEPS: { key: Phase; label: string; labelDone: string }[] = [
+ { key: 'discovering', label: 'Scanning website & discovering channels...', labelDone: 'Channels discovered' },
+ { key: 'collecting', label: 'Collecting channel data & market analysis...', labelDone: 'Data collected' },
+ { key: 'generating', label: 'Generating AI marketing report...', labelDone: 'Report generated' },
+ { key: 'planning', label: 'Generating AI content strategy...', labelDone: 'Content plan generated' },
+ { key: 'complete', label: 'Finalizing report...', labelDone: 'Complete' },
];
-// 파이프라인 resume용 세션 키
-const SESSION_KEYS = {
- reportId: 'infinith_reportId',
- clinicId: 'infinith_clinicId',
- runId: 'infinith_runId',
- url: 'infinith_url',
-};
-
-function saveSession(data: { reportId: string; clinicId?: string; runId?: string; url?: string }) {
- sessionStorage.setItem(SESSION_KEYS.reportId, data.reportId);
- if (data.clinicId) sessionStorage.setItem(SESSION_KEYS.clinicId, data.clinicId);
- if (data.runId) sessionStorage.setItem(SESSION_KEYS.runId, data.runId);
- if (data.url) sessionStorage.setItem(SESSION_KEYS.url, data.url);
-}
-
-function loadSession() {
- return {
- reportId: sessionStorage.getItem(SESSION_KEYS.reportId),
- clinicId: sessionStorage.getItem(SESSION_KEYS.clinicId),
- runId: sessionStorage.getItem(SESSION_KEYS.runId),
- url: sessionStorage.getItem(SESSION_KEYS.url),
- };
-}
-
-function clearSession() {
- Object.values(SESSION_KEYS).forEach(k => sessionStorage.removeItem(k));
-}
-
export default function AnalysisLoadingPage() {
- const [phase, setPhase] = useState('discovering');
- const [error, setError] = useState(null);
- const [errorCode, setErrorCode] = useState(null);
- const [errorDomain, setErrorDomain] = useState(null);
- const [errorDetails, setErrorDetails] = useState | null>(null);
- const navigate = useNavigate();
- const location = useLocation();
- const { reportId: urlReportId } = useParams<{ reportId?: string }>();
- const locState = (location.state as {
- url?: string;
- manualChannels?: ManualChannels;
- }) ?? {};
- const url = locState.url;
- const manualChannels = locState.manualChannels;
- const hasStarted = useRef(false);
- const { mutateAsync: startAnalysisAsync } = useStartAnalysis();
+ const {
+ phase,
+ error,
+ errorCode,
+ errorDomain,
+ errorDetails,
+ url,
+ sessionUrl,
+ handleRetry,
+ handleAbort,
+ } = useAnalysisPipeline();
- const phaseIndex = PHASE_STEPS.findIndex(s => s.key === phase);
-
- const runPipeline = useCallback(async (
- startUrl?: string,
- resumeFrom?: { reportId: string; clinicId?: string; runId?: string; phase: Phase },
- ) => {
- try {
- let reportId = resumeFrom?.reportId || '';
- let clinicId = resumeFrom?.clinicId;
- let runId = resumeFrom?.runId;
-
- // Phase 1: 백엔드 분석 시작 (기존 runId로 resume 중이면 스킵)
- if (!resumeFrom?.runId) {
- if (!startUrl) throw new Error('No URL provided');
- setPhase('discovering');
- const startRes = await startAnalysisAsync({
- data: {
- url: startUrl,
- // manualChannels는 백엔드에서 verified_channels로 주입
- manual_channels: manualChannels,
- } as unknown as Parameters[0]['data'],
- });
- if (startRes.status !== 202) {
- throw new Error('분석 시작에 실패했습니다.');
- }
- const startData = startRes.data as unknown as { run_id?: string; report_id?: string; clinic_id?: string };
- runId = startData.run_id || '';
- reportId = startData.report_id || runId;
- clinicId = startData.clinic_id;
-
- saveSession({ reportId, clinicId, runId, url: startUrl });
- window.history.replaceState(null, '', `/report/loading/${reportId}`);
- }
-
- if (!runId) throw new Error('runId 없음');
-
- // Phase 2-4: 완료될 때까지 상태 폴링
- const phaseFromStatus = (s: string): Phase => {
- if (['discovering', 'discovered'].includes(s)) return 'collecting';
- if (['collecting', 'collected', 'partial'].includes(s)) return 'generating';
- if (['generating'].includes(s)) return 'planning';
- if (['complete'].includes(s)) return 'complete';
- return 'discovering';
- };
-
- // backoff 적용 폴링 루프
- const maxAttempts = 120; // ~2분
- let attempts = 0;
- while (attempts < maxAttempts) {
- attempts++;
- const statusRes = await getAnalysisStatus(runId);
- if (statusRes.status !== 200) {
- throw new Error('분석 상태 조회에 실패했습니다.');
- }
- const statusData = statusRes.data as unknown as { status: string; channel_errors?: Record };
- const next = phaseFromStatus(statusData.status);
- setPhase(next);
- if (statusData.channel_errors && Object.keys(statusData.channel_errors).length > 0) {
- console.warn('[pipeline] Partial failures:', statusData.channel_errors);
- }
- if (statusData.status === 'complete') break;
- if (statusData.status === 'failed' || statusData.status === 'collection_failed') {
- throw new Error(`파이프라인 실패: ${statusData.status}`);
- }
- await new Promise((r) => setTimeout(r, 1500));
- }
-
- setPhase('complete');
- clearSession();
-
- // 최종 리포트 조회 (best effort)
- const reportRes = await getReport(reportId).catch(() => null);
- const reportPayload = reportRes && reportRes.status === 200 ? reportRes.data : null;
- setTimeout(() => {
- navigate(`/report/${reportId}`, {
- replace: true,
- state: reportPayload
- ? { report: reportPayload, metadata: { url: startUrl, clinicName: '', generatedAt: new Date().toISOString() }, reportId, clinicId }
- : undefined,
- });
- }, 800);
- } catch (err) {
- const msg = err instanceof Error ? err.message : 'An error occurred';
- setError(msg);
- if (err && typeof err === 'object' && 'code' in err) {
- setErrorCode((err as { code?: string }).code || null);
- }
- if (err && typeof err === 'object' && 'domain' in err) {
- setErrorDomain((err as { domain?: string }).domain || null);
- }
- }
- }, [navigate, manualChannels, startAnalysisAsync]);
-
- // 현재 실패한 단계부터 재시도
- const handleRetry = useCallback(() => {
- setError(null);
- setErrorDetails(null);
- const session = loadSession();
- if (session.reportId) {
- // 실패한 단계부터 resume
- runPipeline(undefined, {
- reportId: session.reportId,
- clinicId: session.clinicId || undefined,
- runId: session.runId || undefined,
- phase,
- });
- } else if (url || session.url) {
- // 처음부터 재시작
- hasStarted.current = false;
- runPipeline(url || session.url || undefined);
- }
- }, [phase, url, runPipeline]);
-
- useEffect(() => {
- if (hasStarted.current) return;
- hasStarted.current = true;
-
- // 1. URL 파라미터 resume 시도 (예: /report/loading/abc-123)
- if (urlReportId) {
- setPhase('resuming');
- const session = loadSession();
- const runId = session.runId || urlReportId;
- getAnalysisStatus(runId)
- .then((res) => {
- if (res.status !== 200) throw new Error('status fetch failed');
- const status = res.data as unknown as { status: string };
- if (status.status === 'complete') {
- navigate(`/report/${urlReportId}`, { replace: true });
- return;
- }
- if (status.status === 'collection_failed') {
- setError('Data collection failed. Please retry.');
- setPhase('collecting');
- return;
- }
- let resumePhase: Phase = 'discovering';
- if (['discovered', 'discovering'].includes(status.status)) resumePhase = 'collecting';
- else if (['collecting', 'collected', 'partial'].includes(status.status)) resumePhase = 'generating';
- saveSession({ reportId: urlReportId, clinicId: session.clinicId || undefined, runId, url: session.url || undefined });
- runPipeline(undefined, { reportId: urlReportId, clinicId: session.clinicId || undefined, runId, phase: resumePhase });
- })
- .catch(() => {
- setError('Could not resume analysis. Please try again.');
- });
- return;
- }
-
- // 2. sessionStorage resume 시도
- const session = loadSession();
- if (session.reportId && !url) {
- setPhase('resuming');
- const runId = session.runId || session.reportId;
- getAnalysisStatus(runId)
- .then((res) => {
- if (res.status !== 200) throw new Error('status fetch failed');
- const status = res.data as unknown as { status: string };
- if (status.status === 'complete') {
- clearSession();
- navigate(`/report/${session.reportId}`, { replace: true });
- return;
- }
- let resumePhase: Phase = 'discovering';
- if (['discovered', 'discovering'].includes(status.status)) resumePhase = 'collecting';
- else if (['collecting', 'collected', 'partial'].includes(status.status)) resumePhase = 'generating';
- runPipeline(undefined, {
- reportId: session.reportId!,
- clinicId: session.clinicId || undefined,
- runId,
- phase: resumePhase,
- });
- })
- .catch(() => {
- clearSession();
- navigate('/', { replace: true });
- });
- return;
- }
-
- // 3. URL로 처음부터 시작
- if (!url) {
- navigate('/', { replace: true });
- return;
- }
-
- runPipeline(url);
- }, [url, urlReportId, navigate, runPipeline]);
-
- // 'resuming' 상태일 때 phaseIndex 조정
+ const phaseIndex = PHASE_STEPS.findIndex((s) => s.key === phase);
const displayPhaseIndex = phase === 'resuming' ? -1 : phaseIndex;
+ const displayUrl = url || sessionUrl;
return (
@@ -282,14 +47,14 @@ export default function AnalysisLoadingPage() {
INFINITH
- {(url || loadSession().url) && (
+ {displayUrl && (
- {url || loadSession().url}
+ {displayUrl}
)}
@@ -309,7 +74,7 @@ export default function AnalysisLoadingPage() {
현재 분석 대상 병원 목록에 포함되지 않은 도메인입니다.
)
+ ) : phase === 'resuming' ? (
+
+
+ Resuming analysis...
+
) : (
<>
- {phase === 'resuming' ? (
-
-
- Resuming analysis...
-
- ) : (
- <>
-
- {PHASE_STEPS.map((step, index) => {
- const isCompleted = displayPhaseIndex > index || (step.key === 'complete' && phase === 'complete');
- const isActive = displayPhaseIndex === index && phase !== 'complete';
+
+ {PHASE_STEPS.map((step, index) => {
+ const isCompleted =
+ displayPhaseIndex > index || (step.key === 'complete' && phase === 'complete');
+ const isActive = displayPhaseIndex === index && phase !== 'complete';
- return (
-
-
- {isCompleted ? (
-
-
-
- ) : isActive ? (
-
- ) : (
-
- )}
-
- );
- })}
-
-
-
+ return (
-
+ key={step.key}
+ initial={{ opacity: 0, x: -20 }}
+ animate={{ opacity: isActive || isCompleted ? 1 : 0.3, x: 0 }}
+ transition={{ duration: 0.4, delay: index * 0.15 }}
+ className="flex items-center gap-4"
+ >
+
+ {isCompleted ? (
+
+
+
+ ) : isActive ? (
+
+ ) : (
+
+ )}
+
+
+ {isCompleted ? step.labelDone : step.label}
+
+
+ );
+ })}
+
- AI가 마케팅 데이터를 분석하고 있습니다. 약 1~2분 소요됩니다.
-
-
- )}
+
+
+
+
+
+ AI가 마케팅 데이터를 분석하고 있습니다. 약 1~2분 소요됩니다.
+
)}