diff --git a/src/main/frontend/components/import.cljs b/src/main/frontend/components/import.cljs
new file mode 100644
index 0000000000..9a50452135
--- /dev/null
+++ b/src/main/frontend/components/import.cljs
@@ -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"]])])))
diff --git a/src/main/frontend/components/onboarding/setups.cljs b/src/main/frontend/components/onboarding/setups.cljs
index ac3218a048..fb38574bab 100644
--- a/src/main/frontend/components/onboarding/setups.cljs
+++ b/src/main/frontend/components/onboarding/setups.cljs
@@ -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"]])])))
diff --git a/src/main/frontend/handler/export.cljs b/src/main/frontend/handler/export.cljs
index 6de07cac48..6652f9cb9c 100644
--- a/src/main/frontend/handler/export.cljs
+++ b/src/main/frontend/handler/export.cljs
@@ -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")]
diff --git a/src/main/frontend/routes.cljs b/src/main/frontend/routes.cljs
index 1f5a59f8d0..6c3ae1b16b 100644
--- a/src/main/frontend/routes.cljs
+++ b/src/main/frontend/routes.cljs
@@ -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