feat(electron): settings ui of app updater

resources/js/preload.js

@@ -1,6 +1,6 @@
-const { ipcRenderer, contextBridge } = require('electron')
+const { ipcRenderer, contextBridge, shell } = require('electron')
 
-contextBridge.exposeInMainWorld('api', {
+contextBridge.exposeInMainWorld('apis', {
   doAction: async (arg) => {
     return await ipcRenderer.invoke('main', arg)
   },
@@ -19,5 +19,9 @@ contextBridge.exposeInMainWorld('api', {
 
   installUpdatesAndQuitApp () {
     ipcRenderer.invoke('install-updates', true)
+  },
+
+  async openExternal (url, options) {
+    await shell.openExternal(url, options)
   }
 })

src/electron/electron/updater.cljs

@@ -7,9 +7,9 @@
             ["os" :as os]
             ["fs" :as fs]
             ["path" :as path]
-            ["electron" :refer [ipcMain app]]
-            ["open" :as open]))
+            ["electron" :refer [ipcMain app]]))
 
+(def open (js/require "open"))
 (def fetch (js/require "node-fetch"))
 (def *update-ready-to-install (atom nil))
 (def *update-pending (atom nil))
@@ -24,8 +24,9 @@
 
 (defn get-latest-artifact-info
   [repo]
-  (let [;endpoint "https://update.electronjs.org/xyhp915/cljs-todo/darwin-x64/0.0.7"
-        endpoint (str "https://update.electronjs.org/" repo "/" (if mac? "darwin" "win32") "-x64/" version)]
+  (let [endpoint "https://update.electronjs.org/xyhp915/cljs-todo/darwin-x64/0.0.7"
+        ;endpoint (str "https://update.electronjs.org/" repo "/" (if mac? "darwin" "win32") "-x64/" version)
+        ]
     (p/catch
      (p/let [res (fetch endpoint)
              status (.-status res)
@@ -39,7 +40,8 @@
        (throw e)))))
 
 (defn check-for-updates
-  [{:keys [repo ^js logger ^js win]}]
+  [{:keys           [repo ^js logger ^js win]
+    [auto-download] :args}]
   (let [debug (partial (.-warn logger) "[updater]")
         emit (fn [type payload]
                (.. win -webContents
@@ -53,6 +55,7 @@
              url (if-not artifact (emit "update-not-available" nil) (:url artifact))
              _ (if url (emit "update-available" (bean/->js artifact)) (throw (js/Error. "download url not exists")))
                ;; start download FIXME: user's preference about auto download
+             _ (when-not auto-download (throw nil))
              ^js dl-res (fetch url)
              _ (if-not (.-ok dl-res) (throw (js/Error. "download resource not available")))
              dest-info (p/create
@@ -88,8 +91,11 @@
              (resolve nil))
            (p/catch
             (fn [e]
-              (emit "error" e)
-              (reject e)))
+              (if e
+                (do
+                  (emit "error" e)
+                  (reject e))
+                (resolve nil))))
            (p/finally
              (fn []
                (emit "completed" nil))))))))

src/main/electron/ipc.cljs

@@ -5,4 +5,4 @@
 ;; TODO: handle errors
 (defn ipc
   [& args]
-  (js/window.api.doAction (bean/->js args)))
+  (js/window.apis.doAction (bean/->js args)))

src/main/frontend/components/settings.cljs

@@ -8,6 +8,7 @@
             [frontend.handler.config :as config-handler]
             [frontend.handler.page :as page-handler]
             [frontend.state :as state]
+            [frontend.version :refer [version]]
             [frontend.util :as util]
             [frontend.config :as config]
             [frontend.dicts :as dicts]
@@ -73,6 +74,13 @@
     [:div.max-w-lg.rounded-md.sm:max-w-xs
      (ui/toggle state on-toggle)]]])
 
