Add `wave:term` component with direct SSE output + `/api/terminput` input path by Copilot · Pull Request #2974 · wavetermdev/waveterm

Copilot · 2026-03-04T05:20:26Z

This PR introduces a standalone Tsunami terminal element (wave:term) and routes terminal IO outside the normal render/event loop for lower-latency streaming. It adds imperative terminal output (TermWrite) over SSE and terminal input/resize delivery over a dedicated /api/terminput endpoint.

Frontend: new wave:term element
- Added tsunami/frontend/src/element/tsunamiterm.tsx.
- Uses @xterm/xterm with @xterm/addon-fit.
- Renders as an outer <div> (style/class/ref target), with xterm auto-fit to that container.
- Supports ref passthrough on the outer element.
Frontend: terminal transport wiring
- Registered wave:term in tsunami/frontend/src/vdom.tsx.
- Added SSE listener handling for termwrite in tsunami/frontend/src/model/tsunami-model.tsx, dispatched to the terminal component via a local custom event.
- onData and onResize now POST directly to /api/terminput as JSON payloads:
  - id
  - data64 (base64 terminal input)
  - termsize (rows, cols) for resize updates
Backend: new terminal IO APIs
- Added /api/terminput handler in tsunami/engine/serverhandlers.go.
- Added protocol types in tsunami/rpctypes/protocoltypes.go:
  - TermInputPacket, TermWritePacket, TermSize
- Added engine/client support in tsunami/engine/clientimpl.go:
  - SendTermWrite(id, data64) -> emits SSE event termwrite
  - SetTermInputHandler(...) and HandleTermInput(...)
- Exposed app-level APIs in tsunami/app/defaultclient.go:
  - TermWrite(id, data64) error
  - SetTermInputHandler(func(TermInputPacket))

Example usage

app.SetTermInputHandler(func(input app.TermInputPacket) {
    // input.Id, input.Data64, input.TermSize.Rows/Cols
})

_ = app.TermWrite("term1", "SGVsbG8gZnJvbSB0aGUgYmFja2VuZA0K")

- Provided screenshot URL: https://github.com/user-attachments/assets/58c92ebb-0a52-43d2-b577-17c9cf92a19c

💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

Co-authored-by: sawka <2722291+sawka@users.noreply.github.com>

kilo-code-bot · 2026-03-04T06:23:19Z

tsunami/frontend/src/element/tsunamiterm.tsx

