feat: db vesion support & merge #66

EINDEX · Sep 7, 2024 · cbe41e1 · cbe41e1
1 parent f8f0469
commit cbe41e1
Show file tree

Hide file tree

Showing 19 changed files with 16,872 additions and 11,753 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -16,16 +16,12 @@
     "prepare": "husky install"
   },
   "dependencies": {
-    "@chakra-ui/react": "^2.4.9",
-    "@emotion/react": "^11.11.4",
-    "@emotion/styled": "^11.11.5",
+    "@chakra-ui/react": "^2.8.2",
     "@tabler/icons-react": "^2.12.0",
     "@tailwindcss/typography": "^0.5.9",
     "@thedutchcoder/postcss-rem-to-px": "^0.0.2",
-    "chakra-react-select": "^4.6.0",
     "date-fns": "^2.29.3",
     "date-fns-tz": "^2.0.0",
-    "framer-motion": "^11.0.24",
     "liquidjs": "^10.8.4",
     "marked": "^4.3.0",
     "react": "^18.2.0",

diff --git a/src/components/LogseqBlock.tsx b/src/components/LogseqBlock.tsx
@@ -116,16 +116,26 @@ export const LogseqBlock = ({ graph, blocks }: LogseqBlockProps) => {
         <div className={styles.blockBody}>
           <ul className={styles.blockContentList}>
             {blocks.map((block) => {
-              return(
+              if (block.marker != null) {
+                return (
+                  <li className={styles.blockContentListItem}>
+                    <div className={styles.blockContentRoot} >
+                      {markerRender(block.marker)}
+                      <div className={styles.blockContent} dangerouslySetInnerHTML={{ __html: block.html }} />
+                      {toBlock(block)}
+                    </div>
+                  </li>
+                )
+              }
+              return (
                 <li className={styles.blockContentListItem}>
                   <div className={styles.blockContentRoot} >
-                    {markerRender(block.marker)}{' '}
                     <div className={styles.blockContent} dangerouslySetInnerHTML={{ __html: block.html }} />
                     {toBlock(block)}
                   </div>
                 </li>
-              )}
-            )}
+              )
+            })}
           </ul>
         </div>
       </div>

