feat: upgrade to v3 api (#294)

Upgrades all examples to `[email protected]` API

Author: achingbrain

.github/workflows/ci.yml

@@ -34,6 +34,7 @@ jobs:
           - js-libp2p-example-pubsub
           - js-libp2p-example-transports
           - js-libp2p-example-webrtc-private-to-private
+          - js-libp2p-example-webrtc-private-to-public
     defaults:
       run:
         working-directory: examples/${{ matrix.project }}
@@ -95,6 +96,7 @@ jobs:
           - js-libp2p-example-pubsub
           - js-libp2p-example-transports
           - js-libp2p-example-webrtc-private-to-private
+          - js-libp2p-example-webrtc-private-to-public
     steps:
       - uses: convictional/trigger-workflow-and-wait@f69fa9eedd3c62a599220f4d5745230e237904be
         with:

examples/js-libp2p-example-auto-tls/package.json

@@ -16,21 +16,22 @@
   },
   "type": "module",
   "dependencies": {
-    "@chainsafe/libp2p-noise": "^16.0.0",
-    "@chainsafe/libp2p-yamux": "^7.0.0",
+    "@chainsafe/libp2p-noise": "^17.0.0",
+    "@chainsafe/libp2p-yamux": "^8.0.0",
     "@ipshipyard/libp2p-auto-tls": "^1.0.0",
-    "@libp2p/autonat": "^2.0.13",
-    "@libp2p/bootstrap": "^11.0.14",
+    "@libp2p/autonat": "^3.0.0",
+    "@libp2p/bootstrap": "^12.0.0",
     "@libp2p/config": "^1.0.0",
-    "@libp2p/identify": "^3.0.13",
-    "@libp2p/kad-dht": "^15.0.0",
-    "@libp2p/keychain": "^5.0.11",
-    "@libp2p/ping": "^2.0.27",
-    "@libp2p/upnp-nat": "^3.0.1",
-    "@libp2p/websockets": "^9.1.0",
-    "@multiformats/multiaddr-matcher": "^1.6.0",
+    "@libp2p/identify": "^4.0.0",
+    "@libp2p/kad-dht": "^16.0.0",
+    "@libp2p/keychain": "^6.0.0",
+    "@libp2p/ping": "^3.0.0",
+    "@libp2p/tcp": "^11.0.1",
+    "@libp2p/upnp-nat": "^4.0.0",
+    "@libp2p/websockets": "^10.0.0",
+    "@multiformats/multiaddr-matcher": "^3.0.1",
     "datastore-level": "^11.0.1",
-    "libp2p": "^2.0.0"
+    "libp2p": "^3.0.0"
   },
   "private": true
 }

examples/js-libp2p-example-browser-pubsub/README.md

