diff --git a/package.json b/package.json
index 2f280ea..8e1094e 100644
--- a/package.json
+++ b/package.json
@@ -6,7 +6,7 @@
   "license": "AGPL-3.0",
   "dependencies": {
     "@fraction/base16-css": "^1.1.0",
-    "@fraction/flotilla": "^1.0.1",
+    "@fraction/flotilla": "^2.0.0",
     "debug": "^4.1.1",
     "highlight.js": "^9.16.2",
     "hyperaxe": "^1.3.0",
diff --git a/src/pages/meta.js b/src/pages/meta.js
index c35b627..611ccc3 100644
--- a/src/pages/meta.js
+++ b/src/pages/meta.js
@@ -5,8 +5,11 @@ const metaView = require('./views/meta')
 
 module.exports = async function metaPage ({ theme }) {
   const status = await meta.status()
+  const peers = await meta.peers()
+
+  console.log(JSON.stringify(peers, null, 1))
 
   const { themeNames } = require('@fraction/base16-css')
 
-  return metaView({ status, theme, themeNames })
+  return metaView({ status, peers, theme, themeNames })
 }
diff --git a/src/pages/models/lib/cooler.js b/src/pages/models/lib/cooler.js
index e39d437..6f87c0c 100644
--- a/src/pages/models/lib/cooler.js
+++ b/src/pages/models/lib/cooler.js
@@ -20,6 +20,9 @@ const rawConnect = () => new Promise((resolve, reject) => {
         ls: 'source',
         want: 'async'
       },
+      conn: {
+        peers: 'source'
+      },
       createUserStream: 'source',
       createHistoryStream: 'source',
       get: 'sync',
diff --git a/src/pages/models/meta.js b/src/pages/models/meta.js
index a540dca..6e79d7d 100644
--- a/src/pages/models/meta.js
+++ b/src/pages/models/meta.js
@@ -1,6 +1,7 @@
 'use strict'
 
 const cooler = require('./lib/cooler')
+const pull = require('pull-stream')
 
 module.exports = {
   whoami: async () => {
@@ -21,6 +22,18 @@ module.exports = {
   },
   peers: async () => {
     const ssb = await cooler.connect()
-    return cooler.get(ssb.conn)
+    const peersSource = await cooler.read(ssb.conn.peers)
+
+    return new Promise((resolve, reject) => {
+      pull(
+        peersSource,
+        // https://github.com/staltz/ssb-conn/issues/9
+        pull.take(1),
+        pull.collect((err, val) => {
+          if (err) return reject(err)
+          resolve(val[0])
+        })
+      )
+    })
   }
 }
diff --git a/src/pages/views/meta.js b/src/pages/views/meta.js
index ac4437a..3384cb5 100644
--- a/src/pages/views/meta.js
+++ b/src/pages/views/meta.js
@@ -1,20 +1,18 @@
 'use strict'
 
-const highlightJs = require('highlight.js')
 const {
   a,
   button,
+  code,
   div,
   form,
   h1,
   h2,
   h3,
-  h4,
   label,
   li,
   option,
   p,
-  pre,
   progress,
   section,
   select,
@@ -22,24 +20,27 @@ const {
 } = require('hyperaxe')
 const template = require('./components/template')
 
-module.exports = ({ status, theme, themeNames }) => {
+module.exports = ({ status, peers, theme, themeNames }) => {
   const max = status.sync.since
 
   const progressElements = Object.entries(status.sync.plugins).map((e) => {
     const [key, val] = e
     const id = `progress-${key}`
-    return [
+    return div(
       label({ for: id }, key),
       progress({ id, value: val, max }, val)
-    ]
+    )
   })
 
-  const localPeers = Object.keys(status.local || []).map((key) => li(key))
-
-  const remotePeers = Object.keys(status.gossip || []).map((key) => li(key))
-
-  const raw = JSON.stringify(status, null, 2)
-  const rawHighlighted = highlightJs.highlight('json', raw).value
+  const peerList = (peers || [])
+    .map(([key, data]) =>
+      li(
+        a(
+          { href: `/author/${encodeURIComponent(data.key)}` },
+          code(data.key)
+        )
+      )
+    )
 
   const themeElements = themeNames.map((cur) => {
     const isCurrentTheme = cur === theme
@@ -98,12 +99,9 @@ module.exports = ({ status, theme, themeNames }) => {
       h2('Status'),
       h3('Indexes'),
       progressElements,
-      h3('Peers'),
-      h4('Local'),
-      ul(localPeers),
-      h4('Remote'),
-      ul(remotePeers),
-      h2('Raw'),
-      pre({ innerHTML: rawHighlighted }))
+      peerList.length > 0
+        ? [h3('Peers'), ul(peerList)]
+        : null
+    )
   )
 }