Added web sender and wired up to example/apollo-client

[kgpax]

What does this PR do?

• Adds packages/web which you can use to connect your client web application to Envy, ideally before mounting the app (so that initial requests are captured).

// index.tsx

import { enableTracing } from '@envy/web';
import { createRoot } from 'react-dom/client';
import { App } from './App';

const container = document.getElementById('app');
const root = createRoot(container);

// connect to Envy via `@envy/web` and mount the app
enableTracing({ serviceName: 'my-web-app', port: 9999 }).then(() => {
  root.render(<App />);
});

• Adds support for web senders in the collector
• Removes the on('close') listener in the collector, since refreshing the browser would disconnect the @envy/browser viewer
• Displays the service name of the application which sent the trace data in the detail view

Screenshots

How to test

• You know the drill by now...
• yarn workspace @envy/browser start in one terminal, then open http://localhost:9998
• yarn example:apollo in another, then open http://localhost:4001
• You should see four GQL traces in the browser UI (coming from examples/apollo-client) as well as five other traces (coming from examples/apollo)
• Click the orange refresh buttons in the example app and you'll see both the GQL request (coming from apollo-client) and the upstream requests (coming from apollo)