2 files changed, 70 insertions, 12 deletions

diff --git a/lib/app.js b/lib/app.js
index b57e5a6..f475bd2 100644
--- a/lib/app.js
+++ b/lib/app.js
@@ -282,6 +282,22 @@ App.prototype.streamChannels = function (opts) {
   )
 }
 
+App.prototype.streamMyChannels = function (id, opts) {
+  return pull(
+    this.sbot.createUserStream({id: id, reverse: true}),
+    this.unboxMessages(),
+    pull.filter(function (msg) {
+      if (msg.value.content.type == 'channel') {
+        return msg.value.content.subscribed
+      }
+    }),
+    pull.map(function (msg) {
+      return msg.value.content.channel
+    }),
+    pull.unique()
+  )
+}
+
 App.prototype.createContactStreams = function (id) {
   return new Contacts(this.sbot).createContactStreams(id)
 }
diff --git a/lib/serve.js b/lib/serve.js
index defac87..54516e1 100644
--- a/lib/serve.js
+++ b/lib/serve.js
@@ -543,20 +543,48 @@ Serve.prototype.peers = function (ext) {
 
 Serve.prototype.channels = function (ext) {
   var self = this
+  var id = self.app.sbot.id
+
+  function renderMyChannels() {
+    return pull(
+      self.app.streamMyChannels(id),
+      paramap(function (channel, cb) {
+        // var subscribed = false
+        cb(null, [
+          h('a', {href: self.app.render.toUrl('/channel/' + channel)}, '#' + channel),
+          ' '
+        ])
+      }, 8),
+      pull.map(u.toHTML),
+      self.wrapMyChannels()
+    )
+  }
+
+  function renderNetworkChannels() {
+    return pull(
+      self.app.streamChannels(),
+      paramap(function (channel, cb) {
+        // var subscribed = false
+        cb(null, [
+          h('a', {href: self.app.render.toUrl('/channel/' + channel)}, '#' + channel),
+          ' '
+        ])
+      }, 8),
+      pull.map(u.toHTML),
+      self.wrapChannels()
+    )
+  }
 
   pull(
-    self.app.streamChannels(),
-    paramap(function (channel, cb) {
-      var subscribed = false
-      cb(null, [
-        h('a', {href: self.app.render.toUrl('/channel/' + channel)}, '#' + channel),
-        ' '
+    cat([
+      ph('section', {}, [
+        ph('h3', {}, 'Channels:'),
+        renderMyChannels(),
+        renderNetworkChannels()
       ])
-    }, 8),
-    pull.map(u.toHTML),
-    self.wrapChannels(),
-    self.wrapPage('channels'),
-    self.respondSink(200, {
+    ]),
+    this.wrapPage('channels'),
+    this.respondSink(200, {
       'Content-Type': ctype(ext)
     })
   )
@@ -1294,7 +1322,21 @@ Serve.prototype.wrapChannels = function (opts) {
   return u.hyperwrap(function (channels, cb) {
     cb(null, [
       h('section',
-        h('h3', 'Channels')
+        h('h4', 'Network')
+      ),
+      h('section',
+        channels
+      )
+    ])
+  })
+}
+
+Serve.prototype.wrapMyChannels = function (opts) {
+  var self = this
+  return u.hyperwrap(function (channels, cb) {
+    cb(null, [
+      h('section',
+        h('h4', 'Subscribed')
       ),
       h('section',
         channels