get history on refresh

Author: assaf

App.js

@@ -27,6 +27,8 @@ export default class App extends React.Component {
     stationChannel: "",
     messages: [],
     lastUpdate: null,
+    firstItem: -1,
+    refreshing: false,
   };
 
   urbit = null
@@ -108,19 +110,41 @@ export default class App extends React.Component {
   }
 
   async doLeave() {
-    res = await this.urbitAnon.unsubscribe(this.state.stationShip, 'talk', '/afx/' + this.state.stationChannel)
+    res = await this.urbitAnon.unsubscribe(this.state.stationShip, '/', 'talk', '/afx/' + this.state.stationChannel)
     if (!res) {
       console.log("Failed to unsubscribe")
     }
 
-    this.setState({ inChannel: false, messages: [] })
+    this.setState({
+      inChannel: false,
+      messages: [],
+      refreshing: false,
+      firstItem: -1
+    })
   }
 
-  handleMessages(data) {
-    var newMessages = this.state.messages.slice()
+  handleMessages(wire, data) {
+    var isRefresh = wire.startsWith('/refresh')
 
-    if (data.grams) {
-      this.setState({ loading: false })
+    if (data == null) {
+      // got %quit
+      console.log("got %quit for: " + wire)
+      if (isRefresh) {
+        this.setState({ refreshing: false })
+
+      } else {
+        //TODO resubscribe
+      }
+
+    } else if (data.grams) {
+      var newMessages = []
+      if (!isRefresh) {
+        newMessages = this.state.messages.slice()
+      }
+
+      if (this.state.firstItem == -1 || data.grams.num < this.state.firstItem) {
+        this.setState({ firstItem: data.grams.num })
+      }
       data.grams.tele.forEach(t => {
         var speech = t.thought.statement.speech
         var messages = this.processSpeech(
@@ -134,9 +158,20 @@ export default class App extends React.Component {
         }
       })
 
-      this.setState({
-        messages: newMessages
-      })
+      if (isRefresh) {
+        newMessages = newMessages.concat(this.state.messages.slice())
+
+        var path = wire.substring('/refresh'.length)
+        this.urbitAnon.unsubscribe(this.state.stationShip, wire, 'talk', path)
+      }
+
+      this.setState({ messages: newMessages })
+      if (isRefresh) {
+        this.setState({ refreshing: false })
+
+      } else {
+        this.setState({ loading: false })
+      }
     }
   }
 
@@ -347,6 +382,28 @@ export default class App extends React.Component {
     );
   }
 
+  async refresh() {
+    if (this.state.firstItem == 0 || this.state.refreshing) {
+      return
+    }
+
+    this.setState({ refreshing: true })
+
+    var maxFetchItems = 32
+    var end = this.state.firstItem + 1
+    var start = Math.max(0, end - maxFetchItems)
+    var path = '/afx/' + this.state.stationChannel
+        + '/' + this.urbit.formatNumber(start)
+        + '/' + this.urbit.formatNumber(end)
+
+    var res = await this.urbitAnon.subscribe(this.state.stationShip, '/refresh' + path,
+        'talk', path, this.handleMessages.bind(this))
+
+    if (!res) {
+      console.log("refresh failed")
+      this.setState({ refreshing: false })
+    }
+  }
 
   render() {
     if (this.state.loading) {
@@ -392,6 +449,8 @@ export default class App extends React.Component {
           data={this.state.messages}
           renderItem={this.renderItem.bind(this)}
           ListFooterComponent={this.listFooter.bind(this)}
+          refreshing={this.state.refreshing}
+          onRefresh={this.refresh.bind(this)}
         />
 
         <KeyboardAvoidingView behavior="padding">

JoinStation.js

@@ -31,7 +31,7 @@ export default class JoinStation extends React.Component {
     await this.urbitAnon.isAuthenticated()
 
     res = await this.urbitAnon.subscribe(
-        this.state.stationShip,
+        this.state.stationShip, "/",
         'talk', '/afx/' + this.state.stationChannel,
         this.props.onMessages, this.props.onPoll)
 

Urbit.js

@@ -5,6 +5,7 @@ export default class Urbit {
     this.oryx = null;
     this.ixor = null;
     this.event = -1
+    this.subscriptions = 0
   }
 
   async isAuthenticated() {
@@ -128,7 +129,7 @@ export default class Urbit {
     }
   }
 
-  async subscribe(ship, app, path, callback, pollback) {
+  async subscribe(ship, wire, app, path, callback, pollback) {
     try {
       var url = this.server + "/~/is/~" + ship + "/" + app + path + "/.json?PUT"
       let response = await fetch(url, {
@@ -139,7 +140,7 @@ export default class Urbit {
         method: 'POST',
         body: JSON.stringify({
           oryx: this.oryx,
-          wire: path,
+          wire: wire,
           appl: app,
           mark: 'json',
           ship: ship
@@ -153,10 +154,12 @@ export default class Urbit {
       }
 
       var responseJson = await response.json()
-      this.event = 1;
-
-      console.log("Subscribed successfully")
-      this.poll(callback, pollback);
+      console.log("Subscribed successfully: " + wire)
+      this.subscriptions++
+      if (this.event == -1) {
+        this.event = 1;
+        this.poll(callback, pollback);
+      }
       return true
 
     } catch (error) {
@@ -165,7 +168,7 @@ export default class Urbit {
     }
   }
 
-  async unsubscribe(ship, app, path) {
+  async unsubscribe(ship, wire, app, path) {
     try {
       var url = this.server + "/~/is/~" + ship + "/" + app + path + "/.json?DELETE"
       let response = await fetch(url, {
@@ -176,7 +179,7 @@ export default class Urbit {
         method: 'POST',
         body: JSON.stringify({
           oryx: this.oryx,
-          wire: path,
+          wire: wire,
           appl: app,
           mark: 'json',
           ship: ship
@@ -189,9 +192,12 @@ export default class Urbit {
         return false
       }
 
-      // cancel polling
-      this.event = -1
-      console.log("Unsubscribed successfully")
+      this.subscriptions--
+      if (this.subscriptions == 0) {
+        // cancel polling
+        this.event = -1
+      }
+      console.log("Unsubscribed successfully: " + wire)
 
       return true
 
@@ -226,7 +232,10 @@ export default class Urbit {
         if (!responseJson.beat) {
           // got a change
           if (responseJson.type == 'rush') {
-            callback(responseJson.data.json)
+            callback(responseJson.from.path, responseJson.data.json)
+
+          } else if (responseJson.type == 'quit') {
+            callback(responseJson.from.path, null)
           }
           this.event++
         }
@@ -250,6 +259,13 @@ export default class Urbit {
     return str.slice(0, -1);
   }
 
+  /**
+   * format a number the urbit way (with dots)
+   */
+  formatNumber(num) {
+    return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ".");
+  }
+
   formatStation(stationShip, stationChannel, short) {
     return "~" + this.formatShip(stationShip, short) + "/" + stationChannel
   }

app.json

@@ -2,7 +2,7 @@
   "expo": {
     "name": "Urbit Mobile Talk",
     "icon": "./icon.png",
-    "version": "0.4.0",
+    "version": "0.5.0",
     "slug": "urbit-mobile-talk",
     "sdkVersion": "20.0.0",
     "ios": {