[Web UI] Add unit test for NodeCard component

[santoshkumarradha]

Summary

Add a unit test for the NodeCard React component to verify it renders node information correctly.

Prerequisites

This issue depends on #103 (vitest setup). Complete that issue first or work on this after vitest is configured.

Current State

• File: control-plane/web/client/src/components/NodeCard.tsx
• Test: None

What to Test

1. Basic rendering: Component renders without crashing
2. Node information display: Node ID, status, and metadata are displayed
3. Status indicators: Correct status badge/icon for different states (online, offline, error)
4. Action buttons: Buttons render and are clickable
5. Props handling: Component handles various node configurations

Example Test Structure

import { render, screen } from '@testing-library/react';
import { NodeCard } from './NodeCard';

describe('NodeCard', () => {
  const mockNode = {
    id: 'test-node-1',
    status: 'online',
    // ... other required props
  };

  it('renders node information', () => {
    render(<NodeCard node={mockNode} />);
    expect(screen.getByText('test-node-1')).toBeInTheDocument();
  });

  it('displays correct status for online node', () => {
    render(<NodeCard node={mockNode} />);
    expect(screen.getByText('online')).toBeInTheDocument();
  });

  it('displays correct status for offline node', () => {
    render(<NodeCard node={{ ...mockNode, status: 'offline' }} />);
    expect(screen.getByText('offline')).toBeInTheDocument();
  });
});

Acceptance Criteria

• Create NodeCard.test.tsx adjacent to the component
• Tests cover basic rendering scenarios
• Tests cover different node statuses
• All tests pass with npm test

Files

• Source: control-plane/web/client/src/components/NodeCard.tsx
• Test: control-plane/web/client/src/components/NodeCard.test.tsx (new)

---

Using AI to solve this issue? Read our AI-Assisted Contributions guide for testing requirements, prompt strategies, and common pitfalls to avoid.