Initialize plugins inside the headless hooks

[Murderlon]

Initial checklist

• I understand this is a feature request and questions should be posted in the Community Forum
• I searched issues and couldn’t find anything (or linked relevant results below)

Problem

It's a bit odd that when using headless hooks you still have to install the plugins on the Uppy instance:

new Uppy()
  .use(Tus, {
    endpoint: 'https://tusd.tusdemo.net/files/',
  })
  .use(UppyWebcam)
  .use(UppyScreenCapture)
  .use(UppyImageEditor)
  .use(UppyRemoteSources, { companionUrl: 'http://localhost:3020' })

but also initialize the hooks:

const editor = useImageEditor({ file: props.file })
const remoteSource = useRemoteSource(props.id)
const screenCapture = useScreenCapture({ onSubmit: props.close })
const webcam = useWebcam({ onSubmit: props.close })

Solution

Breaking change: initialize the plugin inside the hooks and pass all plugin options through the hook.

This gets rid of the unneeded duplication and off separation of initialization and configuration.

Alternatives

None