✨ (twitter) prepare for tweets

src/utils/twitter.ts

@@ -0,0 +1,43 @@
+// @ts-nocheck
+
+// https://github.com/rlidwka/markdown-it-regexp
+/* 
+const texte = "@[tweet](21345)";
+const regex = /@\[tweet]\((.*?)\)/;
+const resultat = regex.exec(texte)[1];
+console.log(resultat);
+*/
+
+window.twttr = (function (d, s, id) {
+  let js,
+    fjs = d.getElementsByTagName(s)[0],
+    t = window.twttr || {}
+
+  if (d.getElementById(id)) {
+    return t
+  }
+
+  js = d.createElement(s)
+  js.id = id
+  js.src = 'https://platform.twitter.com/widgets.js'
+  fjs.parentNode.insertBefore(js, fjs)
+
+  t._e = []
+  t.ready = (f) => {
+    t._e.push(f)
+  }
+
+  return t
+})(document, 'script', 'twitter-lite-note')
+
+export const createTweet = (
+  tweetId: string,
+  theme: 'light' | 'dark' = 'light'
+) => {
+  window.twttr.ready(() => {
+    window.twttr.widgets.createTweet(
+      tweetId,
+      document.getElementById(`tweet-${tweetId}`, { theme })
+    )
+  })
+}

src/views/SpacedRepetitionCard.vue

@@ -26,6 +26,7 @@ const firstCard = computed(() => {
       :repo="repo"
       :with-content="false"
     >
+      <div id="tweet-1675991484753952769"></div>
       <section v-if="isLoading">Loading...</section>
       <section v-else-if="firstCard">
         <h3 class="subtitle is-3">Level: {{ firstCard.repetition.level }}</h3>