diff --git a/core-web/apps/dotcms-ui/src/app/portlets/dot-edit-page/components/dot-palette/dot-palette-content-type/dot-palette-content-type.module.ts b/core-web/apps/dotcms-ui/src/app/portlets/dot-edit-page/components/dot-palette/dot-palette-content-type/dot-palette-content-type.module.ts index f4dd64ec9df6..a7b7eaa8d18c 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/dot-edit-page/components/dot-palette/dot-palette-content-type/dot-palette-content-type.module.ts +++ b/core-web/apps/dotcms-ui/src/app/portlets/dot-edit-page/components/dot-palette/dot-palette-content-type/dot-palette-content-type.module.ts @@ -2,14 +2,15 @@ import { CommonModule } from '@angular/common'; import { NgModule } from '@angular/core'; import { DotPaletteContentTypeComponent } from '@dotcms/app/portlets/dot-edit-page/components/dot-palette/dot-palette-content-type/dot-palette-content-type.component'; -import { DotIconModule, DotSpinnerModule } from '@dotcms/ui'; -import { DotPipesModule } from '@pipes/dot-pipes.module'; +import { DotPipesModule } from '@dotcms/app/view/pipes/dot-pipes.module'; +import { DotIconModule, DotMessagePipe, DotSpinnerModule } from '@dotcms/ui'; import { DotPaletteInputFilterModule } from '../dot-palette-input-filter/dot-palette-input-filter.module'; @NgModule({ imports: [ CommonModule, + DotMessagePipe, DotPipesModule, DotIconModule, DotSpinnerModule, diff --git a/core-web/libs/template-builder/src/lib/components/template-builder/components/template-builder-box/template-builder-box.component.spec.ts b/core-web/libs/template-builder/src/lib/components/template-builder/components/template-builder-box/template-builder-box.component.spec.ts index a3b67241ee6c..d317eadb3f18 100644 --- a/core-web/libs/template-builder/src/lib/components/template-builder/components/template-builder-box/template-builder-box.component.spec.ts +++ b/core-web/libs/template-builder/src/lib/components/template-builder/components/template-builder-box/template-builder-box.component.spec.ts @@ -11,7 +11,7 @@ import { ScrollPanelModule } from 'primeng/scrollpanel'; import { DotContainersService, DotMessageService } from '@dotcms/data-access'; import { DotMessagePipe } from '@dotcms/ui'; -import { DotContainersServiceMock, mockMatchMedia } from '@dotcms/utils-testing'; +import { containersMock, DotContainersServiceMock, mockMatchMedia } from '@dotcms/utils-testing'; import { TemplateBuilderBoxComponent } from './template-builder-box.component'; @@ -127,7 +127,9 @@ describe('TemplateBuilderBoxComponent', () => { it('should trigger addContainer when click on plus button', () => { const addContainerMock = jest.spyOn(spectator.component.addContainer, 'emit'); - const addButton = spectator.debugElement.query(By.css('.p-dropdown')); + const addButton = spectator.debugElement.query( + By.css('[data-testId="btn-plus"]>.p-dropdown') // The parent element is not listening to the click event + ); spectator.click(addButton); const option = spectator.query('.p-dropdown-item'); @@ -135,6 +137,29 @@ describe('TemplateBuilderBoxComponent', () => { expect(addContainerMock).toHaveBeenCalled(); }); + it('should emit addContainer with a identifier as identifier when source is DB', () => { + const addContainerMock = jest.spyOn(spectator.component.addContainer, 'emit'); + + spectator.triggerEventHandler("[data-testId='btn-plus']", 'onChange', { + value: containersMock[0] + }); + + expect(addContainerMock).toHaveBeenCalledWith(containersMock[0]); + }); + + it('should emit addContainer with a path as identifier when source is FILE', () => { + const addContainerMock = jest.spyOn(spectator.component.addContainer, 'emit'); + + spectator.triggerEventHandler("[data-testId='btn-plus']", 'onChange', { + value: containersMock[2] + }); + + expect(addContainerMock).toHaveBeenCalledWith({ + ...containersMock[2], + identifier: containersMock[2].path + }); + }); + it('should trigger editClasses when click on palette button', () => { const editStyleMock = jest.spyOn(spectator.component.editClasses, 'emit'); const paletteButton = spectator.query(byTestId('box-style-class-button')); diff --git a/core-web/libs/template-builder/src/lib/components/template-builder/components/template-builder-box/template-builder-box.component.ts b/core-web/libs/template-builder/src/lib/components/template-builder/components/template-builder-box/template-builder-box.component.ts index cf532e9dbd4b..f430c3f91e5f 100644 --- a/core-web/libs/template-builder/src/lib/components/template-builder/components/template-builder-box/template-builder-box.component.ts +++ b/core-web/libs/template-builder/src/lib/components/template-builder/components/template-builder-box/template-builder-box.component.ts @@ -18,7 +18,7 @@ import { DropdownModule } from 'primeng/dropdown'; import { ScrollPanelModule } from 'primeng/scrollpanel'; import { DotMessageService } from '@dotcms/data-access'; -import { DotContainer, DotContainerMap } from '@dotcms/dotcms-models'; +import { CONTAINER_SOURCE, DotContainer, DotContainerMap } from '@dotcms/dotcms-models'; import { DotContainerOptionsDirective, DotMessagePipe } from '@dotcms/ui'; import { DotTemplateBuilderContainer, TemplateBuilderBoxSize } from '../../models/models'; @@ -86,11 +86,24 @@ export class TemplateBuilderBoxComponent implements OnChanges { } onContainerSelect({ value }: { value: DotContainer }) { - this.addContainer.emit(value); + this.addContainer.emit({ ...value, identifier: this.getContainerReference(value) }); this.formControl.setValue(null); } requestColumnDelete() { this.deleteColumn.emit(); } + + /** + * Based on the container source, it returns the identifier that should be used as reference. + * + * @param dotContainer + * @returns string + * @memberof TemplateBuilderBoxComponent + */ + private getContainerReference(dotContainer: DotContainer): string { + return dotContainer.source === CONTAINER_SOURCE.FILE + ? dotContainer.path + : dotContainer.identifier; + } } diff --git a/core-web/libs/template-builder/src/lib/components/template-builder/store/template-builder.store.spec.ts b/core-web/libs/template-builder/src/lib/components/template-builder/store/template-builder.store.spec.ts index f2b22aff36e4..262897dc9669 100644 --- a/core-web/libs/template-builder/src/lib/components/template-builder/store/template-builder.store.spec.ts +++ b/core-web/libs/template-builder/src/lib/components/template-builder/store/template-builder.store.spec.ts @@ -39,14 +39,17 @@ describe('DotTemplateBuilderStore', () => { identifier: mockContainer.identifier }; - const addContainer = () => { + const addContainer = (container = mockContainer) => { const parentRow = initialState[0]; const columnToAddContainer: DotGridStackWidget = { ...parentRow.subGridOpts?.children[0], parentId: parentRow.id as string }; - service.addContainer({ affectedColumn: columnToAddContainer, container: mockContainer }); + service.addContainer({ + affectedColumn: columnToAddContainer, + container + }); }; beforeEach(() => { diff --git a/core-web/libs/utils-testing/src/lib/dot-containers.mock.ts b/core-web/libs/utils-testing/src/lib/dot-containers.mock.ts index 95123eb83db9..b0c9ef351802 100644 --- a/core-web/libs/utils-testing/src/lib/dot-containers.mock.ts +++ b/core-web/libs/utils-testing/src/lib/dot-containers.mock.ts @@ -153,11 +153,13 @@ export const containersMockArray = [ ]; export const containersMock: DotContainer[] = containersMockArray.map( - ({ name, identifier, parentPermissionable }) => ({ + ({ name, identifier, parentPermissionable, path, source }) => ({ friendlyName: name, title: name, parentPermissionable: { hostname: parentPermissionable.hostname }, - identifier: identifier + identifier: identifier, + source, + path }) );