fix(editor): refine file edting, fix state update

- update element state when switching files #3415
- notification when saved
- minor style change
- refine editor element id gen, use uuid
- add trailing newline to saved file

Fix #3415

src/main/frontend/components/file.cljs

@@ -2,6 +2,7 @@
   (:require [cljs-time.coerce :as tc]
             [cljs-time.core :as t]
             [clojure.string :as string]
+            [datascript.core :as dc]
             [frontend.components.content :as content]
             [frontend.components.lazy-editor :as lazy-editor]
             [frontend.components.svg :as svg]
@@ -73,11 +74,12 @@
   (let [path (get-path state)
         format (format/get-format path)
         page (db/get-file-page path)
+        random-id (str (dc/squuid))
         config? (= path (config/get-config-path))]
     (rum/with-context [[tongue] i18n/*tongue-context*]
-      [:div.file {:id (str "file-" path)}
+      [:div.file {:id (str "file-edit-wrapper-" random-id)}
        [:h1.title
-        path]
+        [:bdi path]]
        (when page
          [:div.text-sm.mb-4.ml-1 "Page: "
           [:a.bg-base-2.p-1.ml-1 {:style {:border-radius 4}
@@ -117,7 +119,11 @@
            (let [content (string/trim file-content)
                  mode (util/get-file-ext path)]
              (lazy-editor/editor {:file? true
-                                  :file-path path} path {:data-lang mode} content {})))
+                                  :file-path path}
+                                 (str "file-edit-" random-id)
+                                 {:data-lang mode}
+                                 content
+                                 {})))
 
          :else
          [:div (tongue :file/format-not-supported (name format))])])))

src/main/frontend/extensions/code.cljs

@@ -132,6 +132,7 @@
             [frontend.extensions.calc :as calc]
             [frontend.handler.editor :as editor-handler]
             [frontend.handler.file :as file-handler]
+            [frontend.handler.notification :as notification]
             [frontend.state :as state]
             [frontend.utf8 :as utf8]
             [frontend.util :as util]
@@ -170,13 +171,17 @@
         (:file-path config)
         (let [path (:file-path config)
               content (db/get-file-no-sub path)
-              value (some-> (gdom/getElement path)
+              [_ id _ _ _] (:rum/args state)
+              value (some-> (gdom/getElement id)
                             (gobj/get "value"))]
           (when (and
                  (not (string/blank? value))
                  (not= (string/trim value) (string/trim content)))
-            (file-handler/alter-file (state/get-current-repo) path (string/trim value)
-                                     {:re-render-root? true})))
+            (file-handler/alter-file (state/get-current-repo)
+                                     path
+                                     (str (string/trim value) "\n")
+                                     {:re-render-root? true})
+            (notification/show! "Saved file!" :success)))
 
         :else
         nil))))
@@ -267,10 +272,16 @@
    :did-mount (fn [state]
                 (load-and-render! state)
                 state)
+   :will-update (fn [state]
+                  (when-let [editor @(:editor-atom state)]
+                    (.toTextArea ^js editor)
+                    (let [[_ _ _ code _] (:rum/args state)]
+                      (when-let [textarea (rum/ref-node state textarea-ref-name)]
+                        (gobj/set textarea "defaultValue" code)
+                        (gobj/set textarea "value" code))))
+                  state)
+
    :did-update (fn [state]
-                 (when-let [editor @(:editor-atom state)]
-                   ;; clear the previous instance
-                   (.toTextArea ^js editor))
                  (load-and-render! state)
                  state)}
   [state config id attr code theme options]

src/main/frontend/fs/nfs.cljs

@@ -173,7 +173,7 @@
                          (not (string/blank? db-content))
                          (not (:skip-compare? opts))
                          (not contents-matched?)
-                         (not (contains? #{"excalidraw" "edn"} ext))
+                         (not (contains? #{"excalidraw" "edn" "css"} ext))
                          (not (string/includes? path "/.recycle/"))
                          (zero? pending-writes))
                       (p/let [local-content (encrypt/decrypt local-content)]

src/main/frontend/fs/node.cljs

@@ -62,7 +62,7 @@
         (and
          (not= stat :not-found)         ; file on the disk was deleted
          (not contents-matched?)
-         (not (contains? #{"excalidraw" "edn"} ext))
+         (not (contains? #{"excalidraw" "edn" "css"} ext))
          (not (string/includes? path "/.recycle/"))
          (zero? pending-writes))
         (do