DB & Dev Tools · APIs: requests, answers, environments, sockets and GraphQL

ApiRequestBuilder builds a request: its method and address, then tabs
for the query's pairs, headers, body and sign-in, with the address that
goes out under the field, the environment's {{variables}} filled in or
the missing ones named. Send hands the owner the request. The query's
pairs go through forms::KeyValueInput. ResponseViewer shows an answer's
status in its class's tone with its words, its time and size, then its
body, JSON indented, or its headers in a HeadersTable.
EnvironmentSelector picks a set of variables and masks secrets until
their eye opens them. CollectionTree holds saved requests in folders;
Enter opens one. WebSocketConsole shows a socket's messages, each
marked sent or received with its time, and sends on Enter while the
socket is open and the field holds words. GraphQLExplorer browses a
schema beside a query and its variables; Run waits for variables that
read as JSON and the answer shows as a tree.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

examples/gallery/pages/devtools/mod.rs

@@ -1,5 +1,6 @@
 use gpui::{AnyElement, App, Window, div, prelude::*};
 
+mod apis;
 mod data;
 mod db;
 mod formats;
@@ -26,5 +27,8 @@ fn render(window: &mut Window, cx: &mut App) -> AnyElement {
         .child(db::structure(window, cx))
         .child(data::redis(window, cx))
         .child(formats::documents(window, cx))
+        .child(apis::requests(window, cx))
+        .child(apis::socket(window, cx))
+        .child(apis::graphql(window, cx))
         .into_any_element()
 }