@dutodev/cli 0.6.0 → 0.7.0

package/README.md

@@ -146,6 +146,7 @@ Com os túneis no ar, o terminal mostra cada túnel (URL, destino local, requisi
 | `f` | Filtra por túnel, método, caminho ou status |
 | `↵` | Detalhes da requisição: cabeçalhos e o começo dos corpos |
 | `r` | No detalhe, reenvia a requisição ao serviço local |
+| `i` | Abre o inspetor no navegador |
 | `tab`, `↑↓` | Alterna entre túneis e requisições e move a seleção |
 | `q` ou Ctrl+C | Fecha os túneis e sai |
 
@@ -157,6 +158,26 @@ Se o túnel está no ar mas nada responde na porta local, quem abrir o endereço
 
 Fora de um terminal interativo (pipe, CI) ou com `--no-ui`, a CLI imprime um log simples. No Windows a tela cheia vem desligada; use `--ui` para tentar.
 
+## Inspetor no navegador
+
+Junto com a sessão, a CLI sobe um inspetor local: uma página no navegador com as requisições chegando ao vivo, o JSON formatado e botões para copiar e reenviar. Ele é mais confortável que o terminal para corpos grandes.
+
+- **Como abrir.** Na tela cheia, a tecla `i` abre o navegador já com o endereço certo, e a tela mostra `inspetor  http://127.0.0.1:<porta>`. No modo `plain` (pipe, CI, `--no-ui`), a CLI imprime `inspetor: <url>?t=<token>`; copie esse endereço inteiro.
+- **Porta.** O padrão é `127.0.0.1:4141`. Se estiver ocupada, a CLI tenta as seguintes até a 4161 e, por fim, qualquer porta livre. O inspetor escuta só em `127.0.0.1`: não é acessível por outras máquinas da rede.
+- **Token.** O endereço leva um token da sessão (`?t=...`). Ele existe para que outros sites abertos no seu navegador não consigam ler nem reenviar as suas requisições. Por isso a tela cheia não exibe o token; use a tecla `i`.
+- **Desligar.** `--no-inspect` não sobe o inspetor. No modo `plain` o endereço com token vai para a saída; se ela vai para um log compartilhado, use `--no-inspect`.
+- **Nada vai para o disco.** As requisições ficam só na memória da sessão e somem quando ela termina. Funciona sem internet.
+
+A página tem a lista à esquerda e o detalhe à direita, com as abas **Corpo**, **Cabeçalhos**, **Resposta** e **Raw**. O JSON aparece reindentado, exatamente como chegou, com os erros de sintaxe destacados.
+
+| Ação | Como |
+|---|---|
+| Copiar o corpo | **Copiar corpo** copia o corpo da aba ativa |
+| Copiar como `curl` | **Copiar como curl**; em túnel com senha, o comando leva `-H 'X-Duto-Auth: <usuário>:SENHA'` e você troca `SENHA` pela senha |
+| Reenviar | **↻ Reenviar** ou a tecla `r`, com as mesmas regras do terminal |
+| Filtrar | `/` foca o filtro |
+| Navegar | `↑` e `↓` movem a seleção |
+
 ## Comandos
 
 | Comando | O que faz |
@@ -176,6 +197,7 @@ Fora de um terminal interativo (pipe, CI) ou com `--no-ui`, a CLI imprime um log
 | `--auth <usuario:senha>` | Pede usuário e senha para abrir o endereço (repetível) |
 | `--permitir <faixa>` | Com `--auth`: IP, faixa ou nome (`stripe`, `github`) que entra sem senha (repetível) |
 | `--no-ui` / `--ui` | Desliga / força a tela cheia |
+| `--no-inspect` | Não sobe o inspetor no navegador (a tecla `i` passa a mostrar "Inspetor desligado (--no-inspect).") |
 
 ## Configuração
 

package/dist/{chunk-26EQC6HB.js → chunk-74IJFYGT.js}

@@ -38,6 +38,37 @@ function validateName(name, max = MAX_NAME) {
   return { ok: true };
 }
 
+// src/ui/theme.ts
+var C = {
+  signal: "#2dd4bf",
+  muted: "#8a8f8b",
+  strong: "#f3f4f1",
+  ok: "#4ade80",
+  warn: "#facc15",
+  err: "#f87171"
+};
+var TUNNEL_COLORS = ["#93c5fd", "#c4b5fd", "#facc15", "#4ade80", "#f9a8d4", "#fdba74", "#67e8f9"];
+function tunnelColor(index) {
+  return TUNNEL_COLORS[index % TUNNEL_COLORS.length];
+}
+function fit(text, width) {
+  if (width <= 0) return "";
+  return text.length > width ? `${text.slice(0, Math.max(0, width - 1))}\u2026` : text.padEnd(width);
+}
+
+// src/session/bodyNote.ts
+var TRUNCATED_NOTE = "Corpo cortado em 64 KB.";
+function bodyNote(r, side) {
+  if (side === "req") {
+    if (r.reqBodyBytes === 0) return "Sem corpo.";
+    if (r.reqBody === null && !r.reqTruncated) return "Corpo bin\xE1rio; n\xE3o \xE9 guardado.";
+    return null;
+  }
+  if (r.bytes === 0) return "Sem corpo.";
+  if (r.resBody === null) return "Corpo bin\xE1rio; n\xE3o \xE9 guardado.";
+  return null;
+}
+
 // src/ui/format.ts
 function statusColor(status) {
   if (status === null) return "muted";
@@ -66,6 +97,11 @@ function localLabel(t) {
 export {
   normalizeName,
   validateName,
+  C,
+  tunnelColor,
+  fit,
+  TRUNCATED_NOTE,
+  bodyNote,
   statusColor,
   formatDuration,
   formatBytes,

package/dist/{fullscreen-7P5GBCQX.js → fullscreen-YK365XSO.js}

@@ -1,13 +1,18 @@
 #!/usr/bin/env node
 import {
+  C,
+  TRUNCATED_NOTE,
+  bodyNote,
+  fit,
   formatBytes,
   formatDuration,
   formatTime,
   localLabel,
   normalizeName,
   statusColor,
+  tunnelColor,
   validateName
-} from "./chunk-26EQC6HB.js";
+} from "./chunk-74IJFYGT.js";
 
 // src/ui/fullscreen.tsx
 import { render } from "ink";
@@ -18,30 +23,10 @@ import { Box as Box5, Text as Text6, useInput, useStdout } from "ink";
 
 // src/ui/Detail.tsx
 import { Box, Text } from "ink";
-
-// src/ui/theme.ts
-var C = {
-  signal: "#2dd4bf",
-  muted: "#8a8f8b",
-  strong: "#f3f4f1",
-  ok: "#4ade80",
-  warn: "#facc15",
-  err: "#f87171"
-};
-var TUNNEL_COLORS = ["#93c5fd", "#c4b5fd", "#facc15", "#4ade80", "#f9a8d4", "#fdba74", "#67e8f9"];
-function tunnelColor(index) {
-  return TUNNEL_COLORS[index % TUNNEL_COLORS.length];
-}
-function fit(text, width) {
-  if (width <= 0) return "";
-  return text.length > width ? `${text.slice(0, Math.max(0, width - 1))}\u2026` : text.padEnd(width);
-}
-
-// src/ui/Detail.tsx
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var MAX_HEADERS = 12;
 var MAX_BODY_LINES = 8;
-function Section({ title, headers, body, truncated }) {
+function Section({ title, headers, body, truncated, note: note2 }) {
   const entries = Object.entries(headers);
   const lines = body ? body.split("\n") : [];
   return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", marginTop: 1, children: [
@@ -59,9 +44,9 @@ function Section({ title, headers, body, truncated }) {
       entries.length - MAX_HEADERS,
       " cabe\xE7alhos"
     ] }),
-    body === null ? /* @__PURE__ */ jsx(Text, { color: C.muted, children: "(corpo bin\xE1rio ou n\xE3o capturado)" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+    body === null ? /* @__PURE__ */ jsx(Text, { color: C.muted, children: note2 ?? "" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
       lines.slice(0, MAX_BODY_LINES).map((l, i) => /* @__PURE__ */ jsx(Text, { wrap: "truncate-end", children: l }, i)),
-      (lines.length > MAX_BODY_LINES || truncated) && /* @__PURE__ */ jsx(Text, { color: C.muted, children: truncated ? "\u2026 cortado em 64 KB" : "\u2026" })
+      (lines.length > MAX_BODY_LINES || truncated) && /* @__PURE__ */ jsx(Text, { color: C.muted, children: truncated ? TRUNCATED_NOTE : "\u2026" })
     ] })
   ] });
 }
