feat(edit-content): restructure command bar & side panel around Actions tab (#35892)

[oidacra]

Proposed Changes

Restructures the new Edit Contentlet command bar and side panel around a single Actions tab (#35892).

Command bar (dot-edit-content-form)

• Slimmed to [status tag] | Preview … (overflow menu) ▢ (sidebar toggle) and made sticky on scroll.
• Status now renders as a local p-tag; the lock toggle and inline workflow actions were removed from the bar.
• New dot-edit-content-command-bar-actions overflow (…) menu — Permissions, Rules (pages only), View references — which owns the dialog-open logic relocated from the deleted sidebar wrappers.
• Preview now resolves HTML pages via a new generatePageEditUrl helper in addition to URL-mapped content.

Side panel (dot-edit-content-sidebar)

• The Info tab becomes Actions (lightning-bolt icon); the Settings tab is removed.
• The lock control is relocated as a distinct outlined button with a lock icon, separated from the workflow actions by a divider.
• Workflow actions render stacked full-width, one above another (new stacked mode on the shared dot-workflow-actions), first action primary. Firing stays in the form — the sidebar emits workflowActionFired and the layout delegates to DotEditContentFormComponent.fireWorkflowAction via its viewChild, so all validation/wizard/push-publish logic is untouched.
• The Locales, Workflow and Details sections are independently collapsible and persist their open/closed state via DotLocalstorageService; headers use the design's uppercase treatment.
• The information card drops the status chip and the References card (both now live in the command bar).

Removed the now-orphaned dot-edit-content-sidebar-permissions / dot-edit-content-sidebar-rules wrapper components (their dialogs are reused by the new overflow menu).

Out of scope (by design): Locales content is untouched (tracked in #35889) — only its section becomes collapsible. The lock control is relocated only; the richer "Release Lock"/steal-lock flow is deferred. Workflow/Details card visual restyle was intentionally left for a later pass.

Checklist

• yarn nx lint edit-content / yarn nx lint ui — pass (pre-existing warnings only)
• yarn nx test edit-content / yarn nx test ui — pass
• yarn nx build dotcms-ui (AOT template type-check) — pass
• yarn nx format:write

How to test

1. Open an existing contentlet.
2. Command bar shows [status tag] | Preview … ▢, sticks on scroll; no lock toggle / inline workflow actions.
3. Actions tab: lock button (outlined + icon, divider below); workflow actions stacked full-width with the first action primary; firing Save/Publish still validates the form (scroll-to-error) and opens the wizard for push-publish / action-input.
4. Locales / Workflow / Details collapse independently and persist across reload.
5. … menu opens Permissions, Rules (pages only) and View references; Settings tab is gone.
6. Preview shown for a page and for URL-mapped content (existing only); hidden for new content. New contentlet → … menu hidden.

[claude]

Claude finished @oidacra's task in 3m 43s —— View job

---

Code Review

• Gather context
• Review command-bar-actions component (new)
• Review store changes (lock, workflow, content features)
• Review sidebar restructuring
• Review utility functions (generatePageEditUrl)
• Review dot-workflow-actions stacked mode
• Final findings summary

---

Findings

1. $hasReferences races with sidebar load — may disable References in the overflow menu prematurely

$hasReferences in dot-edit-content-form.component.ts (line 204–208) reads information.relatedContent() from the store, which is initialised to '0' and only populated after getReferencePages fires inside DotEditContentSidebarComponent.#informationEffect. That effect is gated on isSidebarOpen (line 135). So if the sidebar is closed when the user opens an existing contentlet, relatedContent stays '0', $hasReferences returns false, and the View References menu item is permanently disabled for that session — even when references exist. Consider always fetching the reference count regardless of sidebar state, or initialising relatedContent to null and treating it as "unknown" rather than "zero" until the API responds.

2. Stale DynamicDialogRef prevents re-opening a dialog after the component is destroyed and recreated

In dot-edit-content-command-bar-actions.component.ts, the three #xxxDialogRef fields are cleared in onClose (lines 136–138, 166–167, 202–204). However, the onClose subscription uses takeUntilDestroyed(this.#destroyRef), which unsubscribes on component destroy before the dialog's own onClose fires. If the dialog is still open when the component is destroyed (e.g. during navigation), #permissionsDialogRef is closed (the onDestroy hook, line 100–104 handles this) but the undefined assignment in the subscription will never run. The next time the component is constructed the ref fields start as undefined, so this is fine. The issue is narrower: if the component is destroyed mid-dialog, the dialog is closed but the ref field in the new instance won't exist (it's a fresh constructor), so no real bug — just document this clearly or simplify with finally on the observable instead of a separate subscription.

3. generatePageEditUrl adds ?host_id= to the page URL directly, potentially creating a double query-string

functions.util.ts line 455:

params.set('url', `${contentlet.url}?host_id=${contentlet.host}`);

If contentlet.url already contains a query string (e.g. /about-us?param=1), this produces /about-us?param=1?host_id=… — the second ? is not valid. generatePreviewUrl (line 430) has the same pattern with URL_MAP_FOR_CONTENT. Both should use new URLSearchParams or a URL object to append host_id safely. Fix this →

4. onLockAction in DotEditContentSidebarComponent: lockedByName() can return null, but escapeHtml is called without a null guard

dot-edit-content-sidebar.component.ts line 183:

lockedBy ? ` (${escapeHtml(lockedBy)})` : ''

lockedBy is string | null so the ternary handles null — but only at runtime. The type annotation for lockedByName() (computed in lock.feature.ts line 94) already returns string | null, so this is fine. But notice that lockedBy is assigned from this.$store.lockedByName() which could return null; the escapeHtml(lockedBy) call then narrowly avoids accepting null via the ternary. However, the code reads lockedBy ? (${escapeHtml(lockedBy)}) : '' which would pass the empty-string case on '', not just null. This is a minor correctness issue only for the empty-string case, but lockedByName already returns null not '' when there's no name, so it's safe in practice.

5. Hardcoded 'Actions' string in the tab tooltip (not i18n)

dot-edit-content-sidebar.component.html line 19:

<p-tab [value]="0" [pTooltip]="'Actions' | dm" tooltipPosition="bottom">

The string 'Actions' is passed to dm (the DotMessage pipe), which looks up a message key. The key Actions does exist in Language.properties (value: "Actions"), so this works. It's worth keeping aligned with the naming convention used by other tabs ('edit.content.sidebar.tab.history', 'edit.content.sidebar.tab.comments'), which use namespaced keys.

6. Lock button inline styles are a workaround for a PrimeNG directive limitation

dot-edit-content-sidebar.component.html lines 62–64:

[class.p-button-outlined]="$store.isContentLocked()"
[style.border-color]="$store.isContentLocked() ? null : 'var(--p-surface-200)'"

This is correctly called out in the comment above it — the pButton directive doesn't reactively remove p-button-outlined. The workaround is correct. No action needed, but consider tracking a PrimeNG issue for upstream fix.

7. $collapsed linkedSignal re-seeds from localStorage on every key change, not on sidebar close/reopen

dot-edit-content-sidebar-section.component.ts lines 62–68: the comment correctly documents this; the note "If DotLocalstorageService ever becomes signal-backed, this would snap back…" is an active risk. Currently safe, but the defensive comment should stay.

8. dot-workflow-actions: stacked and groupActions interaction is not guarded

dot-workflow-actions.component.ts: the docstring says "Takes precedence over the flat overflow layout; ignored when groupActions is true." But there's no assertion or guard in the code — if a caller sets both stacked=true and groupActions=true, $groupedActions would still be computed and the template would render both split-buttons and stacked buttons. Low risk (callers in this PR are consistent), but could be worth a console.warn in dev mode.

9. checkCanLock fires on every contentlet change (including lock/unlock updates)

lock.feature.ts lines 273–289: the effect fires checkCanLock whenever contentlet() changes. A lock/unlock update patches the contentlet in the store (patchState(store, { contentlet: { ...current, locked: ... } })), which triggers this effect again, resulting in a redundant canLock API call immediately after every lock or unlock. The API response would likely be the same, but the extra round-trip is unnecessary. Consider keying the effect on contentlet?.inode only so it skips pure lock-state updates.

10. Missing i18n key for the new "View References" command-bar action label (minor)

Language.properties line 6444: edit.content.sidebar.command-bar.references=View References. The key name mixes two conventions — sidebar (which is being removed as the home of this action) and command-bar (the new home). Not a bug, just a naming smell that will read oddly if another engineer looks at the properties file without context.

---

Overall: The restructuring is well-reasoned and the code is clean. Issues #3 (double ? in URL) and #1 (references count race with closed sidebar) are the only ones that could surface as actual bugs for users. The rest are low-severity design notes.

[alwaysmeticulous]

🤖 No test run has been triggered as your Meticulous project has been deactivated (since you haven't viewed any test results in a while). Click here to reactivate.

_{Last updated for commit a352347. This comment will update as new commits are pushed.}