MM-70359: Show the floating toolbar again after unpinning

[nang2049]

Summary

Unpinning the toolbar left the floating bar hidden until you selected something else, so it looked like it worked only some of the time.

The pinned toolbar now cancels mousedown the way the floating bar does, and the floating bar syncs once on mount against whatever is already selected.

QA

1. Edit a page, select text, and pin the toolbar from the three-dot menu.
2. Select a sentence and click the pin icon to unpin.
3. The floating bar appears over that selection instead of staying hidden.

Also worth checking that pinned toolbar buttons still apply to the
selection and that the callout menu still opens from the pinned bar.

Ticket Link

https://mattermost.atlassian.net/browse/MM-70359

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 52b09cd8-9f41-409e-978b-5f990ab60c97

📥 Commits

Reviewing files that changed from the base of the PR and between 0436350 and f2b5e0c.

📒 Files selected for processing (4)

• webapp/src/components/page_editor/floating_formatting_bar.test.tsx
• webapp/src/components/page_editor/floating_formatting_bar.tsx
• webapp/src/components/page_editor/page_editor.tsx
• webapp/tests/setup.tsx

Included review availability: 4 reviews are currently available. Your included PR review attempts over the past 7 days set your current allowance at 5 reviews per hour.

---

📝 Walkthrough

Walkthrough

The formatting bar now synchronises with an existing text selection when it mounts. The pinned toolbar preserves the editor selection during mouse interaction. Tests cover selected and unselected states, with jsdom geometry support.

Changes

Formatting bar selection behaviour

Layer / File(s)	Summary
Initial selection synchronisation webapp/src/components/page_editor/floating_formatting_bar.tsx, webapp/src/components/page_editor/floating_formatting_bar.test.tsx, webapp/tests/setup.tsx	The formatting bar calls sync() when its effect mounts. Tests verify visibility for existing selections and hidden state without a selection. jsdom receives a DOMRect fallback.
Toolbar selection preservation webapp/src/components/page_editor/page_editor.tsx	The pinned toolbar prevents mouse-down events from clearing the editor selection, except when the event originates in an input or textarea.

Estimated code review effort: 2 (Simple) | ~10 minutes

Merge Risk: ⚪ Minimal · up to f2b5e

This change restores the floating toolbar after unpinning and adds matching selection behavior; no actionable merge-blocking risk remains after normal checks and review.

Possibly related PRs

• mattermost/mattermost-plugin-docs#13: Introduces the FloatingFormattingBar and PageEditor behaviour extended by this change.
• mattermost/mattermost-plugin-docs#23: Contains related PageEditor toolbar interaction and floating bar selection behaviour.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly identifies the main change: restoring the floating toolbar after unpinning.
Description check	✅ Passed	The description directly explains the bug, the implemented fix, and the steps to verify the toolbar behaviour.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch MM-70359-floating-toolbar-after-unpin

---

_{Comment @coderabbitai help to get the list of available commands.}