wire-devtool

Wire Devtool

Reference: devtools/README.md.

Warning: bindings, protocols, registry, shell, transport, transport-panel, and wire are internal platform packages, not tools — do not wire them. feature-flags is an example of a real tool.

1. Identify the tool

1. Ask for the tool name if not already provided as an argument or in context.
2. If devtools/<tool-name>/ does not exist, stop and tell the user to generate it first:

   pnpm --filter @devtools/registry add-tool
   

3. If it exists, read only devtools/<tool-name>/src/types.ts to determine whether the tool has props (file present = has props). Do not read anything else.

2. Ask where to wire

AskUserQuestion({
  questions: [
    {
      question: "Which host apps should I wire this tool into?",
      header: "Host wiring",
      multiSelect: true,
      options: [
        { label: "LLD",       description: "apps/ledger-live-desktop" },
        { label: "LLM",       description: "apps/ledger-live-mobile" },
        { label: "web-tools", description: "apps/web-tools" },
      ]
    }
  ]
})

Stop here if the user selects none.

If the tool has props, check whether devtools/bindings/src/use<ToolName>ToolProps.ts already exists.

• If it exists, skip to step 4 and use it directly.
• If it does not exist, ask:

AskUserQuestion({
  questions: [
    {
      question: "Should I create a bindings hook for this tool?",
      header: "Bindings",
      multiSelect: false,
      options: [
        { label: "Yes", description: "Create use<ToolName>Props in @devtools/bindings and wire it into selected hosts." },
        { label: "No",  description: "Skip bindings — wire with config: undefined for now." },
      ]
    }
  ]
})

3. Create bindings (if requested)

Create devtools/bindings/src/use<ToolName>Props.ts — a hook that reads from the host's state and returns the tool's props type. Then re-export it from devtools/bindings/src/index.ts.

// devtools/bindings/src/useMyToolProps.ts
import type { MyToolProps } from "@devtools/my-tool";

export function useMyToolProps(): MyToolProps {
  return {
    // TODO: replace with real selectors
    property: undefined,
  };
}