From 068f2ef781398e38a415599ceb2498bb776015a2 Mon Sep 17 00:00:00 2001
From: Dominik Sobe Macbook 16 <sobe.dominik@gmail.com>
Date: Sat, 12 Mar 2022 20:13:10 +0000
Subject: [PATCH 1/6] trying out

---
 dev/serve.vue               |  4 ++-
 src/blocks/sync-pointer.vue | 52 +++++++++++++++++++++++++++++++++++++
 src/components/block.vue    | 13 +++++++---
 3 files changed, 65 insertions(+), 4 deletions(-)
 create mode 100644 src/blocks/sync-pointer.vue

diff --git a/dev/serve.vue b/dev/serve.vue
index 19227b6..13e4b20 100644
--- a/dev/serve.vue
+++ b/dev/serve.vue
@@ -23,7 +23,9 @@ export default {
     // react-notion tester: 2e22de6b770e4166be301490f6ffd420
     // equation tester: 2a1d5226d68246deba627012081693f9
     // todo tester: 235057194b954a60ace89c052a65d102
-    this.blockMap = await getPageBlocks("2e22de6b770e4166be301490f6ffd420");
+    // this.blockMap = await getPageBlocks("2e22de6b770e4166be301490f6ffd420"); // Original
+    this.blockMap = await getPageBlocks("4bdce11cd93544e5b96e5b1857cea6dc"); // Sync block
+    console.log("blockMap", this.blockMap);
   },
 };
 </script>
diff --git a/src/blocks/sync-pointer.vue b/src/blocks/sync-pointer.vue
new file mode 100644
index 0000000..3a2d7a0
--- /dev/null
+++ b/src/blocks/sync-pointer.vue
@@ -0,0 +1,52 @@
+<template>
+  <div>
+    just a test {{ referencePointerId }}
+    <!-- <NotionRenderer2 name="uniquerenderer" :blockMap="testMap" /> -->
+  </div>
+</template>
+
+<script>
+import Blockable, { blockComputed } from "@/lib/blockable";
+// import NotionRenderer2 from "@/components/notion-renderer";
+export default {
+  extends: Blockable,
+  name: "NotionSyncPointer",
+  components: {
+    // NotionRenderer2,
+  },
+  computed: {
+    ...blockComputed,
+    referencePointerId() {
+      return this.format?.transclusion_reference_pointer?.id;
+    },
+    testMap() {
+      return {
+        "619b49d9-6b25-489d-88ae-8bd47545ec09": {
+          role: "reader",
+          value: {
+            id: "619b49d9-6b25-489d-88ae-8bd47545ec09",
+            version: 53,
+            type: "header",
+            properties: {
+              title: [["New origin sync block"]],
+            },
+            created_time: 1647109620000,
+            last_edited_time: 1647109620000,
+            parent_id: "4bdce11c-d935-44e5-b96e-5b1857cea6dc",
+            parent_table: "block",
+            alive: true,
+            created_by_table: "notion_user",
+            created_by_id: "f0199428-7aba-473e-86b9-eb9f78d896c6",
+            last_edited_by_table: "notion_user",
+            last_edited_by_id: "f0199428-7aba-473e-86b9-eb9f78d896c6",
+            space_id: "a61a30bd-677b-4bab-b5c8-1863fec1f096",
+          },
+        },
+      };
+    },
+  },
+};
+</script>
+
+<style>
+</style>
\ No newline at end of file
diff --git a/src/components/block.vue b/src/components/block.vue
index 8691b2b..38c2d39 100644
--- a/src/components/block.vue
+++ b/src/components/block.vue
@@ -35,9 +35,14 @@
     v-bind="pass"
   />
   <NotionTable v-else-if="isType('table')" v-bind="pass" />
+  <NotionSyncPointer
+    v-else-if="isType('transclusion_reference')"
+    v-bind="pass"
+  />
   <hr v-else-if="isType('divider')" class="notion-hr" />
   <div v-else-if="todo && visible">
     todo: {{ type }}
+
     <slot />
   </div>
   <!-- todo: maybe add message on !production if block type unsupported -->
