add supabase integration

.gitignore

@@ -1,3 +1,4 @@
 node_modules
 .DS_Store
 coverage
+.env

package.json

@@ -9,9 +9,11 @@
     "test": "node --experimental-vm-modules node_modules/jest/bin/jest.js"
   },
   "devDependencies": {
+    "dotenv": "^16.0.3",
     "jest": "^29.1.2"
   },
   "dependencies": {
+    "@supabase/supabase-js": "^1.35.7",
     "cors": "^2.8.5",
     "events": "^3.3.0",
     "express": "^4.18.1",

src/server/config.js

@@ -0,0 +1,6 @@
+import dotenv from 'dotenv'
+
+dotenv.config()
+
+export const supabaseKey = process.env.SUPABASE_KEY
+export const supabaseUrl = process.env.SUPABASE_URL

src/server/database.js

@@ -0,0 +1,34 @@
+import { createClient } from '@supabase/supabase-js'
+import { supabaseUrl, supabaseKey } from './config'
+
+const supabase = createClient(supabaseUrl, supabaseKey)
+
+export const getSnapshot = async (id) => {
+  const { data, error } = await supabase
+  .from('rooms')
+  .select('snapshot')
+  .is('slug', id)
+
+  if (error) {
+    // Probably doesn't exist.
+    // Could be another error. We should check for other errors too.
+    return []
+  }
+
+  return JSON.parse(data[0].snapshot)
+}
+
+export const setSnapshot = async (id, snapshot) => {
+  const { data, error } = await supabase
+    .from('rooms')
+    .insert({ snapshot: JSON.stringify(snapshot), slug: id })
+    .single()
+
+  if (error) {
+    return []
+  }
+
+  return data
+}
+
+export default supabase

src/server/server-room.js

@@ -1,12 +1,18 @@
 import WebSocket from 'ws'
 import Kernal from '../merge/kernal'
 import { createMessage } from '../merge/messages'
+import { getSnapshot, setSnapshot } from './database'
 
 export class ServerRoom {
   constructor(slug) {
     this.clients = new Map()
     this.kernal = new Kernal(this.handleOps)
     this.slug = slug
+    getSnapshot(slug).then((snapshot) => {
+      if (snapshot.length > 0) {
+        this.kernal.applyOps(snapshot, 'database')
+      }
+    })
   }
 
   handleConnection = (client) => {
@@ -39,7 +45,12 @@ export class ServerRoom {
   }
 
   handleOps = (ops, source) => {
-    if (source === 'remote') {
+    if (source === 'local' || source === 'remote') {
+      // We don't wait for this to happen.
+      setSnapshot(this.slug, this.kernal.getSnapshotOps())
+    }
+
+    if (source === 'remote' || source === 'database') {
       this.broadcastMessage(
         createMessage.patch(ops),
       )

src/server/server.js

@@ -9,7 +9,8 @@ export class Server {
     this.sockets = new Map()
 
     this.wss.on('connection', (ws, req) => {
-      const client = { ws, id: nanoid(), slug: req.url, alive: true, data: {} }
+      const url = (req.url ?? '/test').substring(1)
+      const client = { ws, id: nanoid(), slug: url, alive: true, data: {} }
       this.sockets.set(ws, client)
 
       const currentRoom = this.getRoomBySlug(req.url)