Collaborative Script Editing

client/package.json

@@ -38,6 +38,7 @@
     "dompurify": "3.3.1",
     "fuse.js": "7.1.0",
     "jquery": "3.7.1",
+    "lib0": "^0.2.117",
     "lodash": "4.17.23",
     "loglevel": "1.9.2",
     "marked": "11.2.0",
@@ -49,7 +50,8 @@
     "vue-toast-notification": "0.6.3",
     "vuelidate": "0.7.7",
     "vuex": "3.6.2",
-    "vuex-persistedstate": "3.2.1"
+    "vuex-persistedstate": "3.2.1",
+    "yjs": "^13.6.29"
   },
   "devDependencies": {
     "@babel/core": "7.29.0",

client/src/main.js

@@ -15,6 +15,9 @@ import { getWebSocketURL, isElectron } from '@/js/platform';
 import { initRemoteLogging } from '@/js/logger';
 import log from 'loglevel';
 
+// Expose loglevel globally so `log.setLevel('debug')` works in DevTools
+window.log = log;
+
 import './assets/styles/dark.scss';
 import 'vue-toast-notification/dist/theme-sugar.css';
 import 'vue-multiselect/dist/vue-multiselect.min.css';

client/src/store/modules/script.js

@@ -73,8 +73,9 @@ export default {
         context.dispatch('GET_SCRIPT_REVISIONS');
         Vue.$toast.success('Added new script revision!');
       } else {
+        const data = await response.json().catch(() => ({}));
         log.error('Unable to add new script revision');
-        Vue.$toast.error('Unable to add new script revision');
+        Vue.$toast.error(data.message || 'Unable to add new script revision');
       }
     },
     async DELETE_SCRIPT_REVISION(context, revisionID) {
@@ -91,8 +92,9 @@ export default {
         context.dispatch('GET_SCRIPT_REVISIONS');
         Vue.$toast.success('Deleted script revision!');
       } else {
+        const data = await response.json().catch(() => ({}));
         log.error('Unable to delete script revision');
-        Vue.$toast.error('Unable to delete script revision');
+        Vue.$toast.error(data.message || 'Unable to delete script revision');
       }
     },
     async LOAD_SCRIPT_REVISION(context, revisionID) {
@@ -109,8 +111,9 @@ export default {
         context.dispatch('GET_SCRIPT_REVISIONS');
         Vue.$toast.success('Loaded script revision!');
       } else {
+        const data = await response.json().catch(() => ({}));
         log.error('Unable to load script revision');
-        Vue.$toast.error('Unable to load script revision');
+        Vue.$toast.error(data.message || 'Unable to load script revision');
       }
     },
     async SCRIPT_REVISION_CHANGED(context) {

client/src/store/modules/scriptConfig.js

@@ -9,8 +9,9 @@ export default {
     tmpScript: {},
     deletedLines: {},
     editStatus: {
-      canRequestEdit: false,
-      currentEditor: null,
+      editors: [],
+      cutters: [],
+      hasDraft: false,
     },
     cutMode: false,
     insertedLines: {},
@@ -93,8 +94,9 @@ export default {
     },
   },
   actions: {
-    REQUEST_EDIT_FAILURE(context) {
-      Vue.$toast.error('Unable to edit script');
+    REQUEST_EDIT_FAILURE(context, message) {
+      const reason = message?.DATA?.reason || 'Unable to edit script';
+      Vue.$toast.error(reason);
       context.dispatch('GET_SCRIPT_CONFIG_STATUS');
       context.commit('SET_CUT_MODE', false);
     },
@@ -195,11 +197,34 @@ export default {
     ALL_DELETED_LINES(state) {
       return state.deletedLines;
     },
-    CAN_REQUEST_EDIT(state) {
-      return state.editStatus.canRequestEdit;
+    EDITORS(state) {
+      return state.editStatus.editors;
     },
-    CURRENT_EDITOR(state) {
-      return state.editStatus.currentEditor;
+    CUTTERS(state) {
+      return state.editStatus.cutters;
+    },
+    HAS_DRAFT(state) {
+      return state.editStatus.hasDraft;
+    },
+    CAN_REQUEST_EDIT(state, getters, rootState, rootGetters) {
+      if (rootGetters.CURRENT_SHOW_SESSION) return false;
+      return state.editStatus.cutters.length === 0;
+    },
+    CAN_REQUEST_CUTS(state, getters, rootState, rootGetters) {
+      if (rootGetters.CURRENT_SHOW_SESSION) return false;
+      return (
+        state.editStatus.editors.length === 0 &&
+        state.editStatus.cutters.length === 0 &&
+        !state.editStatus.hasDraft
+      );
+    },
+    IS_CURRENT_EDITOR: (state, getters, rootState, rootGetters) => {
+      const uuid = rootGetters.INTERNAL_UUID;
+      return state.editStatus.editors.some((e) => e.internal_id === uuid);
+    },
+    IS_CURRENT_CUTTER: (state, getters, rootState, rootGetters) => {
+      const uuid = rootGetters.INTERNAL_UUID;
+      return state.editStatus.cutters.some((c) => c.internal_id === uuid);
     },
     IS_CUT_MODE(state) {
       return state.cutMode;

client/src/store/modules/scriptConfig.test.js

@@ -0,0 +1,98 @@
+import { vi } from 'vitest';
+
+// Stub external dependencies before importing scriptConfig
+vi.mock('vue', () => ({
+  default: { prototype: {}, set: vi.fn(), delete: vi.fn() },
+  set: vi.fn(),
+  delete: vi.fn(),
+}));
+vi.mock('loglevel', () => ({
+  default: { debug: vi.fn(), info: vi.fn(), error: vi.fn(), warn: vi.fn() },
+}));
+vi.mock('deep-object-diff', () => ({
+  detailedDiff: vi.fn(() => ({ added: {}, updated: {}, deleted: {} })),
+}));
+vi.mock('@/js/utils', () => ({
+  makeURL: vi.fn((path) => `http://localhost${path}`),
+}));
+
+import scriptConfigModule from './scriptConfig';
+
+const { getters } = scriptConfigModule;
+
+function makeState(overrides = {}) {
+  return {
+    editStatus: { editors: [], cutters: [], hasDraft: false },
+    ...overrides,
+  };
+}
+
+describe('scriptConfig getters', () => {
+  describe('CAN_REQUEST_EDIT', () => {
+    it('returns false when a live session is active (no cutters)', () => {
+      const state = makeState();
+      const result = getters.CAN_REQUEST_EDIT(state, {}, {}, { CURRENT_SHOW_SESSION: { id: 1 } });
+      expect(result).toBe(false);
+    });
+
+    it('returns false when live session is active even if cutters also present', () => {
+      const state = makeState({
+        editStatus: { editors: [], cutters: [{ internal_id: 'x' }], hasDraft: false },
+      });
+      const result = getters.CAN_REQUEST_EDIT(state, {}, {}, { CURRENT_SHOW_SESSION: { id: 1 } });
+      expect(result).toBe(false);
+    });
+
+    it('returns true when no live session and no cutters', () => {
+      const state = makeState();
+      const result = getters.CAN_REQUEST_EDIT(state, {}, {}, { CURRENT_SHOW_SESSION: null });
+      expect(result).toBe(true);
+    });
+
+    it('returns false when no live session but cutters exist', () => {
+      const state = makeState({
+        editStatus: { editors: [], cutters: [{ internal_id: 'x' }], hasDraft: false },
+      });
+      const result = getters.CAN_REQUEST_EDIT(state, {}, {}, { CURRENT_SHOW_SESSION: null });
+      expect(result).toBe(false);
+    });
+  });
+
+  describe('CAN_REQUEST_CUTS', () => {
+    it('returns false when a live session is active (all else clear)', () => {
+      const state = makeState();
+      const result = getters.CAN_REQUEST_CUTS(state, {}, {}, { CURRENT_SHOW_SESSION: { id: 1 } });
+      expect(result).toBe(false);
+    });
+
+    it('returns true when no live session and all else clear', () => {
+      const state = makeState();
+      const result = getters.CAN_REQUEST_CUTS(state, {}, {}, { CURRENT_SHOW_SESSION: null });
+      expect(result).toBe(true);
+    });
+
+    it('returns false when no live session but an editor exists', () => {
+      const state = makeState({
+        editStatus: { editors: [{ internal_id: 'y' }], cutters: [], hasDraft: false },
+      });
+      const result = getters.CAN_REQUEST_CUTS(state, {}, {}, { CURRENT_SHOW_SESSION: null });
+      expect(result).toBe(false);
+    });
+
+    it('returns false when no live session but a cutter exists', () => {
+      const state = makeState({
+        editStatus: { editors: [], cutters: [{ internal_id: 'z' }], hasDraft: false },
+      });
+      const result = getters.CAN_REQUEST_CUTS(state, {}, {}, { CURRENT_SHOW_SESSION: null });
+      expect(result).toBe(false);
+    });
+
+    it('returns false when no live session but a draft exists', () => {
+      const state = makeState({
+        editStatus: { editors: [], cutters: [], hasDraft: true },
+      });
+      const result = getters.CAN_REQUEST_CUTS(state, {}, {}, { CURRENT_SHOW_SESSION: null });
+      expect(result).toBe(false);
+    });
+  });
+});