From ab612a0a1b6361d5fb9de3c314e24cc88d5111d7 Mon Sep 17 00:00:00 2001 From: Tienson Qin Date: Mon, 8 Jan 2024 12:26:05 +0800 Subject: [PATCH] refactor debug UI state --- src/main/frontend/db/rtc/debug_ui.cljs | 79 ++++++++++++-------------- src/main/frontend/db_worker.cljs | 4 ++ src/main/frontend/handler/events.cljs | 6 +- src/main/frontend/handler/worker.cljs | 4 ++ src/main/frontend/worker/rtc/core.cljs | 25 +++++++- 5 files changed, 72 insertions(+), 46 deletions(-) diff --git a/src/main/frontend/db/rtc/debug_ui.cljs b/src/main/frontend/db/rtc/debug_ui.cljs index 22a2572d66..fe8600d9cc 100644 --- a/src/main/frontend/db/rtc/debug_ui.cljs +++ b/src/main/frontend/db/rtc/debug_ui.cljs @@ -1,10 +1,7 @@ (ns frontend.db.rtc.debug-ui "Debug UI for rtc module" - (:require [cljs.core.async :as async :refer [go]] - [fipp.edn :as fipp] + (:require [fipp.edn :as fipp] [frontend.db :as db] - [frontend.worker.rtc.op-mem-layer :as op-mem-layer] - [frontend.worker.rtc.ws :as ws] [frontend.handler.user :as user] [frontend.state :as state] [frontend.ui :as ui] @@ -29,34 +26,29 @@ (rum/defcs ^:large-vars/cleanup-todo rtc-debug-ui < rum/reactive - (rum/local nil ::graph-uuid) - (rum/local nil ::local-tx) - (rum/local nil ::unpushed-block-update-count) - (rum/local nil ::ws-state) - (rum/local nil ::download-graph-to-repo) - (rum/local nil ::remote-graphs) - (rum/local nil ::graph-uuid-to-download) - (rum/local nil ::grant-access-to-user) - (rum/local nil ::auto-push-updates?) + (rum/local nil :graph-uuid) + (rum/local nil :local-tx) + (rum/local nil :unpushed-block-update-count) + (rum/local nil :ws-state) + (rum/local nil :download-graph-to-repo) + (rum/local nil :remote-graphs) + (rum/local nil :graph-uuid-to-download) + (rum/local nil :grant-access-to-user) + (rum/local nil :auto-push-updates?) [state] (let [s (rum/react debug-state) - rtc-state (and s (rum/react (:*rtc-state s)))] + rtc-state (:rtc-state s)] [:div [:div.flex (ui/button "local-state" :class "mr-2" :icon "refresh" :on-click (fn [_] - (go - (let [repo (state/get-current-repo) - local-tx (op-mem-layer/get-local-tx repo) - unpushed-block-update-count (op-mem-layer/get-unpushed-block-update-count repo) - graph-uuid (op-mem-layer/get-graph-uuid repo)] - (reset! (::local-tx state) local-tx) - (reset! (::unpushed-block-update-count state) unpushed-block-update-count) - (reset! (::graph-uuid state) graph-uuid) - (reset! (::ws-state state) (and s (ws/get-state @(:*ws s)))) - (reset! (::auto-push-updates? state) (and s @(:*auto-push-client-ops? s))))))) + (let [repo (state/get-current-repo) + ^object worker @db-browser/*worker] + (p/let [result (.rtc-get-debug-state worker repo) + debug-state (bean/->clj result)] + (swap! state (fn [old] (merge old debug-state))))))) (ui/button "graph-list" :icon "refresh" :on-click (fn [_] @@ -64,18 +56,17 @@ ^object worker @db-browser/*worker] (p/let [result (.rtc-get-graphs worker token) graph-list (bean/->clj result)] - (reset! (::remote-graphs state) (map :graph-uuid graph-list)) - (reset! debug-state s)))))] + (swap! state assoc :remote-graphs (map :graph-uuid graph-list))))))] [:pre.select-text (-> {:user-uuid (user/user-uuid) - :graph @(::graph-uuid state) + :graph (:graph-uuid state) :rtc-state rtc-state - :ws (and s (ws/get-state @(:*ws s))) - :local-tx @(::local-tx state) - :pending-block-update-count @(::unpushed-block-update-count state) - :remote-graphs @(::remote-graphs state) - :auto-push-updates? @(::auto-push-updates? state) + :ws (:ws-state state) + :local-tx (:local-tx state) + :pending-block-update-count (:unpushed-block-update-count state) + :remote-graphs (:remote-graphs state) + :auto-push-updates? (:auto-push-updates? state) :current-page (state/get-current-page) :blocks-count (when-let [page (state/get-current-page)] (count (:block/_page (db/entity [:block/name (util/page-name-sanity-lc page)]))))} @@ -94,14 +85,14 @@ [:div.mr-2 (ui/button (str "send pending ops") {:on-click (fn [] (push-pending-ops))})] [:div.mr-2 (ui/button (str "Toggle auto push updates(" - (if @(:*auto-push-client-ops? s) + (if (:*auto-push-client-ops? s) "ON" "OFF") ")") {:on-click (fn [] (let [^object worker @db-browser/*worker] (p/let [result (.rtc-toggle-sync worker (state/get-current-repo))] - (reset! (::auto-push-updates? state) result))))})] + (swap! state assoc :auto-push-updates? result))))})] [:div (ui/button "stop" {:on-click (fn [] (stop))})]]) (when (some? s) [:hr] @@ -109,16 +100,16 @@ (ui/button "grant graph access to" {:class "mr-2" :on-click (fn [] - (let [user-uuid (some-> @(::grant-access-to-user state) parse-uuid) - user-email (when-not user-uuid @(::grant-access-to-user state))] - (when-let [graph-uuid @(::graph-uuid state)] + (let [user-uuid (some-> (:grant-access-to-user state) parse-uuid) + user-email (when-not user-uuid (:grant-access-to-user state))] + (when-let [graph-uuid (:graph-uuid state)] (let [^object worker @db-browser/*worker] (.rtc-grant-graph-access worker graph-uuid (some-> user-uuid vector) (some-> user-email vector))))))}) [:input.form-input.my-2 - {:on-change (fn [e] (reset! (::grant-access-to-user state) (util/evalue e))) + {:on-change (fn [e] (swap! state assoc :grant-access-to-user (util/evalue e))) :on-focus (fn [e] (let [v (.-value (.-target e))] (when (= v "input email or user-uuid here") (set! (.-value (.-target e)) "")))) @@ -128,8 +119,8 @@ (ui/button (str "download graph to") {:class "mr-2" :on-click (fn [] - (when-let [repo @(::download-graph-to-repo state)] - (when-let [graph-uuid @(::graph-uuid-to-download state)] + (when-let [repo (:download-graph-to-repo state)] + (when-let [graph-uuid (:graph-uuid-to-download state)] (prn :download-graph graph-uuid :to repo) (let [token (state/get-auth-id-token) ^object worker @db-browser/*worker] @@ -138,14 +129,14 @@ [:select {:on-change (fn [e] (let [value (util/evalue e)] - (reset! (::graph-uuid-to-download state) value)))} - (if (seq @(::remote-graphs state)) + (swap! state assoc :graph-uuid-to-download value)))} + (if (seq (:remote-graphs state)) (cons [:option {:key "select a remote graph" :value nil} "select a remote graph"] - (for [graph-uuid @(::remote-graphs state)] + (for [graph-uuid (:remote-graphs state)] [:option {:key graph-uuid :value graph-uuid} (str (subs graph-uuid 0 14) "...")])) (list [:option {:key "refresh-first" :value nil} "refresh remote-graphs first"]))] [:input.form-input.my-2 - {:on-change (fn [e] (reset! (::download-graph-to-repo state) (util/evalue e))) + {:on-change (fn [e] (swap! state assoc :download-graph-to-repo (util/evalue e))) :on-focus (fn [e] (let [v (.-value (.-target e))] (when (= v "repo name here") (set! (.-value (.-target e)) "")))) diff --git a/src/main/frontend/db_worker.cljs b/src/main/frontend/db_worker.cljs index 95099d9580..7ef68fd609 100644 --- a/src/main/frontend/db_worker.cljs +++ b/src/main/frontend/db_worker.cljs @@ -460,6 +460,10 @@ [_this block-id] (rtc-core/js (rtc-core/get-debug-state repo))) + (dangerousRemoveAllDbs [this repo] (p/let [dbs (.listDB this)] diff --git a/src/main/frontend/handler/events.cljs b/src/main/frontend/handler/events.cljs index b963819fca..6886280fc3 100644 --- a/src/main/frontend/handler/events.cljs +++ b/src/main/frontend/handler/events.cljs @@ -74,7 +74,8 @@ [promesa.core :as p] [rum.core :as rum] [frontend.db.listener :as db-listener] - [frontend.persist-db.browser :as db-browser])) + [frontend.persist-db.browser :as db-browser] + [frontend.db.rtc.debug-ui :as rtc-debug-ui])) ;; TODO: should we move all events here? @@ -941,6 +942,9 @@ (state/set-state! :error/multiple-tabs-access-opfs? true) (state/set-modal! multi-tabs-dialog {:container-overflow-visible? true})) +(defmethod handle :rtc-sync-state [[_ state]] + (swap! rtc-debug-ui/debug-state (fn [old] (merge old state)))) + (defn run! [] (let [chan (state/get-events-chan)] diff --git a/src/main/frontend/handler/worker.cljs b/src/main/frontend/handler/worker.cljs index ba699d3db9..8e2d4c9419 100644 --- a/src/main/frontend/handler/worker.cljs +++ b/src/main/frontend/handler/worker.cljs @@ -17,6 +17,10 @@ (defmethod handle :add-repo [_ data] (state/add-repo! {:url (:repo (edn/read-string data))})) +(defmethod handle :rtc-sync-state [_ data] + (let [state (edn/read-string data)] + (state/pub-event! [:rtc/sync-state state]))) + (defmethod handle :default [_ data] (prn :debug "Worker data not handled: " data)) diff --git a/src/main/frontend/worker/rtc/core.cljs b/src/main/frontend/worker/rtc/core.cljs index 1a3c25a261..970a8049af 100644 --- a/src/main/frontend/worker/rtc/core.cljs +++ b/src/main/frontend/worker/rtc/core.cljs @@ -851,6 +851,23 @@ (defonce *state (atom nil)) +(defn get-debug-state + ([repo] + (get-debug-state repo @*state)) + ([repo state] + (let [graph-uuid (op-mem-layer/get-graph-uuid repo) + local-tx (op-mem-layer/get-local-tx repo) + unpushed-block-update-count (op-mem-layer/get-unpushed-block-update-count repo)] + (cond-> + {:graph-uuid graph-uuid + :local-tx local-tx + :unpushed-block-update-count unpushed-block-update-count} + state + (merge + {:rtc-state @(:*rtc-state state) + :ws-state (ws/get-state @(:*ws state)) + :auto-push-updates? (and @*state @(:*auto-push-client-ops? state))}))))) + ;; FIXME: token might be expired (defn js graph-list)))) d)) + +(add-watch *state :notify-main-thread + (fn [_ _ old new] + (let [new-state (get-debug-state @(:*repo new) new) + old-state (get-debug-state @(:*repo old) old)] + (when (not= new-state old-state) + (worker-util/post-message :rtc-sync-state (bean/->js new-state))))))