@object-ui/plugin-dashboard 3.1.5 → 3.3.1

package/src/__tests__/DashboardConfigPanel.test.tsx

@@ -1,206 +0,0 @@
-/**
- * ObjectUI
- * Copyright (c) 2024-present ObjectStack Inc.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-import { describe, it, expect, vi } from 'vitest';
-import { render, screen, fireEvent } from '@testing-library/react';
-import { DashboardConfigPanel } from '../DashboardConfigPanel';
-
-const defaultConfig = {
-  columns: 3,
-  gap: 4,
-  rowHeight: '120',
-  refreshInterval: '0',
-  title: 'My Dashboard',
-  showDescription: true,
-  theme: 'auto',
-};
-
-describe('DashboardConfigPanel', () => {
-  it('should render nothing when closed', () => {
-    const { container } = render(
-      <DashboardConfigPanel
-        open={false}
-        onClose={vi.fn()}
-        config={defaultConfig}
-        onSave={vi.fn()}
-      />,
-    );
-    expect(container.innerHTML).toBe('');
-  });
-
-  it('should render panel when open', () => {
-    render(
-      <DashboardConfigPanel
-        open={true}
-        onClose={vi.fn()}
-        config={defaultConfig}
-        onSave={vi.fn()}
-      />,
-    );
-    expect(screen.getByTestId('config-panel')).toBeDefined();
-  });
-
-  it('should display dashboard breadcrumb', () => {
-    render(
-      <DashboardConfigPanel
-        open={true}
-        onClose={vi.fn()}
-        config={defaultConfig}
-        onSave={vi.fn()}
-      />,
-    );
-    expect(screen.getByText('Dashboard')).toBeDefined();
-    expect(screen.getByText('Configuration')).toBeDefined();
-  });
-
-  it('should display layout section fields', () => {
-    render(
-      <DashboardConfigPanel
-        open={true}
-        onClose={vi.fn()}
-        config={defaultConfig}
-        onSave={vi.fn()}
-      />,
-    );
-    expect(screen.getByText('Layout')).toBeDefined();
-    expect(screen.getByText('Columns')).toBeDefined();
-    expect(screen.getByText('Gap')).toBeDefined();
-    expect(screen.getByText('Row height')).toBeDefined();
-  });
-
-  it('should display data section', () => {
-    render(
-      <DashboardConfigPanel
-        open={true}
-        onClose={vi.fn()}
-        config={defaultConfig}
-        onSave={vi.fn()}
-      />,
-    );
-    expect(screen.getByText('Data')).toBeDefined();
-    expect(screen.getByText('Refresh interval')).toBeDefined();
-  });
-
-  it('should have appearance section collapsed by default', () => {
-    render(
-      <DashboardConfigPanel
-        open={true}
-        onClose={vi.fn()}
-        config={defaultConfig}
-        onSave={vi.fn()}
-      />,
-    );
-    expect(screen.getByText('Appearance')).toBeDefined();
-    // Title field should be hidden since appearance is collapsed by default
-    // Note: 'My Dashboard' is the title field value from the config, not the section title.
-    // The input label 'Title' should not be visible while collapsed
-    expect(screen.queryByText('Show description')).toBeNull();
-  });
-
-  it('should expand appearance section on click', () => {
-    render(
-      <DashboardConfigPanel
-        open={true}
-        onClose={vi.fn()}
-        config={defaultConfig}
-        onSave={vi.fn()}
-      />,
-    );
-    // Click to expand
-    fireEvent.click(screen.getByTestId('section-header-appearance'));
-    expect(screen.getByText('Show description')).toBeDefined();
-    expect(screen.getByText('Theme')).toBeDefined();
-  });
-
-  it('should call onClose when close button clicked', () => {
-    const onClose = vi.fn();
-    render(
-      <DashboardConfigPanel
-        open={true}
-        onClose={onClose}
-        config={defaultConfig}
-        onSave={vi.fn()}
-      />,
-    );
-    fireEvent.click(screen.getByTestId('config-panel-close'));
-    expect(onClose).toHaveBeenCalledTimes(1);
-  });
-
-  it('should show save/discard footer after editing a field', () => {
-    render(
-      <DashboardConfigPanel
-        open={true}
-        onClose={vi.fn()}
-        config={defaultConfig}
-        onSave={vi.fn()}
-      />,
-    );
-    // Edit the row height input
-    const rowHeightInput = screen.getByTestId('config-field-rowHeight');
-    fireEvent.change(rowHeightInput, { target: { value: '200' } });
-    expect(screen.getByTestId('config-panel-footer')).toBeDefined();
-  });
-
-  it('should call onSave with updated draft', () => {
-    const onSave = vi.fn();
-    render(
-      <DashboardConfigPanel
-        open={true}
-        onClose={vi.fn()}
-        config={defaultConfig}
-        onSave={onSave}
-      />,
-    );
-    // Modify a field
-    fireEvent.change(screen.getByTestId('config-field-rowHeight'), {
-      target: { value: '200' },
-    });
-    // Save
-    fireEvent.click(screen.getByTestId('config-panel-save'));
-    expect(onSave).toHaveBeenCalledTimes(1);
-    const savedDraft = onSave.mock.calls[0][0];
-    expect(savedDraft.rowHeight).toBe('200');
-  });
-
-  it('should revert changes on discard', () => {
-    render(
-      <DashboardConfigPanel
-        open={true}
-        onClose={vi.fn()}
-        config={defaultConfig}
-        onSave={vi.fn()}
-      />,
-    );
-    const input = screen.getByTestId('config-field-rowHeight') as HTMLInputElement;
-    fireEvent.change(input, { target: { value: '999' } });
-    expect(input.value).toBe('999');
-
-    // Discard
-    fireEvent.click(screen.getByTestId('config-panel-discard'));
-
-    // Footer should disappear (no longer dirty)
-    expect(screen.queryByTestId('config-panel-footer')).toBeNull();
-  });
-
-  it('should call onFieldChange for live updates', () => {
-    const onFieldChange = vi.fn();
-    render(
-      <DashboardConfigPanel
-        open={true}
-        onClose={vi.fn()}
-        config={defaultConfig}
-        onSave={vi.fn()}
-        onFieldChange={onFieldChange}
-      />,
-    );
-    fireEvent.change(screen.getByTestId('config-field-rowHeight'), {
-      target: { value: '150' },
-    });
-    expect(onFieldChange).toHaveBeenCalledWith('rowHeight', '150');
-  });
-});

package/src/__tests__/DashboardGridLayout.test.tsx

@@ -1,199 +0,0 @@
-/**
- * ObjectUI
- * Copyright (c) 2024-present ObjectStack Inc.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-import { describe, it, expect, vi, beforeEach } from 'vitest';
-import { render, screen, fireEvent } from '@testing-library/react';
-import { DashboardGridLayout } from '../DashboardGridLayout';
-import type { DashboardSchema } from '@object-ui/types';
-
-// Mock localStorage
-const localStorageMock = (() => {
-  let store: Record<string, string> = {};
-  return {
-    getItem: (key: string) => store[key] || null,
-    setItem: (key: string, value: string) => { store[key] = value; },
-    clear: () => { store = {}; },
-    removeItem: (key: string) => { delete store[key]; },
-  };
-})();
-
-Object.defineProperty(window, 'localStorage', { value: localStorageMock });
-
-// Mock react-grid-layout
-vi.mock('react-grid-layout', () => ({
-  Responsive: ({ children }: any) => <div data-testid="grid-layout">{children}</div>,
-  WidthProvider: (Component: any) => Component,
-}));
-
-describe('DashboardGridLayout', () => {
-  beforeEach(() => {
-    localStorageMock.clear();
-  });
-
-  const mockSchema: DashboardSchema = {
-    type: 'dashboard',
-    name: 'test_dashboard',
-    title: 'Test Dashboard',
-    widgets: [
-      {
-        id: 'widget-1',
-        type: 'metric-card',
-        title: 'Total Sales',
-        layout: { x: 0, y: 0, w: 3, h: 2 },
-      },
-      {
-        id: 'widget-2',
-        type: 'bar',
-        title: 'Revenue by Month',
-        layout: { x: 3, y: 0, w: 6, h: 4 },
-      },
-    ],
-  };
-
-  it('should render without crashing', () => {
-    const { container } = render(<DashboardGridLayout schema={mockSchema} />);
-    expect(container).toBeTruthy();
-  });
-
-  it('should render dashboard title', () => {
-    render(<DashboardGridLayout schema={mockSchema} />);
-    expect(screen.getByText('Test Dashboard')).toBeInTheDocument();
-  });
-
-  it('should render all widgets', () => {
-    render(<DashboardGridLayout schema={mockSchema} />);
-    
-    expect(screen.getAllByText('Total Sales').length).toBeGreaterThan(0);
-    expect(screen.getByText('Revenue by Month')).toBeInTheDocument();
-  });
-
-  it('should render edit mode button', () => {
-    render(<DashboardGridLayout schema={mockSchema} />);
-    
-    const editButton = screen.getByRole('button', { name: /edit/i });
-    expect(editButton).toBeInTheDocument();
-  });
-
-  it('should toggle edit mode when edit button is clicked', () => {
-    render(<DashboardGridLayout schema={mockSchema} />);
-    
-    const editButton = screen.getByRole('button', { name: /edit/i });
-    fireEvent.click(editButton);
-    
-    // In edit mode, should show Save and Cancel buttons
-    expect(screen.getByRole('button', { name: /save/i })).toBeInTheDocument();
-    expect(screen.getByRole('button', { name: /cancel/i })).toBeInTheDocument();
-  });
-
-  it('should save layout to localStorage when save button is clicked', () => {
-    render(<DashboardGridLayout schema={mockSchema} persistLayoutKey="test-layout" />);
-    
-    const editButton = screen.getByRole('button', { name: /edit/i });
-    fireEvent.click(editButton);
-    
-    const saveButton = screen.getByRole('button', { name: /save/i });
-    fireEvent.click(saveButton);
-    
-    // Check that layout was saved to localStorage
-    const saved = localStorageMock.getItem('test-layout');
-    expect(saved).toBeTruthy();
-  });
-
-  it('should restore layout from localStorage', () => {
-    const savedLayout = {
-      lg: [
-        { i: 'widget-1', x: 0, y: 0, w: 3, h: 2 },
-        { i: 'widget-2', x: 3, y: 0, w: 6, h: 4 },
-      ],
-    };
-    
-    localStorageMock.setItem('test-layout', JSON.stringify(savedLayout));
-    
-    render(<DashboardGridLayout schema={mockSchema} persistLayoutKey="test-layout" />);
-    
-    // Component should render with saved layout
-    expect(screen.getByText('Test Dashboard')).toBeInTheDocument();
-  });
-
-  it('should call onLayoutChange when layout changes', () => {
-    const onLayoutChange = vi.fn();
-    render(<DashboardGridLayout schema={mockSchema} onLayoutChange={onLayoutChange} />);
-    
-    // Trigger layout change (this would normally happen through drag/drop)
-    // In our mock, we can't easily trigger this, but we verify the callback exists
-    expect(onLayoutChange).toBeDefined();
-  });
-
-  it('should cancel edit mode when cancel button is clicked', () => {
-    render(<DashboardGridLayout schema={mockSchema} />);
-    
-    const editButton = screen.getByRole('button', { name: /edit/i });
-    fireEvent.click(editButton);
-    
-    const cancelButton = screen.getByRole('button', { name: /cancel/i });
-    fireEvent.click(cancelButton);
-    
-    // Should exit edit mode
-    expect(screen.getByRole('button', { name: /edit/i })).toBeInTheDocument();
-    expect(screen.queryByRole('button', { name: /save/i })).not.toBeInTheDocument();
-  });
-
-  it('should reset layout when reset button is clicked', () => {
-    render(<DashboardGridLayout schema={mockSchema} />);
-    
-    const editButton = screen.getByRole('button', { name: /edit/i });
-    fireEvent.click(editButton);
-    
-    // Look for reset button (might be in a dropdown or menu)
-    const buttons = screen.getAllByRole('button');
-    const resetButton = buttons.find(btn => btn.textContent?.includes('Reset'));
-    
-    if (resetButton) {
-      fireEvent.click(resetButton);
-    }
-  });
-
-  it('should render grid layout container', () => {
-    render(<DashboardGridLayout schema={mockSchema} />);
-    
-    const gridLayout = screen.getByTestId('grid-layout');
-    expect(gridLayout).toBeInTheDocument();
-  });
-
-  it('should handle empty widgets array', () => {
-    const emptySchema: DashboardSchema = {
-      type: 'dashboard',
-      name: 'empty_dashboard',
-      title: 'Empty Dashboard',
-      widgets: [],
-    };
-    
-    const { container } = render(<DashboardGridLayout schema={emptySchema} />);
-    expect(container).toBeTruthy();
-  });
-
-  it('should apply custom className', () => {
-    const { container } = render(
-      <DashboardGridLayout schema={mockSchema} className="custom-class" />
-    );
-    
-    const dashboardContainer = container.querySelector('.custom-class');
-    expect(dashboardContainer).toBeTruthy();
-  });
-
-  it('should render drag handles in edit mode', () => {
-    const { container } = render(<DashboardGridLayout schema={mockSchema} />);
-    
-    const editButton = screen.getByRole('button', { name: /edit/i });
-    fireEvent.click(editButton);
-    
-    // In edit mode, widgets should have drag handles (GripVertical icons)
-    const gripIcons = container.querySelectorAll('svg');
-    expect(gripIcons.length).toBeGreaterThan(0);
-  });
-});

package/src/__tests__/DashboardRenderer.autoRefresh.test.tsx

@@ -1,124 +0,0 @@
-/**
- * ObjectUI
- * Copyright (c) 2024-present ObjectStack Inc.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
-import { render, screen, fireEvent, act } from '@testing-library/react';
-import { DashboardRenderer } from '../DashboardRenderer';
-import type { DashboardSchema } from '@object-ui/types';
-
-describe('DashboardRenderer auto-refresh', () => {
-  beforeEach(() => {
-    vi.useFakeTimers();
-  });
-
-  afterEach(() => {
-    vi.useRealTimers();
-  });
-
-  const mockSchema: DashboardSchema = {
-    type: 'dashboard',
-    name: 'test_dashboard',
-    title: 'Test Dashboard',
-    widgets: [],
-  };
-
-  it('should not render refresh button when onRefresh is not provided', () => {
-    render(<DashboardRenderer schema={mockSchema} />);
-    expect(screen.queryByLabelText('Refresh dashboard')).not.toBeInTheDocument();
-  });
-
-  it('should render refresh button when onRefresh is provided', () => {
-    const onRefresh = vi.fn();
-    render(<DashboardRenderer schema={mockSchema} onRefresh={onRefresh} />);
-    expect(screen.getByLabelText('Refresh dashboard')).toBeInTheDocument();
-  });
-
-  it('should call onRefresh when refresh button is clicked', () => {
-    const onRefresh = vi.fn();
-    render(<DashboardRenderer schema={mockSchema} onRefresh={onRefresh} />);
-
-    const button = screen.getByLabelText('Refresh dashboard');
-    fireEvent.click(button);
-
-    expect(onRefresh).toHaveBeenCalledTimes(1);
-  });
-
-  it('should auto-refresh at the configured interval', () => {
-    const onRefresh = vi.fn();
-    const schemaWithRefresh: DashboardSchema = {
-      ...mockSchema,
-      refreshInterval: 30, // 30 seconds
-    };
-
-    render(<DashboardRenderer schema={schemaWithRefresh} onRefresh={onRefresh} />);
-
-    expect(onRefresh).not.toHaveBeenCalled();
-
-    // Advance past one interval
-    act(() => {
-      vi.advanceTimersByTime(30_000);
-    });
-    expect(onRefresh).toHaveBeenCalledTimes(1);
-
-    // Advance past another interval
-    act(() => {
-      vi.advanceTimersByTime(30_000);
-    });
-    expect(onRefresh).toHaveBeenCalledTimes(2);
-  });
-
-  it('should not auto-refresh when refreshInterval is 0', () => {
-    const onRefresh = vi.fn();
-    const schemaWithZeroInterval: DashboardSchema = {
-      ...mockSchema,
-      refreshInterval: 0,
-    };
-
-    render(<DashboardRenderer schema={schemaWithZeroInterval} onRefresh={onRefresh} />);
-
-    act(() => {
-      vi.advanceTimersByTime(60_000);
-    });
-
-    expect(onRefresh).not.toHaveBeenCalled();
-  });
-
-  it('should not auto-refresh when onRefresh is not provided', () => {
-    const schemaWithRefresh: DashboardSchema = {
-      ...mockSchema,
-      refreshInterval: 10,
-    };
-
-    // Should not throw
-    render(<DashboardRenderer schema={schemaWithRefresh} />);
-
-    act(() => {
-      vi.advanceTimersByTime(30_000);
-    });
-  });
-
-  it('should clean up interval on unmount', () => {
-    const onRefresh = vi.fn();
-    const schemaWithRefresh: DashboardSchema = {
-      ...mockSchema,
-      refreshInterval: 5,
-    };
-
-    const { unmount } = render(
-      <DashboardRenderer schema={schemaWithRefresh} onRefresh={onRefresh} />
-    );
-
-    unmount();
-
-    act(() => {
-      vi.advanceTimersByTime(30_000);
-    });
-
-    expect(onRefresh).not.toHaveBeenCalled();
-  });
-});