0.24.11

Improved

- New Translation: `es` (Spanish) by @zeedif (Thank you so much)!
- Now all of messages can be selectable and copyable, also on the iPhone, iPad, and Android devices. Now we can copy or share the messages easily.

New Feature

- Peer-to-Peer Synchronisation has been implemented!

Fixed

- No longer memory or resource leaks when the plug-in is disabled.
- Now deleted chunks are correctly detected on conflict resolution, and we are guided to resurrect them.
- Hanging issue during the initial synchronisation has been fixed.
- Some unnecessary logs have been removed.
- Now all modal dialogues are correctly closed when the plug-in is disabled.

Refactor

- Several interfaces have been moved to the separated library.
- Translations have been moved to each language file, and during the build, they are merged into one file.
- Non-mobile friendly code has been removed and replaced with the safer code.
- Started writing Platform impedance-matching-layer.
- Svelte has been updated to v5.
- Some function have got more robust type definitions.
- Terser optimisation has slightly improved.
- During the build, analysis meta-file of the bundled codes will be generated.

src/modules/features/Log/LogPane.svelte

@@ -6,10 +6,16 @@
   import { $msg as msg, currentLang as lang } from "../../../lib/src/common/i18n.ts";
 
   let unsubscribe: () => void;
-  let messages = [] as string[];
-  let wrapRight = false;
-  let autoScroll = true;
-  let suspended = false;
+    let messages = $state([] as string[]);
+    let wrapRight = $state(false);
+    let autoScroll = $state(true);
+    let suspended = $state(false);
+
+    type Props = {
+        close: () => void;
+    };
+    let { close }: Props = $props();
+    // export let close: () => void;
   function updateLog(logs: ReactiveInstance<string[]>) {
       const e = logs.value;
       if (!suspended) {
@@ -29,6 +35,9 @@
       if (unsubscribe) unsubscribe();
   });
   let scroll: HTMLDivElement;
+    function closeDialogue() {
+        close();
+    }
 </script>
 
 <div class="logpane">
@@ -47,6 +56,8 @@
               <input type="checkbox" bind:checked={suspended} />
               <span>{msg("logPane.pause", {}, lang)}</span>
           </label>
+            <span class="spacer"></span>
+            <button onclick={() => closeDialogue()}>Close</button>
       </div>
   </div>
   <div class="log" bind:this={scroll}>
@@ -68,6 +79,7 @@
   .log {
       overflow-y: scroll;
       user-select: text;
+        -webkit-user-select: text;
       padding-bottom: 2em;
   }
   .log > pre {

src/modules/features/Log/LogPaneView.ts

@@ -1,15 +1,27 @@
-import { ItemView, WorkspaceLeaf } from "obsidian";
+import { WorkspaceLeaf } from "obsidian";
 import LogPaneComponent from "./LogPane.svelte";
 import type ObsidianLiveSyncPlugin from "../../../main.ts";
+import { SvelteItemView } from "../../../common/SvelteItemView.ts";
 import { $msg } from "src/lib/src/common/i18n.ts";
+import { mount } from "svelte";
 export const VIEW_TYPE_LOG = "log-log";
 //Log view
-export class LogPaneView extends ItemView {
-    component?: LogPaneComponent;
+export class LogPaneView extends SvelteItemView {
+    instantiateComponent(target: HTMLElement) {
+        return mount(LogPaneComponent, {
+            target: target,
+            props: {
+                close: () => {
+                    this.leaf.detach();
+                },
+            },
+        });
+    }
+
     plugin: ObsidianLiveSyncPlugin;
     icon = "view-log";
     title: string = "";
-    navigation = true;
+    navigation = false;
 
     getIcon(): string {
         return "view-log";
@@ -28,17 +40,4 @@ export class LogPaneView extends ItemView {
         // TODO: This function is not reactive and does not update the title based on the current language
         return $msg("logPane.title");
     }
-
-    async onOpen() {
-        this.component = new LogPaneComponent({
-            target: this.contentEl,
-            props: {},
-        });
-        await Promise.resolve();
-    }
-
-    async onClose() {
-        this.component?.$destroy();
-        await Promise.resolve();
-    }
 }