@@ -89,8 +74,8 @@ function Detail({ record }) {
       record.replayOf
     ] }),
     record.error && /* @__PURE__ */ jsx(Text, { color: C.err, children: record.error }),
-    /* @__PURE__ */ jsx(Section, { title: "Requisi\xE7\xE3o", headers: record.reqHeaders, body: record.reqBody, truncated: record.reqTruncated }),
-    /* @__PURE__ */ jsx(Section, { title: "Resposta", headers: record.resHeaders, body: record.resBody, truncated: record.resTruncated }),
+    /* @__PURE__ */ jsx(Section, { title: "Requisi\xE7\xE3o", headers: record.reqHeaders, body: record.reqBody, truncated: record.reqTruncated, note: bodyNote(record, "req") }),
+    /* @__PURE__ */ jsx(Section, { title: "Resposta", headers: record.resHeaders, body: record.resBody, truncated: record.resTruncated, note: bodyNote(record, "res") }),
     /* @__PURE__ */ jsxs(Text, { color: C.muted, children: [
       "\n",
       "r reenvia \xB7 esc volta para a lista"
@@ -291,13 +276,14 @@ var KEYS = [
   ["n", "novo t\xFAnel"],
   ["c", "copiar URL"],
   ["o", "abrir no navegador"],
+  ["i", "inspetor"],
   ["m", "QR no celular"],
   ["f", "filtrar"],
   ["\u21B5", "detalhes"],
   ["tab", "foco"],
   ["q", "sair"]
 ];
-function App({ session, version, system, onExit }) {
+function App({ session, version, system, onExit, inspector = null, inspectorError }) {
   const subState = useCallback((fn) => session.subscribe(fn), [session]);
   const subRecords = useCallback((fn) => session.records.subscribe(fn), [session]);
   const state = useSyncExternalStore(subState, () => session.getState());
@@ -310,7 +296,7 @@ function App({ session, version, system, onExit }) {
   const [focus, setFocus] = useState("requests");
   const [selReq, setSelReq] = useState(0);
   const [selTun, setSelTun] = useState(0);
-  const [message, setMessage] = useState(null);
+  const [message, setMessage] = useState(inspectorError ? { text: `Inspetor n\xE3o subiu: ${inspectorError}`, tone: "warn" } : null);
   const [now, setNow] = useState(() => Date.now());
   const quitting = useRef(false);
   const records = useMemo(() => {
@@ -350,6 +336,11 @@ function App({ session, version, system, onExit }) {
     await session.stop();
     onExit();
   }
+  async function openInspector() {
+    if (!inspector) return setMessage({ text: "Inspetor desligado (--no-inspect).", tone: "warn" });
+    const ok = await system.open(inspector.openUrl);
+    setMessage(ok ? { text: "Abrindo o inspetor", tone: "signal" } : { text: "N\xE3o consegui abrir o navegador.", tone: "warn" });
+  }
   async function act(kind) {
     const t = currentTunnel();
     if (!t?.url) return setMessage({ text: "Esse t\xFAnel ainda n\xE3o tem URL.", tone: "warn" });
@@ -436,13 +427,14 @@ function App({ session, version, system, onExit }) {
     if (key.escape && filter) return setFilter("");
     if (input === "c") return void act("copy");
     if (input === "o") return void act("open");
+    if (input === "i") return void openInspector();
     if (input === "m") return showQr();
     if (input === "f") return setMode({ kind: "filter", value: filter });
     if (input === "n") return setMode({ kind: "port", value: "" });
   });
   const live = state.tunnels.filter((t) => t.status === "live").length;
   const conn = state.connection === "online" ? { text: "conectado \u25CF", color: C.signal } : state.connection === "connecting" ? { text: "conectando\u2026", color: C.muted } : { text: "reconectando\u2026", color: C.warn };
-  const listHeight = Math.max(3, rows - state.tunnels.length - 9);
+  const listHeight = Math.max(3, rows - state.tunnels.length - (inspector ? 10 : 9));
   const detailRecord = mode.kind === "detail" ? all.find((r) => r.id === mode.id) : void 0;
   const qrTunnel = mode.kind === "qr" ? state.tunnels.find((t) => t.key === mode.key) : void 0;
   return /* @__PURE__ */ jsxs6(Box5, { flexDirection: "column", width, children: [
@@ -469,6 +461,7 @@ function App({ session, version, system, onExit }) {
     ] }),
     /* @__PURE__ */ jsx6(Text6, { children: " " }),
     /* @__PURE__ */ jsx6(TunnelTable, { tunnels: state.tunnels, selected: selTun, focused: focus === "tunnels" }),
+    inspector && /* @__PURE__ */ jsx6(Text6, { color: C.muted, children: `inspetor  ${inspector.url}` }),
     /* @__PURE__ */ jsx6(Text6, { children: " " }),
     mode.kind === "detail" && detailRecord ? /* @__PURE__ */ jsx6(Detail, { record: detailRecord }) : mode.kind === "qr" && qrTunnel ? /* @__PURE__ */ jsx6(QrView, { tunnel: qrTunnel, link: mode.link, now }) : /* @__PURE__ */ jsx6(RequestList, { records, tunnelIndex, selected: selReq, focused: focus === "requests", height: listHeight, width, filter }),
     /* @__PURE__ */ jsx6(Text6, { children: " " }),
@@ -554,7 +547,7 @@ var realSystem = {
 
 // src/ui/fullscreen.tsx
 import { jsx as jsx7 } from "react/jsx-runtime";
-function runFullscreen(session, specs, version) {
+function runFullscreen(session, specs, version, inspector, inspectorError) {
   return withFullscreen(
     process.stdout,
     (signal) => new Promise((resolve) => {
@@ -565,7 +558,7 @@ function runFullscreen(session, specs, version) {
         app.unmount();
         resolve(code);
       };
-      const app = render(/* @__PURE__ */ jsx7(App, { session, version, system: realSystem, onExit: () => finish(0) }), { exitOnCtrlC: false });
+      const app = render(/* @__PURE__ */ jsx7(App, { session, version, system: realSystem, inspector, inspectorError, onExit: () => finish(0) }), { exitOnCtrlC: false });
       signal.addEventListener("abort", () => void session.stop().then(() => finish(0)), { once: true });
       session.start(specs).catch(() => void 0);
     })