refactor(ui): migrate DotFolderListView to @dotcms/ui - #36896
Conversation
- Extracted DotFolderListView component and related models/constants/mocks into the new `@dotcms/ui` library. - Updated imports in the Content Drive shell to reference the new location. - Introduced `selectionMode` input to support both single and multiple selection. - Re-exported necessary symbols from `@dotcms/ui` in the Content Drive UI for compatibility. - Added tests for the new component and selection mode functionality. This migration aims to share the folder/asset list component between Content Drive and future AssetPicker implementations, enhancing code reuse and maintainability.
There was a problem hiding this comment.
Pull request overview
This PR refactors the Content Drive folder list so it becomes a shared, reusable UI component under @dotcms/ui, enabling reuse by both Content Drive and the upcoming AssetPicker while preserving backward compatibility via thin re-exports from @dotcms/portlets/content-drive/ui.
Changes:
- Migrates
DotFolderListViewand its supporting column models/constants intocore-web/libs/uiand exports them from@dotcms/ui. - Adds
selectionMode('single' | 'multiple', default'multiple') and normalizesselectionChangeto always emitDotContentDriveItem[]. - Updates Content Drive shell imports to consume the component/types from
@dotcms/ui, while keeping@dotcms/portlets/content-drive/uire-exports for compatibility.
Reviewed changes
Copilot reviewed 12 out of 13 changed files in this pull request and generated no comments.
Show a summary per file
| File | Description |
|---|---|
| core-web/libs/ui/src/lib/components/dot-folder-list-view/models.ts | Introduces shared column model/types and selectionMode type for the migrated list view. |
| core-web/libs/ui/src/lib/components/dot-folder-list-view/mocks.ts | Provides local test fixtures for the list view specs under @dotcms/ui. |
| core-web/libs/ui/src/lib/components/dot-folder-list-view/constants.ts | Moves HEADER_COLUMNS and DOT_DRAG_ITEM into @dotcms/ui to support shared consumers. |
| core-web/libs/ui/src/lib/components/dot-folder-list-view/dot-folder-list-view.component.ts | Adds selectionMode, normalizes selection emission to arrays, and adjusts selection handling for PrimeNG single vs multiple modes. |
| core-web/libs/ui/src/lib/components/dot-folder-list-view/dot-folder-list-view.component.html | Switches table selection binding + renders checkbox vs radio UI based on selectionMode. |
| core-web/libs/ui/src/lib/components/dot-folder-list-view/dot-folder-list-view.component.scss | Fixes SCSS import paths after moving the component into libs/ui. |
| core-web/libs/ui/src/lib/components/dot-folder-list-view/dot-folder-list-view.component.spec.ts | Updates tests for new file locations and adds coverage for selectionMode behavior. |
| core-web/libs/ui/src/index.ts | Exports the migrated list view component/models/constants from @dotcms/ui. |
| core-web/libs/portlets/dot-content-drive/ui/src/lib/shared/models.ts | Removes list-view-specific models now hosted in @dotcms/ui. |
| core-web/libs/portlets/dot-content-drive/ui/src/lib/shared/constants.ts | Removes list-view-specific constants now hosted in @dotcms/ui. |
| core-web/libs/portlets/dot-content-drive/ui/src/index.ts | Re-exports list view symbols from @dotcms/ui to maintain compatibility for existing consumers. |
| core-web/libs/portlets/dot-content-drive/portlet/src/lib/dot-content-drive-shell/dot-content-drive-shell.component.ts | Updates imports to consume DotFolderListView* from @dotcms/ui. |
| core-web/libs/portlets/dot-content-drive/portlet/src/lib/dot-content-drive-shell/dot-content-drive-shell.component.spec.ts | Aligns test imports with the new @dotcms/ui location for the list view component. |
|
@copilot resolve the merge conflicts in this pull request |
…otfolderlistview-to-dotcms-ui # Conflicts: # core-web/libs/portlets/dot-content-drive/ui/src/lib/shared/constants.ts Co-authored-by: nicobytes <7611944+nicobytes@users.noreply.github.com>
|
Claude finished @nicobytes's task in 52s —— View job SDK Compatibility Analysis
Result: No SDK breaking changes detected. This PR ( None of the reviewed categories apply:
This is an admin-UI-only ( |
Summary
DotFolderListView(plus column models,HEADER_COLUMNS,DOT_DRAG_ITEM) from@dotcms/portlets/content-drive/uiinto@dotcms/uiso Content Drive and AssetPicker can share the same list.selectionModeinput (single|multiple, defaultmultiple) with radio vs checkbox UI;selectionChangealways emitsDotContentDriveItem[].@dotcms/uiand keep thin re-exports from content-drive/ui for compatibility (e.g. dropzone).Closes #36831
Related epic: #36702 (AssetPicker 1/7)
Test plan
pnpm exec nx test ui --testPathPatterns=dot-folder-list-viewpnpm exec nx test content-drive-uipnpm exec nx test portlets-content-drive --testPathPatterns=dot-content-drive-shellpnpm exec nx test portlets-content-drive --testPathPatterns=dot-content-drive-dropzoneMade with Cursor