Add log sidebar

Author: Negabinary

src/web/Main.re

@@ -64,8 +64,11 @@ let apply =
            ~dynamics=true,
          )
     ) {
-    | _ =>
-      print_endline("ERROR: Exception during calculate phase");
+    | exc =>
+      Printf.printf(
+        "ERROR: Exception during calculate: %s\n",
+        Printexc.to_string(exc),
+      );
       {
         ...model,
         replay_toggle: false,
@@ -180,6 +183,8 @@ let start = {
     JsUtil.focus_clipboard_shim();
     /* Setup scroll listener for floating elements (backpack) */
     FloatingElement.setup_scroll_listener();
+    // Sync log count from database
+    Log.sync_count();
     schedule_action(
       Assistant(AssistantUpdate.ChatAction(FilterLoadingMessages)),
     );
@@ -226,13 +231,7 @@ let start = {
   let%arr app_model = app_model
   and app_inject = app_inject;
   try(
-    History.View.view(
-      app_model,
-      ~inject=app_inject,
-      ~get_log_and=Log.get_and,
-      ~next_log=
-        Util.ListUtil.hd_opt(app_model.future_log) |> Option.map(snd),
-    )
+    History.View.view(app_model, ~inject=app_inject, ~get_log_and=Log.get_and)
   ) {
   | exc =>
     print_endline(

src/web/app/History.re

@@ -106,22 +106,21 @@ module Update = {
         );
         model |> Updated.return_quiet;
       | FinishImport(None) =>
-        print_endline("Log import failed");
+        LogSidebar.log_error("Log import failed");
         model |> Updated.return_quiet;
       | FinishImport(Some(data)) =>
         let of_data = (data: string): list((float, Page.Update.t)) =>
           Export.import_just_log(data)
           |> Sexplib.Sexp.of_string
           |> Log.Entry.s_of_sexp_opt
           |> List.filter_map(x => x);
-        // |> List.filter(((ts, _action)) => ts > 1757794060000.0);
         let actions =
           data
           |> of_data
           |> Log.flatten_imports(~of_data)
           |> (
             x => {
-              print_endline(
+              LogSidebar.log_info(
                 "Imported log entries: " ++ string_of_int(List.length(x)),
               );
               x;
@@ -135,15 +134,15 @@ module Update = {
       | NextLog =>
         switch (model.future_log) {
         | [] =>
-          print_endline("No next log action to perform");
+          LogSidebar.log_info("No next log action to perform");
           model |> Updated.return_quiet;
         | [(t, next), ...rest] =>
-          print_endline(
-            "Applying next log action: "
-            ++ JsUtil.print_timestamp(t)
-            ++ " :: "
-            ++ Page.Update.show(next),
+          LogSidebar.log_action(
+            "Applying next log action",
+            Some(JsUtil.print_timestamp(t)),
           );
+          // Keep full action expression in console for detailed debugging
+          print_endline("Full action: " ++ Page.Update.show(next));
           try({
             let updated =
               Page.Update.update(
@@ -171,7 +170,7 @@ module Update = {
             };
           }) {
           | _ =>
-            print_endline("Failed to apply log action");
+            LogSidebar.log_error("Failed to apply log action");
             Model.{
               ...model,
               future_log:
@@ -185,10 +184,10 @@ module Update = {
           };
         }
       | SkipLog =>
-        print_endline("Skipping the next log entry");
+        LogSidebar.log_action("Skipping the next log entry", None);
         switch (model.future_log) {
         | [] =>
-          print_endline("No log entry to skip");
+          LogSidebar.log_info("No log entry to skip");
           model |> return_quiet;
         | [(_, _), ...rest] =>
           {
@@ -198,7 +197,10 @@ module Update = {
           |> return_quiet
         };
       | SkipExercise =>
-        print_endline("Skipping to the next exercise in the log");
+        LogSidebar.log_action(
+          "Skipping to the next exercise in the log",
+          None,
+        );
         let rec skip_to_next_exercise = (log: list((float, Page.Update.t))) =>
           switch (log) {
           | [] => []
@@ -217,6 +219,10 @@ module Update = {
           replay_toggle: !model.replay_toggle,
         }
         |> return_quiet
+      | ClearLog =>
+        Log.DB.clear_and(() => ());
+        LogSidebar.log_info("Log cleared");
+        model |> return_quiet;
       }
     | action =>
       let current =

src/web/app/Log.re

@@ -23,10 +23,12 @@ module DB = {
     openDB(~upgrade, ~error, ~version=1, db_name, db => f(db));
   };
 
-  let add = (key: string, value: string): unit =>
+  let add = (key: string, value: string): unit => {
+    LogCount.increment();
     with_db(db =>
       Store.add(~key, ~callback=_key => (), kv_store(db), value)
     );
+  };
 
   let get = (key: string, f: option(string) => unit): unit => {
     let error = _ => Printf.printf("ERROR: Log.IDBKV.get");
@@ -40,6 +42,7 @@ module DB = {
 
   let clear_and = (callback): unit => {
     let error = _ => Printf.printf("ERROR: Log.IDBKV.clear");
+    LogCount.clear();
     with_db(db => Store.clear(~error, ~callback, kv_store(db)));
   };
 };
@@ -79,27 +82,39 @@ module Entry = {
     };
 };
 
+let get_and = (f: string => unit): unit =>
+  DB.get_all(entries => f("(" ++ String.concat(" ", entries) ++ ")"));
+
+let get_count = (f: int => unit): unit =>
+  DB.get_all(entries => f(List.length(entries)));
+
+// Synchronously get the cached count (may be stale until sync_count is called)
+let get_count_sync = (): int => LogCount.get();
+
+// Sync the cached count with the database
+let sync_count = (): unit =>
+  DB.get_all(entries => LogCount.set(List.length(entries)));
+
 let import = (data: string): unit =>
   /* Should be fine to fire saves concurrently? */
-  DB.clear_and(() =>
+  DB.clear_and(() => {
     try(
       data
       |> Sexplib.Sexp.of_string
       |> Entry.s_of_sexp
       |> List.iter(Entry.save)
     ) {
     | _ => Printf.printf("Log.Entry.import: Deserialization error")
-    }
-  );
+    };
+    // Sync count after import completes
+    sync_count();
+  });
 
 let update = (action: Page.Update.t, result: Updated.t('a)): unit =>
   if (result.logged) {
     Entry.save(Entry.mk(action));
   };
 
-let get_and = (f: string => unit): unit =>
-  DB.get_all(entries => f("(" ++ String.concat(" ", entries) ++ ")"));
-
 let to_actions = () => {
   print_endline("HELLO??");
   let actions = ref([]);

src/web/app/LogCount.re

@@ -0,0 +1,17 @@
+/* Cached log entry count to avoid async queries on every render */
+
+let count = ref(0);
+
+let get = (): int => count^;
+
+let set = (n: int): unit => {
+  count := n;
+};
+
+let increment = (): unit => {
+  count := count^ + 1;
+};
+
+let clear = (): unit => {
+  count := 0;
+};

src/web/app/Page.re

@@ -17,6 +17,7 @@ module Model = {
     editors: Editors.Model.t,
     explain_this: ExplainThisModel.t,
     assistant: AssistantModel.t,
+    log_sidebar: LogSidebar.Model.t,
     selection,
   };
 
@@ -33,11 +34,13 @@ module Store = {
       );
     let explain_this = ExplainThisModel.Store.load();
     let assistant = AssistantModel.Store.load();
+    let log_sidebar = LogSidebar.Model.init();
     {
       editors,
       globals,
       explain_this,
       assistant,
+      log_sidebar,
       selection: Editors.Selection.default_selection(editors),
     };
   };
@@ -632,13 +635,7 @@ module View = {
     );
   };
 
-  let top_bar =
-      (
-        ~globals,
-        ~inject: Update.t => Ui_effect.t(unit),
-        ~editors,
-        ~next_log: option(Update.t),
-      ) =>
+  let top_bar = (~globals, ~inject: Update.t => Ui_effect.t(unit), ~editors) =>
     div(
       ~attrs=[Attr.id("top-bar")],
       [
@@ -661,37 +658,6 @@ module View = {
             ),
           ],
         ),
-      ]
-      @ (
-        next_log
-        |> Option.map(_ =>
-             [
-               Widgets.button(
-                 text("next"),
-                 _ => Ui_effect.Many([inject(Globals(Log(NextLog)))]),
-                 ~tooltip="Play next action from imported log",
-               ),
-               Widgets.button(
-                 text("skip"),
-                 _ => Ui_effect.Many([inject(Globals(Log(SkipLog)))]),
-                 ~tooltip="Skip the rest of the imported log",
-               ),
-               Widgets.button(
-                 text("skip exercise"),
-                 _ => Ui_effect.Many([inject(Globals(Log(SkipExercise)))]),
-                 ~tooltip="Skip to the next exercise in the imported log",
-               ),
-             ]
-           )
-        |> Option.to_list
-        |> List.flatten
-      )
-      @ [
-        Widgets.button(
-          text("play/pause"),
-          _ => Ui_effect.Many([inject(Globals(Log(ToggleReplay)))]),
-          ~tooltip="Toggle replaying imported log automatically",
-        ),
       ],
     );
 
@@ -700,19 +666,22 @@ module View = {
         ~get_log_and: (string => unit) => unit,
         ~inject: Update.t => Ui_effect.t(unit),
         ~cursor: Cursor.cursor(Editors.Update.t),
-        ~next_log: option(Update.t),
         {
           globals,
           editors,
           explain_this: explainThisModel,
           assistant: assistantModel,
+          log_sidebar,
           selection,
         } as model: Model.t,
       ) => {
+    let log_count = LogCount.get();
     let globals = {
       ...globals,
       inject_global: x => inject(Globals(x)),
       get_log_and,
+      get_log_count: _ =>
+        failwith("get_log_count is deprecated, use Log.get_count_sync"),
       export_all: Export.export_all,
     };
     let bottom_bar = CursorInspector.view(~globals, cursor);
@@ -727,6 +696,8 @@ module View = {
           | MakeActive(s) => inject(MakeActive(Scratch(s))),
         ~explainThisModel,
         ~assistantModel,
+        ~log_model=log_sidebar,
+        ~log_count,
         ~editor=Update.get_editor(model),
         cursor.info,
       );
@@ -778,7 +749,7 @@ module View = {
     };
 
     [
-      top_bar(~globals, ~inject, ~editors, ~next_log),
+      top_bar(~globals, ~inject, ~editors),
       div(
         ~attrs=[
           Attr.id("main"),
@@ -794,17 +765,12 @@ module View = {
   };
 
   let view =
-      (
-        ~get_log_and,
-        ~inject: Update.t => Ui_effect.t(unit),
-        ~next_log: option(Update.t),
-        model: Model.t,
-      ) => {
+      (~get_log_and, ~inject: Update.t => Ui_effect.t(unit), model: Model.t) => {
     let cursor = Selection.get_cursor_info(~selection=model.selection, model);
     div(
       ~attrs=[Attr.id("page"), ...handlers(~cursor, ~inject, model)],
       [FontSpecimen.view, JsUtil.clipboard_shim]
-      @ main_view(~get_log_and, ~cursor, ~inject, ~next_log, model),
+      @ main_view(~get_log_and, ~cursor, ~inject, model),
     );
   };
 };

src/web/app/editors/stepper/MissingStep.re

@@ -116,7 +116,7 @@ module Update = {
             cached_result: Some(result),
           }),
       }
-      |> Updated.raise_invalid_action
+      |> Updated.return_quiet(~logged=true)
     | (UpdateResult(_), _) => model |> Updated.raise_invalid_action
     | (AxiomBoxAction(action), AxiomsOpen(m)) =>
       let* updated = AxiomsBox.Update.update(~settings, action, m);

src/web/app/globals/Globals.re

@@ -51,7 +51,8 @@ module Action = {
     | NextLog
     | SkipLog
     | SkipExercise
-    | ToggleReplay;
+    | ToggleReplay
+    | ClearLog;
 
   [@deriving (show({with_path: false}), sexp, yojson)]
   type t =
@@ -86,6 +87,7 @@ module Model = {
        convenience to avoid having to pass it around everywhere. Can only
        be used in view functions. */
     get_log_and: (string => unit) => unit,
+    get_log_count: (int => unit) => unit,
     export_all:
       (
         ~settings: Language.CoreSettings.t,
@@ -112,6 +114,10 @@ module Model = {
         failwith(
           "Cannot use get_log_and outside of the main view or update functions!",
         ),
+      get_log_count: _ =>
+        failwith(
+          "Cannot use get_log_count outside of the main view or update functions!",
+        ),
       export_all: (~settings as _, ~instructor_mode as _, ~log as _) =>
         failwith(
           "Cannot use export_all outside of the main view or update functions!",