feat: rtc members UI

src/main/frontend/components/settings.cljs

@@ -20,6 +20,7 @@
             [frontend.handler.route :as route-handler]
             [frontend.handler.ui :as ui-handler]
             [frontend.handler.user :as user-handler]
+            [frontend.handler.db-based.rtc :as rtc-handler]
             [frontend.mobile.util :as mobile-util]
             [frontend.modules.instrumentation.core :as instrument]
             [frontend.modules.shortcut.data-helper :as shortcut-helper]
@@ -34,7 +35,8 @@
             [goog.string :as gstring]
             [promesa.core :as p]
             [reitit.frontend.easy :as rfe]
-            [rum.core :as rum]))
+            [rum.core :as rum]
+            [logseq.db :as ldb]))
 
 (defn toggle
   [label-for name state on-toggle & [detail-text]]
@@ -1126,29 +1128,62 @@
 
   [:<>])
 
+(rum/defcs settings-collaboration < rum/reactive
+  (rum/local "" ::invite-email)
+  {:will-mount (fn [state]
+                 ;; TODO: get all members including offline members
+                 (rtc-handler/<rtc-get-online-info)
+                 state)}
+  [state]
+  (let [*invite-email (::invite-email state)
+        current-repo (state/get-current-repo)
+        users (get (state/sub :rtc/online-info) current-repo)]
+    [:div.panel-wrap.is-collaboration.mb-8
+     [:div.flex.flex-col.gap-2.mt-4
+      [:h2.opacity-50.font-medium "Members:"]
+      [:div.users.flex.flex-col.gap-1
+       (for [{:keys [user-name user-email graph<->user-user-type]} users]
+         [:div.flex.flex-row.items-center.gap-2 {:key (str "user-" user-name)}
+          [:div user-name]
+          (when user-email [:div.opacity-50.text-sm user-email])
+          (when graph<->user-user-type [:div.opacity-50.text-sm graph<->user-user-type])])]
+      [:div.flex.flex-col.gap-2.mt-4
+       (shui/input
+        {:placeholder   "Email address"
+         :on-change     #(reset! *invite-email (util/evalue %))})
+       (shui/button
+        {:on-click (fn []
+                     (let [user-email @*invite-email
+                           graph-uuid (ldb/get-graph-rtc-uuid (db/get-db))]
+                       (when-not (string/blank? user-email)
+                         (when graph-uuid
+                           (rtc-handler/<rtc-invite-email graph-uuid user-email)))))}
+        "Invite")]]]))
+
 (rum/defcs settings
   < (rum/local DEFAULT-ACTIVE-TAB-STATE ::active)
-    {:will-mount
-     (fn [state]
-       (state/load-app-user-cfgs)
-       state)
-     :did-mount
-     (fn [state]
-       (let [active-tab (first (:rum/args state))
-             *active (::active state)]
-         (when (keyword? active-tab)
-           (reset! *active [active-tab nil])))
-       state)
-     :will-unmount
-     (fn [state]
-       (state/close-settings!)
-       state)}
-    rum/reactive
+  {:will-mount
+   (fn [state]
+     (state/load-app-user-cfgs)
+     state)
+   :did-mount
+   (fn [state]
+     (let [active-tab (first (:rum/args state))
+           *active (::active state)]
+       (when (keyword? active-tab)
+         (reset! *active [active-tab nil])))
+     state)
+   :will-unmount
+   (fn [state]
+     (state/close-settings!)
+     state)}
+  rum/reactive
   [state _active-tab]
   (let [current-repo (state/sub :git/current-repo)
         _installed-plugins (state/sub :plugin/installed-plugins)
         plugins-of-settings (and config/lsp-enabled? (seq (plugin-handler/get-enabled-plugins-if-setting-schema)))
-        *active (::active state)]
+        *active (::active state)
+        logged-in? (user-handler/logged-in?)]
 
     [:div#settings.cp__settings-main
      (settings-effect @*active)
@@ -1159,7 +1194,7 @@
        [:ul.settings-menu
         (for [[label id text icon]
               [(when config/ENABLE-SETTINGS-ACCOUNT-TAB
-                [:account "account" (t :settings-page/tab-account) (ui/icon "user-circle")])
+                 [:account "account" (t :settings-page/tab-account) (ui/icon "user-circle")])
                [:general "general" (t :settings-page/tab-general) (ui/icon "adjustments")]
                [:editor "editor" (t :settings-page/tab-editor) (ui/icon "writing")]
                [:keymap "keymap" (t :settings-page/tab-keymap) (ui/icon "keyboard")]
@@ -1172,6 +1207,8 @@
 
                [:advanced "advanced" (t :settings-page/tab-advanced) (ui/icon "bulb")]
                [:features "features" (t :settings-page/tab-features) (ui/icon "app-feature")]
+               (when logged-in?
+                 [:collaboration "collaboration" (t :settings-page/tab-collaboration) (ui/icon "users")])
 
                (when plugins-of-settings
                  [:plugins-setting "plugins" (t :settings-of-plugins) (ui/icon "puzzle")])]]
@@ -1221,4 +1258,7 @@
          :features
          (settings-features)
 
+         :collaboration
+         (settings-collaboration)
+
          nil)]]]))