+(rum/defcs app-updater < rum/reactive
+  [state]
+  (let [update-pending? (state/sub :electron/updater-pending?)]
+    [:div.cp__settings-app-updater
+     [:button.ui__button_base.is-logseq.check-update
+      (if update-pending? "Checking ..." "Check for updates")]]))
+
 (rum/defcs settings < rum/reactive
   []
   (let [preferred-format (state/get-preferred-format)
@@ -210,41 +218,38 @@
 
          (when (not enable-journals?)
            [:div.mt-6.sm:mt-5.sm:grid.sm:grid-cols-3.sm:gap-4.sm:items-start.sm:pt-5
-             [:label.block.text-sm.font-medium.leading-5.sm:mt-px.sm:pt-2.opacity-70
-              {:for "default page"}
-              (t :settings-page/home-default-page)]
-             [:div.mt-1.sm:mt-0.sm:col-span-2
-              [:div.max-w-lg.rounded-md.shadow-sm.sm:max-w-xs
-               [:input#home-default-page.form-input.block.w-full.transition.duration-150.ease-in-out.sm:text-sm.sm:leading-5
-                {:default-value (state/sub-default-home-page)
-                 :on-blur (fn [event]
-                            (let [value (util/evalue event)]
-                              (cond
-                                (string/blank? value)
-                                (let [home (get (state/get-config) :default-home {})
-                                      new-home (dissoc home :page)]
-                                  (config-handler/set-config! :default-home new-home)
-                                  (notification/show! "Home default page updated successfully!" :success))
+            [:label.block.text-sm.font-medium.leading-5.sm:mt-px.sm:pt-2.opacity-70
+             {:for "default page"}
+             (t :settings-page/home-default-page)]
+            [:div.mt-1.sm:mt-0.sm:col-span-2
+             [:div.max-w-lg.rounded-md.shadow-sm.sm:max-w-xs
+              [:input#home-default-page.form-input.block.w-full.transition.duration-150.ease-in-out.sm:text-sm.sm:leading-5
+               {:default-value (state/sub-default-home-page)
+                :on-blur (fn [event]
+                           (let [value (util/evalue event)]
+                             (cond
+                               (string/blank? value)
+                               (let [home (get (state/get-config) :default-home {})
+                                     new-home (dissoc home :page)]
+                                 (config-handler/set-config! :default-home new-home)
+                                 (notification/show! "Home default page updated successfully!" :success))
 
-                                (page-handler/page-exists? (string/lower-case value))
-                                (let [home (get (state/get-config) :default-home {})
-                                      new-home (assoc home :page value)]
-                                  (config-handler/set-config! :default-home new-home)
-                                  (notification/show! "Home default page updated successfully!" :success))
+                               (page-handler/page-exists? (string/lower-case value))
+                               (let [home (get (state/get-config) :default-home {})
+                                     new-home (assoc home :page value)]
+                                 (config-handler/set-config! :default-home new-home)
+                                 (notification/show! "Home default page updated successfully!" :success))
 
-                                :else
-                                (notification/show! "Please make sure the page exists!" :warning))))}]]]])
+                               :else
+                               (notification/show! "Please make sure the page exists!" :warning))))}]]]])
 
          (when (string/starts-with? current-repo "https://")
            (toggle "enable_git_auto_push"
-                  "Enable Git auto push"
-                  enable-git-auto-push?
-                  (fn []
-                    (let [value (not enable-git-auto-push?)]
-                      (config-handler/set-config! :git-auto-push value)))))
-
-
-         [:hr]
+                   "Enable Git auto push"
+                   enable-git-auto-push?
+                   (fn []
+                     (let [value (not enable-git-auto-push?)]
+                       (config-handler/set-config! :git-auto-push value))))) [:hr]
 
          (when logged?
            [:div
@@ -275,6 +280,15 @@
 
             [:hr]])
 
