mirror of
https://github.com/mountain-loop/yaak.git
synced 2026-11-13 12:13:42 +01:00
The actions row moves out of the code editor into ActionsBar, a plain component a wrapper places over its content. FormatAction reformats an editor through its ref, and BodyViewModeSwitch names its first state for the body's format (Pretty, Table, Parts, Preview, Form) next to Raw. Yaak Proxy's request and response body tabs now share one viewer choice, with the switch in each tab's bar beside the text viewer's filter. The choice is remembered for both panes; bodies over the large size open raw. "Response (Raw)" leaves the proxy's tab menu, while Yaak's response pane keeps it until the remaining sites move. SegmentedControl moves from the client into packages/ui. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
57 lines
1.6 KiB
TypeScript
57 lines
1.6 KiB
TypeScript
import { formatSize } from "@yaakapp-internal/lib/formatSize";
|
|
import {
|
|
Banner,
|
|
CONTROL_TOOLTIP_DELAY,
|
|
EmptyStateText,
|
|
LoadingIcon,
|
|
Tooltip,
|
|
} from "@yaakapp-internal/ui";
|
|
import type { HttpBodyResult } from "@yaakapp-internal/ui/httpTypes";
|
|
import type { ReactNode } from "react";
|
|
import type { FlowBodyData } from "../lib/flowViews";
|
|
|
|
interface Props {
|
|
/** The request body as the engine's body RPC returned it */
|
|
body: HttpBodyResult<FlowBodyData | null>;
|
|
/** The body in the viewer for its type, formatted or raw */
|
|
viewer: ReactNode;
|
|
/** Bytes of the request body on the wire */
|
|
requestSize: number;
|
|
}
|
|
|
|
/**
|
|
* The request half's Body tab: the body in its viewer, or why it isn't there yet. A body that
|
|
* failed to load says why, as the response's viewer does, rather than reading as no body.
|
|
*/
|
|
export function FlowRequestBody({ body, viewer, requestSize }: Props) {
|
|
if (body.error != null) {
|
|
return (
|
|
<Banner color="danger" className="text-sm">
|
|
{body.error.message}
|
|
</Banner>
|
|
);
|
|
}
|
|
if (body.isLoading) {
|
|
return (
|
|
<EmptyStateText>
|
|
<LoadingIcon />
|
|
</EmptyStateText>
|
|
);
|
|
}
|
|
if (body.data?.truncated) {
|
|
return (
|
|
<div className="h-full grid grid-rows-[auto_minmax(0,1fr)]">
|
|
<Banner color="notice" className="text-sm mb-2">
|
|
<Tooltip wrap content="The app sent all of it" delay={CONTROL_TOOLTIP_DELAY}>
|
|
<span>
|
|
First {formatSize(body.data.storedSize)} of {formatSize(requestSize)} kept
|
|
</span>
|
|
</Tooltip>
|
|
</Banner>
|
|
<div className="min-h-0">{viewer}</div>
|
|
</div>
|
|
);
|
|
}
|
|
return viewer;
|
|
}
|