diff --git a/src/components/LogseqCopilot.tsx b/src/components/LogseqCopilot.tsx
@@ -47,7 +47,7 @@ const LogseqCopilot = ({ graph, pages, blocks }) => {
         return (
           <div className={styles.page}>
             <LogseqPageLink
-              key={page.name}
+              key={page.uuid}
               graph={graph}
               page={page}
             ></LogseqPageLink>

diff --git a/src/components/LogseqPage.tsx b/src/components/LogseqPage.tsx
@@ -24,7 +24,7 @@ const LogseqPageLink = ({
         href={`logseq://graph/${graph}?page=${page?.name}`}
       >
         <span className="tie tie-page"></span>
-        {page?.originalName?.replaceAll("/", "/ ")}
+        {page?.originalName || page?.title}
       </a>
     </>
   );

diff --git a/src/components/logseq.module.scss b/src/components/logseq.module.scss
@@ -1,5 +1,5 @@
 .pageContent {
-  @apply flex flex-col gap-2 prose-sm dark:prose-invert whitespace-pre-wrap text-sm;
+  @apply flex flex-col gap-2 prose-sm dark:prose-invert whitespace-pre-wrap text-sm grow;
 }
 
 .pageContentFooter {
@@ -19,7 +19,7 @@
 }
 
 .toBlock {
-  @apply no-underline hover:underline min-w-max;
+  @apply no-underline hover:underline min-w-fit;
 }
 
 .logseqPageLink {
@@ -30,13 +30,12 @@
   @apply grid grid-cols-3 gap-2 p-1 bg-[#8080801a] rounded-lg relative max-h-52 overflow-auto;
 }
 
-.pages::before{
+.pages::before {
   content: 📝;
   position: absolute;
   // top: 0;
 }
 
-
 :root {
   --cardShadow: color-mix(in srgb, black 30%, transparent) 0 1px 2px 0,
     color-mix(in srgb, black 15%, transparent) 0 1px 3px 1px;
@@ -68,36 +67,36 @@
 }
 
 .blockBody {
-  @apply flex flex-row flex-wrap gap-2 items-start hover:no-underline ml-3 my-1;
+  @apply flex flex-row flex-wrap gap-2 items-start hover:no-underline my-1;
 }
 
 .blockHeader {
   @apply w-full justify-between flex flex-row gap-2 border-0 border-b-[1px] border-solid border-[#6666664d] pb-1;
 }
 
-.blockContentList{
+.blockContentList {
   width: 100%;
   margin: 0 !important;
 }
 
-.blockContentListItem{
-  // @apply list-inside;
-  padding: 1px 3px;
+.blockContentListItem {
+  @apply list-outside ml-4;
+  min-height: 20px;
+  line-height: 20px;
+  // padding: 1px 3px;
   border-radius: 3px;
 }
 
-.blockContentListItem:hover{
+.blockContentListItem:hover {
   background-color: hsl(0deg 0% 40% / 30%);
 }
 
-.blockContentRoot{
-  display: flex;
-  justify-content: space-between;
-  gap: 8px;
+.blockContentRoot {
+  @apply flex flex-row justify-between gap-2 flex-wrap items-center;
 }
 
 .blockContent {
-  @apply flex flex-col items-start whitespace-pre-wrap text-sm prose-img:w-full prose-p:my-0 prose-img:my-1;
+  @apply grow flex flex-col items-start whitespace-pre-wrap text-sm prose-img:w-full prose-p:my-0 prose-img:my-1 self-start;
   * {
     @apply m-0 break-all text-sm;
   }
@@ -119,12 +118,14 @@
 }
 
 .blockMarker {
-  @apply flex flex-row h-5 justify-center items-center;
+  @apply flex flex-row justify-center items-center;
 }
 
 .blockMarkerCheckbox {
-  @apply h-4 w-4 m-0 border-none transition ease-in-out mr-1 transform hover:scale-110 duration-150 rounded-sm;
+  @apply m-0 border-none transition ease-in-out mr-1 transform hover:scale-110 duration-150 rounded-sm;
   appearance: none;
+  height: 16px;
+  width: 16px;
   background-color: var(--markerCheckerBGColor);
 }
 
@@ -134,8 +135,10 @@
 }
 
 .blockMarkerStatus {
-  @apply h-4 text-sm flex items-center self-center text-center border-none font-bold no-underline text-orange-500 hover:no-underline transform duration-300 px-0;
+  @apply flex items-center self-center text-center border-none font-bold no-underline text-orange-500 hover:no-underline transform duration-300 p-0;
   background: none;
+  font-size: 14px;
+  line-height: 16px;
 }
 .blockMarkerStatus:hover {
   color: var(--markerStatusHoverColor);

diff --git a/src/pages/background/index.ts b/src/pages/background/index.ts
@@ -1,20 +1,18 @@
 import { browser } from '@/browser';
-import LogseqClient from '../logseq/client';
 import { getLogseqCopliotConfig } from '../../config';
 import { blockRending, versionCompare } from './utils';
 import { debounce } from '@/utils';
 import { format } from 'date-fns';
 import { changeOptionsHostToHostNameAndPort } from './upgrade';
-import LogseqService from '@pages/logseq/service';
-
-const logseqClient = new LogseqClient();
-const logseqService = new LogseqService();
+import {getLogseqService} from '@pages/logseq/tool';
 
 browser.runtime.onConnect.addListener((port) => {
   port.onMessage.addListener((msg) => {
     if (msg.type === 'query') {
       const promise = new Promise(async () => {
+        const logseqService = await getLogseqService();
         const searchRes = await logseqService.search(msg.query);
+        console.debug("search result", searchRes)
         port.postMessage(searchRes);
       });
 
@@ -48,6 +46,7 @@ const changeBlockMarker = async (uuid: string, marker: string) => {
   if (!tab) {
     return;
   }
+  const logseqService = await getLogseqService();
   const result = await logseqService.changeBlockMarker(uuid, marker);
   browser.tabs.sendMessage(tab.id!, result);
 };
@@ -76,7 +75,9 @@ const quickCapture = async (data: string) => {
   const { clipNoteLocation, clipNoteCustomPage, clipNoteTemplate } =
     await getLogseqCopliotConfig();
   const now = new Date();
-  const resp = await logseqClient.getUserConfig();
+  const logseqService = await getLogseqService();
+
+  const resp = await logseqService.client.getUserConfig();
 
   const block = blockRending({
     url: activeTab.url,
@@ -88,13 +89,13 @@ const quickCapture = async (data: string) => {
   });
 
   if (clipNoteLocation === 'customPage') {
-    await logseqClient.appendBlock(clipNoteCustomPage, block);
+    await logseqService.client.appendBlock(clipNoteCustomPage, block);
   } else if (clipNoteLocation === 'currentPage') {
-    const { name: currentPage } = await logseqClient.getCurrentPage();
-    await logseqClient.appendBlock(currentPage, block);
+    const { name: currentPage } = await logseqService.client.getCurrentPage();
+    await logseqService.client.appendBlock(currentPage, block);
   } else {
     const journalPage = format(now, resp['preferredDateFormat']);
-    await logseqClient.appendBlock(journalPage, block);
+    await logseqService.client.appendBlock(journalPage, block);
   }
 
   debounceBadgeSearch(activeTab.url, activeTab.id!);
@@ -120,6 +121,7 @@ browser.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
 const badgeSearch = async (url: string | undefined, tabId: number) => {
   if (!url) return;
   const searchURL = new URL(url);
+  const logseqService = await getLogseqService();
   const searchRes = await logseqService.urlSearch(searchURL);
   const resultCount = searchRes.count ? searchRes.count!.toString() : '';
   await setExtensionBadge(resultCount, tabId);

diff --git a/src/pages/content/searchingEngines/searchingEngines.ts b/src/pages/content/searchingEngines/searchingEngines.ts
@@ -61,7 +61,7 @@ export class Ecosia extends SearchingEngine {
     const container = document.createElement('article');
     const asideElement = document.querySelector('.layout__content .web .sidebar');
     asideElement!.insertBefore(container, asideElement!.firstChild);
-    
+
     return container;
   }
 }