refactor(web): add HTTP Editor Context and eliminate prop drilling

[andrewmelchor]

Summary

New Context System

• HttpRequestEditorContext.tsx - Context provider using createSimpleContext utility
• Exports useHttpRequestEditor hook and HttpRequestEditorProvider component

[greptile-apps]

Greptile Summary

This PR introduces an HTTP Request Editor context (HttpRequestEditorContext) to eliminate the ~36-prop drilling chain from HttpEditorWithExecution down to RequestWorkspaceTabs, using the existing createSimpleContext utility. The refactoring is logically correct — no behavioral changes are introduced — and significantly cleans up the RequestWorkspaceTabs props interface.

Key changes:

• New HttpRequestEditorContext.tsx exposes useHttpRequestEditor and HttpRequestEditorProvider, initialized directly from the HttpRequestWorkspaceState object (no async gating needed).
• HttpEditorWithExecution wraps its return tree with HttpRequestEditorProvider and drops all workspace-related props from the RequestWorkspaceTabs call site.
• RequestWorkspaceTabs shrinks from ~36 props to 2, reading workspace state via useHttpRequestEditor().
• HttpRequestWorkspaceState interface is exported from useHttpRequestWorkspace.ts to support the new context type.

Concerns:

• request-workspace-tabs.tsx now imports useHttpRequestEditor directly from ../editor/HttpRequestEditorContext, creating an upward dependency from the request-workspace module into the editor module. Moving the context file to a shared location (e.g., src/context/) would preserve clear module boundaries.
• selectedRequest is defined as a plain inline function called three times in JSX, while requestParams is a createMemo. These should be consistent for clarity and to avoid multiple independent reactive subscriptions.

Confidence Score: 4/5

• This PR is safe to merge — it's a clean prop-drilling refactor with no behavioral changes, though a minor architectural coupling concern is worth addressing.
• All props previously passed explicitly are now accessed via context with the same values; no logic changed. The only concerns are architectural (cross-module coupling) and a minor SolidJS best-practice inconsistency (memo vs. plain function), neither of which is a runtime bug.
• packages/web/src/components/request-workspace/request-workspace-tabs.tsx — imports context from the sibling editor/ module, creating an unusual upward dependency.

Important Files Changed

Filename	Overview
packages/web/src/components/editor/HttpRequestEditorContext.tsx	New context file that wraps HttpRequestWorkspaceState using the createSimpleContext utility with gate: false (no async gating). Clean and minimal implementation; the interface extending Record<string, unknown> is required by the generic constraint of createSimpleContext.
packages/web/src/components/editor/HttpEditorWithExecution.tsx	Fragment replaced with HttpRequestEditorProvider wrapping the same content; 36 props removed from the RequestWorkspaceTabs call site. The change is correct and non-breaking.
packages/web/src/components/request-workspace/request-workspace-tabs.tsx	Props interface reduced to only activeTab and onTabChange; workspace state now consumed via useHttpRequestEditor(). Introduces an upward cross-module dependency (request-workspace → editor), and selectedRequest is a plain function called 3x in JSX rather than a memo, both worth addressing.
packages/web/src/hooks/useHttpRequestWorkspace.ts	Only change is exporting the HttpRequestWorkspaceState interface (previously unexported). No logic changes; straightforward and correct.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A["HttpEditorWithExecution\n(editor/)"]
    B["HttpRequestEditorProvider\n(editor/HttpRequestEditorContext)"]
    C["HttpRequestWorkspaceState\n(hooks/useHttpRequestWorkspace)"]
    D["RequestWorkspaceTabs\n(request-workspace/)"]
    E["useHttpRequestEditor()\n → workspace.selection\n → workspace.requests\n → workspace.drafts"]
    F["RequestWorkspaceHeadersPanel"]
    G["RequestWorkspaceBodyPanel"]
    H["RequestWorkspaceParamsPanel"]

    A -->|"creates & passes store"| B
    A -->|"renders inside provider"| D
    C -->|"HttpRequestWorkspaceState"| B
    B -->|"provides context"| D
    D -->|"consumes context"| E
    E --> F
    E --> G
    E --> H

Loading

_{Last reviewed commit: 4547867}