feat: add tabler icon extensions

deps/graph-parser/src/logseq/graph_parser.cljs

@@ -25,38 +25,36 @@
   (let [format (gp-util/get-format file)
         file-content [{:file/path file}]
         {:keys [tx ast]}
-        (if (contains? gp-config/mldoc-support-formats format)
-          (let [extract-options' (merge {:block-pattern (gp-config/get-block-pattern format)
-                                         :date-formatter "MMM do, yyyy"
-                                         :supported-formats (gp-config/supported-formats)}
-                                        extract-options
-                                        {:db @conn})
-                {:keys [pages blocks ast]
-                 :or   {pages []
-                        blocks []
-                        ast []}}
-                (cond (contains? gp-config/mldoc-support-formats format)
-                      (extract/extract file content extract-options')
+        (let [extract-options' (merge {:block-pattern (gp-config/get-block-pattern format)
+                                       :date-formatter "MMM do, yyyy"
+                                       :supported-formats (gp-config/supported-formats)}
+                                      extract-options
+                                      {:db @conn})
+              {:keys [pages blocks ast]
+               :or   {pages []
+                      blocks []
+                      ast []}}
+              (cond (contains? gp-config/mldoc-support-formats format)
+                    (extract/extract file content extract-options')
 
-                      (gp-config/whiteboard? file)
-                      (extract/extract-whiteboard-edn file content extract-options')
+                    (gp-config/whiteboard? file)
+                    (extract/extract-whiteboard-edn file content extract-options')
 
-                      :else nil)
-                delete-blocks (delete-blocks-fn (first pages) file)
-                block-ids (map (fn [block] {:block/uuid (:block/uuid block)}) blocks)
-                block-refs-ids (->> (mapcat :block/refs blocks)
-                                    (filter (fn [ref] (and (vector? ref)
-                                                           (= :block/uuid (first ref)))))
-                                    (map (fn [ref] {:block/uuid (second ref)}))
-                                    (seq))
+                    :else nil)
+              delete-blocks (delete-blocks-fn (first pages) file)
+              block-ids (map (fn [block] {:block/uuid (:block/uuid block)}) blocks)
+              block-refs-ids (->> (mapcat :block/refs blocks)
+                                  (filter (fn [ref] (and (vector? ref)
+                                                         (= :block/uuid (first ref)))))
+                                  (map (fn [ref] {:block/uuid (second ref)}))
+                                  (seq))
                    ;; To prevent "unique constraint" on datascript
-                block-ids (set/union (set block-ids) (set block-refs-ids))
-                pages (extract/with-ref-pages pages blocks)
-                pages-index (map #(select-keys % [:block/name]) pages)]
+              block-ids (set/union (set block-ids) (set block-refs-ids))
+              pages (extract/with-ref-pages pages blocks)
+              pages-index (map #(select-keys % [:block/name]) pages)]
                ;; does order matter?
-            {:tx (concat file-content pages-index delete-blocks pages block-ids blocks)
-             :ast ast})
-          {:tx file-content})
+          {:tx (concat file-content pages-index delete-blocks pages block-ids blocks)
+           :ast ast})
         tx (concat tx [(cond-> {:file/path file}
                          new?
                                ;; TODO: use file system timestamp?

deps/graph-parser/src/logseq/graph_parser/extract.cljc

@@ -215,6 +215,7 @@
    - it will only contain a single page (for now). The page properties contains 'bindings' etc
    - blocks will be adapted to tldraw shapes. All blocks's parent is the given page."
   [file content {:keys [verbose] :or {verbose true} :as options}]
+  (println "extract-whiteboard-edn Parsing start: " file)
   (let [_ (when verbose (println "Parsing start: " file))
         {:keys [pages blocks]} (gp-util/safe-read-string content)
         page-block (first pages)

deps/graph-parser/test/logseq/graph_parser_test.cljs

@@ -52,7 +52,22 @@
                                                         (reset! deleted-page page))})
           (catch :default _)))
       (is (= nil @deleted-page)
-          "Page should not be deleted when there is unexpected failure"))))
+          "Page should not be deleted when there is unexpected failure")))
+  
+  (testing "parsing whiteboard page"
+    (let [conn (ldb/start-conn)]
+      (graph-parser/parse-file conn "whiteboards/foo.edn" (pr-str foo-edn) {})
+      (is (= {:block/name "foo" :block/file {:file/path "whiteboards/foo.edn"}}
+             (let [blocks (d/q '[:find (pull ?b [* {:block/parent
+                                                    [:block/name
+                                                     {:block/file
+                                                      [:file/path]}]}])
+                                 :in $
+                                 :where [?b :block/content] [(missing? $ ?b :block/name)]]
+                               @conn)
+                   parent (:block/parent (ffirst blocks))]
+               parent))
+          "parsed block in the whiteboard page has correct parent page"))))
 
 (defn- test-property-order [num-properties]
   (let [conn (ldb/start-conn)
@@ -79,18 +94,3 @@
     (test-property-order 4))
   (testing "Sort order and persistence of 10 properties"
     (test-property-order 10)))
-
-(testing "parsing whiteboard page"
-    (let [conn (ldb/start-conn)]
-      (graph-parser/parse-file conn "/whiteboards/foo.edn" (pr-str foo-edn) {})
-      (is (= {:block/name "foo" :block/file {:file/path "/whiteboards/foo.edn"}}
-             (let [blocks (d/q '[:find (pull ?b [* {:block/parent
-                                                    [:block/name
-                                                     {:block/file
-                                                      [:file/path]}]}])
-                                 :in $
-                                 :where [?b :block/content] [(missing? $ ?b :block/name)]]
-                               @conn)
-                   parent (:block/parent (ffirst blocks))]
-               parent))
-          "parsed block in the whiteboard page has correct parent page"))))

