From f963c48e7587fd2faad6e8650581dbaec7032b78 Mon Sep 17 00:00:00 2001
From: Julio Ruiz <julio.ruiz@fusionary.com>
Date: Sun, 24 May 2026 06:04:50 -0500
Subject: [PATCH 1/4] Added base64 encoding / decoding code

---
 app/utils/textUtilities.ts | 51 ++++++++++++++++++++++++++++++++++++--
 1 file changed, 49 insertions(+), 2 deletions(-)

diff --git a/app/utils/textUtilities.ts b/app/utils/textUtilities.ts
index d3ae1a2..a246a60 100644
--- a/app/utils/textUtilities.ts
+++ b/app/utils/textUtilities.ts
@@ -1,5 +1,5 @@
 /* Copy to Clipboard */
-export async function copyToClipboard(textToCopy: string, type: string) {
+export async function copyToClipboard(textToCopy: string, type: string, id: string) {
   const toast = useToast()
 
   try {
@@ -13,4 +13,51 @@ export async function copyToClipboard(textToCopy: string, type: string) {
   } catch (err) {
     console.error('Failed to copy: ', err)
   }
-}
\ No newline at end of file
+}
+
+/* Function to copy url with search parameters into clipboard */
+export function copyParagraphToUrl(id: string) {
+  console.log('Encoding id', id)
+
+  const highlights = {
+    highlights: [
+      {
+        id: id,
+        color: '#f90'
+      }
+    ]
+  }
+
+  const blob = encodeObjectToBase64Url(highlights)
+
+  console.log('Encoded highlights', blob)
+
+  console.log('Decoded highlights object', base64UrlDecode(blob))
+}
+
+/* Encode JS object to base64Url compatible string */
+function encodeObjectToBase64Url(obj: object) {
+  // 1. Convert object to JSON string
+  const jsonString = JSON.stringify(obj)
+
+  // 2. Base64 encode the JSON string
+  const base64 = btoa(jsonString)
+
+  // 3. Make it URL-safe and remove padding
+  return base64
+    .replace(/\+/g, '-')
+    .replace(/\//g, '_')
+    .replace(/=+$/, '')
+}
+
+/* Decode base64URL String to json object */
+function base64UrlDecode(base64Url: string) {
+  // Replace URL-safe characters and add padding
+  let base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/');
+  while (base64.length % 4 !== 0) {
+    base64 += '='
+  }
+  return decodeURIComponent(atob(base64).split('').map(function (c) {
+    return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2)
+  }).join(''))
+}

From 09b99985ebe47aae7f5a869da3309bfc9325a57d Mon Sep 17 00:00:00 2001
From: Julio Ruiz <julio.ruiz@fusionary.com>
Date: Mon, 25 May 2026 18:41:45 -0500
Subject: [PATCH 2/4] Adding basic hover toolbar for all paragraphs

---
 .../EstudiosTypensenseDetail.vue              | 51 +++++++++++++++----
 1 file changed, 42 insertions(+), 9 deletions(-)

diff --git a/app/components/estudiosTypensense/EstudiosTypensenseDetail.vue b/app/components/estudiosTypensense/EstudiosTypensenseDetail.vue
index 98f52bc..dbc0832 100644
--- a/app/components/estudiosTypensense/EstudiosTypensenseDetail.vue
+++ b/app/components/estudiosTypensense/EstudiosTypensenseDetail.vue
@@ -843,15 +843,48 @@ function highlightTextNodes(root: HTMLElement, terms: string[]): number {
           <div v-for="(hit, idx) in paragraphs" :key="idx" :data-paragraph-number="hit.document.number">
             <div class="grid grid-cols-1fr items-start gap-2 mb-2" :class="(showParagraphNumbers && 'grid-cols-[32px_1fr]')">
               <div v-if="showParagraphNumbers" class="w-full select-none cursor-pointer flex justify-end">
-                <UBadge
-                  v-if="hit.document.number"
-                  :label="`${hit.document.number}`"
-                  size="md"
-                  variant="ghost"
-                  @click="copyToClipboard(hit.document.text, hit.document.type)"
-                  class="text-gray-300 hover:text-white"
-                  :class="(hit.document.type=='activities'?'hover:bg-carpagreen':'hover:bg-carpablue')"
-                />
+                <UPopover :content="{
+                    align: 'right',
+                    side: 'top',
+                    sideOffset: -10
+                  }" placement="top" :ui="{ maxWidth: 'max-w-lg' }">
+                  <UBadge
+                    v-if="hit.document.number"
+                    :label="`${hit.document.number}`"
+                    size="md"
+                    variant="ghost"
+                    class="text-gray-300 hover:text-white"
+                    :class="(hit.document.type=='activities'?'hover:bg-carpagreen':'hover:bg-carpablue')"
+                  />
+                  <template #content>
+                    <UFieldGroup size="sm" orientation="horizontal" class="bg-white p-0 rounded-md shadow-md">
+                      <UButton
+                        v-if="hit.document.text"
+                        icon="ph-note-pencil"
+                        variant="ghost"
+                        color="neutral"
+                        size="lg"
+                        @click="addNote(hit.document.id)"
+                      ></UButton>
+                      <UButton
+                        v-if="hit.document.text"
+                        icon="ph-highlighter"
+                        variant="ghost"
+                        color="neutral"
+                        size="lg"
+                        @click="highlightParagraph(hit.document.id)"
+                      ></UButton>
+                      <UButton
+                        v-if="hit.document.text"
+                        icon="ph-copy"
+                        variant="ghost"
+                        color="neutral"
+                        size="lg"
+                        @click="copyToClipboard(hit.document.text, hit.document.type)"
+                      ></UButton>
+                    </UFieldGroup>
+                  </template>
+                </UPopover>
               </div>
               <div class="">
                 <div

From 995111612cc5c424cc0d70deb0d9fef1da2c8b28 Mon Sep 17 00:00:00 2001
From: Julio Ruiz <julio.ruiz@fusionary.com>
Date: Mon, 25 May 2026 21:12:42 -0500
Subject: [PATCH 3/4] Fixed copy functionality

---
 .../EstudiosTypensenseDetail.vue              | 45 ++++++++++++-------
 app/utils/textUtilities.ts                    | 24 ++++++++--
 2 files changed, 50 insertions(+), 19 deletions(-)

diff --git a/app/components/estudiosTypensense/EstudiosTypensenseDetail.vue b/app/components/estudiosTypensense/EstudiosTypensenseDetail.vue
index dbc0832..090a04d 100644
--- a/app/components/estudiosTypensense/EstudiosTypensenseDetail.vue
+++ b/app/components/estudiosTypensense/EstudiosTypensenseDetail.vue
@@ -858,22 +858,35 @@ function highlightTextNodes(root: HTMLElement, terms: string[]): number {
                   />
                   <template #content>
                     <UFieldGroup size="sm" orientation="horizontal" class="bg-white p-0 rounded-md shadow-md">
-                      <UButton
-                        v-if="hit.document.text"
-                        icon="ph-note-pencil"
-                        variant="ghost"
-                        color="neutral"
-                        size="lg"
-                        @click="addNote(hit.document.id)"
-                      ></UButton>
-                      <UButton
-                        v-if="hit.document.text"
-                        icon="ph-highlighter"
-                        variant="ghost"
-                        color="neutral"
-                        size="lg"
-                        @click="highlightParagraph(hit.document.id)"
-                      ></UButton>
+                      <UPopover>
+                        <UButton
+                          v-if="hit.document.text"
+                          icon="ph-note-pencil"
+                          variant="ghost"
+                          color="neutral"
+                          size="lg"
+                          @click="addNote(hit.document.id)"
+                        ></UButton>
+
+                        <template #content>
+                          <UEditor />
+                        </template>
+                      </UPopover>
+
+                      <UPopover>
+                        <UButton
+                          v-if="hit.document.text"
+                          icon="ph-highlighter"
+                          variant="ghost"
+                          color="neutral"
+                          size="lg"
+                          @click="highlightParagraph(hit.document.id)"
+                        ></UButton>
+
+                        <template #content>
+                          <UColorPicker />
+                        </template>
+                      </UPopover>
                       <UButton
                         v-if="hit.document.text"
                         icon="ph-copy"
diff --git a/app/utils/textUtilities.ts b/app/utils/textUtilities.ts
index a246a60..61d8624 100644
--- a/app/utils/textUtilities.ts
+++ b/app/utils/textUtilities.ts
@@ -1,12 +1,30 @@
 /* Copy to Clipboard */
-export async function copyToClipboard(textToCopy: string, type: string, id: string) {
+export async function copyToClipboard() {
   const toast = useToast()
 
+  const selection = window.getSelection()
+
+  const container = document.createElement('div')
+  const range = selection?.getRangeAt(0)
+  container.appendChild(range.cloneContents())
+
+  const htmlOutput = container.innerHTML
+  const textOutput = selection?.toString()
+
   try {
-    await navigator.clipboard.writeText(textToCopy)
+    // Modern Clipboard API requires ClipboardItem
+    const clipboardItem = new ClipboardItem({
+      'text/html': new Blob([htmlOutput], { type: 'text/html' }),
+      'text/plain': new Blob([textOutput], { type: 'text/plain' })
+    })
+
+    await navigator.clipboard.write([clipboardItem])
+
+    window.getSelection()?.removeAllRanges()
+
     toast.add({
       title: 'Texto copiado!',
-      description: `${textToCopy}`,
+      description: `${textOutput}`,
       icon: 'ph-clipboard-text',
       color: type == 'activities' ? 'success' : 'info'
     })

From 572cf9031c379cdc9c81c5e2f111cc2de53d762c Mon Sep 17 00:00:00 2001
From: Julio Ruiz <julio.ruiz@fusionary.com>
Date: Mon, 25 May 2026 21:16:09 -0500
Subject: [PATCH 4/4] Removing copy bug

---
 app/utils/textUtilities.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/utils/textUtilities.ts b/app/utils/textUtilities.ts
index 61d8624..d84917a 100644
--- a/app/utils/textUtilities.ts
+++ b/app/utils/textUtilities.ts
@@ -26,7 +26,7 @@ export async function copyToClipboard() {
       title: 'Texto copiado!',
       description: `${textOutput}`,
       icon: 'ph-clipboard-text',
-      color: type == 'activities' ? 'success' : 'info'
+      color: 'success'
     })
   } catch (err) {
     console.error('Failed to copy: ', err)