refactor: centralize all variable to sessionManager

app/src/utils/session.js

@@ -1,6 +1,8 @@
 import { ref } from 'vue'
 import { FileGraph } from '@linux-odyssey/file-graph'
 import api from './api'
+import Socket from './socket'
+import SocketTerminal from './terminal'
 
 class SessionManager {
   constructor(questId) {
@@ -16,6 +18,30 @@ class SessionManager {
     )
     this.pwd = ref('')
     this.status = ref('inactive')
+    this.socket = new Socket()
+    this.term = new SocketTerminal(40, 80)
+  }
+
+  init() {
+    this.socket.on('terminal', (data) => {
+      this.term.write(data)
+    })
+    this.term.onData((data) => {
+      this.socket.emit('terminal', data)
+    })
+    this.socket.on('graph', (event) => {
+      this.handleGraphUpdate(event)
+    })
+    this.socket.on('hints', (event) => {
+      this.handleHintUpdate(event)
+    })
+    this.socket.on('tasks', (tasks) => {
+      this.setTasks(tasks)
+    })
+    this.socket.on('status', (event) => {
+      this.handleStatusUpdate(event)
+    })
+    return this.getActiveSession()
   }
 
   getSession() {
@@ -27,6 +53,8 @@ class SessionManager {
     this.graph.value = new FileGraph(session.graph)
     this.hints.value = session.hints
     this.status.value = session.status
+    this.term.clear()
+    this.socket.connect(session)
   }
 
   handleGraphUpdate(event) {