resources/css/tabler-extension.css

@@ -0,0 +1,45 @@
+@font-face {
+  font-family: 'tabler-icons-extension';
+  src: url('../fonts/tabler-icons-extension.woff2?8ezspz') format('woff2');
+  font-style: normal;
+  font-weight: 400;
+}
+
+.tie {
+  display: inline-block;
+  font-family: 'tabler-icons-extension' !important;
+  font-style: normal !important;
+  font-weight: normal !important;
+  font-variant: normal !important;
+  text-transform: none !important;
+  speak: none;
+  line-height: 1;
+  vertical-align: -0.125em;
+  text-rendering: auto;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.tie-block::before {
+  content: '\ea01';
+}
+
+.tie-page::before {
+  content: '\ea02';
+}
+
+.tie-references-hide::before {
+  content: '\ea03';
+}
+
+.tie-references-show::before {
+  content: '\ea04';
+}
+
+.tie-whiteboard::before {
+  content: '\ea05';
+}
+
+.tie-whiteboard-element::before {
+  content: '\ea06';
+}

src/main/frontend/components/block.cljs

@@ -648,7 +648,7 @@
                   (not html-export?)
                   (not contents-page?))
          [:span.text-gray-500.bracket page-ref/left-brackets])
-       (when whiteboard? [:span.text-gray-500.ti.ti-artboard " "])
+       (when whiteboard? [:span.text-gray-500.tie.tie-whiteboard " "])
        (let [s (string/trim s)]
          (page-cp (assoc config
                          :label (mldoc/plain->text label)
@@ -2257,7 +2257,7 @@
       [:div.single-block
        {:class (str block-uuid)
         :id (str "ls-block-" blocks-container-id "-" block-uuid)}
-       (block-content-or-editor config block edit-input-id uuid 0 edit? true)])))
+       (block-content-or-editor config block edit-input-id uuid (:block/heading-level block) edit? true)])))
 
 (rum/defc single-block-cp
   [block-uuid]

src/main/frontend/components/header.css

@@ -48,7 +48,7 @@
     justify-content: center;
     opacity: .5;
 
-    .ti {
+    .ti, .tie {
       font-size: 20px;
     }
   }
@@ -107,7 +107,7 @@
   }
 
   .dropdown-wrapper {
-    .ti {
+    .ti, .tie {
       opacity: .9;
     }
   }

src/main/frontend/components/onboarding/index.css

@@ -151,7 +151,7 @@ body[data-page=import] {
                     background-position-x: center;
                   }
 
-                  > .ti {
+                  > .ti, .tie {
                     opacity: .25;
                     color: black;
                   }
@@ -447,7 +447,7 @@ body[data-page=import] {
     box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05);
     font-weight: 700;
 
-    .ti {
+    .ti, .tie {
       padding-right: 6px;
       font-size: 18px;
       position: relative;

src/main/frontend/components/onboarding/setups.cljs

@@ -109,9 +109,9 @@
 
        [:ul
         (for [[title label icon]
-              [["Graphics & Documents" "/assets" "artboard"]
+              [["Graphics & Documents" "/assets" "whiteboard"]
                ["Daily notes" "/journals" "calendar-plus"]
-               ["PAGES" "/pages" "file-text"]
+               ["PAGES" "/pages" "page"]
                []
                ["APP Internal" "/logseq" "tool"]
                ["Config File" "/logseq/config.edn"]]]

src/main/frontend/components/page.cljs

@@ -937,7 +937,7 @@
              [:a.button.whiteboard
               {:class    (util/classnames [{:active (boolean @*whiteboard?)}])
                :on-click #(reset! *whiteboard? (not @*whiteboard?))}
-              (ui/icon "artboard" {:style {:fontSize ui/icon-size}})])]
+              (ui/icon "whiteboard" {:style {:fontSize ui/icon-size}})])]
            [:div
             (ui/tippy
              {:html  [:small (str (t :page/show-journals) " ?")]

src/main/frontend/components/page.css

@@ -115,7 +115,7 @@
       margin: 0;
     }
 
-    i.ti {
+    i:is(.ti, .tie) {
       font-size: 16px;
       display: inline-block;
       position: relative;

src/main/frontend/components/plugins.css

@@ -55,7 +55,7 @@
         margin-right: 5px;
         background: transparent;
 
-        .ti {
+        .ti, .tie {
           margin-right: 3px;
         }
 
@@ -67,7 +67,7 @@
     }
 
     .control-tabs {
-      .ti {
+      .ti, .tie {
         margin-right: 4px;
       }
       .ui__dropdown-trigger {
@@ -273,7 +273,7 @@
           position: relative;
           z-index: var(--ls-z-index-level-1);
 
-          .ti {
+          .ti, .tie {
             font-size: 16px;
           }
 
@@ -322,7 +322,7 @@
                 }
               }
 
-              .ti {
+              .ti, .tie {
                 font-size: 12px;
               }
             }
@@ -799,7 +799,7 @@
         font-size: 13px;
         position: relative;
 
-        div[data-injected-ui] .ti {
+        div[data-injected-ui] :is(.ti, .tie) {
           position: relative;
           bottom: -1px;
         }

src/main/frontend/components/sidebar.cljs

@@ -82,12 +82,12 @@
                            (route-handler/redirect-to-whiteboard! name)
                            (route-handler/redirect-to-page! name {:click-from-recent? recent?})))))}
      [:span.page-icon (if whiteboard-page?
-                        [:span.ti.ti-artboard]
+                        [:span.tie.tie-whiteboard]
                         icon)]
      (pdf-assets/fix-local-asset-filename original-name)]))
 
 (defn get-page-icon [page-entity]
-  (let [default-icon (ui/icon "file-text")
+  (let [default-icon (ui/icon "page")
         from-properties (get-in (into {} page-entity) [:block/properties :icon])]
     (or
      (when (not= from-properties "") from-properties)
@@ -273,7 +273,7 @@
             :title "Whiteboards"
             :href  (rfe/href :whiteboards)
             :active (and (not srs-open?) (#{:whiteboard :whiteboards} route-name))
-            :icon  "artboard"}))]]
+            :icon  "whiteboard"}))]]
 
       (when (and left-sidebar-open? (not config/publishing?)) (favorites t))
 