@@ -59,11 +64,12 @@ import NotionToggle from "@/blocks/toggle";
 import NotionQuote from "@/blocks/quote";
 import NotionEquation from "@/blocks/equation";
 import NotionTodo from "@/blocks/todo";
-import NotionTable from '@/blocks/table'
+import NotionTable from "@/blocks/table";
+import NotionSyncPointer from "@/blocks/sync-pointer";
 
 export default {
   extends: Blockable,
-  name: 'NotionBlock',
+  name: "NotionBlock",
   components: {
     NotionBookmark,
     NotionCallout,
@@ -78,7 +84,8 @@ export default {
     NotionQuote,
     NotionTable,
     NotionEquation,
+    NotionSyncPointer,
     NotionTodo,
   },
-}
+};
 </script>

From bdf66bced253cb4e27f3c8cd25a537d98ec93000 Mon Sep 17 00:00:00 2001
From: Dominik Sobe Macbook 16 <sobe.dominik@gmail.com>
Date: Sat, 12 Mar 2022 21:52:08 +0000
Subject: [PATCH 2/6] fix

---
 src/blocks/sync-pointer.vue | 104 +++++++++++++++++++++++++++++++-----
 src/components/block.vue    |   3 ++
 2 files changed, 95 insertions(+), 12 deletions(-)

diff --git a/src/blocks/sync-pointer.vue b/src/blocks/sync-pointer.vue
index 3a2d7a0..854556d 100644
--- a/src/blocks/sync-pointer.vue
+++ b/src/blocks/sync-pointer.vue
@@ -1,38 +1,82 @@
 <template>
   <div>
-    just a test {{ referencePointerId }}
-    <!-- <NotionRenderer2 name="uniquerenderer" :blockMap="testMap" /> -->
+    <!-- just a test {{ referencePointerId }}<br /><br /> -->
+
+    <!-- {{ calcMap }} -->
+    <!-- <p>RENDERED DATA:</p> -->
+    <!-- {{ childMap }}
+    <h4>test</h4>
+    {{ blockMap }} -->
+    <NotionRenderer :blockMap="childMap" />
   </div>
 </template>
 
 <script>
 import Blockable, { blockComputed } from "@/lib/blockable";
