mirror of https://github.com/logseq/logseq
enhance(mobile): onboarding graph picker for non-login user
charlie
parent
5d7e44c28f
commit
0dc6145391
|
|
@ -67,8 +67,11 @@
|
|||
|
||||
(rum/defcs picker < rum/reactive
|
||||
[_state onboarding-and-home?]
|
||||
(let [parsing? (state/sub :repo/parsing-files?)
|
||||
native-ios? (mobile-util/native-ios?)]
|
||||
(let [parsing? (state/sub :repo/parsing-files?)
|
||||
_ (state/sub :auth/id-token)
|
||||
native-ios? (mobile-util/native-ios?)
|
||||
native-icloud? (not (string/blank? (state/sub [:mobile/container-urls :iCloudContainerUrl])))
|
||||
logged? (user-handler/logged-in?)]
|
||||
|
||||
(setups-container
|
||||
:picker
|
||||
|
|
@ -81,7 +84,9 @@
|
|||
|
||||
(if native-ios?
|
||||
;; TODO: open for all native mobile platforms
|
||||
(graph-picker/graph-picker-cp {:onboarding-and-home? onboarding-and-home?})
|
||||
(graph-picker/graph-picker-cp {:onboarding-and-home? onboarding-and-home?
|
||||
:logged? logged?
|
||||
:native-icloud? native-icloud?})
|
||||
|
||||
(if (or (nfs/supported?) (mobile-util/native-platform?))
|
||||
[:div.choose.flex.flex-col.items-center
|
||||
|
|
|
|||
|
|
@ -195,7 +195,7 @@
|
|||
(->>
|
||||
(concat repo-links
|
||||
[(when (seq repo-links) {:hr true})
|
||||
{:title (t :new-graph) :options {:on-click #(page-handler/ls-dir-files! shortcut/refresh!)}}
|
||||
{:title (t :new-graph) :options {:on-click #(state/pub-event! [:graph/setup-a-repo])}}
|
||||
{:title (t :all-graphs) :options {:href (rfe/href :repos)}}
|
||||
refresh-link
|
||||
reindex-link
|
||||
|
|
|
|||
|
|
@ -725,11 +725,14 @@
|
|||
(fs/watch-dir! dir))))
|
||||
|
||||
(defmethod handle :graph/setup-a-repo [[_ opts]]
|
||||
(if (mobile-util/native-ios?)
|
||||
(do (state/set-modal!
|
||||
#(graph-picker/graph-picker-cp {})
|
||||
{:label "graph-setup"}))
|
||||
(page-handler/ls-dir-files! st/refresh! opts)))
|
||||
(let [opts' (merge {:picked-root-fn #(state/close-modal!)
|
||||
:native-icloud? (not (string/blank? (state/get-icloud-container-root-url)))
|
||||
:logged? (user-handler/logged-in?)} opts)]
|
||||
(if (mobile-util/native-ios?)
|
||||
(do (state/set-modal!
|
||||
#(graph-picker/graph-picker-cp opts')
|
||||
{:label "graph-setup"}))
|
||||
(page-handler/ls-dir-files! st/refresh! opts'))))
|
||||
|
||||
(defmethod handle :file/alter [[_ repo path content]]
|
||||
(p/let [_ (file-handler/alter-file repo path content {:from-disk? true})]
|
||||
|
|
|
|||
|
|
@ -122,7 +122,7 @@
|
|||
(defn ^:large-vars/cleanup-todo ls-dir-files-with-handler!
|
||||
"Read files from directory and setup repo (for the first time setup a repo)"
|
||||
([ok-handler] (ls-dir-files-with-handler! ok-handler nil))
|
||||
([ok-handler {:keys [empty-dir?-or-pred dir-result-fn ios-logseq-sync?]}]
|
||||
([ok-handler {:keys [empty-dir?-or-pred dir-result-fn picked-root-fn ios-logseq-sync?]}]
|
||||
(let [path-handles (atom {})
|
||||
electron? (util/electron?)
|
||||
mobile-native? (mobile-util/native-platform?)
|
||||
|
|
@ -149,6 +149,7 @@
|
|||
(fn? empty-dir?-or-pred)
|
||||
(empty-dir?-or-pred result)))
|
||||
root-handle (first result)
|
||||
_ (when (fn? picked-root-fn) (picked-root-fn root-handle))
|
||||
dir-name (if nfs?
|
||||
(gobj/get root-handle "name")
|
||||
root-handle)
|
||||
|
|
|
|||
|
|
@ -21,34 +21,52 @@
|
|||
;; TODO: temporarily just load the existing folder
|
||||
(p/resolved (util/node-path.join root dirname)))
|
||||
|
||||
(rum/defc toggle-item
|
||||
[{:keys [on? disabled? title on-toggle]}]
|
||||
(ui/button
|
||||
[:span.flex.items-center.justify-between.w-full.py-1
|
||||
[:strong title]
|
||||
(ui/icon (if on? "toggle-right" "toggle-left"))]
|
||||
|
||||
:class (str "toggle-item " (when on? "is-on"))
|
||||
:intent "logseq"
|
||||
:on-mouse-down #(util/stop %)
|
||||
:on-click #(when (fn? on-toggle)
|
||||
(on-toggle (not on?)))))
|
||||
|
||||
(rum/defc graph-picker-cp
|
||||
[{:keys [onboarding-and-home?]}]
|
||||
[{:keys [onboarding-and-home? logged? native-icloud?] :as opts}]
|
||||
(let [[step set-step!] (rum/use-state :init)
|
||||
*input-ref (rum/create-ref)
|
||||
native-ios? (mobile-util/native-ios?)
|
||||
[sync-mode set-sync-mode!] (rum/use-state
|
||||
(cond
|
||||
logged? :logseq-sync
|
||||
native-icloud? :icloud-sync))
|
||||
icloud-sync-on? (= sync-mode :icloud-sync)
|
||||
logseq-sync-on? (= sync-mode :logseq-sync)
|
||||
*input-ref (rum/create-ref)
|
||||
native-ios? (mobile-util/native-ios?)
|
||||
|
||||
open-picker #(page-handler/ls-dir-files!
|
||||
(fn []
|
||||
(shortcut/refresh!)))
|
||||
on-create (fn [input-val]
|
||||
(let [graph-name (util/safe-sanitize-file-name input-val)]
|
||||
(if (string/blank? graph-name)
|
||||
(notification/show! "Illegal graph folder name.")
|
||||
open-picker #(page-handler/ls-dir-files! shortcut/refresh! opts)
|
||||
on-create (fn [input-val]
|
||||
(let [graph-name (util/safe-sanitize-file-name input-val)]
|
||||
(if (string/blank? graph-name)
|
||||
(notification/show! "Illegal graph folder name.")
|
||||
|
||||
;; create graph directory under Logseq document folder
|
||||
;; TODO: icloud sync
|
||||
(when-let [root (state/get-local-container-root-url)]
|
||||
(-> (validate-graph-dirname root graph-name)
|
||||
(p/then (fn [graph-path]
|
||||
(-> (fs/mkdir! graph-path)
|
||||
(p/then (fn []
|
||||
(web-nfs/ls-dir-files-with-path! graph-path)
|
||||
(notification/show! (str "Create graph: " graph-name) :success))))))
|
||||
(p/catch (fn [^js e]
|
||||
(notification/show! (str e) :error)
|
||||
(js/console.error e)))
|
||||
(p/finally
|
||||
#()))))))]
|
||||
;; create graph directory under Logseq document folder
|
||||
;; TODO: icloud sync
|
||||
(when-let [root (if icloud-sync-on? (state/get-icloud-container-root-url)
|
||||
(state/get-local-container-root-url))]
|
||||
(-> (validate-graph-dirname root graph-name)
|
||||
(p/then (fn [graph-path]
|
||||
(-> (fs/mkdir! graph-path)
|
||||
(p/then (fn []
|
||||
(web-nfs/ls-dir-files-with-path! graph-path opts)
|
||||
(notification/show! (str "Create graph: " graph-name) :success))))))
|
||||
(p/catch (fn [^js e]
|
||||
(notification/show! (str e) :error)
|
||||
(js/console.error e)))
|
||||
(p/finally
|
||||
#()))))))]
|
||||
|
||||
(rum/use-effect!
|
||||
(fn []
|
||||
|
|
@ -100,13 +118,14 @@
|
|||
:ref *input-ref
|
||||
:placeholder "What's the graph name?"}]
|
||||
|
||||
(ui/button
|
||||
[:span.flex.items-center.justify-between.w-full.py-1
|
||||
[:strong "Logseq sync"]
|
||||
(ui/icon "toggle-right")]
|
||||
(when logged?
|
||||
(toggle-item {:title "Logseq sync"
|
||||
:on? logseq-sync-on?}))
|
||||
|
||||
:intent "logseq"
|
||||
:on-click #())
|
||||
(when (and native-icloud? (not logseq-sync-on?))
|
||||
(toggle-item {:title "iCloud sync"
|
||||
:on? icloud-sync-on?
|
||||
:on-toggle #(set-sync-mode! (if % :icloud-sync nil))}))
|
||||
|
||||
[:div.flex.justify-between.items-center.pt-2
|
||||
(ui/button [:span.flex.items-center
|
||||
|
|
|
|||
|
|
@ -199,12 +199,31 @@ html.is-zoomed-native-ios {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
.cp__graph-picker {
|
||||
button.toggle-item {
|
||||
@apply opacity-90 hover:text-inherit;
|
||||
|
||||
.ui__icon {
|
||||
@apply scale-150;
|
||||
}
|
||||
|
||||
&.is-on {
|
||||
@apply opacity-100;
|
||||
|
||||
.ui__icon {
|
||||
@apply text-indigo-600;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ui__modal {
|
||||
&[label=graph-setup] {
|
||||
align-items: center;
|
||||
|
||||
.ui__modal-panel {
|
||||
transform: translate3d(0, -60px, 0);
|
||||
transform: translate3d(0, -70px, 0);
|
||||
}
|
||||
|
||||
.panel-content {
|
||||
|
|
|
|||
Loading…
Reference in New Issue