+    }
+}
+
+const TsunamiTerm = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(function TsunamiTerm(


CRITICAL: Missing displayName for React.forwardRef component

According to the project's coding guidelines, when using React.memo() or React.forwardRef(), you must add a displayName for the component. This helps with debugging and React DevTools.

Add after the component definition:

TsunamiTerm.displayName = "TsunamiTerm";

kilo-code-bot · 2026-03-04T06:23:31Z

Code Review Summary

Status: No New Issues Found | Recommendation: Merge

This PR adds a new Tsunami terminal component (wave:term) with proper integration between the Go backend and TypeScript frontend. The implementation includes:

New TsunamiTerm React component using xterm.js
Terminal ref operations and SSE-based terminal write events
Proper atomic.Bool usage for thread-safe HasCurrent field
Custom JSON marshaling/unmarshaling for VDomRef
io.Writer implementation via TermRef wrapper

All previously identified issues have already been commented on. No new critical issues were found during this review.

Other Observations (not in diff)

File	Line	Issue
`tsunami/engine/clientimpl.go`	1	Copyright year should be 2026 (file was updated but still shows 2025)

Files Reviewed (11 files)

tsunami/app/defaultclient.go - Added TermWrite function and updated QueueRefOp to use atomic.Bool
tsunami/app/hooks.go - Added TermRef wrapper implementing io.Writer
tsunami/cmd/main-tsunami.go - Added absolute path resolution for environment variables
tsunami/engine/clientimpl.go - Added SendTermWrite method
tsunami/frontend/src/element/tsunamiterm.tsx - New terminal component (already has 3 comments)
tsunami/frontend/src/model/model-utils.ts - Added terminal element type guards and operations (already has 1 comment)
tsunami/frontend/src/model/tsunami-model.tsx - Added termwrite SSE event handling and terminal size tracking
tsunami/frontend/src/types/vdom.d.ts - Added VDomTermSize and VDomTermInputData types
tsunami/frontend/src/vdom.tsx - Added WaveTerm component and terminal input event handling
tsunami/rpctypes/protocoltypes.go - Added TermWritePacket type
tsunami/vdom/vdom_types.go - Changed HasCurrent to atomic.Bool with custom JSON marshaling

Fix these issues in Kilo Cloud

…mi-component

cloudflare-workers-and-pages · 2026-03-05T00:26:21Z

Deploying waveterm with Cloudflare Pages

Latest commit:	`b5e358e`
Status:	✅ Deploy successful!
Preview URL:	https://8f5d475e.waveterm.pages.dev
Branch Preview URL:	https://copilot-add-new-tsunami-comp.waveterm.pages.dev

View logs

…abs paths for env vars, dont pass position back for refs

kilo-code-bot · 2026-03-05T08:02:08Z

tsunami/frontend/src/element/tsunamiterm.tsx

+    );
+
+    return (
+        <div {...outerProps} id={id} ref={setOuterRef as React.RefCallback<HTMLDivElement>} onFocus={handleFocus} onBlur={handleBlur}>


WARNING: Potential ref forwarding issue

The setOuterRef callback casts to React.RefCallback<HTMLDivElement>, but it expects TsunamiTermElem (which extends HTMLDivElement with custom methods). This cast may cause type safety issues. Consider using React.RefCallback<TsunamiTermElem> or handling the type more explicitly.

kilo-code-bot · 2026-03-05T08:02:08Z

tsunami/frontend/src/element/tsunamiterm.tsx

+        terminalRef.current = terminal;
+
+        const onDataDisposable = terminal.onData((data) => {
+            if (id == null || id === "") {


SUGGESTION: Inconsistent null check pattern

The code uses id == null || id === "" here and on line 100, but the project guidelines prefer id == null without the explicit empty string check (since == null catches both null and undefined). Consider simplifying to just check if the id is truthy: if (!id) return;

kilo-code-bot · 2026-03-05T08:02:09Z

tsunami/frontend/src/model/model-utils.ts

+    const { op, params } = termOp;
+    if (op === "termwrite") {
+        const data64 = params?.[0];
+        if (typeof data64 === "string" && data64 !== "") {


SUGGESTION: Redundant empty string check

The check data64 !== "" is redundant since the parent condition already checks typeof data64 === "string". An empty string is still a valid string type. If you want to skip empty strings, the check is fine, but consider if this is the intended behavior.

Initial plan

6b15bf1

Copilot AI assigned Copilot and sawka Mar 4, 2026

Copilot started work on behalf of sawka March 4, 2026 05:20 View session

feat(tsunami): add wave term component and direct terminal io path

e035595

Co-authored-by: sawka <2722291+sawka@users.noreply.github.com>

Copilot AI changed the title ~~[WIP] Add new tsunami component with TermWrite functionality~~ Add wave:term component with direct SSE output + /api/terminput input path Mar 4, 2026

Copilot finished work on behalf of sawka March 4, 2026 05:36

sawka marked this pull request as ready for review March 4, 2026 06:22

kilo-code-bot bot reviewed Mar 4, 2026

View reviewed changes

Merge remote-tracking branch 'origin/main' into copilot/add-new-tsuna…

b5e358e

…mi-component

sawka added 3 commits March 4, 2026 23:36

update HasCurrent to be atomic, dont re-render on ref update, ensure …

a9cd808

…abs paths for env vars, dont pass position back for refs

fix the way terminalwrites work (use ref)

8d2bbe6

new UseTermRef to create an io.Writer to the terminal

c71b09a

kilo-code-bot bot reviewed Mar 5, 2026

View reviewed changes

sawka added 3 commits March 5, 2026 00:26

use an onData handler rather than a different api

b1df7da

get termsize propagated onmount...

8841c2a

fix go vet warning

c786d4e

sawka merged commit 1a1cd85 into main Mar 5, 2026

sawka deleted the copilot/add-new-tsunami-component branch March 5, 2026 17:32

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Add `wave:term` component with direct SSE output + `/api/terminput` input path#2974

Add `wave:term` component with direct SSE output + `/api/terminput` input path#2974
sawka merged 9 commits intomainfrom
copilot/add-new-tsunami-component

Copilot AI commented Mar 4, 2026 •

edited

Loading

Uh oh!

kilo-code-bot bot Mar 4, 2026

Uh oh!

kilo-code-bot bot commented Mar 4, 2026 •

edited

Loading

Uh oh!

cloudflare-workers-and-pages bot commented Mar 5, 2026 •

edited

Loading

Uh oh!

kilo-code-bot bot Mar 5, 2026

Uh oh!

kilo-code-bot bot Mar 5, 2026

Uh oh!

kilo-code-bot bot Mar 5, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

Copilot AI commented Mar 4, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

kilo-code-bot bot Mar 4, 2026

Choose a reason for hiding this comment

Uh oh!

kilo-code-bot bot commented Mar 4, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Code Review Summary

Uh oh!

cloudflare-workers-and-pages bot commented Mar 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Deploying waveterm with Cloudflare Pages

Uh oh!

kilo-code-bot bot Mar 5, 2026

Choose a reason for hiding this comment

Uh oh!

kilo-code-bot bot Mar 5, 2026

Choose a reason for hiding this comment

Uh oh!

kilo-code-bot bot Mar 5, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Copilot AI commented Mar 4, 2026 •

edited

Loading

kilo-code-bot bot commented Mar 4, 2026 •

edited

Loading

cloudflare-workers-and-pages bot commented Mar 5, 2026 •

edited

Loading