@object-ui/plugin-detail 3.1.5 → 3.3.1

package/src/__tests__/RecordComments.test.tsx

@@ -1,96 +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 '@testing-library/jest-dom';
-import { RecordComments } from '../RecordComments';
-import type { CommentEntry } from '@object-ui/types';
-
-const mockComments: CommentEntry[] = [
-  {
-    id: '1',
-    text: 'This is the first comment',
-    author: 'Alice',
-    createdAt: '2026-02-16T08:00:00Z',
-  },
-  {
-    id: '2',
-    text: 'Second comment here',
-    author: 'Bob',
-    avatarUrl: 'https://example.com/bob.jpg',
-    createdAt: '2026-02-16T09:00:00Z',
-  },
-];
-
-describe('RecordComments', () => {
-  it('should render comments heading with count', () => {
-    render(<RecordComments comments={mockComments} />);
-    expect(screen.getByText('Comments')).toBeInTheDocument();
-    expect(screen.getByText('(2)')).toBeInTheDocument();
-  });
-
-  it('should render comment authors and text', () => {
-    render(<RecordComments comments={mockComments} />);
-    expect(screen.getByText('Alice')).toBeInTheDocument();
-    expect(screen.getByText('This is the first comment')).toBeInTheDocument();
-    expect(screen.getByText('Bob')).toBeInTheDocument();
-    expect(screen.getByText('Second comment here')).toBeInTheDocument();
-  });
-
-  it('should show "No comments yet" when empty', () => {
-    render(<RecordComments comments={[]} />);
-    expect(screen.getByText('No comments yet')).toBeInTheDocument();
-  });
-
-  it('should render comment input when onAddComment is provided', () => {
-    const onAdd = vi.fn();
-    render(<RecordComments comments={[]} onAddComment={onAdd} />);
-    const textarea = screen.getByPlaceholderText(/Add a comment/);
-    expect(textarea).toBeInTheDocument();
-  });
-
-  it('should not render comment input when onAddComment is not provided', () => {
-    render(<RecordComments comments={[]} />);
-    const textarea = screen.queryByPlaceholderText(/Add a comment/);
-    expect(textarea).not.toBeInTheDocument();
-  });
-
-  it('should call onAddComment when submit button is clicked', async () => {
-    const onAdd = vi.fn().mockResolvedValue(undefined);
-    render(<RecordComments comments={[]} onAddComment={onAdd} />);
-
-    const textarea = screen.getByPlaceholderText(/Add a comment/);
-    fireEvent.change(textarea, { target: { value: 'New comment' } });
-
-    const submitButton = screen.getByRole('button');
-    fireEvent.click(submitButton);
-
-    expect(onAdd).toHaveBeenCalledWith('New comment');
-  });
-
-  it('should disable submit button when textarea is empty', () => {
-    const onAdd = vi.fn();
-    render(<RecordComments comments={[]} onAddComment={onAdd} />);
-    const submitButton = screen.getByRole('button');
-    expect(submitButton).toBeDisabled();
-  });
-
-  it('should render avatar initials when no avatarUrl', () => {
-    render(<RecordComments comments={[mockComments[0]]} />);
-    // Alice's initial
-    expect(screen.getByText('A')).toBeInTheDocument();
-  });
-
-  it('should render avatar image when avatarUrl is provided', () => {
-    render(<RecordComments comments={[mockComments[1]]} />);
-    const img = screen.getByAltText('Bob');
-    expect(img).toBeInTheDocument();
-    expect(img).toHaveAttribute('src', 'https://example.com/bob.jpg');
-  });
-});

package/src/__tests__/RecordCommentsPinSearch.test.tsx

