vzcode 1.11.0 → 1.12.0

package/src/client/vzReducer/setActiveFileLeftRightReducer.ts

@@ -1,4 +1,7 @@
 import { VZAction, VZState } from '.';
+import { Pane } from '../../types';
+import { findPane } from './findPane';
+import { updatePane } from './updatePane';
 
 export const setActiveFileLeftReducer = (
   state: VZState,
@@ -8,18 +11,31 @@ export const setActiveFileLeftReducer = (
     return state;
   }
 
-  let index = state.tabList.findIndex(
-    (tab) => tab.fileId === state.activeFileId,
+  const { pane, activePaneId } = state;
+  const activePane: Pane = findPane(pane, activePaneId);
+
+  if (activePane.type !== 'leafPane') {
+    throw new Error(
+      'closeTabsReducer: activePane is not a leafPane',
+    );
+  }
+
+  let index = activePane.tabList.findIndex(
+    (tab) => tab.fileId === activePane.activeFileId,
   );
 
   index -= 1;
   if (index < 0) {
-    index = state.tabList.length - 1;
+    index = activePane.tabList.length - 1;
   }
 
   return {
     ...state,
-    activeFileId: state.tabList[index].fileId,
+    pane: updatePane({
+      pane,
+      activePaneId,
+      newActiveFileId: activePane.tabList[index].fileId,
+    }),
   };
 };
 
@@ -31,17 +47,30 @@ export const setActiveFileRightReducer = (
     return state;
   }
 
-  let index = state.tabList.findIndex(
-    (tab) => tab.fileId === state.activeFileId,
+  const { pane, activePaneId } = state;
+  const activePane: Pane = findPane(pane, activePaneId);
+
+  if (activePane.type !== 'leafPane') {
+    throw new Error(
+      'closeTabsReducer: activePane is not a leafPane',
+    );
+  }
+
+  let index = activePane.tabList.findIndex(
+    (tab) => tab.fileId === activePane.activeFileId,
   );
 
   index += 1;
-  if (index > state.tabList.length - 1) {
+  if (index > activePane.tabList.length - 1) {
     index = 0;
   }
 
   return {
     ...state,
-    activeFileId: state.tabList[index].fileId,
+    pane: updatePane({
+      pane,
+      activePaneId,
+      newActiveFileId: activePane.tabList[index].fileId,
+    }),
   };
 };

package/src/client/vzReducer/updatePane.ts

@@ -0,0 +1,44 @@
+import {
+  FileId,
+  Pane,
+  PaneId,
+  TabState,
+} from '../../types';
+
+// Immutable update pattern for updating a pane's tab list.
+export const updatePane = ({
+  pane,
+  activePaneId,
+  newTabList,
+  newActiveFileId,
+}: {
+  pane: Pane;
+  activePaneId: PaneId;
+  newTabList?: Array<TabState>;
+  newActiveFileId?: FileId | null;
+}): Pane =>
+  pane.type === 'splitPane'
+    ? {
+        ...pane,
+        children: pane.children.map((child) =>
+          updatePane({
+            pane: child,
+            activePaneId,
+            newTabList,
+            newActiveFileId,
+          }),
+        ),
+      }
+    : pane.id === activePaneId
+      ? {
+          ...pane,
+          tabList:
+            newTabList !== undefined
+              ? newTabList
+              : pane.tabList,
+          activeFileId:
+            newActiveFileId !== undefined
+              ? newActiveFileId
+              : pane.activeFileId,
+        }
+      : pane;

package/src/server/index.js

@@ -313,6 +313,7 @@ server.listen(port, async () => {
     // Sets the port to the one specified in the environment
     // variable (for development) or the default port.
     let livePort = process.env.EDITOR_PORT || port;
+    console.log(`EDITOR_PORT: ${process.env.EDITOR_PORT}`);
     console.log(
       `Editor is live at http://localhost:${livePort}`,
     );

package/src/types.ts

@@ -80,8 +80,70 @@ export interface SearchFile {
 export interface SearchResults {
   pattern: string;
   results: SearchResult;
+  focused: boolean;
 }
 
+// Representation of an open tab.
+export type TabState = {
+  // `fileId`
+  // The ID of the file that the tab represents.
+  fileId: FileId;
+
+  // `isTransient`
+  // Represents whether the tab is temporary or persistent.
+  //  * `true` if the tab is temporary, meaning its text
+  //    appears as italic, and it will be automatically
+  //    closed when the user switches to another file.
+  //    If `true` and the tab is opened, the editor will not focus.
+  //  * `false` or `undefined` if the tab is persistent, meaning its text
+  //    appears as normal, and it will not be automatically
+  //    closed when the user switches to another file.
+  //    If `false` and the tab is opened, the editor will focus.
+  isTransient?: boolean;
+};
+
+// PaneId
+//   * A unique ID for a pane.
+//   * This is a random string.
+export type PaneId = string;
+
+// The leaf node of the tree data structure
+export type LeafPane = {
+  type: 'leafPane';
+  // The list of tabs
+  // Mutually exclusive with `children`.
+  tabList: Array<TabState>;
+
+  // The ID of the file that is currently active
+  // within this leaf pane.
+  // Invariant: `activeFileId` is always in `tabList`.
+  activeFileId: FileId | null;
+};
+
+// Internal node of the tree data structure
+export type SplitPane = {
+  type: 'splitPane';
+
+  // Which orientation is it? Vertical split or horizontal split?
+  // Applies only to `children`
+  orientation: 'vertical' | 'horizontal';
+
+  // The children panels
+  // Mutually exclusive with `tabList`.
+  children: Array<Pane>;
+};
+
+// The node data structure of the split pane tree
+export type Pane = {
+  // Every pane gets a unique ID,
+  // so we can refer to it in actions.
+  id: PaneId;
+
+  // The type of the pane
+  // Either a leaf pane or a split pane.
+  type: 'leafPane' | 'splitPane';
+} & (LeafPane | SplitPane);
+
 export type JSONOp = any;
 
 // `ShareDBDoc`