mirror of
https://github.com/logseq/logseq.git
synced 2026-05-28 06:34:34 +00:00
chore: separate import from onboarding
This commit is contained in:
Tienson Qin
143
src/main/frontend/components/import.cljs
Normal file
143
src/main/frontend/components/import.cljs
Normal file
@@ -0,0 +1,143 @@
|
||||
(ns frontend.components.import
|
||||
(:require [frontend.state :as state]
|
||||
[rum.core :as rum]
|
||||
[frontend.ui :as ui]
|
||||
[frontend.context.i18n :refer [t]]
|
||||
[frontend.components.svg :as svg]
|
||||
[frontend.handler.route :as route-handler]
|
||||
[frontend.handler.ui :as ui-handler]
|
||||
[frontend.handler.notification :as notification]
|
||||
[frontend.handler.import :as import-handler]
|
||||
[clojure.string :as string]
|
||||
[goog.object :as gobj]
|
||||
[frontend.components.onboarding.setups :as setups]))
|
||||
|
||||
(defonce *opml-imported-pages (atom nil))
|
||||
|
||||
(defn- finished-cb
|
||||
[]
|
||||
(route-handler/redirect-to-home!)
|
||||
(notification/show! "Import finished!" :success)
|
||||
(ui-handler/re-render-root!))
|
||||
|
||||
(defn- roam-import-handler
|
||||
[e]
|
||||
(let [file (first (array-seq (.-files (.-target e))))
|
||||
file-name (gobj/get file "name")]
|
||||
(if (string/ends-with? file-name ".json")
|
||||
(do
|
||||
(state/set-state! :graph/importing :roam-json)
|
||||
(let [reader (js/FileReader.)]
|
||||
(set! (.-onload reader)
|
||||
(fn [e]
|
||||
(let [text (.. e -target -result)]
|
||||
(import-handler/import-from-roam-json!
|
||||
text
|
||||
#(do
|
||||
(state/set-state! :graph/importing nil)
|
||||
(finished-cb))))))
|
||||
(.readAsText reader file)))
|
||||
(notification/show! "Please choose a JSON file."
|
||||
:error))))
|
||||
|
||||
(defn- lsq-import-handler
|
||||
[e]
|
||||
(let [file (first (array-seq (.-files (.-target e))))
|
||||
file-name (some-> (gobj/get file "name")
|
||||
(string/lower-case))
|
||||
edn? (string/ends-with? file-name ".edn")
|
||||
json? (string/ends-with? file-name ".json")]
|
||||
(if (or edn? json?)
|
||||
(do
|
||||
(state/set-state! :graph/importing :logseq)
|
||||
(let [reader (js/FileReader.)
|
||||
import-f (if edn?
|
||||
import-handler/import-from-edn!
|
||||
import-handler/import-from-json!)]
|
||||
(set! (.-onload reader)
|
||||
(fn [e]
|
||||
(let [text (.. e -target -result)]
|
||||
(import-f
|
||||
text
|
||||
#(do
|
||||
(state/set-state! :graph/importing nil)
|
||||
(finished-cb))))))
|
||||
(.readAsText reader file)))
|
||||
(notification/show! "Please choose an EDN or a JSON file."
|
||||
:error))))
|
||||
|
||||
(defn- opml-import-handler
|
||||
[e]
|
||||
(let [file (first (array-seq (.-files (.-target e))))
|
||||
file-name (gobj/get file "name")]
|
||||
(if (string/ends-with? file-name ".opml")
|
||||
(do
|
||||
(state/set-state! :graph/importing :opml)
|
||||
(let [reader (js/FileReader.)]
|
||||
(set! (.-onload reader)
|
||||
(fn [e]
|
||||
(let [text (.. e -target -result)]
|
||||
(import-handler/import-from-opml! text
|
||||
(fn [pages]
|
||||
(reset! *opml-imported-pages pages)
|
||||
(state/set-state! :graph/importing nil)
|
||||
(finished-cb))))))
|
||||
(.readAsText reader file)))
|
||||
(notification/show! "Please choose a OPML file."
|
||||
:error))))
|
||||
|
||||
(rum/defc importer < rum/reactive
|
||||
[{:keys [query-params]}]
|
||||
(if (state/sub :graph/importing)
|
||||
(let [{:keys [total current-idx current-page]} (state/sub :graph/importing-state)
|
||||
left-label [:div.flex.flex-row.font-bold
|
||||
(t :importing)
|
||||
[:div.hidden.md:flex.flex-row
|
||||
[:span.mr-1 ": "]
|
||||
[:div.text-ellipsis-wrapper {:style {:max-width 300}}
|
||||
current-page]]]
|
||||
width (js/Math.round (* (.toFixed (/ current-idx total) 2) 100))
|
||||
process (when (and total current-idx)
|
||||
(str current-idx "/" total))]
|
||||
(ui/progress-bar-with-label width left-label process))
|
||||
(setups/setups-container
|
||||
:importer
|
||||
[:article.flex.flex-col.items-center.importer.py-16.px-8
|
||||
[:section.c.text-center
|
||||
[:h1 (t :on-boarding/importing-title)]
|
||||
[:h2 (t :on-boarding/importing-desc)]]
|
||||
[:section.d.md:flex
|
||||
[:label.action-input.flex.items-center.mx-2.my-2
|
||||
[:span.as-flex-center [:i (svg/roam-research 28)]]
|
||||
[:div.flex.flex-col
|
||||
[[:strong "RoamResearch"]
|
||||
[:small (t :on-boarding/importing-roam-desc)]]]
|
||||
[:input.absolute.hidden
|
||||
{:id "import-roam"
|
||||
:type "file"
|
||||
:on-change roam-import-handler}]]
|
||||
|
||||
[:label.action-input.flex.items-center.mx-2.my-2
|
||||
[:span.as-flex-center [:i (svg/logo 28)]]
|
||||
[:span.flex.flex-col
|
||||
[[:strong "EDN / JSON"]
|
||||
[:small (t :on-boarding/importing-lsq-desc)]]]
|
||||
[:input.absolute.hidden
|
||||
{:id "import-lsq"
|
||||
:type "file"
|
||||
:on-change lsq-import-handler}]]
|
||||
|
||||
[:label.action-input.flex.items-center.mx-2.my-2
|
||||
[:span.as-flex-center (ui/icon "sitemap" {:style {:fontSize "26px"}})]
|
||||
[:span.flex.flex-col
|
||||
[[:strong "OPML"]
|
||||
[:small (t :on-boarding/importing-opml-desc)]]]
|
||||
|
||||
[:input.absolute.hidden
|
||||
{:id "import-opml"
|
||||
:type "file"
|
||||
:on-change opml-import-handler}]]]
|
||||
|
||||
(when (= "picker" (:from query-params))
|
||||
[:section.e
|
||||
[:a.button {:on-click #(route-handler/redirect-to-home!)} "Skip"]])])))
|
||||
@@ -3,21 +3,15 @@
|
||||
[rum.core :as rum]
|
||||
[frontend.ui :as ui]
|
||||
[frontend.context.i18n :refer [t]]
|
||||
[frontend.components.svg :as svg]
|
||||
[frontend.components.widgets :as widgets]
|
||||
[frontend.handler.page :as page-handler]
|
||||
[frontend.handler.route :as route-handler]
|
||||
[frontend.handler.ui :as ui-handler]
|
||||
[frontend.util :as util]
|
||||
[frontend.handler.web.nfs :as nfs]
|
||||
[frontend.mobile.util :as mobile-util]
|
||||
[frontend.mobile.graph-picker :as graph-picker]
|
||||
[frontend.handler.notification :as notification]
|
||||
[frontend.handler.import :as import-handler]
|
||||
[frontend.modules.shortcut.core :as shortcut]
|
||||
[frontend.handler.user :as user-handler]
|
||||
[clojure.string :as string]
|
||||
[goog.object :as gobj]))
|
||||
[clojure.string :as string]))
|
||||
|
||||
(def DEVICE (if (util/mobile?) (t :on-boarding/section-phone) (t :on-boarding/section-computer)))
|
||||
|
||||
@@ -131,133 +125,3 @@
|
||||
[:span
|
||||
[:strong.uppercase title]
|
||||
[:small.opacity-50 label]]]))]]])))
|
||||
|
||||
(defonce *opml-imported-pages (atom nil))
|
||||
|
||||
(defn- finished-cb
|
||||
[]
|
||||
(route-handler/redirect-to-home!)
|
||||
(notification/show! "Import finished!" :success)
|
||||
(ui-handler/re-render-root!))
|
||||
|
||||
(defn- roam-import-handler
|
||||
[e]
|
||||
(let [file (first (array-seq (.-files (.-target e))))
|
||||
file-name (gobj/get file "name")]
|
||||
(if (string/ends-with? file-name ".json")
|
||||
(do
|
||||
(state/set-state! :graph/importing :roam-json)
|
||||
(let [reader (js/FileReader.)]
|
||||
(set! (.-onload reader)
|
||||
(fn [e]
|
||||
(let [text (.. e -target -result)]
|
||||
(import-handler/import-from-roam-json!
|
||||
text
|
||||
#(do
|
||||
(state/set-state! :graph/importing nil)
|
||||
(finished-cb))))))
|
||||
(.readAsText reader file)))
|
||||
(notification/show! "Please choose a JSON file."
|
||||
:error))))
|
||||
|
||||
(defn- lsq-import-handler
|
||||
[e]
|
||||
(let [file (first (array-seq (.-files (.-target e))))
|
||||
file-name (some-> (gobj/get file "name")
|
||||
(string/lower-case))
|
||||
edn? (string/ends-with? file-name ".edn")
|
||||
json? (string/ends-with? file-name ".json")]
|
||||
(if (or edn? json?)
|
||||
(do
|
||||
(state/set-state! :graph/importing :logseq)
|
||||
(let [reader (js/FileReader.)
|
||||
import-f (if edn?
|
||||
import-handler/import-from-edn!
|
||||
import-handler/import-from-json!)]
|
||||
(set! (.-onload reader)
|
||||
(fn [e]
|
||||
(let [text (.. e -target -result)]
|
||||
(import-f
|
||||
text
|
||||
#(do
|
||||
(state/set-state! :graph/importing nil)
|
||||
(finished-cb))))))
|
||||
(.readAsText reader file)))
|
||||
(notification/show! "Please choose an EDN or a JSON file."
|
||||
:error))))
|
||||
|
||||
(defn- opml-import-handler
|
||||
[e]
|
||||
(let [file (first (array-seq (.-files (.-target e))))
|
||||
file-name (gobj/get file "name")]
|
||||
(if (string/ends-with? file-name ".opml")
|
||||
(do
|
||||
(state/set-state! :graph/importing :opml)
|
||||
(let [reader (js/FileReader.)]
|
||||
(set! (.-onload reader)
|
||||
(fn [e]
|
||||
(let [text (.. e -target -result)]
|
||||
(import-handler/import-from-opml! text
|
||||
(fn [pages]
|
||||
(reset! *opml-imported-pages pages)
|
||||
(state/set-state! :graph/importing nil)
|
||||
(finished-cb))))))
|
||||
(.readAsText reader file)))
|
||||
(notification/show! "Please choose a OPML file."
|
||||
:error))))
|
||||
|
||||
(rum/defc importer < rum/reactive
|
||||
[{:keys [query-params]}]
|
||||
(if (state/sub :graph/importing)
|
||||
(let [{:keys [total current-idx current-page]} (state/sub :graph/importing-state)
|
||||
left-label [:div.flex.flex-row.font-bold
|
||||
(t :importing)
|
||||
[:div.hidden.md:flex.flex-row
|
||||
[:span.mr-1 ": "]
|
||||
[:div.text-ellipsis-wrapper {:style {:max-width 300}}
|
||||
current-page]]]
|
||||
width (js/Math.round (* (.toFixed (/ current-idx total) 2) 100))
|
||||
process (when (and total current-idx)
|
||||
(str current-idx "/" total))]
|
||||
(ui/progress-bar-with-label width left-label process))
|
||||
(setups-container
|
||||
:importer
|
||||
[:article.flex.flex-col.items-center.importer.py-16.px-8
|
||||
[:section.c.text-center
|
||||
[:h1 (t :on-boarding/importing-title)]
|
||||
[:h2 (t :on-boarding/importing-desc)]]
|
||||
[:section.d.md:flex
|
||||
[:label.action-input.flex.items-center.mx-2.my-2
|
||||
[:span.as-flex-center [:i (svg/roam-research 28)]]
|
||||
[:div.flex.flex-col
|
||||
[[:strong "RoamResearch"]
|
||||
[:small (t :on-boarding/importing-roam-desc)]]]
|
||||
[:input.absolute.hidden
|
||||
{:id "import-roam"
|
||||
:type "file"
|
||||
:on-change roam-import-handler}]]
|
||||
|
||||
[:label.action-input.flex.items-center.mx-2.my-2
|
||||
[:span.as-flex-center [:i (svg/logo 28)]]
|
||||
[:span.flex.flex-col
|
||||
[[:strong "EDN / JSON"]
|
||||
[:small (t :on-boarding/importing-lsq-desc)]]]
|
||||
[:input.absolute.hidden
|
||||
{:id "import-lsq"
|
||||
:type "file"
|
||||
:on-change lsq-import-handler}]]
|
||||
|
||||
[:label.action-input.flex.items-center.mx-2.my-2
|
||||
[:span.as-flex-center (ui/icon "sitemap" {:style {:fontSize "26px"}})]
|
||||
[:span.flex.flex-col
|
||||
[[:strong "OPML"]
|
||||
[:small (t :on-boarding/importing-opml-desc)]]]
|
||||
|
||||
[:input.absolute.hidden
|
||||
{:id "import-opml"
|
||||
:type "file"
|
||||
:on-change opml-import-handler}]]]
|
||||
|
||||
(when (= "picker" (:from query-params))
|
||||
[:section.e
|
||||
[:a.button {:on-click #(route-handler/redirect-to-home!)} "Skip"]])])))
|
||||
|
||||
@@ -401,7 +401,7 @@
|
||||
(defn export-repo-as-sqlite-db!
|
||||
[repo]
|
||||
(p/let [data (persist-db/<export-db repo {:return-data? true})
|
||||
filename (str repo ".sqlite")
|
||||
filename (file-name repo "sqlite")
|
||||
url (js/URL.createObjectURL (js/Blob. data))]
|
||||
(when-not (mobile-util/native-platform?)
|
||||
(when-let [anchor (gdom/getElement "download-as-sqlite-db")]
|
||||
|
||||
@@ -11,7 +11,8 @@
|
||||
[frontend.components.whiteboard :as whiteboard]
|
||||
[frontend.extensions.zotero :as zotero]
|
||||
[frontend.components.bug-report :as bug-report]
|
||||
[frontend.components.user.login :as login]))
|
||||
[frontend.components.user.login :as login]
|
||||
[frontend.components.import :as import]))
|
||||
|
||||
;; http://localhost:3000/#?anchor=fn.1
|
||||
(def routes
|
||||
@@ -69,7 +70,7 @@
|
||||
|
||||
["/import"
|
||||
{:name :import
|
||||
:view setups/importer}]
|
||||
:view import/importer}]
|
||||
|
||||
["/bug-report"
|
||||
{:name :bug-report
|
||||
|
||||
Reference in New Issue
Block a user