@@ -1,133 +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 '@testing-library/jest-dom';
-import { RecordComments } from '../RecordComments';
-import type { CommentEntry } from '@object-ui/types';
-
-const mockComments: CommentEntry[] = [
-  {
-    id: '1',
-    text: 'First comment about the project',
-    author: 'Alice',
-    createdAt: '2026-02-16T08:00:00Z',
-  },
-  {
-    id: '2',
-    text: 'Second comment on this record',
-    author: 'Bob',
-    avatarUrl: 'https://example.com/bob.jpg',
-    createdAt: '2026-02-16T09:00:00Z',
-    pinned: true,
-  },
-  {
-    id: '3',
-    text: 'Third comment here',
-    author: 'Charlie',
-    createdAt: '2026-02-16T10:00:00Z',
-  },
-];
-
-describe('RecordComments - Pinning', () => {
-  it('shows "Pinned" label on pinned comments', () => {
-    render(<RecordComments comments={mockComments} />);
-    expect(screen.getByText('Pinned')).toBeInTheDocument();
-  });
-
-  it('sorts pinned comments to the top', () => {
-    const { container } = render(<RecordComments comments={mockComments} />);
-    // Bob (pinned) should appear first
-    const authors = container.querySelectorAll('.text-sm.font-medium');
-    const authorTexts = Array.from(authors).map(el => el.textContent);
-    expect(authorTexts[0]).toBe('Bob');
-  });
-
-  it('renders pin/unpin button when onTogglePin is provided', () => {
-    const onTogglePin = vi.fn();
-    render(<RecordComments comments={mockComments} onTogglePin={onTogglePin} />);
-
-    // Should show "Unpin" for Bob (pinned) and "Pin" for others
-    expect(screen.getByText('Unpin')).toBeInTheDocument();
-    expect(screen.getAllByText('Pin')).toHaveLength(2);
-  });
-
-  it('does not render pin button when onTogglePin is not provided', () => {
-    render(<RecordComments comments={mockComments} />);
-    expect(screen.queryByText('Unpin')).not.toBeInTheDocument();
-    expect(screen.queryAllByText('Pin')).toHaveLength(0);
-  });
-
-  it('calls onTogglePin when pin button is clicked', () => {
-    const onTogglePin = vi.fn();
-    render(<RecordComments comments={mockComments} onTogglePin={onTogglePin} />);
-
-    const unpinBtn = screen.getByText('Unpin');
-    fireEvent.click(unpinBtn);
-
-    expect(onTogglePin).toHaveBeenCalledWith('2');
-  });
-});
-
-describe('RecordComments - Search', () => {
-  it('does not render search input when searchable is false/not provided', () => {
-    render(<RecordComments comments={mockComments} />);
-    expect(screen.queryByLabelText('Search comments')).not.toBeInTheDocument();
-  });
-
-  it('renders search input when searchable is true', () => {
-    render(<RecordComments comments={mockComments} searchable />);
-    expect(screen.getByLabelText('Search comments')).toBeInTheDocument();
-  });
-
-  it('filters comments by text when searching', () => {
-    render(<RecordComments comments={mockComments} searchable />);
-
-    const searchInput = screen.getByLabelText('Search comments');
-    fireEvent.change(searchInput, { target: { value: 'project' } });
-
-    expect(screen.getByText('First comment about the project')).toBeInTheDocument();
-    expect(screen.queryByText('Second comment on this record')).not.toBeInTheDocument();
-    expect(screen.queryByText('Third comment here')).not.toBeInTheDocument();
-  });
-
-  it('filters comments by author when searching', () => {
-    render(<RecordComments comments={mockComments} searchable />);
-
-    const searchInput = screen.getByLabelText('Search comments');
-    fireEvent.change(searchInput, { target: { value: 'Charlie' } });
-
-    expect(screen.getByText('Third comment here')).toBeInTheDocument();
-    expect(screen.queryByText('First comment about the project')).not.toBeInTheDocument();
-  });
-
-  it('shows "No matching comments" when search has no results', () => {
-    render(<RecordComments comments={mockComments} searchable />);
-
-    const searchInput = screen.getByLabelText('Search comments');
-    fireEvent.change(searchInput, { target: { value: 'zzzznonexistent' } });
-
-    expect(screen.getByText('No matching comments')).toBeInTheDocument();
-  });
-
-  it('clears search when clear button is clicked', () => {
-    render(<RecordComments comments={mockComments} searchable />);
-
-    const searchInput = screen.getByLabelText('Search comments');
-    fireEvent.change(searchInput, { target: { value: 'project' } });
-
-    const clearBtn = screen.getByLabelText('Clear search');
-    fireEvent.click(clearBtn);
-
-    // All comments should be visible again
-    expect(screen.getByText('First comment about the project')).toBeInTheDocument();
-    expect(screen.getByText('Second comment on this record')).toBeInTheDocument();
-    expect(screen.getByText('Third comment here')).toBeInTheDocument();
-  });
-});

package/src/__tests__/RelatedList.test.tsx

