Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion ROADMAP.md
Original file line number Diff line number Diff line change
Expand Up @@ -216,12 +216,16 @@ ObjectUI is a universal Server-Driven UI (SDUI) engine built on React + Tailwind
1. ~~**`generateViewSchema` (plugin-view):** Hardcodes `showSearch: false` for non-grid views~~ → Now propagates from `activeView`
2. ~~**Console `renderListView`:** Omits toolbar/display flags from `fullSchema`~~ → Now passes all config properties
3. ~~**`NamedListView` type:** Missing toolbar/display properties~~ → Added as first-class properties
4. **No per-view-type integration tests:** Pending — tests verify config reaches `fullSchema`, but per-renderer integration tests still needed
4. ~~**Plugin `renderListView` schema missing toolbar flags:** `renderContent` → `renderListView` schema did not include `showSearch`/`showFilters`/`showSort`~~ → Now propagated (PR #771)
5. ~~**ListView toolbar unconditionally rendered:** Search/Filter/Sort buttons always visible regardless of schema flags~~ → Now conditionally rendered based on `schema.showSearch`/`showFilters`/`showSort` (PR #771)
6. **No per-view-type integration tests:** Pending — tests verify config reaches `fullSchema`, but per-renderer integration tests still needed

**Phase 1 — Grid/Table View (baseline, already complete):**
- [x] `gridSchema` includes `striped`/`bordered` from `activeView`
- [x] `showSort`/`showSearch`/`showFilters` passed via `ObjectViewSchema`
- [x] `useMemo` dependency arrays cover all grid config
- [x] ListView toolbar buttons conditionally rendered based on `schema.showSearch`/`showFilters`/`showSort` (PR #771)
- [x] `renderListView` schema includes toolbar toggle flags (`showSearch`/`showFilters`/`showSort`) and display props (`striped`/`bordered`/`color`) (PR #771)

**Phase 2 — Kanban Live Preview:**
- [x] Propagate `showSort`/`showSearch`/`showFilters` through `generateViewSchema` kanban branch
Expand Down
6 changes: 6 additions & 0 deletions packages/plugin-list/src/ListView.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -871,6 +871,7 @@ export const ListView: React.FC<ListViewProps> = ({
</Popover>

{/* Filter */}
{schema.showFilters !== false && (
<Popover open={showFilters} onOpenChange={setShowFilters}>
<PopoverTrigger asChild>
<Button
Expand Down Expand Up @@ -906,6 +907,7 @@ export const ListView: React.FC<ListViewProps> = ({
</div>
</PopoverContent>
</Popover>
)}

{/* Group */}
<Button
Expand All @@ -919,6 +921,7 @@ export const ListView: React.FC<ListViewProps> = ({
</Button>

{/* Sort */}
{schema.showSort !== false && (
<Popover open={showSort} onOpenChange={setShowSort}>
<PopoverTrigger asChild>
<Button
Expand Down Expand Up @@ -954,6 +957,7 @@ export const ListView: React.FC<ListViewProps> = ({
</div>
</PopoverContent>
</Popover>
)}

{/* Color */}
<Button
Expand Down Expand Up @@ -1026,6 +1030,7 @@ export const ListView: React.FC<ListViewProps> = ({
</div>

{/* Right: Search */}
{schema.showSearch !== false && (
<div className="flex items-center gap-1">
{searchExpanded ? (
<div className="relative w-36 sm:w-48 lg:w-64">
Expand Down Expand Up @@ -1064,6 +1069,7 @@ export const ListView: React.FC<ListViewProps> = ({
</Button>
Comment on lines 1033 to 1069
Copy link

Copilot AI Feb 22, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

On small screens the button label is hidden (hidden sm:inline), and the icon doesn’t provide an accessible name. Add an aria-label (and/or title) to the Search trigger button so it remains accessible when rendered icon-only.

Copilot uses AI. Check for mistakes.
)}
</div>
)}
</div>


Expand Down
95 changes: 95 additions & 0 deletions packages/plugin-list/src/__tests__/ListView.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -598,4 +598,99 @@ describe('ListView', () => {
expect(screen.queryByTestId('user-filters')).not.toBeInTheDocument();
});
});

// ============================
// Toolbar Toggle Visibility
// ============================
describe('Toolbar Toggle Visibility', () => {
it('should hide Search button when showSearch is false', () => {
const schema: ListViewSchema = {
type: 'list-view',
objectName: 'contacts',
viewType: 'grid',
fields: ['name', 'email'],
showSearch: false,
};

renderWithProvider(<ListView schema={schema} />);
expect(screen.queryByRole('button', { name: /search/i })).not.toBeInTheDocument();
});

it('should show Search button when showSearch is true', () => {
const schema: ListViewSchema = {
type: 'list-view',
objectName: 'contacts',
viewType: 'grid',
fields: ['name', 'email'],
showSearch: true,
};

renderWithProvider(<ListView schema={schema} />);
expect(screen.getByRole('button', { name: /search/i })).toBeInTheDocument();
});

it('should show Search button when showSearch is undefined (default)', () => {
const schema: ListViewSchema = {
type: 'list-view',
objectName: 'contacts',
viewType: 'grid',
fields: ['name', 'email'],
};

renderWithProvider(<ListView schema={schema} />);
expect(screen.getByRole('button', { name: /search/i })).toBeInTheDocument();
});

it('should hide Filter button when showFilters is false', () => {
const schema: ListViewSchema = {
type: 'list-view',
objectName: 'contacts',
viewType: 'grid',
fields: ['name', 'email'],
showFilters: false,
};

renderWithProvider(<ListView schema={schema} />);
expect(screen.queryByRole('button', { name: /filter/i })).not.toBeInTheDocument();
});

it('should show Filter button when showFilters is true', () => {
const schema: ListViewSchema = {
type: 'list-view',
objectName: 'contacts',
viewType: 'grid',
fields: ['name', 'email'],
showFilters: true,
};

renderWithProvider(<ListView schema={schema} />);
expect(screen.getByRole('button', { name: /filter/i })).toBeInTheDocument();
});

it('should hide Sort button when showSort is false', () => {
const schema: ListViewSchema = {
type: 'list-view',
objectName: 'contacts',
viewType: 'grid',
fields: ['name', 'email'],
showSort: false,
};

renderWithProvider(<ListView schema={schema} />);
expect(screen.queryByRole('button', { name: /^sort$/i })).not.toBeInTheDocument();
});

it('should show Sort button when showSort is true', () => {
const schema: ListViewSchema = {
type: 'list-view',
objectName: 'contacts',
viewType: 'grid',
fields: ['name', 'email'],
showSort: true,
};

renderWithProvider(<ListView schema={schema} />);
expect(screen.getByRole('button', { name: /^sort$/i })).toBeInTheDocument();
});
});
});
8 changes: 8 additions & 0 deletions packages/plugin-view/src/ObjectView.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -813,6 +813,14 @@ export const ObjectView: React.FC<ObjectViewProps> = ({
densityMode: activeView?.densityMode,
groupBy: activeView?.groupBy,
options: currentNamedViewConfig?.options || activeView,
// Propagate toolbar toggle flags
showSearch: activeView?.showSearch ?? schema.showSearch,
showFilters: activeView?.showFilters ?? schema.showFilters,
showSort: activeView?.showSort ?? schema.showSort,
// Propagate display properties
striped: activeView?.striped ?? (schema as any).striped,
bordered: activeView?.bordered ?? (schema as any).bordered,
color: activeView?.color ?? (schema as any).color,
Comment on lines +821 to +823
Copy link

Copilot AI Feb 22, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

striped/bordered/color fall back to (schema as any) here, but ObjectViewSchema doesn’t define these fields at the top level (they live under schema.table or NamedListView). This means when activeView is undefined, the display props won’t propagate to renderListView as intended. Consider falling back to schema.table?.striped/schema.table?.bordered and (for color) currentNamedViewConfig?.color (or omit the schema fallback if there is no schema-level source).

Suggested change
striped: activeView?.striped ?? (schema as any).striped,
bordered: activeView?.bordered ?? (schema as any).bordered,
color: activeView?.color ?? (schema as any).color,
striped: activeView?.striped ?? schema.table?.striped,
bordered: activeView?.bordered ?? schema.table?.bordered,
color: activeView?.color ?? currentNamedViewConfig?.color,

Copilot uses AI. Check for mistakes.
},
dataSource,
onEdit: handleEdit,
Expand Down
59 changes: 59 additions & 0 deletions packages/plugin-view/src/__tests__/ObjectView.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -549,5 +549,64 @@ describe('ObjectView', () => {
// Component renders without crash — showSort is respected
expect(screen.getByTestId('object-grid')).toBeInTheDocument();
});

it('should include showSearch/showFilters/showSort in renderListView schema', async () => {
const schema: ObjectViewSchema = {
type: 'object-view',
objectName: 'contacts',
showSearch: false,
showFilters: false,
showSort: false,
};

const renderListViewSpy = vi.fn(({ schema: listSchema }: any) => (
<div data-testid="custom-list">Custom ListView</div>
));
Comment on lines +562 to +564
Copy link

Copilot AI Feb 22, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

renderListViewSpy destructures schema: listSchema but never uses listSchema in this test, which can trip lint rules (no-unused-vars) and adds noise. Consider removing the destructuring or renaming it to _listSchema.

Copilot uses AI. Check for mistakes.

render(
<ObjectView
schema={schema}
dataSource={mockDataSource}
renderListView={renderListViewSpy}
/>,
);

expect(renderListViewSpy).toHaveBeenCalled();
const callSchema = renderListViewSpy.mock.calls[0]?.[0]?.schema;
expect(callSchema?.showSearch).toBe(false);
expect(callSchema?.showFilters).toBe(false);
expect(callSchema?.showSort).toBe(false);
});

it('should propagate showSearch/showFilters/showSort from activeView in renderListView', async () => {
const schema: ObjectViewSchema = {
type: 'object-view',
objectName: 'contacts',
};

const renderListViewSpy = vi.fn(({ schema: listSchema }: any) => (
<div data-testid="custom-list">Custom ListView</div>
));
Comment on lines +587 to +589
Copy link

Copilot AI Feb 22, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

renderListViewSpy destructures schema: listSchema but never uses listSchema in this test, which can trip lint rules (no-unused-vars) and adds noise. Consider removing the destructuring or renaming it to _listSchema.

Copilot uses AI. Check for mistakes.

const views = [
{ id: 'v1', label: 'View 1', type: 'grid' as const, showSearch: false, showFilters: false, showSort: false },
];

render(
<ObjectView
schema={schema}
dataSource={mockDataSource}
views={views}
activeViewId="v1"
renderListView={renderListViewSpy}
/>,
);

expect(renderListViewSpy).toHaveBeenCalled();
const callSchema = renderListViewSpy.mock.calls[0]?.[0]?.schema;
expect(callSchema?.showSearch).toBe(false);
expect(callSchema?.showFilters).toBe(false);
expect(callSchema?.showSort).toBe(false);
});
});
});