src/main/frontend/db_worker.cljs

@@ -571,12 +571,10 @@
     (when-let [state @rtc-core/*state]
       (let [target-user-uuids (ldb/read-transit-str target-user-uuids-str)
             target-user-emails (ldb/read-transit-str target-user-emails-str)]
-
         (rtc-core/<grant-graph-access-to-others
          state graph-uuid
          :target-user-uuids target-user-uuids
-         :target-user-emails target-user-emails)
-        nil))))
+         :target-user-emails target-user-emails)))))
 
   (rtc-upload-graph
    [this repo token remote-graph-name]

src/main/frontend/handler/db_based/rtc.cljs

@@ -7,7 +7,8 @@
             [frontend.handler.user :as user-handler]
             [frontend.db :as db]
             [logseq.db :as ldb]
-            [logseq.db.sqlite.common-db :as sqlite-common-db]))
+            [logseq.db.sqlite.common-db :as sqlite-common-db]
+            [frontend.handler.notification :as notification]))
 
 (defn <rtc-create-graph!
   [repo]
@@ -73,3 +74,24 @@
                                          :rtc-graph? true})
                                       (dissoc graph :graph-uuid :graph-name)))))]
            (state/set-state! :rtc/graphs result)))))))
+
+(defn <rtc-get-online-info
+  []
+  (when-let [^js worker @state/*db-worker]
+    (p/let [result (.rtc-get-online-info worker)
+            result (bean/->clj result)
+            repo (state/get-current-repo)]
+      (state/set-state! :rtc/online-info {repo result}))))
+
+(defn <rtc-invite-email
+  [graph-uuid email]
+  (when-let [^js worker @state/*db-worker]
+    (->
+     (p/do!
+      (.rtc-grant-graph-access worker graph-uuid
+                               (ldb/write-transit-str [])
+                               (ldb/write-transit-str [email]))
+      (notification/show! (str "Invitation sent!") :success))
+     (p/catch (fn [e]
+                (notification/show! (str "Something wrong, please try again.") :error)
+                (js/console.error e))))))

src/main/frontend/state.cljs

@@ -290,6 +290,7 @@
       :rtc/uploading?                        false
       :rtc/downloading?                      false
       :rtc/graphs                            []
+      :rtc/online-info                       (atom {})
       ;; graph-url -> {:in-transaction? Boolean :txs []}
       :rtc/remote-batch-tx-state             {}
 

src/main/frontend/worker/async_util.cljc

@@ -30,6 +30,8 @@
        (if chan
          (async/go
            (let [result (async/<! chan)]
-             (p/resolve! d result)))
+             (if (instance? ExceptionInfo result)
+               (p/reject! d result)
+               (p/resolve! d result))))
          (p/resolve! d nil))
        d)))

src/main/frontend/worker/rtc/core.cljs

@@ -1024,15 +1024,11 @@
 
 (defn <grant-graph-access-to-others
   [state graph-uuid & {:keys [target-user-uuids target-user-emails]}]
-  (go
-    (let [r (<? (ws/<send&receive state
-                                  (cond-> {:action "grant-access"
-                                           :graph-uuid graph-uuid}
-                                    target-user-uuids (assoc :target-user-uuids target-user-uuids)
-                                    target-user-emails (assoc :target-user-emails target-user-emails))))]
-      (if-let [ex-message (:ex-message r)]
-        (prn ::<grant-graph-access-to-others ex-message (:ex-data r))
-        (prn ::<grant-graph-access-to-others :succ)))))
+  (ws/<send&receive state
+                    (cond-> {:action "grant-access"
+                             :graph-uuid graph-uuid}
+                      target-user-uuids (assoc :target-user-uuids target-user-uuids)
+                      target-user-emails (assoc :target-user-emails target-user-emails))))
 
 (defn <toggle-auto-push-client-ops
   [state]

src/resources/dicts/en.edn

@@ -315,6 +315,7 @@
  :settings-page/tab-advanced "Advanced"
  :settings-page/tab-assets "Assets"
  :settings-page/tab-features "Features"
+ :settings-page/tab-collaboration "Collaboration"
  :settings-page/plugin-system "Plugins"
  :settings-page/enable-flashcards "Flashcards"
  :settings-page/network-proxy "Network proxy"