@@ -1,160 +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, waitFor } from '@testing-library/react';
-import { RelatedList } from '../RelatedList';
-
-describe('RelatedList', () => {
-  it('should render title', () => {
-    render(<RelatedList title="Contacts" type="table" data={[]} />);
-    expect(screen.getByText('Contacts')).toBeInTheDocument();
-  });
-
-  it('should show record count badge for empty list', () => {
-    render(<RelatedList title="Contacts" type="table" data={[]} />);
-    expect(screen.getByText('0')).toBeInTheDocument();
-  });
-
-  it('should show record count badge for one item', () => {
-    render(<RelatedList title="Contacts" type="table" data={[{ id: 1, name: 'Alice' }]} />);
-    expect(screen.getByText('1')).toBeInTheDocument();
-  });
-
-  it('should show record count badge for multiple items', () => {
-    const data = [
-      { id: 1, name: 'Alice' },
-      { id: 2, name: 'Bob' },
-    ];
-    render(<RelatedList title="Orders" type="table" data={data} />);
-    expect(screen.getByText('2')).toBeInTheDocument();
-  });
-
-  it('should show "No related records found" for empty data', () => {
-    render(<RelatedList title="Contacts" type="table" data={[]} />);
-    expect(screen.getByText('No related records found')).toBeInTheDocument();
-  });
-
-  it('should render New button when onNew callback is provided', () => {
-    const onNew = vi.fn();
-    render(<RelatedList title="Contacts" type="table" data={[]} onNew={onNew} />);
-    const newButton = screen.getByText('New');
-    expect(newButton).toBeInTheDocument();
-    fireEvent.click(newButton);
-    expect(onNew).toHaveBeenCalledTimes(1);
-  });
-
-  it('should render View All button when onViewAll callback is provided', () => {
-    const onViewAll = vi.fn();
-    render(<RelatedList title="Contacts" type="table" data={[]} onViewAll={onViewAll} />);
-    const viewAllButton = screen.getByText('View All');
-    expect(viewAllButton).toBeInTheDocument();
-    fireEvent.click(viewAllButton);
-    expect(onViewAll).toHaveBeenCalledTimes(1);
-  });
-
-  it('should not render New or View All buttons when callbacks are not provided', () => {
-    render(<RelatedList title="Contacts" type="table" data={[]} />);
-    expect(screen.queryByText('New')).not.toBeInTheDocument();
-    expect(screen.queryByText('View All')).not.toBeInTheDocument();
-  });
-
-  it('should auto-generate columns from object schema when api and dataSource provided but no columns', async () => {
-    const mockDataSource = {
-      getObjectSchema: vi.fn().mockResolvedValue({
-        name: 'order_item',
-        fields: {
-          product: { type: 'string', label: 'Product' },
-          quantity: { type: 'number', label: 'Quantity' },
-          id: { type: 'string', label: 'ID' },
-        },
-      }),
-      find: vi.fn(),
-    } as any;
-
-    const data = [{ product: 'Widget', quantity: 5 }];
-    render(
-      <RelatedList
-        title="Order Items"
-        type="table"
-        api="order_item"
-        data={data}
-        dataSource={mockDataSource}
-      />,
-    );
-
-    await waitFor(() => {
-      expect(mockDataSource.getObjectSchema).toHaveBeenCalledWith('order_item');
-    });
-
-    // Verify columns are generated from schema (excluding id)
-    await waitFor(() => {
-      expect(screen.getByText('Product')).toBeInTheDocument();
-      expect(screen.getByText('Quantity')).toBeInTheDocument();
-    });
-    // id should be filtered out
-    expect(screen.queryByText('ID')).not.toBeInTheDocument();
-  });
-
-  it('should not fetch object schema when explicit columns are provided', () => {
-    const mockDataSource = {
-      getObjectSchema: vi.fn(),
-      find: vi.fn(),
-    } as any;
-
-    const columns = [{ accessorKey: 'name', header: 'Name' }];
-    render(
-      <RelatedList
-        title="Contacts"
-        type="table"
-        api="contact"
-        data={[{ name: 'Alice' }]}
-        columns={columns}
-        dataSource={mockDataSource}
-      />,
-    );
-
-    expect(mockDataSource.getObjectSchema).not.toHaveBeenCalled();
-  });
-
-  it('should render collapsed state when collapsible and defaultCollapsed are true', () => {
-    const data = [{ id: 1, name: 'Alice' }];
-    render(
-      <RelatedList title="Contacts" type="table" data={data} collapsible defaultCollapsed />,
-    );
-    expect(screen.getByText('Contacts')).toBeInTheDocument();
-    // Content should be hidden when collapsed
-    expect(screen.queryByText('Alice')).not.toBeInTheDocument();
-  });
-
-  it('should expand collapsed card when header is clicked', () => {
-    render(
-      <RelatedList title="Contacts" type="table" data={[]} collapsible defaultCollapsed />,
-    );
-    // Initially collapsed - content should be hidden
-    expect(screen.queryByText('No related records found')).not.toBeInTheDocument();
-    // Click the header to expand
-    fireEvent.click(screen.getByText('Contacts'));
-    // Content should now be visible
-    expect(screen.getByText('No related records found')).toBeInTheDocument();
-  });
-
-  it('should show content by default when collapsible is true but defaultCollapsed is false', () => {
-    render(
-      <RelatedList title="Contacts" type="table" data={[]} collapsible />,
-    );
-    expect(screen.getByText('No related records found')).toBeInTheDocument();
-  });
-
-  it('should show content when collapsible is false (default)', () => {
-    render(
-      <RelatedList title="Contacts" type="table" data={[]} />,
-    );
-    expect(screen.getByText('No related records found')).toBeInTheDocument();
-  });
-});