+         [:div.sm:grid.sm:grid-cols-3.sm:gap-4.sm:items-start.sm:pt-5
+          [:label.block.text-sm.font-medium.leading-5.sm:mt-px.sm:pt-2.opacity-70
+           (t :settings-page/current-version)]
+          [:div.mt-1.sm:mt-0.sm:col-span-2
+           [:p version]
+           (if util/electron? (app-updater))]]
+
+         [:hr]
+
          [:div.sm:grid.sm:grid-cols-3.sm:gap-4.sm:items-start.sm:pt-5
           [:label.block.text-sm.font-medium.leading-5.sm:mt-px.sm:pt-2.opacity-70
            {:for "developer_mode"}

src/main/frontend/components/settings.css

@@ -0,0 +1,12 @@
+.cp__settings {
+  &-app-updater {
+    min-height: 20px;
+    position: relative;
+
+    button.check-update {
+      position: absolute;
+      right: 0;
+      top: -45px;
+    }
+  }
+}

src/main/frontend/dicts.cljs

@@ -291,6 +291,7 @@ title: How to take dummy notes?
         :settings-page/enable-developer-mode "Enable developer mode"
         :settings-page/disable-developer-mode "Disable developer mode"
         :settings-page/developer-mode-desc "Developer mode helps contributors and extension developers test their integration with Logseq more efficient."
+        :settings-page/current-version "Current version"
         :logseq "Logseq"
         :dot-mode "Dot mode"
         :on "ON"
@@ -774,6 +775,7 @@ title: How to take dummy notes?
            :settings-page/enable-developer-mode "启用开发者模式"
            :settings-page/disable-developer-mode "禁用开发者模式"
            :settings-page/developer-mode-desc "开发者模式帮助贡献者和扩展开发者更有效地测试他们与 Logseq 的集成。"
+           :settings-page/current-version "当前版本"
            :logseq "Logseq"
            :dot-mode "点模式"
            :on "已打开"

src/main/frontend/page.cljs

@@ -12,6 +12,7 @@
 (rum/defc current-page < rum/reactive
   {:did-mount    (fn [state]
                    (state/set-root-component! (:rum/react-component state))
+                   (state/setup-electron-updater!)
                    (ui/inject-document-devices-envs!)
                    (ui/inject-dynamic-style-node!)
                    (let [teardown-fn (comp (ui/setup-patch-ios-fixed-bottom-position!))]

src/main/frontend/state.cljs

@@ -3,6 +3,7 @@
             [rum.core :as rum]
             [frontend.util :as util :refer-macros [profile]]
             [clojure.string :as string]
+            [cljs-bean.core :as bean]
             [medley.core :as medley]
             [goog.object :as gobj]
             [goog.dom :as gdom]
@@ -96,6 +97,10 @@
 
     :preferred-language (storage/get :preferred-language)
 
+    ;; electron
+    :electron/updater-pending? false
+    :electron/updater {}
+
     ;; all notification contents as k-v pairs
     :notification/contents {}
     :graph/syncing? false}))
@@ -194,8 +199,7 @@
   ;;         (get (sub-config) (get-current-repo))))
 
   ;; Disable block timestamps for now, because it doesn't work with undo/redo
-  false
-  )
+  false)
 
 ;; Enable by default
 (defn show-brackets?
@@ -714,6 +718,17 @@
   []
   (get @state :ui/root-component))
 
+(defn setup-electron-updater!
+  []
+  (when util/electron?
+    (js/window.apis.setUpdatesCallback
+     (fn [_ args]
+       (let [data (bean/->clj args)
+             pending? (not= (:type data) "completed")]
+         (set-state! :electron/updater-pending? pending?)
+         (when-not pending? (set-state! :electron/updater data))
+         nil)))))
+
 (defn set-file-component!
   [component]
   (set-state! :ui/file-component component))
@@ -767,7 +782,7 @@
   (or
    (when-let [repo (get-current-repo)]
      (get-in @state [:config repo :date-formatter]))
-   ;; TODO:
+    ;; TODO:
    (get-in @state [:me :settings :date-formatter])
    "MMM do, yyyy"))
 
@@ -1005,7 +1020,7 @@
      (when-let [last-time (get-in @state [:editor/last-input-time repo])]
        (let [now (util/time-ms)]
          (>= (- now last-time) 1000)))
-     ;; not in editing mode
+      ;; not in editing mode
      (not (get-edit-input-id)))))
 
 (defn set-last-persist-transact-id!
@@ -1027,7 +1042,7 @@
                                     (remove (fn [tx] (<= (:tx-id tx) last-persist-tx-id)) result)))
                        latest-txs)
           new-txs (update-in latest-txs [repo files?] (fn [result]
-                                                        (vec (conj result {:tx-id tx-id
+                                                        (vec (conj result {:tx-id   tx-id
                                                                            :tx-data tx-data}))))]
       (storage/set-transit! :db/latest-txs new-txs)
       (set-state! :db/latest-txs new-txs))))

src/main/frontend/ui.css

@@ -43,6 +43,27 @@
   }
 }
 
+.ui__button_base {
+  @apply inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4
+  font-medium rounded-md text-white
+  bg-gray-500 hover:bg-gray-700 active:bg-gray-700
+  focus:border-gray-700 focus:shadow-outline-gray
+  focus:outline-none transition
+  ease-in-out duration-150 mt-1;
+
+  &.is-logseq {
+    @apply focus:border-gray-500;
+
+    color: var(--ls-primary-text-color);
+    background: var(--ls-secondary-background-color);
+  }
+
+  &.is-primary {
+    @apply bg-indigo-600 hover:bg-indigo-700 active:bg-indigo-700
+    focus:border-indigo-700 focus:shadow-outline-indigo;
+  }
+}
+
 .dropdown-wrapper {
   background-color: var(--ls-primary-background-color, #fff);
   min-width: 12rem;