narang-ai
52732e88b9
Sprint 001 non-blocking 해결: - N6: npm audit high 패키지 업데이트 (@nestjs/config, @nestjs/cli) - S1: CORS origin 화이트리스트 (CORS_ORIGINS env) - S3: DATABASE_URL 미설정 시 즉시 throw - N2: SSH_KEY_PATH 미설정 시 즉시 throw (하드코딩 fallback 제거) - N3: API 응답에서 내부 IP 제거 - N7: SshService 에러 메시지 마스킹 (IP 노출 차단) - N4: theme.ts 색상 SisterCard/StatusBadge에 실제 적용 - N5: Sidebar-MainContent margin 연동 (SidebarContext) - N9: LayoutShell Client 컴포넌트로 분리 Sprint 002 본문: - TASK-004: GiteaService (org repo 목록, PR 조회) - TASK-004: GET /api/projects → Gitea + DB 병합 - TASK-004: GET /api/projects/:id → 상세 + open PRs - TASK-005: GET /api/projects/:id/tasks → Sprint/Task Ledger - TASK-005: POST /api/projects/:id/sprints → Sprint 생성 - TASK-005: PATCH /api/tasks/:id → Task 상태 업데이트 + ActivityLog - TASK-006: GET /api/activity, /api/projects/:id/activity - TASK-007: /projects/[id] 상세 페이지 (SprintAccordion + TaskTable + 활동탭) - TASK-007: 메인 대시보드에 프로젝트 섹션 + 활동 피드 추가 - 테스트 11/11 pass
57 lines
1.3 KiB
TypeScript
57 lines
1.3 KiB
TypeScript
'use client';
|
|
|
|
import React from 'react';
|
|
import styled from 'styled-components';
|
|
import { theme } from '@/styles/theme';
|
|
|
|
export interface Tab {
|
|
id: string;
|
|
label: string;
|
|
icon?: string;
|
|
}
|
|
|
|
interface TabNavProps {
|
|
tabs: Tab[];
|
|
active: string;
|
|
onChange: (id: string) => void;
|
|
}
|
|
|
|
const Nav = styled.div`
|
|
display: flex;
|
|
gap: 4px;
|
|
border-bottom: 1px solid ${theme.colors.border};
|
|
margin-bottom: 20px;
|
|
`;
|
|
|
|
const TabBtn = styled.button<{ $active: boolean }>`
|
|
padding: 10px 16px;
|
|
background: none;
|
|
border: none;
|
|
border-bottom: 2px solid ${({ $active }) => $active ? theme.colors.accent : 'transparent'};
|
|
color: ${({ $active }) => $active ? theme.colors.textPrimary : theme.colors.textSecondary};
|
|
font-size: 14px;
|
|
font-weight: ${({ $active }) => $active ? '600' : '400'};
|
|
cursor: pointer;
|
|
transition: color 0.15s, border-color 0.15s;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 6px;
|
|
|
|
&:hover {
|
|
color: ${theme.colors.textPrimary};
|
|
}
|
|
`;
|
|
|
|
export default function TabNav({ tabs, active, onChange }: TabNavProps) {
|
|
return (
|
|
<Nav>
|
|
{tabs.map((tab) => (
|
|
<TabBtn key={tab.id} $active={active === tab.id} onClick={() => onChange(tab.id)}>
|
|
{tab.icon && <span>{tab.icon}</span>}
|
|
{tab.label}
|
|
</TabBtn>
|
|
))}
|
|
</Nav>
|
|
);
|
|
}
|