colorize code in results, simplify cell error handling,

editor2/deps.edn

@@ -22,7 +22,7 @@
 
         io.github.applied-science/shapes {:git/sha "da44031cf79a649932cb502f17388db23f2b8ace"}
         io.github.mhuebert/re-db {:git/sha "4492511e7a84725990a2cb025084af809548ef70"}
-        io.github.mhuebert/yawn {:git/sha "8f506c78bb3d9c1c489fe8f2fb601a6566641d22"}}
+        io.github.mhuebert/yawn {:git/sha "98fea9a681f4507afaba65590aed33b58fff294c"}}
  :aliases
  {:local {:extra-deps {#_#_io.github.babashka/sci {:local/root "../../sci"}
                        #_#_applied-science/js-interop {:local/root "../../js-interop"}

editor2/src/main/cells/async.cljc

@@ -9,10 +9,9 @@
   [x]
   (get (meta x) `status))
 
-(defn error! [cell e] (reset! (!status cell)
-                              {:error (cond-> e
-                                              (string? e)
-                                              (ex-info {:cell cell}))}))
+(defn error! [cell e] (reset! cell (cond-> e
+                                           (string? e)
+                                           (ex-info {:cell cell}))))
 (defn loading! [cell] (reset! (!status cell) {:loading true}))
 (defn complete!
   ([cell] (reset! (!status cell) nil))

editor2/src/main/cells/core.cljc

@@ -50,10 +50,12 @@
   (hooks/use-geo-location))
 
 (def loading? (comp async/loading? deref async/!status))
-(def message (comp async/error deref async/!status))
-(def error? (comp boolean message))
-(defn status [cell] (some #{:error :loading} @(async/!status cell)))
+(def message (comp first r/deref-result))
+(def error? (comp some? message))
 
+(defn status [cell]
+  (cond (loading? cell) :loading
+        (error? cell) :error))
 
 (defn dependencies [cell] (filter impl/cell? (r/get-derefs cell)))
 

editor2/src/main/cells/hooks.cljs

@@ -75,12 +75,9 @@
                                        (a/complete! self))
 
                                      :else
-                                     (do
-                                       (j/log XhrIo)
-                                       (aset js/window "x" XhrIo)
-                                       (if-let [error-message (xhrio-error-message XhrIo)]
-                                         (a/error! self (ex-info error-message {:cell self}))
-                                         (v! "No error message"))))))]
+                                     (if-let [error-message (xhrio-error-message XhrIo)]
+                                       (a/error! self (ex-info error-message {:cell self}))
+                                       (v! "No error message")))))]
          #(j/call XhrIo :abort)))
      [url])
     v))

editor2/src/main/maria/cloud/core.cljs

@@ -35,8 +35,8 @@
 
 (defview root []
   (let [{:as location ::routes/keys [view]} (h/use-deref routes/!location)]
-      [:<>
-       (command-bar/use-global-keymap)
+    (command-bar/use-global-keymap)
+    [:<>
        [sidebar/with-sidebar
         [sidebar/content]
         [:div

editor2/src/main/maria/cloud/github.cljs

@@ -17,7 +17,7 @@
 ;; to avoid load failure while waiting for auth to complete?
 
 (defonce !token (local/ratom nil))
-(defonce !user (r/atom nil)) ;; `nil` means not loaded, `false` means signed out
+(defonce !user (r/atom nil))                                ;; `nil` means not loaded, `false` means signed out
 
 (defn token [] (when @!user @!token))
 
@@ -86,7 +86,14 @@
            :html_url html_url
            :updated_at updated_at}))
 
-(keymaps/register-commands! {:account/sign-in {:f (fn [_] (sign-in-with-popup!))
-                                               :when (fn [_] (not @!user))}
-                             :account/sign-out {:f    (fn [_] (sign-out))
-                                                :when (fn [_] (boolean @!user))}})
+(defn new-gist! [])
+(defn save-gist [])
+(defn revert-gist [])
+
+
+
+(keymaps/register-commands!
+  {:account/sign-in {:f (fn [_] (sign-in-with-popup!))
+                     :when (fn [_] (not @!user))}
+   :account/sign-out {:f (fn [_] (sign-out))
+                      :when (fn [_] (boolean @!user))}})

editor2/src/main/maria/cloud/local.cljs

@@ -1,20 +1,28 @@
 (ns maria.cloud.local
+  (:refer-clojure :exclude [get])
   (:require [applied-science.js-interop :as j]
             [maria.cloud.transit :as t]
             [re-db.reactive :as r]))
 
 (defn local-id [id] (str "maria.local/" id))
 
+(defn get
+  ([id] (get id nil))
+  ([id not-found]
+   (if-let [v (j/get-in js/window [:localStorage (local-id id)])]
+     (t/read v)
+     not-found)))
+
+(defn put! [id v]
+  (j/assoc-in! js/window [:localStorage (local-id id)] (t/write v)))
+
 (defonce ratom
   (memoize
    (fn [id init]
-     (let [v (if-let [v (j/get-in js/window [:localStorage (local-id id)])]
-               (t/read v)
-               ::new)
+     (let [v (get id ::not-found)
            !rx (r/atom v)]
        (add-watch !rx ::sync
-                  (fn [_ _ _ new-value]
-                    (j/assoc-in! js/window [:localStorage (local-id id)] (t/write new-value))))
-       (when (= v ::new)
+                  (fn [_ _ _ new-value] (put! id new-value)))
+       (when (= v ::not-found)
          (reset! !rx init))
        !rx))))

editor2/src/main/maria/cloud/persistence.cljs

@@ -1,16 +1,37 @@
 (ns maria.cloud.persistence
   (:require [maria.cloud.github :as gh]
-            [maria.editor.keymaps :as keymaps]))
+            [maria.cloud.local :as local]
+            [maria.editor.doc :as doc]
+            [maria.editor.keymaps :as keymaps]
+            [yawn.hooks :as h]
+            [goog.functions :as gf]))
+
+(defn autosave-fn
+  "Returns a callback that will save the current doc to local storage after a 1s debounce."
+  []
+  (-> (fn [id ^js prev-state ^js next-state]
+        (when-not (.eq (.-doc prev-state) (.-doc next-state))
+          (local/put! id (doc/doc->clj (.-doc next-state)))))
+      (gf/debounce 1000)))
 
 (keymaps/register-commands!
-  {:file/new       {:kind     :prose
-                    :bindings [:Mod-n]
-                    :f        #(prn :new)}
+  {:file/new {:kind :prose
+              :bindings [:Mod-n]
+              ;; generate a new UUID,
+              ;; go to that (local) route,
+              ;; sync local storage for that UUID,
+              ;; if empty create a blank doc.
+              :f #(prn :new)}
    :file/duplicate {:kind :prose
-                    :f    #(prn :duplicate)}
-   :file/revert    {:kind :prose
-                    :f    #(prn :revert)}
-   :file/save      {:kind     :prose
-                    :bindings [:Mod-s]
-                    :when     gh/token
-                    :f        #(prn :save)}})
+                    ;; create a new gist with contents of current doc.
+                    :f #(prn :duplicate)}
+   :file/revert {:kind :prose
+                 ;; :when local state diverges from gist state.
+                 ;; reset local state to gist state.
+                 :f #(prn :revert)}
+   :file/save {:kind :prose
+               :bindings [:Mod-s]
+               :when gh/token
+               ;; if local, create a new gist and then navigate there.
+               ;; if gist, save a new revision of that gist.
+               :f #(prn :save)}})

editor2/src/main/maria/cloud/sidebar.cljs

@@ -27,25 +27,26 @@
       [:div.flex-grow.overflow-y-auto sidebar]]
      content]))
 
-(def acc-item (v/from-element :a.block.px-2.mx-1.py-1.my-1.text-sm.no-underline.rounded))
+(def acc-item (v/from-element :a.block
+                              {:class ["text-sm text-black no-underline"
+                                       "px-2 mx-1 py-1 rounded"
+                                       "hover:bg-black/5 hover:text-black visited:text-black"
+                                       "data-[selected=true]:bg-sky-500 data-[selected=true]:text-white"]}))
 
 (defn acc-props [current? props]
-  (merge {:style {:color (when current? "white")}
-          :class (if current?
-                   "bg-sky-600"
-                   "hover:bg-zinc-100")}
+  (merge {:data-selected current?}
          props))
 
 (ui/defview acc-section [title items]
   [:> acc/Item
    {:value title
     :class ui/c:divider}
    [:> acc/Header
-    {:class "flex flex-row h-[40px]"}
+    {:class "flex flex-row h-[40px] m-0"}
     [:> acc/Trigger {:class "text-sm font-bold cursor-pointer p-2 AccordionTrigger flex-grow"}
      [icons/chevron-right:mini "w-4 h-4 -ml-1 mr-1 AccordionChevron"]
      title]]
-   (into [:el acc/Content] items)])
+   (into [:el.flex.flex-col.gap-1 acc/Content] items)])
 
 (ui/defview user-gist-list [{:keys [username current-path]}]
   (let [gists (u/use-promise #(p/-> (u/fetch (str "https://api.github.com/users/" username "/gists")

editor2/src/main/maria/cloud/views.cljs

@@ -8,47 +8,39 @@
             [maria.ui :as ui]
             [promesa.core :as p]
             [re-db.api :as db]
-            [yawn.hooks :as hooks]))
+            [yawn.hooks :as hooks]
+            [yawn.view :as v]))
 
 (ui/defview editor [options]
-  (let [!element-ref (hooks/use-ref nil)]
-    (hooks/use-effect
-     (fn []
-       (when-let [element @!element-ref]
-         (prose/init options element)))
-     [@!element-ref (:initial-value options)])
-    [:div.relative.notebook.my-4 {:ref !element-ref}]))
+  [:div.relative.notebook.my-4 {:ref (prose/use-editor options)}])
 
 (defn doc-title [title]
   (menubar/title!
-   [:div.m-1.px-3.py-1.bg-zinc-100.border.border-zinc-200.rounded
-    title
-    [icons/chevron-down:mini "w-4 h-4 ml-1 -mr-1 text-zinc-500"]]))
+    [:div.m-1.px-3.py-1.bg-zinc-100.border.border-zinc-200.rounded
+     title
+     [icons/chevron-down:mini "w-4 h-4 ml-1 -mr-1 text-zinc-500"]]))
 
 (ui/defview curriculum
   [{:as props :curriculum/keys [name]}]
   (let [{:curriculum/keys [hash file-name]} (db/get [:curriculum/name name])
         url (str "/curriculum/" file-name "?v=" hash)
         text (u/use-promise #(p/-> (u/fetch url) (j/call :text)) [url])]
     (when text
-      [:<> {}
-       ;; todo, fix yawn to not treat a portal as props
-       ;; (the :<> fragment here is giving an error w/o this empty map)
+      [:<>
        (doc-title (str "curriculum / " name))
-       [editor {:initial-value text
-                :id url}]])))
+       [editor {:id              url
+                :persisted-value text}]])))
 
 (ui/defview gist [{:gist/keys [id]}]
-  (let [{:keys [gist/id]
-         [{:gist/keys [filename content]}] :gist/clojure-files}
+  (let [{:keys                             [gist/id]
+         [{:gist/keys  [filename content]}] :gist/clojure-files}
         (u/use-promise #(p/-> (u/fetch (str "https://api.github.com/gists/" id)
                                        :headers (gh/auth-headers))
                               (j/call :json)
                               gh/parse-gist)
                        [id])]
     (when content
       [:<>
-       (doc-title filename)
-       [editor {:id id
-                :initial-value content}]])))
-
+       [doc-title filename]
+       [editor {:id              id
+                :persisted-value content}]])))

editor2/src/main/maria/curriculum/data_flow.cljs

@@ -129,5 +129,5 @@
 
 (cell/dependencies inline-count)
 
-[(cell :a (cell/interval 1000 inc))
- (cell :b (cell/interval 500 #(rand-nth [\q \r \s \t \u \v])))]
+[(cell (cell/interval 1000 inc))
+ (cell (cell/interval 500 #(rand-nth [\q \r \s \t \u \v])))]