Skip to content

feat(admin): make content settings sections reorderable#2185

Merged
ascorbic merged 6 commits into
emdash-cms:mainfrom
logelog:feat/content-settings-section-order
Jul 22, 2026
Merged

feat(admin): make content settings sections reorderable#2185
ascorbic merged 6 commits into
emdash-cms:mainfrom
logelog:feat/content-settings-section-order

Conversation

@logelog

@logelog logelog commented Jul 21, 2026

Copy link
Copy Markdown
Contributor

What does this PR do?

Makes the built-in content editor settings sections reorderable from dedicated drag handles.

Editors can arrange Publish, Ownership, Bylines, Translations, Taxonomies, SEO, Outline, and Revisions around their workflow. The order is stored per user and collection in browser storage, so an arrangement made on one entry remains consistent when another entry in the same collection is opened.

The implementation also:

  • supports pointer and keyboard sorting;
  • constrains movement to the vertical axis and settings-panel width;
  • keeps disclosure controls separate from drag handles;
  • collapses section bodies while sorting;
  • reconciles malformed, stale, and newly extended saved layouts safely;
  • preserves the default order when no preference exists;
  • keeps the mobile settings sheet open after keyboard reordering;
  • keeps destructive footer actions outside the sortable section list.

Discussion: #2184

Type of change

  • Bug fix
  • Feature (requires maintainer-approved Discussion)
  • Refactor (no behavior change)
  • Translation
  • Documentation
  • Performance improvement
  • Tests
  • Chore (dependencies, CI, tooling)

Checklist

  • I have read CONTRIBUTING.md
  • pnpm typecheck passes
  • pnpm lint passes
  • pnpm test passes (or targeted tests for my change)
  • pnpm format has been run
  • I have added/updated tests for my changes (if applicable)
  • User-visible strings in the admin UI are wrapped for translation (if applicable). Do not include messages.po changes except in translation PRs - a workflow extracts catalogs on merge to main.
  • I have added a changeset (if this PR changes a published package)
  • New features link to an approved Discussion: Reorderable content settings sections in the editor #2184

Screenshots / test output

Validated against current main / EmDash 0.30:

  • focused browser coverage: 5 files, 119 tests passed;
  • complete admin browser suite: 104 files, 1,236 tests passed;
  • root typecheck passed across 31 package projects;
  • root lint passed with 0 warnings and 0 errors across 2,220 files;
  • formatting checks passed;
  • @emdash-cms/admin production build passed;
  • desktop and mobile interaction checks passed in light and dark themes;
  • pointer and keyboard ordering, saved-order restoration, and horizontal-drift constraints were visually verified.

@changeset-bot

changeset-bot Bot commented Jul 21, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 86d30b1

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 17 packages
Name Type
@emdash-cms/admin Minor
emdash Minor
@emdash-cms/cloudflare Minor
@emdash-cms/sandbox-workerd Patch
@emdash-cms/plugin-mcp-smoke Major
@emdash-cms/fixture-perf-site Patch
@emdash-cms/perf-demo-site Patch
@emdash-cms/cache-demo-site Patch
@emdash-cms/do-demo-site Patch
@emdash-cms/do-solo-demo-site Patch
@emdash-cms/auth Minor
@emdash-cms/blocks Minor
@emdash-cms/gutenberg-to-portable-text Minor
@emdash-cms/x402 Minor
create-emdash Minor
@emdash-cms/auth-atproto Patch
@emdash-cms/plugin-embeds Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-actions

Copy link
Copy Markdown
Contributor

Scope check

This PR changes 1,113 lines across 13 files. Large PRs are harder to review and more likely to be closed without review.

If this scope is intentional, no action needed. A maintainer will review it. If not, please consider splitting this into smaller PRs.

See CONTRIBUTING.md for contribution guidelines.

@github-actions github-actions Bot added the review/needs-review No maintainer or bot review yet label Jul 21, 2026
@pkg-pr-new

pkg-pr-new Bot commented Jul 21, 2026

Copy link
Copy Markdown

Open in StackBlitz

@emdash-cms/admin

npm i https://pkg.pr.new/@emdash-cms/admin@2185

@emdash-cms/auth

npm i https://pkg.pr.new/@emdash-cms/auth@2185

@emdash-cms/auth-atproto

npm i https://pkg.pr.new/@emdash-cms/auth-atproto@2185

@emdash-cms/blocks

npm i https://pkg.pr.new/@emdash-cms/blocks@2185

@emdash-cms/cloudflare

npm i https://pkg.pr.new/@emdash-cms/cloudflare@2185

@emdash-cms/contentful-to-portable-text

npm i https://pkg.pr.new/@emdash-cms/contentful-to-portable-text@2185

emdash

npm i https://pkg.pr.new/emdash@2185

create-emdash

npm i https://pkg.pr.new/create-emdash@2185

@emdash-cms/gutenberg-to-portable-text

npm i https://pkg.pr.new/@emdash-cms/gutenberg-to-portable-text@2185

@emdash-cms/plugin-cli

npm i https://pkg.pr.new/@emdash-cms/plugin-cli@2185

@emdash-cms/plugin-types

