- 학습 흐름에 맞게 사이드바/CONTENT_MAP 순서 재배치 - InitialSetup: 팀 필수 vs 권장 도구 구분, 대안 도구 안내 - NexusUsage: 팀 정책 vs 개인 로컬 설정 분리, 인증 경고 강화 - StartingProject: /init-project 수행 내용 상세화, settings.json vs local 설명 Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
48 lines
1.7 KiB
TypeScript
48 lines
1.7 KiB
TypeScript
import { lazy, Suspense, useEffect } from 'react';
|
|
import { useParams } from 'react-router';
|
|
import { api } from '../utils/api';
|
|
|
|
const CONTENT_MAP: Record<string, React.LazyExoticComponent<React.ComponentType>> = {
|
|
'env-intro': lazy(() => import('../content/DevEnvIntro')),
|
|
'initial-setup': lazy(() => import('../content/InitialSetup')),
|
|
'gitea-usage': lazy(() => import('../content/GiteaUsage')),
|
|
'git-workflow': lazy(() => import('../content/GitWorkflow')),
|
|
'starting-project': lazy(() => import('../content/StartingProject')),
|
|
'nexus-usage': lazy(() => import('../content/NexusUsage')),
|
|
'ci-cd': lazy(() => import('../content/CiCdGuide')),
|
|
'chat-bot': lazy(() => import('../content/ChatBotIntegration')),
|
|
'design-system': lazy(() => import('../content/DesignSystem')),
|
|
};
|
|
|
|
export function GuidePage() {
|
|
const { section } = useParams<{ section: string }>();
|
|
const Content = section ? CONTENT_MAP[section] : null;
|
|
|
|
useEffect(() => {
|
|
if (section) {
|
|
api.post('/activity/track', { pagePath: `/dev/${section}` }).catch(() => {});
|
|
}
|
|
}, [section]);
|
|
|
|
if (!Content) {
|
|
return (
|
|
<div className="max-w-4xl mx-auto py-12 px-6">
|
|
<h1 className="text-3xl font-bold text-text-primary mb-4">페이지를 찾을 수 없습니다</h1>
|
|
<p className="text-text-secondary">요청한 가이드 섹션이 존재하지 않습니다.</p>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<Suspense
|
|
fallback={
|
|
<div className="flex items-center justify-center py-20">
|
|
<div className="animate-spin h-6 w-6 border-3 border-accent border-t-transparent rounded-full" />
|
|
</div>
|
|
}
|
|
>
|
|
<Content />
|
|
</Suspense>
|
|
);
|
|
}
|