Fix view add/edit 404 & replace design mode toggle with admin auto-detect - #633
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
…navigation 404
- Replace useState designMode toggle with useAuth isAdmin check
- Admin users automatically see design tools (no toggle needed)
- Non-admin users see no design entry points
- Fix 404 by adding { relative: 'path' } to all view navigate calls
- Update tests for admin/non-admin design tools visibility and navigation
Co-authored-by: hotlong <50353452+hotlong@users.noreply.github.com>
Co-authored-by: hotlong <50353452+hotlong@users.noreply.github.com>
There was a problem hiding this comment.
Pull request overview
This PR addresses a critical navigation bug and improves the UX for admin users by removing unnecessary friction in the design mode workflow.
Changes:
- Fixed 404 errors when navigating to view designer from nested view routes by adding
{ relative: 'path' }option to allnavigate()calls - Replaced the "Enter/Exit Design Mode" toggle with automatic admin detection using
useAuth()→isAdminpattern - Added comprehensive test coverage for admin/non-admin visibility and navigation paths with 6 new test cases
Reviewed changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated 3 comments.
| File | Description |
|---|---|
| apps/console/src/components/ObjectView.tsx | Fixed navigation 404s with relative: 'path' option; replaced design mode toggle with isAdmin auto-detection; removed unused MoreVertical import |
| apps/console/src/tests/ObjectView.test.tsx | Added auth mocking infrastructure and 6 new tests for admin visibility and relative path navigation |
| ROADMAP_CONSOLE.md | Documented G14 (view 404 fix) and task 5.9 (admin auto-design mode) |
| | 5.6 | Row-level security | ⚠️ Partial (server-side assumed; client `DataScopeManager` types only) | | ||
| | 5.7 | Permission-denied fallback UI | ✅ Done (`PermissionGuard`) | | ||
| | 5.8 | Integration with ObjectStack RBAC API | ✅ Done | | ||
| | 5.9 | Admin auto-design mode (no toggle) | ✅ Done — design tools (Edit/Add View, Metadata Inspector) auto-visible for `isAdmin` users; non-admin users see no design entry. Fixes #628 | |
There was a problem hiding this comment.
| fireEvent.click(addViewBtn); | ||
|
|
||
| expect(mockNavigate).toHaveBeenCalledWith('views/new', { relative: 'path' }); | ||
| }); |
There was a problem hiding this comment.
While the tests verify "Add View" navigation with the relative path fix, there's no test case for "Edit View" navigation which also uses the same { relative: 'path' } fix (line 344 in ObjectView.tsx). Consider adding a test case to verify that clicking "Edit View" also navigates correctly with the relative path option from both nested and root routes.
| }); | |
| }); | |
| it('navigates to edit view designer with relative path from nested view route', () => { | |
| mockAuthUser = { id: 'u1', name: 'Admin', role: 'admin' }; | |
| mockUseParams.mockReturnValue({ objectName: 'opportunity', viewId: 'pipeline' }); | |
| render(<ObjectView dataSource={mockDataSource} objects={mockObjects} onEdit={vi.fn()} />); | |
| const designBtn = screen.getByTitle('console.objectView.designTools'); | |
| fireEvent.click(designBtn); | |
| const editViewBtn = screen.getByText('console.objectView.editView'); | |
| fireEvent.click(editViewBtn); | |
| expect(mockNavigate).toHaveBeenCalledWith(expect.any(String), { relative: 'path' }); | |
| }); | |
| it('navigates to edit view designer with relative path from root object route', () => { | |
| mockAuthUser = { id: 'u1', name: 'Admin', role: 'admin' }; | |
| mockUseParams.mockReturnValue({ objectName: 'opportunity' }); | |
| render(<ObjectView dataSource={mockDataSource} objects={mockObjects} onEdit={vi.fn()} />); | |
| const designBtn = screen.getByTitle('console.objectView.designTools'); | |
| fireEvent.click(designBtn); | |
| const editViewBtn = screen.getByText('console.objectView.editView'); | |
| fireEvent.click(editViewBtn); | |
| expect(mockNavigate).toHaveBeenCalledWith(expect.any(String), { relative: 'path' }); | |
| }); |
| | G11 | Collaboration data hardcoded | ✅ | Presence/activity/comments now fetched from API; fallback to defaults when API unavailable | | ||
| | G12 | ReportBuilder uses mock fields | ✅ | `availableFields` derived from object schema via `useMetadata().objects` | | ||
| | G13 | ViewDesigner save not persisted | ✅ | `handleSave` calls `dataSource.create/update('sys_view', config)` | | ||
| | G14 | View add/edit navigates to 404 | ✅ | Fixed relative navigation in ObjectView (added `{ relative: 'path' }` to all view designer navigate calls). Fixes #628 | |
There was a problem hiding this comment.
View designer navigation from nested view routes (
:objectName/view/:viewId) produced 404s due to route-relative resolution. The "Enter/Exit Design Mode" toggle added unnecessary friction for admin users.Navigation 404 fix
navigate()calls for Edit View, Add View, and ViewTabBar'sonAddViewused default route-relative resolution, which breaks on flat sibling routes. Added{ relative: 'path' }for correct URL-relative resolution:Admin auto-design mode
useState(false)designMode toggle withuseAuth()→isAdmin(user?.role === 'admin'), matching the existing pattern used in system admin pages+button hidden viaonAddView={undefined}MoreVerticalimportTests
{ relative: 'path' }from both root and nested routes@object-ui/authmock and simplified dropdown mocks for testabilityRoadmap
ROADMAP_CONSOLE.mdOriginal prompt
💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.