diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-category-field/components/dot-edit-content-category-field-sidebar/dot-edit-content-category-field-sidebar.component.scss b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-category-field/components/dot-edit-content-category-field-sidebar/dot-edit-content-category-field-sidebar.component.scss index d92ce35afaa6..0c6023307745 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-category-field/components/dot-edit-content-category-field-sidebar/dot-edit-content-category-field-sidebar.component.scss +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-category-field/components/dot-edit-content-category-field-sidebar/dot-edit-content-category-field-sidebar.component.scss @@ -1,10 +1,11 @@ @use "variables" as *; .category-field__header { + height: 60px; align-items: center; flex-wrap: wrap; gap: $spacing-0; - padding: $spacing-1 $spacing-4; + padding: 0 $spacing-4; } .category-field__header-title { @@ -33,6 +34,7 @@ border: $field-border-size solid $color-palette-gray-400; border-radius: $border-radius-md; background-color: $white; + padding: $spacing-3; } diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-category-field/dot-edit-content-category-field.component.spec.ts b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-category-field/dot-edit-content-category-field.component.spec.ts index 718afe8267cd..62dcda1cebf0 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-category-field/dot-edit-content-category-field.component.spec.ts +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-category-field/dot-edit-content-category-field.component.spec.ts @@ -1,12 +1,11 @@ -import { byTestId, createComponentFactory, mockProvider, Spectator } from '@ngneat/spectator/jest'; - -import { fakeAsync } from '@angular/core/testing'; +import { expect, it } from '@jest/globals'; +import { byTestId, createComponentFactory, Spectator } from '@ngneat/spectator'; +import { mockProvider } from '@ngneat/spectator/jest'; import { DotMessageService } from '@dotcms/data-access'; import { DotEditContentCategoryFieldSidebarComponent } from './components/dot-edit-content-category-field-sidebar/dot-edit-content-category-field-sidebar.component'; import { DotEditContentCategoryFieldComponent } from './dot-edit-content-category-field.component'; -import { CLOSE_SIDEBAR_CSS_DELAY_MS } from './dot-edit-content-category-field.const'; describe('DotEditContentCategoryFieldComponent', () => { let spectator: Spectator; @@ -72,7 +71,7 @@ describe('DotEditContentCategoryFieldComponent', () => { expect(spectator.query(DotEditContentCategoryFieldSidebarComponent)).not.toBeNull(); }); - it('should remove DotEditContentCategoryFieldSidebarComponent when `closedSidebar` emit', fakeAsync(() => { + it('should remove DotEditContentCategoryFieldSidebarComponent when `closedSidebar` emit', async () => { const selectBtn = spectator.query(byTestId('show-sidebar-btn')) as HTMLButtonElement; expect(selectBtn).not.toBeNull(); spectator.click(selectBtn); @@ -87,11 +86,12 @@ describe('DotEditContentCategoryFieldComponent', () => { spectator.detectComponentChanges(); // Due to a delay in the pipe of the subscription - spectator.tick(CLOSE_SIDEBAR_CSS_DELAY_MS + 100); + await new Promise((resolve) => setTimeout(resolve, 400)); expect(spectator.query(DotEditContentCategoryFieldSidebarComponent)).toBeNull(); + spectator.detectComponentChanges(); expect(selectBtn.disabled).toBe(false); - })); + }); }); }); diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-category-field/dot-edit-content-category-field.component.ts b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-category-field/dot-edit-content-category-field.component.ts index 70ab22043ef7..a2ce3380e897 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-category-field/dot-edit-content-category-field.component.ts +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-category-field/dot-edit-content-category-field.component.ts @@ -23,7 +23,8 @@ import { DotCMSContentTypeField } from '@dotcms/dotcms-models'; import { DotDynamicDirective, DotMessagePipe } from '@dotcms/ui'; import { DotEditContentCategoryFieldSidebarComponent } from './components/dot-edit-content-category-field-sidebar/dot-edit-content-category-field-sidebar.component'; -import { CLOSE_SIDEBAR_CSS_DELAY_MS } from './dot-edit-content-category-field.const'; + +const CLOSE_SIDEBAR_CSS_DELAY_MS = 300; /** * Component for editing content category field.