timetravel with git: something works now

Author: williamstein

src/packages/frontend/frame-editors/time-travel-editor/actions.ts

@@ -28,7 +28,7 @@ import {
 import { SyncDoc } from "@cocalc/sync/editor/generic/sync-doc";
 import { webapp_client } from "../../webapp-client";
 import { exec } from "@cocalc/frontend/frame-editors/generic/client";
-
+import { ViewDocument } from "./view-document";
 import {
   Actions as CodeEditorActions,
   CodeEditorState,
@@ -163,10 +163,6 @@ export class TimeTravelActions extends CodeEditorActions<TimeTravelState> {
       // syncdoc_changed -- can get called at any time, so have to be extra careful
       versions = List<Date>(this.syncdoc.all_versions());
     } catch (err) {
-      console.warn(
-        "ignoring issue with time travel due to syncdoc not being ready",
-        err,
-      );
       this.setState({ versions: List([]) });
       return;
     }
@@ -296,25 +292,19 @@ export class TimeTravelActions extends CodeEditorActions<TimeTravelState> {
   }
 
   public setTextMode(id: string, text_mode: boolean): void {
-    for (const actions of [this, this.ambient_actions]) {
-      if (actions == null) continue;
-      const node = actions._get_frame_node(id);
-      if (node == null) continue;
-      text_mode = !!text_mode;
-      actions.set_frame_tree({ id, text_mode });
-      break;
+    const node = this._get_frame_node(id);
+    if (node == null) {
+      return;
     }
+    this.set_frame_tree({ id, text_mode: !!text_mode });
   }
 
   public setGitMode(id: string, git_mode: boolean): void {
-    for (const actions of [this, this.ambient_actions]) {
-      if (actions == null) continue;
-      const node = actions._get_frame_node(id);
-      if (node == null) continue;
-      git_mode = !!git_mode;
-      actions.set_frame_tree({ id, git_mode });
-      break;
+    const node = this._get_frame_node(id);
+    if (node == null) {
+      return;
     }
+    this.set_frame_tree({ id, git_mode: !!git_mode });
     this.updateGitVersions();
   }
 
@@ -371,9 +361,16 @@ export class TimeTravelActions extends CodeEditorActions<TimeTravelState> {
 
   private gitCommand = async (args: string[], commit?: string) => {
     const { head, tail } = path_split(this.docpath);
+    console.log({
+      command: "git",
+      args: args.concat([`${commit ? commit + ":./" : ""}${tail}`]),
+      path: head,
+      project_id: this.project_id,
+      err_on_exit: true,
+    });
     return await exec({
       command: "git",
-      args: args.concat([`${commit ? commit + ":" : ""}${tail}`]),
+      args: args.concat([`${commit ? commit + ":./" : ""}${tail}`]),
       path: head,
       project_id: this.project_id,
       err_on_exit: true,
@@ -411,18 +408,26 @@ export class TimeTravelActions extends CodeEditorActions<TimeTravelState> {
     }
   };
 
-  gitShow = async (version: Date): Promise<string> => {
+  private gitShow = async (version: Date): Promise<string | undefined> => {
     const h = this.gitTimestampToHash[version.valueOf()];
     if (h == null) {
-      return "";
+      return;
     }
     try {
       const { stdout } = await this.gitCommand(["show"], h);
       return stdout;
     } catch (err) {
       this.set_error(`${err}`);
-      return "";
+      return;
+    }
+  };
+
+  gitDoc = async (version: Date): Promise<ViewDocument | undefined> => {
+    const str = await this.gitShow(version);
+    if (str == null) {
+      return undefined;
     }
+    return new ViewDocument(this.docpath, str);
   };
 }
 

src/packages/frontend/frame-editors/time-travel-editor/time-travel.tsx

@@ -5,6 +5,7 @@
 
 // Time travel editor react component.
 
+import { useEffect, useState } from "react";
 import { Checkbox, Tooltip } from "antd";
 import { Map } from "immutable";
 import { redux } from "../../app-framework";
@@ -27,6 +28,7 @@ import { to_ipynb } from "../../jupyter/history-viewer";
 import { SagewsDiff } from "./sagews-diff";
 import { useEditorRedux } from "@cocalc/frontend/app-framework";
 import { Viewer } from "./viewer";
+import type { Document } from "@cocalc/sync/editor/generic/types";
 
 const HAS_SPECIAL_VIEWER = new Set([
   "tasks",
@@ -60,6 +62,8 @@ export function TimeTravel(props: Props) {
   const docext = useEditor("docext");
   const git = useEditor("git");
 
+  const [doc, setDoc] = useState<Document | undefined>(undefined);
+
   const getVersion = (): Date | undefined => {
     if (props.desc == null || versions == null) return;
     const version = props.desc.get("version");
@@ -68,6 +72,31 @@ export function TimeTravel(props: Props) {
     return versions.get(-1);
   };
 
+  const getDoc = (version?: number | Date | undefined) => {
+    if (version == null) {
+      version = getVersion();
+    } else if (typeof version == "number") {
+      if (versions == null) return;
+      version = versions.get(version);
+    }
+    if (version == null) return;
+    return props.actions.get_doc(version);
+  };
+
+  useEffect(() => {
+    const version = getVersion();
+    if (version != null) {
+      if (props.desc?.get("git_mode")) {
+        (async () => {
+          const doc = await props.actions.gitDoc(version);
+          setDoc(doc ?? undefined);
+        })();
+      } else {
+        setDoc(getDoc(version));
+      }
+    }
+  }, [props.desc?.get("version"), versions]);
+
   const renderVersion = () => {
     if (props.desc == null || versions == null) return;
     if (props.desc.get("changes_mode")) {
@@ -88,51 +117,6 @@ export function TimeTravel(props: Props) {
     }
   };
 
-  const getDoc = (version?: number | Date | undefined) => {
-    if (version == null) {
-      version = getVersion();
-    } else if (typeof version == "number") {
-      if (versions == null) return;
-      version = versions.get(version);
-    }
-    if (version == null) return;
-    return props.actions.get_doc(version);
-  };
-
-  const renderDocument = () => {
-    if (
-      docpath == null ||
-      docext == null ||
-      props.desc == null ||
-      props.desc.get("changes_mode")
-    ) {
-      return;
-    }
-
-    const version = getVersion();
-    if (version == null) {
-      // no versions yet, so nothing to render
-      return;
-    }
-    const doc = getDoc(version);
-    if (doc == null) {
-      return;
-    }
-    return (
-      <Viewer
-        ext={docext}
-        doc={doc}
-        textMode={props.desc.get("text_mode")}
-        actions={props.actions}
-        id={props.id}
-        path={docpath ? docpath : "a.js"}
-        project_id={props.project_id}
-        font_size={props.font_size}
-        editor_settings={props.editor_settings}
-      />
-    );
-  };
-
   const getDiffValues = ():
     | { v0: string; v1: string; use_json: boolean }
     | undefined => {
@@ -392,23 +376,32 @@ export function TimeTravel(props: Props) {
     return <Loading theme={"medium"} />;
   };
 
-  const renderView = () => {
-    return (
-      <>
-        {renderDocument()}
-        {renderDiff()}
-      </>
-    );
-  };
-
   if (loading) {
     return renderLoading();
   }
   return (
     <div className="smc-vfill">
       {renderControls()}
       {renderTimeSelect()}
-      {renderView()}
+      <>
+        {doc != null &&
+          docpath != null &&
+          docext != null &&
+          !props.desc?.get("changes_mode") && (
+            <Viewer
+              ext={docext}
+              doc={doc}
+              textMode={props.desc.get("text_mode")}
+              actions={props.actions}
+              id={props.id}
+              path={docpath ? docpath : "a.js"}
+              project_id={props.project_id}
+              font_size={props.font_size}
+              editor_settings={props.editor_settings}
+            />
+          )}
+        {renderDiff()}
+      </>
     </div>
   );
 }

src/packages/frontend/frame-editors/time-travel-editor/view-document.ts

@@ -1,46 +1,61 @@
 import { fromJS } from "immutable";
 import type { Document } from "@cocalc/sync/editor/generic/types";
+import { filenameMode } from "@cocalc/frontend/file-associations";
+
+export function isObjectDoc(path) {
+  /* not a great way to tell if json lines or text? */
+  const obj = "__cocalc__object_doc__";
+  return filenameMode(path, obj) == obj;
+}
 
 export class ViewDocument implements Document {
-  private v: any[] = [];
+  private v: any[] | null;
   private str: string;
 
-  constructor(str: string) {
+  constructor(path: string, str: string) {
     this.str = str;
-    const v: any[] = [];
-    for (const x of str.split("\n")) {
-      v.push(JSON.parse(x));
+    if (isObjectDoc(path)) {
+      const v: any[] = [];
+      for (const x of str.split("\n")) {
+        v.push(JSON.parse(x));
+      }
+      this.v = v;
+    } else {
+      this.v = null;
     }
-    this.v = v;
   }
 
-  // @ts-ignore
-  apply_patch(_patch) {
+  apply_patch(_patch): any {
     throw Error("not implemented");
   }
 
-  // @ts-ignore
-  make_patch(_doc) {
+  make_patch(_doc): any {
     throw Error("not implemented");
   }
 
-  // @ts-ignore
-  is_equal(_doc) {
+  is_equal(_doc): boolean {
     throw Error("not implemented");
   }
 
-  to_str() {
+  to_str(): string {
     return this.str;
   }
 
   // @ts-ignore
-  set(_x) {
+  set(_x: any): any {
     throw Error("not implemented");
   }
 
-  get(query) {
+  get(query?) {
+    const v = this.v;
+    if (v == null) {
+      return [];
+    }
+    if (query == null) {
+      return fromJS(v);
+    }
     const matches: any[] = [];
-    for (const x of this.v) {
+    for (const x of v) {
       for (const key in query) {
         if (x[key] != query[key]) {
           continue;
@@ -53,7 +68,11 @@ export class ViewDocument implements Document {
   }
 
   get_one(query) {
-    for (const x of this.v) {
+    const v = this.v;
+    if (v == null) {
+      return;
+    }
+    for (const x of v) {
       for (const key in query) {
         if (x[key] != query[key]) {
           continue;
@@ -65,16 +84,16 @@ export class ViewDocument implements Document {
   }
 
   // @ts-ignore
-  delete(_query) {
+  delete(_query): any {
     throw Error("not implemented");
   }
 
   // optional info about what changed going from prev to this.
-  changes(_prev) {
+  changes(_prev): any {
     throw Error("not implemented");
   }
   // how many in this document (length of string number of records in db-doc, etc.)
   count() {
-    return this.v.length;
+    return this.v?.length ?? this.str.length;
   }
 }

src/packages/frontend/frame-editors/time-travel-editor/viewer.tsx

@@ -6,10 +6,10 @@ import type { Document } from "@cocalc/sync/editor/generic/types";
 import StaticMarkdown from "@cocalc/frontend/editors/slate/static-markdown";
 import { TextDocument } from "./document";
 import { TasksHistoryViewer } from "../../editors/task-editor/history-viewer";
-import { filenameMode } from "@cocalc/frontend/file-associations";
 import { HistoryViewer as JupyterHistoryViewer } from "../../jupyter/history-viewer";
 import { SagewsCodemirror } from "./sagews-codemirror";
 import Whiteboard from "@cocalc/frontend/frame-editors/whiteboard-editor/time-travel";
+import { isObjectDoc } from "./view-document";
 
 export function Viewer({
   ext,
@@ -37,10 +37,7 @@ export function Viewer({
       <TextDocument
         value={doc.to_str()}
         id={id}
-        path={
-          /* TODO: this is to tell if json lines or text */
-          filenameMode(path, "") == "" ? "a.js" : path
-        }
+        path={isObjectDoc(path) ? "a.js" : path}
         project_id={project_id}
         font_size={font_size}
         editor_settings={editor_settings}