package/src/__tests__/SectionGroup.test.tsx

@@ -1,101 +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 { SectionGroup } from '../SectionGroup';
-import type { SectionGroup as SectionGroupType } from '@object-ui/types';
-
-describe('SectionGroup', () => {
-  const baseGroup: SectionGroupType = {
-    title: 'Address Information',
-    sections: [
-      {
-        title: 'Billing',
-        fields: [
-          { name: 'billingStreet', label: 'Street' },
-          { name: 'billingCity', label: 'City' },
-        ],
-      },
-      {
-        title: 'Shipping',
-        fields: [
-          { name: 'shippingStreet', label: 'Street' },
-          { name: 'shippingCity', label: 'City' },
-        ],
-      },
-    ],
-  };
-
-  const data = {
-    billingStreet: '123 Main St',
-    billingCity: 'Springfield',
-    shippingStreet: '456 Oak Ave',
-    shippingCity: 'Shelbyville',
-  };
-
-  it('should render group title', () => {
-    render(<SectionGroup group={baseGroup} data={data} />);
-    expect(screen.getByText('Address Information')).toBeInTheDocument();
-  });
-
-  it('should render child section titles', () => {
-    render(<SectionGroup group={baseGroup} data={data} />);
-    expect(screen.getByText('Billing')).toBeInTheDocument();
-    expect(screen.getByText('Shipping')).toBeInTheDocument();
-  });
-
-  it('should render field values in child sections', () => {
-    render(<SectionGroup group={baseGroup} data={data} />);
-    expect(screen.getByText('123 Main St')).toBeInTheDocument();
-    expect(screen.getByText('Springfield')).toBeInTheDocument();
-  });
-
-  it('should be collapsible by default', () => {
-    render(<SectionGroup group={baseGroup} data={data} />);
-    // The group should render a collapsible trigger
-    const trigger = screen.getByText('Address Information');
-    expect(trigger.closest('[data-state]') || trigger.closest('div')).toBeTruthy();
-  });
-
-  it('should start collapsed when defaultCollapsed is true', () => {
-    const collapsedGroup = { ...baseGroup, defaultCollapsed: true };
-    render(<SectionGroup group={collapsedGroup} data={data} />);
-    // Title should still be visible
-    expect(screen.getByText('Address Information')).toBeInTheDocument();
-    // Child section content should be hidden (in collapsed state)
-    expect(screen.queryByText('123 Main St')).not.toBeInTheDocument();
-  });
-
-  it('should expand when clicked while collapsed', () => {
-    const collapsedGroup = { ...baseGroup, defaultCollapsed: true };
-    render(<SectionGroup group={collapsedGroup} data={data} />);
-    
-    // Click the trigger to expand
-    fireEvent.click(screen.getByText('Address Information'));
-    
-    // Content should now be visible
-    expect(screen.getByText('123 Main St')).toBeInTheDocument();
-  });
-
-  it('should render description when provided', () => {
-    const groupWithDesc = { ...baseGroup, description: 'Billing and shipping addresses', collapsible: false };
-    render(<SectionGroup group={groupWithDesc} data={data} />);
-    expect(screen.getByText('Billing and shipping addresses')).toBeInTheDocument();
-  });
-
-  it('should not be collapsible when collapsible is false', () => {
-    const nonCollapsible = { ...baseGroup, collapsible: false };
-    const { container } = render(<SectionGroup group={nonCollapsible} data={data} />);
-    // The top-level group heading should not have a cursor-pointer collapsible trigger
-    const heading = screen.getByText('Address Information');
-    const parentDiv = heading.closest('div');
-    // Non-collapsible group renders a static border-b div, not a CollapsibleTrigger
-    expect(parentDiv?.className).not.toContain('cursor-pointer');
-  });
-});