src/main/frontend/components/sidebar.css

@@ -100,7 +100,7 @@
     user-select: none;
     transition: background-color .3s;
 
-    > .ti {
+    > :is(.ti, .tie) {
       font-size: 16px;
       margin-right: 8px;
       opacity: .6;
@@ -114,7 +114,7 @@
     &:hover {
       opacity: .8;
 
-      .ti {
+      .ti, .tie {
         opacity: .8;
       }
     }

src/main/frontend/components/whiteboard.cljs

@@ -110,7 +110,7 @@
     {:style {:z-index 2000}}
     [:span.inline-flex.color-level.text-xl.px-2
      {:style {:color "var(--ls-primary-text-color)"}}
-     (page/page-title name [:span.ti.ti-artboard
+     (page/page-title name [:span.tie.tie-whiteboard
                             {:style {:font-size "0.9em"}}]
                       name nil false)]
 

src/main/frontend/mobile/index.css

@@ -45,7 +45,7 @@
         width: 120%;
         
         
-        .ti {
+        .ti, .tie {
             color: var(--ls-primary-text-color);
             font-size: 23px;
             opacity: 50%;

src/main/frontend/ui.cljs

@@ -867,10 +867,19 @@
              :options               {:theme (when (= (state/sub :ui/theme) "dark") "dark")}
              :on-tweet-load-success #(reset! *loading? false)})]]))
 
+;; Extended tabler icons managed by Webfont app
+(defonce tie-names 
+  #{"block" 
+    "page" 
+    "references-hide" 
+    "references-show" 
+    "whiteboard" 
+    "whiteboard-element"})
+
 (defn icon
   ([class] (icon class nil))
   ([class opts]
-   [:i (merge {:class (str "ti ti-" class
+   [:i (merge {:class (str (if (tie-names class) "tie tie-" "ti ti-") class
                            (when (:class opts)
                              (str " " (string/trim (:class opts)))))}
               (dissoc opts :class))]))

tailwind.all.css

@@ -19,5 +19,6 @@
 @import "resources/css/tooltip.css";
 @import "resources/css/common.css";
 @import "resources/css/srs_cards.css";
+@import "resources/css/tabler-extension.css";
 @import-glob "src/main/frontend/**/[!_]*.css";
 @import "tailwindcss/utilities";

tldraw/apps/tldraw-logseq/src/styles.css

@@ -519,7 +519,7 @@
 
 .tl-logseq-portal-container {
   width: calc(100% - 2px);
-  height: 100%;
+  height: calc(100% - 2px);
   transform: translate(1px, 1px);
   overscroll-behavior: none;
   display: flex;