@@ -9,6 +9,9 @@
 
 This example leverages the [vite bundler](https://vitejs.dev/) to compile and serve the libp2p code in the browser. You can use other bundlers such as Webpack, but we will not be covering them here.
 
+> [!TIP]
+> This example uses `@libp2p/floodsub` as a pubsub implementation - it is not suitable for production use, instead use `@chainsafe/libp2p-gossipsub`
+
 ## Table of contents <!-- omit in toc -->
 
 - [Setup](#setup)

examples/js-libp2p-example-browser-pubsub/index.js

@@ -1,13 +1,12 @@
-import { gossipsub } from '@chainsafe/libp2p-gossipsub'
 import { noise } from '@chainsafe/libp2p-noise'
 import { yamux } from '@chainsafe/libp2p-yamux'
 import { circuitRelayTransport } from '@libp2p/circuit-relay-v2'
-import { dcutr } from '@libp2p/dcutr'
+import { floodsub } from '@libp2p/floodsub'
 import { identify } from '@libp2p/identify'
 import { webRTC } from '@libp2p/webrtc'
 import { webSockets } from '@libp2p/websockets'
-import * as filters from '@libp2p/websockets/filters'
 import { multiaddr } from '@multiformats/multiaddr'
+import { WebRTC } from '@multiformats/multiaddr-matcher'
 import { createLibp2p } from 'libp2p'
 import { fromString, toString } from 'uint8arrays'
 
@@ -48,10 +47,7 @@ const libp2p = await createLibp2p({
   },
   transports: [
     // the WebSocket transport lets us dial a local relay
-    webSockets({
-      // this allows non-secure WebSocket connections for purposes of the demo
-      filter: filters.all
-    }),
+    webSockets(),
     // support dialing/listening on WebRTC addresses
     webRTC(),
     // support dialing/listening on Circuit Relay addresses
@@ -72,8 +68,7 @@ const libp2p = await createLibp2p({
   },
   services: {
     identify: identify(),
-    pubsub: gossipsub(),
-    dcutr: dcutr()
+    pubsub: floodsub()
   }
 })
 
@@ -113,6 +108,7 @@ libp2p.addEventListener('connection:close', () => {
 // update listening addresses
 libp2p.addEventListener('self:peer:update', () => {
   const multiaddrs = libp2p.getMultiaddrs()
+    .filter(ma => WebRTC.matches(ma))
     .map((ma) => {
       const el = document.createElement('li')
       el.textContent = ma.toString()

examples/js-libp2p-example-browser-pubsub/package.json

@@ -21,16 +21,17 @@
     "test": "npm run build && test-browser-example test"
   },
   "dependencies": {
-    "@chainsafe/libp2p-gossipsub": "^14.0.0",
-    "@chainsafe/libp2p-noise": "^16.0.0",
-    "@chainsafe/libp2p-yamux": "^7.0.0",
-    "@libp2p/circuit-relay-v2": "^3.0.0",
-    "@libp2p/dcutr": "^2.0.0",
-    "@libp2p/identify": "^3.0.0",
-    "@libp2p/webrtc": "^5.0.0",
-    "@libp2p/websockets": "^9.0.0",
-    "@multiformats/multiaddr": "^12.3.1",
-    "libp2p": "^2.0.0",
+    "@chainsafe/libp2p-noise": "^17.0.0",
+    "@chainsafe/libp2p-yamux": "^8.0.0",
+    "@libp2p/circuit-relay-v2": "^4.0.1",
+    "@libp2p/floodsub": "^11.0.1",
+    "@libp2p/identify": "^4.0.1",
+    "@libp2p/webrtc": "^6.0.3",
+    "@libp2p/websockets": "^10.0.1",
+    "@multiformats/multiaddr": "^13.0.1",
+    "@multiformats/multiaddr-matcher": "^3.0.1",
+    "libp2p": "^3.0.2",
+    "uint8arrays": "^5.1.0",
     "vite": "^6.0.3"
   },
   "devDependencies": {

examples/js-libp2p-example-browser-pubsub/relay.js

@@ -5,17 +5,14 @@ import { yamux } from '@chainsafe/libp2p-yamux'
 import { circuitRelayServer } from '@libp2p/circuit-relay-v2'
 import { identify } from '@libp2p/identify'
 import { webSockets } from '@libp2p/websockets'
-import * as filters from '@libp2p/websockets/filters'
 import { createLibp2p } from 'libp2p'
 
 const server = await createLibp2p({
   addresses: {
     listen: ['/ip4/127.0.0.1/tcp/0/ws']
   },
   transports: [
-    webSockets({
-      filter: filters.all
-    })
+    webSockets()
   ],
   connectionEncrypters: [noise()],
   streamMuxers: [yamux()],

examples/js-libp2p-example-browser-pubsub/test/index.spec.js

@@ -1,10 +1,8 @@
-/* eslint-disable no-console */
 import { noise } from '@chainsafe/libp2p-noise'
 import { yamux } from '@chainsafe/libp2p-yamux'
 import { circuitRelayServer } from '@libp2p/circuit-relay-v2'
 import { identify } from '@libp2p/identify'
 import { webSockets } from '@libp2p/websockets'
-import * as filters from '@libp2p/websockets/filters'
 import { createLibp2p } from 'libp2p'
 import { setup, expect } from 'test-ipfs-example/browser'
 
@@ -32,9 +30,7 @@ async function spawnRelay () {
       listen: ['/ip4/127.0.0.1/tcp/0/ws']
     },
     transports: [
-      webSockets({
-        filter: filters.all
-      })
+      webSockets()
     ],
     connectionEncrypters: [noise()],
     streamMuxers: [yamux()],
@@ -53,7 +49,6 @@ test.describe('pubsub browser example:', () => {
   let relayNode
   let relayNodeAddr
 
-  // eslint-disable-next-line no-empty-pattern
   test.beforeAll(async ({ servers }, testInfo) => {
     testInfo.setTimeout(5 * 60_000)
     const r = await spawnRelay()
@@ -70,7 +65,7 @@ test.describe('pubsub browser example:', () => {
     await page.goto(url)
   })
 
-  test('should connect via a relay node', async ({ page: pageA, context }) => {
+  test('should send and receive a message', async ({ page: pageA, context }) => {
     // load second page
     const pageB = await context.newPage()
     await pageB.goto(url)

examples/js-libp2p-example-chat/package.json

@@ -16,21 +16,18 @@
     "test": "test-node-example test/*"
   },
   "dependencies": {
-    "@chainsafe/libp2p-noise": "^16.0.0",
-    "@chainsafe/libp2p-yamux": "^7.0.0",
-    "@libp2p/mdns": "^11.0.1",
-    "@libp2p/tcp": "^10.0.0",
-    "@libp2p/websockets": "^9.0.0",
-    "@multiformats/multiaddr": "^12.3.1",
+    "@chainsafe/libp2p-noise": "^17.0.0",
+    "@chainsafe/libp2p-yamux": "^8.0.0",
+    "@libp2p/mdns": "^12.0.2",
+    "@libp2p/tcp": "^11.0.1",
+    "@libp2p/utils": "^7.0.1",
+    "@libp2p/websockets": "^10.0.1",
     "@nodeutils/defaults-deep": "^1.1.0",
-    "it-length-prefixed": "^10.0.1",
-    "it-map": "^3.0.3",
-    "it-pipe": "^3.0.1",
-    "libp2p": "^2.0.0",
-    "p-defer": "^4.0.0",
+    "libp2p": "^3.0.2",
     "uint8arrays": "^5.1.0"
   },
   "devDependencies": {
+    "p-defer": "^4.0.0",
     "test-ipfs-example": "^1.1.0"
   },
   "private": true

examples/js-libp2p-example-chat/src/listener.js

@@ -18,7 +18,7 @@ async function run () {
   })
 
   // Handle messages for the protocol
-  await listener.handle('/chat/1.0.0', async ({ stream }) => {
+  await listener.handle('/chat/1.0.0', async (stream) => {
     // Send stdin to the stream
     stdinToStream(stream)
     // Read the stream and output to console

examples/js-libp2p-example-chat/src/stream.js

@@ -1,41 +1,27 @@
 /* eslint-disable no-console */
 
-import * as lp from 'it-length-prefixed'
-import map from 'it-map'
-import { pipe } from 'it-pipe'
-import { fromString as uint8ArrayFromString } from 'uint8arrays/from-string'
+import { lpStream } from '@libp2p/utils'
 import { toString as uint8ArrayToString } from 'uint8arrays/to-string'
 
 export function stdinToStream (stream) {
-  // Read utf-8 from stdin
-  process.stdin.setEncoding('utf8')
-  pipe(
-    // Read from stdin (the source)
-    process.stdin,
-    // Turn strings into buffers
-    (source) => map(source, (string) => uint8ArrayFromString(string)),
-    // Encode with length prefix (so receiving side knows how much data is coming)
-    (source) => lp.encode(source),
-    // Write to the stream (the sink)
-    stream.sink
-  )
+  // Encode with length prefix (so receiving side knows how much data is coming)
+  const lp = lpStream(stream)
+
+  process.stdin.addListener('data', (buf) => {
+    lp.write(buf)
+  })
 }
 
 export function streamToConsole (stream) {
-  pipe(
-    // Read from the stream (the source)
-    stream.source,
-    // Decode length-prefixed data
-    (source) => lp.decode(source),
-    // Turn buffers into strings
-    (source) => map(source, (buf) => uint8ArrayToString(buf.subarray())),
-    // Sink function
-    async function (source) {
-      // For each chunk of data
-      for await (const msg of source) {
-        // Output the data as a utf8 string
-        console.log('> ' + msg.toString().replace('\n', ''))
-      }
+  const lp = lpStream(stream)
+
+  Promise.resolve().then(async () => {
+    while (true) {
+      // Read from the stream
+      const message = await lp.read()
+
+      // Output the data as a utf8 string
+      console.log('> ' + uint8ArrayToString(message.subarray()).replace('\n', ''))
     }
-  )
+  })
 }