Describe the bug

This is the same problems as #2033 but for /webrtc-direct

To Reproduce

1. Run Kubo v0.24.0
2. Enable WebRTCDirect by
   1. adding "/ip4/0.0.0.0/udp/4002/webrtc-direct" to Addresses.Swarm
   2. enabling transport via ipfs config Swarm.Transports.Network.WebRTCDirect --json true
3. Restart node, wait a minute for listeners to set up via UPnP
4. Open webui
5. See broken state:

   

See Release Notes for more info: https://github.com/ipfs/kubo/blob/master/docs/changelogs/v0.24.md

Expected behavior

Show /webrtc-direct (spec) listeners returned by ipfs.id
While at it, also make sure /webrtc (spec) is supported as well (not in kubo yet, but will be added in near future).

To avoid a big refactor, a fix similar to patches/multiaddr+8.1.2.patch from #2057 would be sufficient for solving the problem at hand.
Add codes for webrtc-direct and webrtc https://github.com/multiformats/multiaddr/blob/master/protocols.csv