-// import NotionRenderer2 from "@/components/notion-renderer";
+
+// import NotionBlock from "@/components/block";
+// import { defaultMapImageUrl, defaultMapPageUrl } from "@/lib/utils";
+// import NotionRenderer from "@/components/notion-renderer";
 export default {
   extends: Blockable,
   name: "NotionSyncPointer",
   components: {
+    // NotionBlock,
     // NotionRenderer2,
+    NotionRenderer: () => import("../components/notion-renderer.vue"),
   },
   computed: {
     ...blockComputed,
     referencePointerId() {
       return this.format?.transclusion_reference_pointer?.id;
     },
+
+    calcMap() {
+      //   return this.blockMap[this.referencePointerId]?.value;
+      return {
+        [this.referencePointerId]: {
+          role: "reader",
+          value: this.blockMap[this.referencePointerId]?.value,
+        },
+      };
+    },
+    transclusionChildIds() {
+      return this.blockMap[this.referencePointerId]?.value?.content;
+    },
+    childMap() {
+      return this.transclusionChildIds
+        .map((id) => {
+          return {
+            [id]: this.blockMap[id],
+          };
+        })
+        .reduce(function (result, item) {
+          var key = Object.keys(item)[0]; //first property: a, b, c
+          result[key] = item[key];
+          return result;
+        }, {});
+    },
+    // childMap() {
+    //   return this.transclusionChildIds.map((id) => id);
+    // },
     testMap() {
       return {
-        "619b49d9-6b25-489d-88ae-8bd47545ec09": {
+        "661a6380-e23d-4fd6-ac5c-197aeadfaafe": {
           role: "reader",
           value: {
-            id: "619b49d9-6b25-489d-88ae-8bd47545ec09",
-            version: 53,
-            type: "header",
+            id: "661a6380-e23d-4fd6-ac5c-197aeadfaafe",
+            version: 49,
+            type: "text",
             properties: {
-              title: [["New origin sync block"]],
+              title: [
+                ["This is a synced block from another "],
+                ["page", [["b"], ["c"]]],
+                ["."],
+              ],
             },
-            created_time: 1647109620000,
-            last_edited_time: 1647109620000,
-            parent_id: "4bdce11c-d935-44e5-b96e-5b1857cea6dc",
+            created_time: 1647108420000,
+            last_edited_time: 1647108660000,
+            parent_id: "61a98ab5-4f1f-4fb9-aef4-340acfcd1759",
             parent_table: "block",
             alive: true,
             created_by_table: "notion_user",
@@ -42,11 +86,47 @@ export default {
             space_id: "a61a30bd-677b-4bab-b5c8-1863fec1f096",
           },
         },
+
+        // "619b49d9-6b25-489d-88ae-8bd47545ec09": {
+        //   role: "reader",
+        //   value: {
+        //     id: "619b49d9-6b25-489d-88ae-8bd47545ec09",
+        //     version: 53,
+        //     type: "header",
+        //     properties: {
+        //       title: [["New origin sync block"]],
+        //     },
+        //     created_time: 1647109620000,
+        //     last_edited_time: 1647109620000,
+        //     parent_id: "4bdce11c-d935-44e5-b96e-5b1857cea6dc",
+        //     parent_table: "block",
+        //     alive: true,
+        //     created_by_table: "notion_user",
+        //     created_by_id: "f0199428-7aba-473e-86b9-eb9f78d896c6",
+        //     last_edited_by_table: "notion_user",
+        //     last_edited_by_id: "f0199428-7aba-473e-86b9-eb9f78d896c6",
+        //     space_id: "a61a30bd-677b-4bab-b5c8-1863fec1f096",
+        //   },
+        // },
       };
     },
   },
+  //   props: {
+  //     blockMap: [Object],
+  //     contentId: String,
+  //     fullPage: { type: Boolean, default: false },
+  //     hideList: { type: Array, default: () => [] },
+  //     level: { type: Number, default: 0 },
+  //     mapImageUrl: { type: Function, default: defaultMapImageUrl },
+  //     mapPageUrl: { type: Function, default: defaultMapPageUrl },
+  //     pageLinkOptions: Object,
+  //     prism: { type: Boolean, default: false },
+  //     todo: { type: Boolean, default: false },
+  //   },
 };
 </script>
 
 <style>
-</style>
\ No newline at end of file
+</style>
+
+
diff --git a/src/components/block.vue b/src/components/block.vue
index 38c2d39..a8db6bb 100644
--- a/src/components/block.vue
+++ b/src/components/block.vue
@@ -39,6 +39,9 @@
     v-else-if="isType('transclusion_reference')"
     v-bind="pass"
   />
+  <div v-else-if="isType('transclusion_container')" class="notion-sync-block">
+    <slot />
+  </div>
   <hr v-else-if="isType('divider')" class="notion-hr" />
   <div v-else-if="todo && visible">
     todo: {{ type }}

From 854da229e767e55a8f82dc713e40badbe498b9df Mon Sep 17 00:00:00 2001
From: Dominik Sobe Macbook 16 <sobe.dominik@gmail.com>
Date: Thu, 31 Mar 2022 19:06:29 +0100
Subject: [PATCH 3/6] add sync-block functionality

---
 dev/serve.js                |   1 +
 src/blocks/sync-pointer.vue | 111 +-----------------------------------
 2 files changed, 2 insertions(+), 110 deletions(-)

diff --git a/dev/serve.js b/dev/serve.js
index dc15f37..f76d93b 100644
--- a/dev/serve.js
+++ b/dev/serve.js
@@ -2,6 +2,7 @@ import Vue from "vue";
 import Dev from "./serve.vue";
 
 import VueKatex from "vue-katex";
+import { NotionRenderer } from "../src/components";
 
 Vue.use(VueKatex);
 
diff --git a/src/blocks/sync-pointer.vue b/src/blocks/sync-pointer.vue
index 854556d..4584aa8 100644
--- a/src/blocks/sync-pointer.vue
+++ b/src/blocks/sync-pointer.vue
@@ -1,28 +1,14 @@
 <template>
-  <div>
-    <!-- just a test {{ referencePointerId }}<br /><br /> -->
-
-    <!-- {{ calcMap }} -->
-    <!-- <p>RENDERED DATA:</p> -->
-    <!-- {{ childMap }}
-    <h4>test</h4>
-    {{ blockMap }} -->
-    <NotionRenderer :blockMap="childMap" />
-  </div>
+  <NotionRenderer :blockMap="blockMap" :contentId="referencePointerId" />
 </template>
 
 <script>
 import Blockable, { blockComputed } from "@/lib/blockable";
 
-// import NotionBlock from "@/components/block";
-// import { defaultMapImageUrl, defaultMapPageUrl } from "@/lib/utils";
-// import NotionRenderer from "@/components/notion-renderer";
 export default {
   extends: Blockable,
   name: "NotionSyncPointer",
   components: {
-    // NotionBlock,
-    // NotionRenderer2,
     NotionRenderer: () => import("../components/notion-renderer.vue"),
   },
   computed: {
@@ -30,103 +16,8 @@ export default {
     referencePointerId() {
       return this.format?.transclusion_reference_pointer?.id;
     },
-
-    calcMap() {
-      //   return this.blockMap[this.referencePointerId]?.value;
-      return {
-        [this.referencePointerId]: {
-          role: "reader",
-          value: this.blockMap[this.referencePointerId]?.value,
-        },
-      };
-    },
-    transclusionChildIds() {
-      return this.blockMap[this.referencePointerId]?.value?.content;
-    },
-    childMap() {
-      return this.transclusionChildIds
-        .map((id) => {
-          return {
-            [id]: this.blockMap[id],
-          };
-        })
-        .reduce(function (result, item) {
-          var key = Object.keys(item)[0]; //first property: a, b, c
-          result[key] = item[key];
-          return result;
-        }, {});
-    },
-    // childMap() {
-    //   return this.transclusionChildIds.map((id) => id);
-    // },
-    testMap() {
-      return {
-        "661a6380-e23d-4fd6-ac5c-197aeadfaafe": {
-          role: "reader",
-          value: {
-            id: "661a6380-e23d-4fd6-ac5c-197aeadfaafe",
-            version: 49,
-            type: "text",
-            properties: {
-              title: [
-                ["This is a synced block from another "],
-                ["page", [["b"], ["c"]]],
-                ["."],
-              ],
-            },
-            created_time: 1647108420000,
-            last_edited_time: 1647108660000,
-            parent_id: "61a98ab5-4f1f-4fb9-aef4-340acfcd1759",
-            parent_table: "block",
-            alive: true,
-            created_by_table: "notion_user",
-            created_by_id: "f0199428-7aba-473e-86b9-eb9f78d896c6",
-            last_edited_by_table: "notion_user",
-            last_edited_by_id: "f0199428-7aba-473e-86b9-eb9f78d896c6",
-            space_id: "a61a30bd-677b-4bab-b5c8-1863fec1f096",
-          },
-        },
-
-        // "619b49d9-6b25-489d-88ae-8bd47545ec09": {
-        //   role: "reader",
-        //   value: {
-        //     id: "619b49d9-6b25-489d-88ae-8bd47545ec09",
-        //     version: 53,
-        //     type: "header",
-        //     properties: {
-        //       title: [["New origin sync block"]],
-        //     },
-        //     created_time: 1647109620000,
-        //     last_edited_time: 1647109620000,
-        //     parent_id: "4bdce11c-d935-44e5-b96e-5b1857cea6dc",
-        //     parent_table: "block",
-        //     alive: true,
-        //     created_by_table: "notion_user",
-        //     created_by_id: "f0199428-7aba-473e-86b9-eb9f78d896c6",
-        //     last_edited_by_table: "notion_user",
-        //     last_edited_by_id: "f0199428-7aba-473e-86b9-eb9f78d896c6",
-        //     space_id: "a61a30bd-677b-4bab-b5c8-1863fec1f096",
-        //   },
-        // },
-      };
-    },
   },
-  //   props: {
-  //     blockMap: [Object],
-  //     contentId: String,
-  //     fullPage: { type: Boolean, default: false },
-  //     hideList: { type: Array, default: () => [] },
-  //     level: { type: Number, default: 0 },
-  //     mapImageUrl: { type: Function, default: defaultMapImageUrl },
-  //     mapPageUrl: { type: Function, default: defaultMapPageUrl },
-  //     pageLinkOptions: Object,
-  //     prism: { type: Boolean, default: false },
-  //     todo: { type: Boolean, default: false },
-  //   },
 };
 </script>
 
-<style>
-</style>
-
 

From ba73d11efde41cd4cc765252a432c0801996b6b9 Mon Sep 17 00:00:00 2001
From: janniks <janniks@users.noreply.github.com>
Date: Thu, 31 Mar 2022 20:21:40 +0200
Subject: [PATCH 4/6] cleanup

---
 dev/serve.js                |  5 +++--
 dev/serve.vue               |  4 +---
 src/blocks/sync-pointer.vue | 11 +++++------
 3 files changed, 9 insertions(+), 11 deletions(-)

diff --git a/dev/serve.js b/dev/serve.js
index f76d93b..28101c3 100644
--- a/dev/serve.js
+++ b/dev/serve.js
@@ -2,12 +2,13 @@ import Vue from "vue";
 import Dev from "./serve.vue";
 
 import VueKatex from "vue-katex";
-import { NotionRenderer } from "../src/components";
+import { NotionRenderer } from "@/entry";
 
 Vue.use(VueKatex);
+Vue.component("NotionRenderer", NotionRenderer);
 
 Vue.config.productionTip = false;
 
 new Vue({
-  render: (h) => h(Dev),
+  render: h => h(Dev)
 }).$mount("#app");
diff --git a/dev/serve.vue b/dev/serve.vue
index 13e4b20..732abee 100644
--- a/dev/serve.vue
+++ b/dev/serve.vue
@@ -23,9 +23,7 @@ export default {
     // react-notion tester: 2e22de6b770e4166be301490f6ffd420
     // equation tester: 2a1d5226d68246deba627012081693f9
     // todo tester: 235057194b954a60ace89c052a65d102
-    // this.blockMap = await getPageBlocks("2e22de6b770e4166be301490f6ffd420"); // Original
-    this.blockMap = await getPageBlocks("4bdce11cd93544e5b96e5b1857cea6dc"); // Sync block
-    console.log("blockMap", this.blockMap);
+    this.blockMap = await getPageBlocks("4bdce11cd93544e5b96e5b1857cea6dc");
   },
 };
 </script>
diff --git a/src/blocks/sync-pointer.vue b/src/blocks/sync-pointer.vue
index 4584aa8..7121ae6 100644
--- a/src/blocks/sync-pointer.vue
+++ b/src/blocks/sync-pointer.vue
@@ -1,5 +1,9 @@
 <template>
-  <NotionRenderer :blockMap="blockMap" :contentId="referencePointerId" />
+  <NotionRenderer
+    v-bind="pass"
+    :blockMap="blockMap"
+    :contentId="referencePointerId"
+  />
 </template>
 
 <script>
@@ -8,9 +12,6 @@ import Blockable, { blockComputed } from "@/lib/blockable";
 export default {
   extends: Blockable,
   name: "NotionSyncPointer",
-  components: {
-    NotionRenderer: () => import("../components/notion-renderer.vue"),
-  },
   computed: {
     ...blockComputed,
     referencePointerId() {
@@ -19,5 +20,3 @@ export default {
   },
 };
 </script>
-
-

From 7bf49f58847508422b352df8a0852ac3e4c8c6ed Mon Sep 17 00:00:00 2001
From: janniks <janniks@users.noreply.github.com>
Date: Thu, 31 Mar 2022 20:29:37 +0200
Subject: [PATCH 5/6] fix imports

---
 src/components/block.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/components/block.vue b/src/components/block.vue
index 05140ee..78e11a2 100644
--- a/src/components/block.vue
+++ b/src/components/block.vue
@@ -70,12 +70,11 @@ import NotionHeader from "@/blocks/header";
 import NotionList from "@/blocks/list";
 import NotionPage from "@/blocks/page";
 import NotionQuote from "@/blocks/quote";
+import NotionSyncPointer from "@/blocks/sync-pointer";
 import NotionTable from "@/blocks/table";
 import NotionTableRow from "@/blocks/table-row";
 import NotionText from "@/blocks/text";
 import NotionTodo from "@/blocks/todo";
-import NotionTable from "@/blocks/table";
-import NotionSyncPointer from "@/blocks/sync-pointer";
 import NotionToggle from "@/blocks/toggle";
 
 export default {

From 0ab073b9cf1bc0cf05cb3543040d5fdb02e71be8 Mon Sep 17 00:00:00 2001
From: janniks <janniks@users.noreply.github.com>
Date: Thu, 31 Mar 2022 20:42:27 +0200
Subject: [PATCH 6/6] cleanup

---
 dev/serve.vue               |  1 +
 src/blocks/sync-pointer.vue |  2 +-
 src/components/block.vue    | 17 ++++++++++++++---
 3 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/dev/serve.vue b/dev/serve.vue
index 1f902ff..405c067 100644
--- a/dev/serve.vue
+++ b/dev/serve.vue
@@ -22,6 +22,7 @@ export default {
   async created() {
     // react-notion tester: 2e22de6b770e4166be301490f6ffd420
     // equation tester: 2a1d5226d68246deba627012081693f9
+    // sync tester: c10e1556bec44f23a20f71497b3d98c4
     // table tester: bd1de400a8b349dc824f4f00e61d0797
     // todo tester: 235057194b954a60ace89c052a65d102
     this.blockMap = await getPageBlocks("2e22de6b770e4166be301490f6ffd420");
diff --git a/src/blocks/sync-pointer.vue b/src/blocks/sync-pointer.vue
index 7121ae6..ff78c37 100644
--- a/src/blocks/sync-pointer.vue
+++ b/src/blocks/sync-pointer.vue
@@ -7,7 +7,7 @@
 </template>
 
 <script>
-import Blockable, { blockComputed } from "@/lib/blockable";
+import { Blockable, blockComputed } from "@/lib/blockable";
 
 export default {
   extends: Blockable,
diff --git a/src/components/block.vue b/src/components/block.vue
index 78e11a2..e8958c5 100644
--- a/src/components/block.vue
+++ b/src/components/block.vue
@@ -41,10 +41,13 @@
   />
   <NotionTable v-else-if="isType('table')" v-bind="pass"><slot /></NotionTable>
   <NotionSyncPointer
-    v-else-if="isType('transclusion_reference')"
+    v-else-if="isRendererRegistered && isType('transclusion_reference')"
     v-bind="pass"
   />
-  <div v-else-if="isType('transclusion_container')" class="notion-sync-block">
+  <div
+    v-else-if="isRendererRegistered && isType('transclusion_container')"
+    class="notion-sync-block"
+  >
     <slot />
   </div>
   <NotionTableRow v-else-if="isType('table_row')" v-bind="pass" />
@@ -58,7 +61,9 @@
 </template>
 
 <script>
-import { Blockable } from "@/lib/blockable";
+import Vue from "vue";
+
+import { Blockable, blockComputed } from "@/lib/blockable";
 
 import NotionBookmark from "@/blocks/bookmark";
 import NotionCallout from "@/blocks/callout";
@@ -99,5 +104,11 @@ export default {
     NotionTodo,
     NotionToggle,
   },
+  computed: {
+    ...blockComputed,
+    isRendererRegistered() {
+      return "NotionRenderer" in Vue?.options?.components;
+    },
+  },
 };
 </script>