Skip to content

feat: floating composer - #3674

Draft
aerodeval wants to merge 4 commits into
frappe:developfrom
aerodeval:feat/floating-composer
Draft

feat: floating composer#3674
aerodeval wants to merge 4 commits into
frappe:developfrom
aerodeval:feat/floating-composer

Conversation

@aerodeval

@aerodeval aerodeval commented Aug 5, 2026

Copy link
Copy Markdown
Member

Replaces the ticket page's EmailEditor / CommentTextEditor with the @framework/ui EmailComposer / CommentComposer hosted in a frappe-ui/experimental FloatingWindow. One rewritten file, both old editors deleted, net −522 lines.

Depends on frappe/frappe#40280 (@framework/ui composers). Draft until that lands.

What changes

  • The reply area is a minimized pill by default. Clicking it opens the composer docked at the bottom of the timeline; it can be popped out into a floating window, dragged, and resized from any edge or corner.
  • Email / Comment are tabs inside the window header instead of two separate editors.
  • Drag the docked header — or either top corner — to set the composer height. It persists per browser and is restored on reopen and reload. Dragging 60px below the floor collapses back to the pill.
  • Drafts, mentions, saved replies, attachments, signatures and the existing localStorage draft keys all behave as before.

Before / after

Before After
Reply area Always-expanded editor pinned under the timeline, fixed height Minimized pill; composer opens over the timeline, height is drag-set and remembered
Channels Separate email box and comment box, toggled from outside One window, Email / Comment tabs in its header
Window Fixed in the page Docked or floating — draggable, resizable from every edge and corner
Empty pill label "Add a comment" "Send a reply" (clicking it opens the email reply)

Screenshots

Before After
Reply bar
Minimized pill
Email editor
Docked composer
Floating window

Notes

  • EmailComposer header rows now share a grid so the label column is only as wide as the widest label rendered — previously a hardcoded 52px sized for a "Subject" row helpdesk never shows, which left a visible gap between "To" and its recipients. That part lives in the frappe PR.
  • Not yet covered: a ticket whose thread contains a very large table can wedge the composer on open — under investigation, unrelated to the window itself.

Demo:

Screen.Recording.2026-08-05.at.4.03.23.AM.mov

The header already started a resize anywhere that wasn't a button, but
the tab switcher and window controls cover both top corners, so grabbing
one did nothing.

The empty pill also read "Add a comment" while clicking it opens the
email reply.
@aerodeval aerodeval changed the title feat: floating composer for ticket replies feat: floating composer Aug 5, 2026
…mposer

# Conflicts:
#	desk/src/components/CommunicationArea.vue
#	desk/src/components/EmailEditor.vue
@codecov-commenter

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 73.80%. Comparing base (c3ae467) to head (6542db6).
⚠️ Report is 5 commits behind head on develop.

Additional details and impacted files
@@             Coverage Diff             @@
##           develop    #3674      +/-   ##
===========================================
+ Coverage    73.76%   73.80%   +0.03%     
===========================================
  Files          148      148              
  Lines        10841    10845       +4     
===========================================
+ Hits          7997     8004       +7     
+ Misses        2844     2841       -3     

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants