@lightworkai.official/debug-capture 0.17.4 → 0.19.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +37 -1
- package/dist/config.d.ts +26 -0
- package/dist/debug-capture.js +41 -11
- package/dist/index.d.ts +2 -0
- package/dist/index.mjs +47 -17
- package/dist/live.d.ts +7 -0
- package/dist/server.d.ts +7 -3
- package/dist/server.mjs +7 -6
- package/dist/types.d.ts +2 -0
- package/dist/ui/chatBubble.d.ts +12 -0
- package/dist/ui/strings.d.ts +4 -0
- package/package.json +1 -1
- package/src/config.ts +27 -0
- package/src/embed.ts +12 -1
- package/src/index.ts +6 -0
- package/src/install.ts +11 -0
- package/src/live.ts +27 -6
- package/src/server.ts +16 -9
- package/src/submit.ts +2 -0
- package/src/types.ts +2 -0
- package/src/ui/callFrame.ts +1 -1
- package/src/ui/chatBubble.ts +247 -0
- package/src/ui/ring.ts +2 -2
- package/src/ui/strings.ts +10 -0
package/README.md
CHANGED
|
@@ -199,6 +199,9 @@ knowing before you ship:
|
|
|
199
199
|
- **`callFrame`** — the call itself happens in your app, in the support host's
|
|
200
200
|
own call UI (0.16, see below). Default `true`; `false` keeps 0.15's card that
|
|
201
201
|
opens the portal to answer.
|
|
202
|
+
- **`chat`** — แชทกับทีม, a chat bubble at the bottom of your app (0.19, see
|
|
203
|
+
below). Off unless set; `true`, or `{ position: "left", offset: { x, y } }`.
|
|
204
|
+
Needs `identity`.
|
|
202
205
|
|
|
203
206
|
## The other half: letting people track what they reported
|
|
204
207
|
|
|
@@ -244,11 +247,16 @@ export const GET = supportTokenHandler({
|
|
|
244
247
|
// The one thing we cannot do for you: only you can read your session.
|
|
245
248
|
user: async () => {
|
|
246
249
|
const session = await getServerSession(authOptions);
|
|
247
|
-
return session?.user
|
|
250
|
+
return session?.user ? { id: session.user.id, email: session.user.email } : null;
|
|
248
251
|
},
|
|
249
252
|
});
|
|
250
253
|
```
|
|
251
254
|
|
|
255
|
+
Someone you know but hold no email for — signed in with a national ID, say — is
|
|
256
|
+
vouched for by your own `id` alone (0.18): leave `email` out or null. The
|
|
257
|
+
support desk keeps one account for them by that id, and moves it to their email
|
|
258
|
+
the day you have one. Return null only when nobody is signed in.
|
|
259
|
+
|
|
252
260
|
It returns a standard `Response`, so it works anywhere the Fetch API does — Bun,
|
|
253
261
|
Deno, Hono, Next. The secret comes from `SUPPORT_REPORTER_SECRET` unless you
|
|
254
262
|
pass one. `createSupportToken()` is the same thing without the routing, if your
|
|
@@ -437,6 +445,34 @@ While the person shares their screen, the call itself folds to a single bar,
|
|
|
437
445
|
so it covers very little of your page; that comes from the support host and
|
|
438
446
|
needs no update here.
|
|
439
447
|
|
|
448
|
+
### A chat with the support team, no report needed (0.19)
|
|
449
|
+
|
|
450
|
+
People do not only report problems — they ask: how to do something, for a
|
|
451
|
+
permission, whether what they see is a problem at all. Until now the only door
|
|
452
|
+
was the report button, so questions arrived as reports (or by LINE, outside the
|
|
453
|
+
desk). `chat: true` puts a round chat button at the bottom right of your app:
|
|
454
|
+
|
|
455
|
+
```ts
|
|
456
|
+
configureDebugCapture({ /* … */, identity: async () => /* your support token */, chat: true });
|
|
457
|
+
```
|
|
458
|
+
|
|
459
|
+
Pressed, a panel opens above it — the support host's own page, framed, signed
|
|
460
|
+
in with the token your `identity` already provides (handed over by
|
|
461
|
+
`postMessage`, never in the address). It has two tabs: **แชท**, the person's
|
|
462
|
+
one ongoing chat with the desk, and **เรื่องของฉัน**, what they filed, each
|
|
463
|
+
opening its thread in the panel. The desk answers from สนทนา › แชท and can open
|
|
464
|
+
a ticket from the chat (the chat keeps every line and shows the ticket's card).
|
|
465
|
+
**แจ้งปัญหาพร้อมภาพหน้าจอ** in the panel folds it and opens this library's
|
|
466
|
+
report over your page — its screen, its logs — linked to the chat.
|
|
467
|
+
|
|
468
|
+
The button carries a badge of what waits for the person (the desk's new lines
|
|
469
|
+
and their tickets' replies), kept current by the same socket the call ring
|
|
470
|
+
uses — with calls off for the desk too. The call's card and frame sit above
|
|
471
|
+
the button. It is not shown when nobody is signed in (`identity` returns
|
|
472
|
+
null). Your own button instead of ours: `openSupportChat()` /
|
|
473
|
+
`closeSupportChat()`; on a page with no bundler, `data-chat` and
|
|
474
|
+
`data-identity-url` on the script tag, and `window.lwOpenSupportChat()`.
|
|
475
|
+
|
|
440
476
|
|
|
441
477
|
## Installing
|
|
442
478
|
|
package/dist/config.d.ts
CHANGED
|
@@ -105,6 +105,16 @@ export interface DebugCaptureConfig {
|
|
|
105
105
|
} | null;
|
|
106
106
|
/** Anything else worth recording — feature flags, build id, tenant. */
|
|
107
107
|
extra?: () => Record<string, unknown>;
|
|
108
|
+
/**
|
|
109
|
+
* แชทกับทีม — a chat bubble at the bottom right: the person asks the support desk anything, no report needed, and
|
|
110
|
+
* follows what they filed (เรื่องของฉัน) in the same panel. The desk answers from สนทนา › แชท and can open a เรื่อง
|
|
111
|
+
* from it; แจ้งปัญหาพร้อมภาพหน้าจอ in the panel opens this library's report, linked to the chat.
|
|
112
|
+
*
|
|
113
|
+
* Off unless set. Needs `identity` — a chat is a person's, and is read back: with no signed-in person the bubble is
|
|
114
|
+
* not shown. `true` puts it at the bottom right; `{ position: "left" }` at the bottom left; `offset` moves it in from
|
|
115
|
+
* the corner (px) for a host that already has something there.
|
|
116
|
+
*/
|
|
117
|
+
chat?: boolean | ChatOptions;
|
|
108
118
|
capture?: CaptureOptions;
|
|
109
119
|
redact?: RedactOptions;
|
|
110
120
|
/**
|
|
@@ -198,6 +208,22 @@ export interface ToastNotice {
|
|
|
198
208
|
onClick: () => void;
|
|
199
209
|
};
|
|
200
210
|
}
|
|
211
|
+
/** Where แชทกับทีม's bubble sits (`chat`). */
|
|
212
|
+
export interface ChatOptions {
|
|
213
|
+
/** Which bottom corner — the right unless said. */
|
|
214
|
+
position?: "right" | "left";
|
|
215
|
+
/** In from that corner, in px — for a host that already has something there. */
|
|
216
|
+
offset?: {
|
|
217
|
+
x?: number;
|
|
218
|
+
y?: number;
|
|
219
|
+
};
|
|
220
|
+
}
|
|
221
|
+
/** The bubble's place, from `chat`: null when it is off. */
|
|
222
|
+
export declare function chatPlace(chat: DebugCaptureConfig["chat"]): {
|
|
223
|
+
side: "right" | "left";
|
|
224
|
+
x: number;
|
|
225
|
+
y: number;
|
|
226
|
+
} | null;
|
|
201
227
|
export interface CaptureOptions {
|
|
202
228
|
/** Rolling buffer sizes. */
|
|
203
229
|
maxRequests?: number;
|