npm i https://pkg.pr.new/@emdash-cms/plugin-types@2185

@emdash-cms/registry-client

npm i https://pkg.pr.new/@emdash-cms/registry-client@2185

@emdash-cms/registry-lexicons

npm i https://pkg.pr.new/@emdash-cms/registry-lexicons@2185

@emdash-cms/registry-verification

npm i https://pkg.pr.new/@emdash-cms/registry-verification@2185

@emdash-cms/sandbox-workerd

npm i https://pkg.pr.new/@emdash-cms/sandbox-workerd@2185

@emdash-cms/x402

npm i https://pkg.pr.new/@emdash-cms/x402@2185

@emdash-cms/plugin-ai-moderation

npm i https://pkg.pr.new/@emdash-cms/plugin-ai-moderation@2185

@emdash-cms/plugin-atproto

npm i https://pkg.pr.new/@emdash-cms/plugin-atproto@2185

@emdash-cms/plugin-audit-log

npm i https://pkg.pr.new/@emdash-cms/plugin-audit-log@2185

@emdash-cms/plugin-color

npm i https://pkg.pr.new/@emdash-cms/plugin-color@2185

@emdash-cms/plugin-embeds

npm i https://pkg.pr.new/@emdash-cms/plugin-embeds@2185

@emdash-cms/plugin-field-kit

npm i https://pkg.pr.new/@emdash-cms/plugin-field-kit@2185

@emdash-cms/plugin-forms

npm i https://pkg.pr.new/@emdash-cms/plugin-forms@2185

@emdash-cms/plugin-webhook-notifier

npm i https://pkg.pr.new/@emdash-cms/plugin-webhook-notifier@2185

commit: 86d30b1

@github-actions

Copy link
Copy Markdown
Contributor

Visual regression: 4 screens changed

These admin screens render differently on this PR. Confirm every change below is intended before accepting.

Screen Image Compare
content-editor-ltr expected · actual
content-editor-rtl expected · actual
content-new-ltr expected · actual
content-new-rtl expected · actual

Maintainers: if every change above is intended, comment /accept-baselines
to commit the regenerated Linux baselines to this PR.

Measured head: 86d30b11be12fbd3e47d04537f7bec7b2f60500a. /accept-baselines accepts the snapshots for this commit.

github-actions Bot pushed a commit that referenced this pull request Jul 21, 2026
@swissky swissky added the bot:review Trigger an emdashbot code review on this PR label Jul 21, 2026

@emdashbot emdashbot Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This PR is a focused, well-scoped feature: it makes the admin content-settings sections reorderable with dnd-kit, stores the order per-user/collection in browser storage, and keeps the mobile settings sheet usable during keyboard/pointer sorting. The linked Discussion is approved, the changeset is present, and the implementation sticks to the admin UI surface (no new backend queries, no SQL, no logged-out route impact).

What I checked:

  • Read the full diff and every changed file, plus the surrounding ContentEditor, TaxonomySidebar, DocumentOutline, and RevisionHistory code.
  • Verified Lingui usage: all user-facing strings in the new components go through t/Trans, and imported section labels are translated before being passed in.
  • Verified RTL-safe Tailwind: positioning uses logical properties (insetInlineStart, inlineSize, start/end, ps/pe) and avoids physical left/right/ml/mr.
  • Checked storage reconciliation: parseContentSettingsLayout rejects malformed/stale state, resolveContentSettingsLayout deduplicates and appends new defaults safely, and localStorage reads are deferred to a client effect to avoid hydration mismatches.
  • Checked mobile interaction guards: MobileSidebarPortalGuard now distinguishes a transient sortable-handle blur from a real sheet-leave, and Escape during keyboard sorting restores the sheet after Kumo's dismissal.
  • Checked tests: new unit tests cover layout parsing, keyboard reorder persistence, sorting-state callbacks, and mobile sheet behavior; existing tests were updated for the new handle labels.

Headline conclusion: no blocking issues. The feature is clean, localized, RTL-aware, and respects the existing component boundaries (destructive actions stay outside the sortable list, disclosure sections still collapse, block side panels are unaffected). Nice work.

@emdashbot emdashbot Bot removed the bot:review Trigger an emdashbot code review on this PR label Jul 21, 2026
@github-actions

Copy link
Copy Markdown
Contributor

Overlapping PRs

This PR modifies files that are also changed by other open PRs:

This may cause merge conflicts or duplicated work. A maintainer will coordinate.

@github-actions github-actions Bot added review/approved Approved; no new commits since and removed review/needs-review No maintainer or bot review yet labels Jul 22, 2026

@ascorbic ascorbic left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tested and it works great. Thanks! Making them collapsible would probably be a good addition at some point

@ascorbic

Copy link
Copy Markdown
Collaborator

/accept-baselines

@github-actions

Copy link
Copy Markdown
Contributor

ℹ️ The committed baselines already match the candidates; nothing to commit.

@ascorbic
ascorbic merged commit d62a302 into emdash-cms:main Jul 22, 2026
48 of 49 checks passed
@emdashbot emdashbot Bot mentioned this pull request Jul 22, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants