Sync on reconnect

This commit is contained in:
Chen-I Lim 2020-11-06 10:17:33 -08:00
parent 0d0bc7a672
commit 40623db4c5
3 changed files with 29 additions and 13 deletions

View file

@ -56,12 +56,20 @@ class CardDetail extends React.Component<Props, State> {
componentDidMount() { componentDidMount() {
const cardTree = new MutableCardTree(this.props.cardId) const cardTree = new MutableCardTree(this.props.cardId)
this.cardListener = new OctoListener() this.cardListener = new OctoListener()
this.cardListener.open([this.props.cardId], async (blocks) => { this.cardListener.open(
Utils.log(`cardListener.onChanged: ${blocks.length}`) [this.props.cardId],
const newCardTree = cardTree.mutableCopy() async (blocks) => {
newCardTree.incrementalUpdate(blocks) Utils.log(`cardListener.onChanged: ${blocks.length}`)
this.setState({cardTree: newCardTree}) const newCardTree = cardTree.mutableCopy()
}) newCardTree.incrementalUpdate(blocks)
this.setState({cardTree: newCardTree, title: cardTree.card.title})
},
async () => {
Utils.log(`cardListener.onReconnect`)
const newCardTree = cardTree.mutableCopy()
await newCardTree.sync()
this.setState({cardTree: newCardTree, title: newCardTree.card.title})
})
cardTree.sync().then(() => { cardTree.sync().then(() => {
this.setState({cardTree, title: cardTree.card.title}) this.setState({cardTree, title: cardTree.card.title})
setTimeout(() => { setTimeout(() => {

View file

@ -43,7 +43,7 @@ class OctoListener {
Utils.log(`OctoListener serverUrl: ${this.serverUrl}`) Utils.log(`OctoListener serverUrl: ${this.serverUrl}`)
} }
open(blockIds: string[], onChange: OnChangeHandler) { open(blockIds: string[], onChange: OnChangeHandler, onReconnect: () => void) {
let timeoutId: NodeJS.Timeout let timeoutId: NodeJS.Timeout
if (this.ws) { if (this.ws) {
@ -75,13 +75,14 @@ class OctoListener {
const reopenBlockIds = this.isInitialized ? this.blockIds.slice() : blockIds.slice() const reopenBlockIds = this.isInitialized ? this.blockIds.slice() : blockIds.slice()
Utils.logError(`Unexpected close, re-opening with ${reopenBlockIds.length} blocks...`) Utils.logError(`Unexpected close, re-opening with ${reopenBlockIds.length} blocks...`)
setTimeout(() => { setTimeout(() => {
this.open(reopenBlockIds, onChange) this.open(reopenBlockIds, onChange, onReconnect)
onReconnect()
}, this.reopenDelay) }, this.reopenDelay)
} }
} }
ws.onmessage = (e) => { ws.onmessage = (e) => {
Utils.log(`OctoListener websocket onmessage. data: ${e.data}`) // Utils.log(`OctoListener websocket onmessage. data: ${e.data}`)
if (ws !== this.ws) { if (ws !== this.ws) {
Utils.log('Ignoring closed ws') Utils.log('Ignoring closed ws')
return return
@ -94,6 +95,7 @@ class OctoListener {
if (timeoutId) { if (timeoutId) {
clearTimeout(timeoutId) clearTimeout(timeoutId)
} }
Utils.log(`OctoListener update block: ${message.block?.id}`)
this.queueUpdateNotification(message.block) this.queueUpdateNotification(message.block)
break break
default: default:

View file

@ -152,10 +152,16 @@ export default class BoardPage extends React.Component<Props, State> {
const boardIds = workspaceTree.boards.map((o) => o.id) const boardIds = workspaceTree.boards.map((o) => o.id)
// Listen to boards plus all blocks at root (Empty string for parentId) // Listen to boards plus all blocks at root (Empty string for parentId)
this.workspaceListener.open(['', ...boardIds], async (blocks) => { this.workspaceListener.open(
Utils.log(`workspaceListener.onChanged: ${blocks.length}`) ['', ...boardIds],
this.incrementalUpdate(blocks) async (blocks) => {
}) Utils.log(`workspaceListener.onChanged: ${blocks.length}`)
this.incrementalUpdate(blocks)
},
() => {
Utils.log(`workspaceListener.onReconnect`)
this.sync()
})
if (boardId) { if (boardId) {
const boardTree = new MutableBoardTree(boardId) const boardTree = new MutableBoardTree(boardId)