From 7e0593fad3c5ce87582a1ef96826a4a4beb8407f Mon Sep 17 00:00:00 2001 From: Arcadio Quintero Date: Thu, 14 Nov 2024 12:41:39 -0500 Subject: [PATCH] feat(edit-content) handle 2 workflows for 1 contenttype --- .../dot-workflows-actions.service.ts | 27 +- .../src/lib/dot-workflow-action.model.ts | 25 ++ .../components/messages/_message.scss | 262 ++++++++++-------- .../dot-edit-content-form.component.html | 26 +- .../dot-edit-content-form.component.spec.ts | 12 +- ...content-sidebar-information.component.html | 104 ++++--- ...tent-sidebar-information.component.spec.ts | 2 +- ...it-content-sidebar-workflow.component.html | 84 ++++-- ...it-content-sidebar-workflow.component.scss | 17 +- ...edit-content-sidebar-workflow.component.ts | 117 +++++++- .../dot-edit-content-sidebar.component.html | 32 ++- ...dot-edit-content-sidebar.component.spec.ts | 2 + .../dot-edit-content-sidebar.component.ts | 39 ++- .../edit-content.layout.component.html | 76 +++-- .../edit-content.layout.component.scss | 4 + .../edit-content.layout.component.spec.ts | 77 ++++- .../edit-content.layout.component.ts | 31 ++- .../store/edit-content.store.spec.ts | 13 +- .../edit-content/store/edit-content.store.ts | 88 +++++- .../store/features/workflow.feature.ts | 83 ++---- .../models/dot-edit-content-status.enum.ts | 2 +- .../lib/pipes/contentlet-status.pipe.spec.ts | 4 +- .../src/lib/pipes/contentlet-status.pipe.ts | 84 +++--- .../src/lib/utils/edit-content.mock.ts | 100 +++++++ .../src/lib/utils/functions.util.spec.ts | 44 ++- .../src/lib/utils/functions.util.ts | 38 ++- .../src/lib/dot-workflows-actions.mock.ts | 244 +++++++++++++++- .../WEB-INF/messages/Language.properties | 10 + 28 files changed, 1299 insertions(+), 348 deletions(-) diff --git a/core-web/libs/data-access/src/lib/dot-workflows-actions/dot-workflows-actions.service.ts b/core-web/libs/data-access/src/lib/dot-workflows-actions/dot-workflows-actions.service.ts index f873623ac7dd..39f4fb88cf71 100644 --- a/core-web/libs/data-access/src/lib/dot-workflows-actions/dot-workflows-actions.service.ts +++ b/core-web/libs/data-access/src/lib/dot-workflows-actions/dot-workflows-actions.service.ts @@ -6,7 +6,7 @@ import { Injectable, inject } from '@angular/core'; import { map, pluck } from 'rxjs/operators'; import { DotCMSResponse } from '@dotcms/dotcms-js'; -import { DotCMSWorkflowAction, DotCMSWorkflow } from '@dotcms/dotcms-models'; +import { DotCMSWorkflow, DotCMSWorkflowAction, DotCMSWorkflowStep } from '@dotcms/dotcms-models'; export enum DotRenderMode { LISTING = 'LISTING', @@ -51,7 +51,7 @@ export class DotWorkflowsActionsService { /** * Returns the workflow actions of the passed contentType - * + * @deprecated * @param {string} inode * @param {DotRenderMode} [renderMode] * @returns {Observable} @@ -75,4 +75,27 @@ export class DotWorkflowsActionsService { private getWorkFlowId(workflow: DotCMSWorkflow): string { return workflow && workflow.id; } + + getWorkFlowActions(contentTypeName: string): Observable< + { + scheme: DotCMSWorkflow; + action: DotCMSWorkflowAction; + firstStep: DotCMSWorkflowStep; + }[] + > { + return this.httpClient + .get< + DotCMSResponse< + { + scheme: DotCMSWorkflow; + action: DotCMSWorkflowAction; + firstStep: DotCMSWorkflowStep; + }[] + > + >(`${this.BASE_URL}/defaultactions/contenttype/${contentTypeName}`) + .pipe( + pluck('entity'), + map((res) => res || []) + ); + } } diff --git a/core-web/libs/dotcms-models/src/lib/dot-workflow-action.model.ts b/core-web/libs/dotcms-models/src/lib/dot-workflow-action.model.ts index e7f52d5dfe4a..f0fb2d4075c2 100644 --- a/core-web/libs/dotcms-models/src/lib/dot-workflow-action.model.ts +++ b/core-web/libs/dotcms-models/src/lib/dot-workflow-action.model.ts @@ -24,6 +24,19 @@ export interface DotCMSWorkflowAction { showOn: string[]; actionInputs: DotCMSWorkflowInput[]; metadata?: Record; + hasArchiveActionlet?: boolean; + hasCommentActionlet?: boolean; + hasDeleteActionlet?: boolean; + hasDestroyActionlet?: boolean; + hasMoveActionletActionlet?: boolean; + hasMoveActionletHasPathActionlet?: boolean; + hasOnlyBatchActionlet?: boolean; + hasPublishActionlet?: boolean; + hasPushPublishActionlet?: boolean; + hasResetActionlet?: boolean; + hasSaveActionlet?: boolean; + hasUnarchiveActionlet?: boolean; + hasUnpublishActionlet?: boolean; } export enum DotCMSSystemActionType { @@ -58,3 +71,15 @@ export interface DotCMSWorkflowInput { id: string; body: any; } + +export interface DotCMSWorkflowStep { + creationDate: number; + enableEscalation: boolean; + escalationAction: null; + escalationTime: number; + id: string; + myOrder: number; + name: string; + resolved: boolean; + schemeId: string; +} diff --git a/core-web/libs/dotcms-scss/angular/dotcms-theme/components/messages/_message.scss b/core-web/libs/dotcms-scss/angular/dotcms-theme/components/messages/_message.scss index ad9907fbd8fb..0f3ebfdeb968 100644 --- a/core-web/libs/dotcms-scss/angular/dotcms-theme/components/messages/_message.scss +++ b/core-web/libs/dotcms-scss/angular/dotcms-theme/components/messages/_message.scss @@ -1,63 +1,132 @@ @use "variables" as *; + +/* Base styles for inline messages */ .p-inline-message { padding: $spacing-2 $spacing-2; margin: 0; - border-radius: $border-radius-xs; + border-radius: $border-radius-md; + background: transparent; + border: 1px solid; } + +/* Styles for each type of inline message */ .p-inline-message.p-inline-message-info { - background: #b3e5fc; - border: solid transparent; - border-width: 1px; - color: #01579b; -} -.p-inline-message.p-inline-message-info .p-inline-message-icon { - color: #01579b; + background: transparent; + border-color: $color-palette-blue; + color: $black; } + .p-inline-message.p-inline-message-success { - background: #c8e6c9; - border: solid transparent; - border-width: 1px; - color: #1b5e20; -} -.p-inline-message.p-inline-message-success .p-inline-message-icon { - color: #1b5e20; + background: transparent; + border-color: $color-palette-green; + color: $black; } + .p-inline-message.p-inline-message-warn { - background: #ffecb3; - border: solid transparent; - border-width: 1px; - color: #7f6003; -} -.p-inline-message.p-inline-message-warn .p-inline-message-icon { - color: #7f6003; + background: transparent; + border-color: $color-palette-yellow; + color: $black; } + .p-inline-message.p-inline-message-error { - background: #ffcdd2; - border: solid transparent; - border-width: 1px; - color: #b71c1c; -} -.p-inline-message.p-inline-message-error .p-inline-message-icon { - color: #b71c1c; + background: transparent; + border-color: $color-palette-red; + color: $black; } -.p-inline-message .p-inline-message-icon { - font-size: $font-size-md; - margin-right: $spacing-1; + +/* Base styles for regular messages */ +.p-message { + margin: 0; + border-radius: $border-radius-md; + position: relative; + background: transparent !important; + border: 1px solid transparent; + + /* Wider left border */ + &::before { + content: ""; + position: absolute; + left: 0; + top: 0; + height: 100%; + width: 9px; + border-radius: $border-radius-md 0 0 $border-radius-md; + } + + .p-message-wrapper { + padding: $spacing-2 $spacing-4; + justify-content: center; + } + + .p-message-text { + font-size: $font-size-md; + font-weight: $font-weight-semi-bold; + } + + .p-message-icon { + font-size: $font-size-lg; + margin-right: $spacing-1; + } } -.p-inline-message .p-inline-message-text { - font-size: $font-size-md; + +/* Specific styles for each message type */ +.p-message.p-message-info { + background: transparent; + border-color: $color-palette-blue; + color: $black; + + &::before { + background: $color-palette-blue; + } + + .p-message-icon { + color: $color-palette-blue; + } } -.p-inline-message.p-inline-message-icon-only .p-inline-message-icon { - margin-right: 0; + +.p-message.p-message-success { + background: transparent; + border-color: $color-palette-green; + color: $black; + + &::before { + background: $color-palette-green; + } + + .p-message-icon { + color: $color-palette-green; + } } -.p-message { - margin: 0; - border-radius: $border-radius-xs; +.p-message.p-message-warn { + background: transparent; + border-color: $color-palette-yellow; + color: $black; + + &::before { + background: $color-palette-yellow; + } + + .p-message-icon { + color: $color-palette-yellow; + } } -.p-message .p-message-wrapper { - padding: $spacing-3 $spacing-4; + +.p-message.p-message-error { + background: transparent; + border-color: $color-palette-red; + color: $black; + + &::before { + background: $color-palette-red; + } + + .p-message-icon { + color: $color-palette-red; + } } + +/* Styles for close button */ .p-message .p-message-close { width: $spacing-5; height: $spacing-5; @@ -67,88 +136,47 @@ background-color 0.2s, color 0.2s, box-shadow 0.2s; -} -.p-message .p-message-close:hover { - background: $color-palette-white-op-30; -} -.p-message .p-message-close:focus { - outline: 0 none; - outline-offset: 0; - box-shadow: none; -} -.p-message.p-message-info { - background: #b3e5fc; - border: solid transparent; - border-width: 0 0 0 0; - color: #01579b; -} -.p-message.p-message-info .p-message-icon { - color: #01579b; -} -.p-message.p-message-info .p-message-close { - color: #01579b; -} -.p-message.p-message-success { - background: rgba(245, 253, 248, 1); - border: solid transparent; - border-width: 0 0 0 0; - color: $black; - .pi { - color: rgba(62, 217, 122, 1); + &:hover { + background: $color-palette-white-op-30; } -} -.p-message.p-message-success { - border: solid rgba(62, 217, 122, 1); - border-width: 0 0 0 0; -} -.p-message.p-message-success .p-message-icon { - color: rgba(62, 217, 122, 1); -} -.p-message.p-message-success .p-message-close { - color: rgba(62, 217, 122, 1); -} -.p-messages.p-message-border-y:has(.p-message.p-message-success) { - border: 0 solid rgba(62, 217, 122, 1); - border-top-width: 1px; - border-bottom-width: 1px; -} -.p-message.p-message-warn { - background: #ffecb3; - border: solid transparent; - border-width: 0 0 0 0; - color: #7f6003; -} -.p-message.p-message-warn .p-message-icon { - color: #7f6003; -} -.p-message.p-message-warn .p-message-close { - color: #7f6003; -} -.p-message.p-message-error { - background: #ffcdd2; - border: solid transparent; - border-width: 0 0 0 0; - color: #b71c1c; + &:focus { + outline: 0 none; + outline-offset: 0; + box-shadow: none; + } } -.p-message.p-message-error .p-message-icon { - color: #b71c1c; + +/* Styles for centered messages */ +.p-message.message-centered .p-message-wrapper { + justify-content: center; } -.p-message.p-message-error .p-message-close { - color: #b71c1c; + +/* Text and details */ +.p-message { + .p-message-summary { + font-weight: 700; + } + + .p-message-detail { + margin-left: $spacing-1; + } } -.p-message .p-message-text { - font-size: $font-size-md; + +/* Styles for Warning text */ +.p-message.p-message-warn .p-message-text:has(> span)::before { + content: "Warning "; font-weight: $font-weight-semi-bold; } -.p-message .p-message-icon { - font-size: $font-size-lg; - margin-right: $spacing-1; -} -.p-message .p-message-summary { - font-weight: 700; -} -.p-message .p-message-detail { - margin-left: $spacing-1; + +/* Styles for links inside messages */ +.p-message .p-message-text a { + color: var(--primary-color); + text-decoration: none; + margin-left: 0.25rem; + + &:hover { + text-decoration: underline; + } } diff --git a/core-web/libs/edit-content/src/lib/components/dot-edit-content-form/dot-edit-content-form.component.html b/core-web/libs/edit-content/src/lib/components/dot-edit-content-form/dot-edit-content-form.component.html index ab42f266c4f3..0fe4ce909fbd 100644 --- a/core-web/libs/edit-content/src/lib/components/dot-edit-content-form/dot-edit-content-form.component.html +++ b/core-web/libs/edit-content/src/lib/components/dot-edit-content-form/dot-edit-content-form.component.html @@ -1,6 +1,8 @@ @let contentType = $store.contentType(); @let contentlet = $store.contentlet(); @let showSidebar = $store.showSidebar(); +@let showSelectWorkflowWarning = $store.showSelectWorkflowWarning(); +@let actions = $store.actions(); @if (form) { @@ -74,17 +76,19 @@
- + @if (!showSelectWorkflowWarning) { + + }
{ of(MOCK_WORKFLOW_ACTIONS_NEW_ITEMNTTYPE_1_TAB) ); dotEditContentService.getContentById.mockReturnValue(of(MOCK_CONTENTLET_1_OR_2_TABS)); + workflowActionsService.getWorkFlowActions.mockReturnValue( + of(MOCK_SINGLE_WORKFLOW_ACTIONS) + ); store.initializeExistingContent(MOCK_CONTENTLET_1_OR_2_TABS.inode); // called with the inode of the contentlet + spectator.detectChanges(); }); @@ -152,6 +156,9 @@ describe('DotFormComponent', () => { workflowActionsService.getDefaultActions.mockReturnValue( of(MOCK_WORKFLOW_ACTIONS_NEW_ITEMNTTYPE_1_TAB) ); + workflowActionsService.getWorkFlowActions.mockReturnValue( + of(MOCK_SINGLE_WORKFLOW_ACTIONS) + ); store.initializeNewContent('TestMock'); @@ -189,6 +196,9 @@ describe('DotFormComponent', () => { of(MOCK_WORKFLOW_ACTIONS_NEW_ITEMNTTYPE_1_TAB) ); workflowActionsFireService.fireTo.mockReturnValue(of(MOCK_CONTENTLET_1_OR_2_TABS)); + workflowActionsService.getWorkFlowActions.mockReturnValue( + of(MOCK_SINGLE_WORKFLOW_ACTIONS) + ); store.initializeExistingContent(MOCK_CONTENTLET_1_OR_2_TABS.inode); // called with the inode of the contentlet spectator.detectChanges(); diff --git a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-information/dot-edit-content-sidebar-information.component.html b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-information/dot-edit-content-sidebar-information.component.html index bc2f72c56308..08bbfd3fb088 100644 --- a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-information/dot-edit-content-sidebar-information.component.html +++ b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-information/dot-edit-content-sidebar-information.component.html @@ -29,67 +29,83 @@
{{ 'Created' | dm }} - - {{ (contentlet?.ownerName | dotNameFormat) || 'You' }} - - {{ contentlet?.createDate }} - {{ contentlet?.createDate | dotRelativeDate: 'MM/dd/yyyy' : null }} + class="sidebar-card__subtitle" + [tooltipPosition]="'left'" + [pTooltip]="!contentlet?.creationDate ? ('Not created yet' | dm) : null"> + {{ + contentlet?.creationDate + ? (contentlet?.ownerName | dotNameFormat) || 'You' + : '-' + }} + @if (contentlet?.creationDate) { + + {{ contentlet?.creationDate | dotRelativeDate: 'MM/dd/yyyy' : null }} + + }
{{ 'Modified' | dm }} - - {{ contentlet?.modUserName | dotNameFormat }} - - {{ contentlet?.modDate | dotRelativeDate: 'MM/dd/yyyy' : null }} + class="sidebar-card__subtitle" + [tooltipPosition]="'left'" + [pTooltip]="!contentlet?.modDate ? ('Not modified yet' | dm) : null"> + {{ contentlet?.modDate ? (contentlet?.modUserName | dotNameFormat) : '-' }} + @if (contentlet?.modDate) { + + {{ contentlet?.modDate | dotRelativeDate: 'MM/dd/yyyy' : null }} + + }
- @if (contentlet?.publishDate) { -
- {{ 'Published' | dm }} - @if (contentlet?.publishUserName) { - - {{ contentlet?.publishUserName | dotNameFormat }} - - } +
+ {{ 'Published' | dm }} + + {{ + contentlet?.publishDate + ? (contentlet?.publishUserName | dotNameFormat) + : '-' + }} + + @if (contentlet?.publishDate) { {{ contentlet?.publishDate | dotRelativeDate: 'MM/dd/yyyy' : null }} -
- } + } +
+
-
- {{ 'References' | dm }} - @if (loading) { - - } @else { - - @if (referencesPageCount && referencesPageCount !== '0') { - {{ - 'edit.content.sidebar.information.references-with.pages.tooltip' - | dm: [referencesPageCount] - }} - } @else { - {{ 'edit.content.sidebar.information.references-with.pages.not.used' | dm }} - } - - } -
+
+ {{ 'References' | dm }} + @if (loading) { + + } @else { + + @if (referencesPageCount && referencesPageCount !== '0') { + {{ + 'edit.content.sidebar.information.references-with.pages.tooltip' + | dm: [referencesPageCount] + }} + } @else { + {{ 'edit.content.sidebar.information.references-with.pages.not.used' | dm }} + } + + }
diff --git a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-information/dot-edit-content-sidebar-information.component.spec.ts b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-information/dot-edit-content-sidebar-information.component.spec.ts index 302bafd27803..c07268000c9f 100644 --- a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-information/dot-edit-content-sidebar-information.component.spec.ts +++ b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-information/dot-edit-content-sidebar-information.component.spec.ts @@ -25,7 +25,7 @@ describe('DotEditContentSidebarInformationComponent', () => { const mockContentlet = { inode: '123', ownerName: 'admin@dotcms.com', - createDate: new Date('2024-03-20'), + creationDate: new Date('2024-03-20'), modDate: new Date('2024-03-21'), modUserName: 'editor@dotcms.com', publishDate: new Date('2024-03-22'), diff --git a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.html b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.html index 31d74e7ae826..bec34211d569 100644 --- a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.html +++ b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.html @@ -2,6 +2,7 @@ @let step = $workflow().step; @let task = $workflow().task; @let isLoading = $isLoading(); +@let noWorkflowSelectedYet = $noWorkflowSelectedYet();
{{ 'Workflow' | dm }}
@@ -11,34 +12,85 @@ data-testId="workflow-name"> @if (isLoading) { + } @else if (noWorkflowSelectedYet) { + + {{ 'Select Workflow' | dm }} + } @else { {{ scheme?.name }} - } - -
{{ 'Step' | dm }}
-
- @if (isLoading) { - - } @else { - {{ step?.name || 'New' | dm }} + + @if ($showWorkflowDialogIcon()) { + + } }
- @if (task) { -
{{ 'Assignee' | dm }}
+ @if (!noWorkflowSelectedYet) { +
{{ 'Step' | dm }}
+ aria-labelledby="step-title" + data-testId="workflow-step"> @if (isLoading) { } @else { - {{ task.assignedTo }} + + {{ step?.name || 'New' | dm }} }
+ + @if (task) { +
{{ 'Assignee' | dm }}
+
+ @if (isLoading) { + + } @else { + {{ task.assignedTo }} + } +
+ } }
+ + +@defer (when $showDialog()) { + +
+
+ + +
+
+ + + + + +} diff --git a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.scss b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.scss index 363511744baa..f817db2eb52c 100644 --- a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.scss +++ b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.scss @@ -1,15 +1,21 @@ @use "variables" as *; @import "mixins"; + $skeleton-height: 14px; + .workflow-list { display: grid; grid-template-columns: 96px 1fr; - gap: $spacing-3; + margin: 0; dt { font-weight: $font-weight-medium-bold; color: $black; + min-height: 32px; + display: flex; + align-content: center; + flex-wrap: wrap; } dd { @@ -18,6 +24,15 @@ $skeleton-height: 14px; font-weight: $font-weight-regular-bold; } } +.workflow-column__description { + display: flex; + align-items: center; + gap: $spacing-0; +} + +.select-workflow-link { + cursor: pointer; +} :host ::ng-deep { skeleton { diff --git a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.ts b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.ts index 2e8320392374..041c6c02f223 100644 --- a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.ts +++ b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.ts @@ -1,8 +1,13 @@ -import { ChangeDetectionStrategy, Component, input } from '@angular/core'; +import { JsonPipe } from '@angular/common'; +import { ChangeDetectionStrategy, Component, computed, input, model, output } from '@angular/core'; +import { FormsModule } from '@angular/forms'; +import { SelectItem } from 'primeng/api'; +import { ButtonModule } from 'primeng/button'; +import { DialogModule } from 'primeng/dialog'; +import { DropdownModule } from 'primeng/dropdown'; import { SkeletonModule } from 'primeng/skeleton'; -import { DotWorkflowService } from '@dotcms/data-access'; import { DotCMSWorkflowStatus } from '@dotcms/dotcms-models'; import { DotMessagePipe } from '@dotcms/ui'; @@ -15,13 +20,56 @@ import { DotMessagePipe } from '@dotcms/ui'; @Component({ selector: 'dot-edit-content-sidebar-workflow', standalone: true, - imports: [DotMessagePipe, SkeletonModule, SkeletonModule], - providers: [DotWorkflowService], + imports: [ + DotMessagePipe, + SkeletonModule, + ButtonModule, + DialogModule, + DropdownModule, + FormsModule, + JsonPipe + ], + templateUrl: './dot-edit-content-sidebar-workflow.component.html', styleUrl: './dot-edit-content-sidebar-workflow.component.scss', changeDetection: ChangeDetectionStrategy.OnPush }) export class DotEditContentSidebarWorkflowComponent { + /** + * Whether not exist content yet + * + * @type {boolean} + * @memberof DotEditContentSidebarWorkflowComponent + */ + $isNewContent = input(true, { + alias: 'isNew' + }); + /** + * Whether the dialog should be shown. + * + * @type {boolean} + * @memberof DotEditContentSidebarWorkflowComponent + */ + readonly $showDialog = model(false, { + alias: 'showDialog' + }); + + /** + * Output event to select the workflow. + * + * @type {Output} + * @memberof DotEditContentSidebarWorkflowComponent + */ + readonly onSelectWorkflow = output(); + + /** + * The selected workflow. + * + * @type {string} + * @memberof DotEditContentSidebarWorkflowComponent + */ + $selectedWorkflow = model({} as SelectItem); + /** * The workflow status of the content item. * @@ -41,4 +89,65 @@ export class DotEditContentSidebarWorkflowComponent { $isLoading = input(true, { alias: 'isLoading' }); + + /** + * Whether the select workflow warning should be shown. + * + * @type {boolean} + * @memberof DotEditContentSidebarWorkflowComponent + */ + $noWorkflowSelectedYet = input(false, { + alias: 'noWorkflowSelectedYet' + }); + + /** + * The workflow scheme options. + * + * @type {Array<{ value: string; label: string }>} + * @memberof DotEditContentSidebarWorkflowComponent + */ + $workflowSchemeOptions = input([], { + alias: 'workflowSchemeOptions' + }); + + /** + * Whether to show the workflow selection dialog icon. + * Shows when content is new and there are multiple workflow options available. + * + * @type {Signal} + * @memberof DotEditContentSidebarWorkflowComponent + */ + $showWorkflowDialogIcon = computed(() => { + const hasMultipleWorkflows = this.$workflowSchemeOptions().length > 1; + + return this.$isNewContent() && hasMultipleWorkflows; + }); + + /** + * Shows the dialog to select the workflow. + * + * @memberof DotEditContentSidebarWorkflowComponent + */ + showDialog() { + this.$showDialog.set(true); + } + + /** + * Selects the workflow. + * + * @memberof DotEditContentSidebarWorkflowComponent + */ + selectWorkflow() { + this.$showDialog.set(false); + this.onSelectWorkflow.emit(this.$selectedWorkflow().value); + } + + /** + * Closes the dialog. + * + * @memberof DotEditContentSidebarWorkflowComponent + */ + closeDialog() { + this.$showDialog.set(false); + } } diff --git a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/dot-edit-content-sidebar.component.html b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/dot-edit-content-sidebar.component.html index af75a0ccaf41..343f351b1608 100644 --- a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/dot-edit-content-sidebar.component.html +++ b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/dot-edit-content-sidebar.component.html @@ -1,10 +1,16 @@ @let contentlet = store.contentlet(); @let contentType = store.contentType(); +@let isNew = store.isNew(); + @let isLoadingInformation = store.isLoadingInformation(); @let referencePagesCount = store.information.relatedContent(); - -@let workflow = store.workflow; -@let isLoadingWorkflow = store.isLoadingWorkflow; + +@let workflowOptions = store.workflowSchemeOptions(); +@let schema = store.getScheme(); +@let step = store.currentStep(); +@let task = store.lastTask(); +@let isLoadingWorkflow = store.isLoadingWorkflow(); +@let showSelectWorkflowWarning = store.showSelectWorkflowWarning();