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
63 lines
1.3 KiB
TypeScript
63 lines
1.3 KiB
TypeScript
'use client';
|
|
|
|
import React from 'react';
|
|
import styled from 'styled-components';
|
|
import { theme } from '@/styles/theme';
|
|
|
|
type Status = 'online' | 'offline' | 'working' | 'unknown';
|
|
|
|
interface StatusBadgeProps {
|
|
status: Status;
|
|
}
|
|
|
|
const statusLabels: Record<Status, string> = {
|
|
online: '온라인',
|
|
offline: '오프라인',
|
|
working: '작업중',
|
|
unknown: '알 수 없음',
|
|
};
|
|
|
|
const statusColors: Record<Status, string> = {
|
|
online: theme.colors.online,
|
|
offline: theme.colors.offline,
|
|
working: theme.colors.working,
|
|
unknown: theme.colors.textSecondary,
|
|
};
|
|
|
|
const BadgeWrapper = styled.span<{ $status: Status }>`
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 6px;
|
|
font-size: 12px;
|
|
font-weight: 500;
|
|
color: ${({ $status }) => statusColors[$status]};
|
|
`;
|
|
|
|
const Dot = styled.span<{ $status: Status }>`
|
|
width: 8px;
|
|
height: 8px;
|
|
border-radius: 50%;
|
|
background-color: ${({ $status }) => statusColors[$status]};
|
|
flex-shrink: 0;
|
|
${({ $status }) =>
|
|
$status === 'online' &&
|
|
`
|
|
box-shadow: 0 0 6px #00E676;
|
|
animation: pulse 2s infinite;
|
|
`}
|
|
|
|
@keyframes pulse {
|
|
0%, 100% { opacity: 1; }
|
|
50% { opacity: 0.5; }
|
|
}
|
|
`;
|
|
|
|
export default function StatusBadge({ status }: StatusBadgeProps) {
|
|
return (
|
|
<BadgeWrapper $status={status}>
|
|
<Dot $status={status} />
|
|
{statusLabels[status]}
|
|
</BadgeWrapper>
|
|
);
|
|
}
|