# request-maker

Request Maker is a Component for Studio to craft HTTP Requests, send them somewhere and display them back in the component.

- View the changelog: [Releases](https://github.com/stoplightio/request-maker/releases)

### Installation

Supported in modern browsers and node.

```bash
  yarn add request-maker
```

### Usage

This library exports `Request`, `Response` and `RequestMaker` component.

While the first two do not hold any state (they just display stuff) — `RequestMaker` hold the current/latest request
and forward the response to the `<Response>` component.

#### RequestMaker

```jsx
  <RequestMaker/>
```

That's all you need to do. It'll manage the state for you and place the components here and there.

#### Using Request and Response separately

In case you want to craft your own component, you can use the parts separately, but you'll have to manage its state

```jsx
import * as React from 'react';
import { Request } from './Request';
import { Response } from './Response';

export const RequestMaker: React.FunctionComponent<{}> = props => {
  const [response, setResponse] = React.useState({
    data: {},
    status: 0,
    statusText: '',
    headers: {},
  });

  return (
    <>
      <Request
        initialUrl="https://test.com/v1/users"
        initialVerb="GET"
        onRequestTerminated={setResponse}
      />
      <Response
        data={response.data}
        status={response.status}
        statusText={response.statusText}
        headers={response.headers}
      />
    </>
  )
};
```