package/src/__tests__/SubscriptionToggle.test.tsx

@@ -1,84 +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 '@testing-library/jest-dom';
-import { SubscriptionToggle } from '../SubscriptionToggle';
-import type { RecordSubscription } from '@object-ui/types';
-
-describe('SubscriptionToggle', () => {
-  it('should render subscribed state', () => {
-    const sub: RecordSubscription = { recordId: '1', subscribed: true };
-    render(<SubscriptionToggle subscription={sub} />);
-    const btn = screen.getByRole('button');
-    expect(btn).toHaveAttribute('aria-label', 'Unsubscribe from notifications');
-  });
-
-  it('should render unsubscribed state', () => {
-    const sub: RecordSubscription = { recordId: '1', subscribed: false };
-    render(<SubscriptionToggle subscription={sub} />);
-    const btn = screen.getByRole('button');
-    expect(btn).toHaveAttribute('aria-label', 'Subscribe to notifications');
-  });
-
-  it('should call onToggle with new state when clicked', () => {
-    const onToggle = vi.fn();
-    const sub: RecordSubscription = { recordId: '1', subscribed: false };
-    render(<SubscriptionToggle subscription={sub} onToggle={onToggle} />);
-    fireEvent.click(screen.getByRole('button'));
-    expect(onToggle).toHaveBeenCalledWith(true);
-  });
-
-  it('should call onToggle with false when unsubscribing', () => {
-    const onToggle = vi.fn();
-    const sub: RecordSubscription = { recordId: '1', subscribed: true };
-    render(<SubscriptionToggle subscription={sub} onToggle={onToggle} />);
-    fireEvent.click(screen.getByRole('button'));
-    expect(onToggle).toHaveBeenCalledWith(false);
-  });
-
-  it('should be disabled when no onToggle provided', () => {
-    const sub: RecordSubscription = { recordId: '1', subscribed: true };
-    render(<SubscriptionToggle subscription={sub} />);
-    expect(screen.getByRole('button')).toBeDisabled();
-  });
-
-  it('should show title for subscribed state', () => {
-    const sub: RecordSubscription = { recordId: '1', subscribed: true };
-    render(<SubscriptionToggle subscription={sub} onToggle={() => {}} />);
-    expect(screen.getByRole('button')).toHaveAttribute('title', 'Subscribed — click to unsubscribe');
-  });
-
-  it('should show title for unsubscribed state', () => {
-    const sub: RecordSubscription = { recordId: '1', subscribed: false };
-    render(<SubscriptionToggle subscription={sub} onToggle={() => {}} />);
-    expect(screen.getByRole('button')).toHaveAttribute('title', 'Subscribe to notifications');
-  });
-
-  it('should be disabled during loading after click', async () => {
-    let resolveToggle: () => void;
-    const onToggle = vi.fn(() => new Promise<void>((r) => { resolveToggle = r; }));
-    const sub: RecordSubscription = { recordId: '1', subscribed: false };
-    render(<SubscriptionToggle subscription={sub} onToggle={onToggle} />);
-    fireEvent.click(screen.getByRole('button'));
-    expect(screen.getByRole('button')).toBeDisabled();
-    resolveToggle!();
-    await vi.waitFor(() => {
-      expect(screen.getByRole('button')).not.toBeDisabled();
-    });
-  });
-
-  it('should update aria-label based on subscribed state', () => {
-    const sub: RecordSubscription = { recordId: '1', subscribed: true };
-    const { rerender } = render(<SubscriptionToggle subscription={sub} onToggle={() => {}} />);
-    expect(screen.getByRole('button')).toHaveAttribute('aria-label', 'Unsubscribe from notifications');
-    rerender(<SubscriptionToggle subscription={{ ...sub, subscribed: false }} onToggle={() => {}} />);
-    expect(screen.getByRole('button')).toHaveAttribute('aria-label', 'Subscribe to notifications');
-  });
-});