feat: add an export feature (#47)

thepersonalaicompany · Dec 22, 2024 · fe761db · fe761db
1 parent 58e48c4
commit fe761db
Show file tree

Hide file tree

Showing 3 changed files with 168 additions and 6 deletions.
diff --git a/extension/sidepanels/sidepanel.css b/extension/sidepanels/sidepanel.css
@@ -719,4 +719,65 @@ h2 {
   line-height: 1.5;
 }
 
+.dropdown {
+  position: relative;
+  flex: 1;
+}
+
+.dropdown-arrow {
+  margin-left: 4px;
+  transition: transform 0.2s;
+}
+
+.dropdown.active .dropdown-arrow {
+  transform: rotate(180deg);
+}
+
+.dropdown-menu {
+  position: absolute;
+  top: calc(100% + 4px);
+  left: 0;
+  right: 0;
+  background: #18181B;
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 8px;
+  padding: 4px;
+  display: none;
+  z-index: 100;
+}
+
+.dropdown.active .dropdown-menu {
+  display: block;
+}
+
+.dropdown-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  width: 100%;
+  padding: 8px 12px;
+  background: none;
+  border: none;
+  color: rgba(255, 255, 255, 0.9);
+  font-size: 14px;
+  cursor: pointer;
+  border-radius: 4px;
+  transition: all 0.2s;
+}
+
+.dropdown-item:hover {
+  background: rgba(255, 255, 255, 0.05);
+}
+
+.dropdown-item svg {
+  flex-shrink: 0;
+}
+
+#export-button {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
 
diff --git a/extension/sidepanels/sidepanel.html b/extension/sidepanels/sidepanel.html
@@ -101,12 +101,31 @@ <h2>Amurex</h2>
             <span>Copy All</span>
           </button>
 
-          <button id="download-transcript" class="action-btn purple">
-            <svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-              <path d="M21 15V16C21 18.2091 19.2091 20 17 20H7C4.79086 20 3 18.2091 3 16V15M12 3V16M12 16L16 11M12 16L8 11" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
-            </svg>
-            <span>Export</span>
-          </button>
+          <div class="dropdown">
+            <button id="export-button" class="action-btn purple">
+              <svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                <path d="M21 15V16C21 18.2091 19.2091 20 17 20H7C4.79086 20 3 18.2091 3 16V15M12 3V16M12 16L16 11M12 16L8 11" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+              </svg>
+              <span>Export</span>
+              <svg class="dropdown-arrow" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor">
+                <path d="M6 9L12 15L18 9" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+              </svg>
+            </button>
+            <div class="dropdown-menu">
+              <button id="download-transcript" class="dropdown-item">
+                <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor">
+                  <path d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                </svg>
+                <span>Save transcript</span>
+              </button>
+              <button id="share-to-apps" class="dropdown-item">
+                <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor">
+                  <path d="M18 8A3 3 0 1 0 15 5m3 3v8M6 15a3 3 0 1 0 3 3m-3-3V8m6 4a3 3 0 1 0 0-6 3 3 0 0 0 0 6z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                </svg>
+                <span>Share transcript</span>
+              </button>
+            </div>
+          </div>
         </div>
 
         <div class="section">

diff --git a/extension/sidepanels/sidepanel.js b/extension/sidepanels/sidepanel.js
@@ -491,3 +491,85 @@ document.getElementById("settings-btn").addEventListener("click", () => {
     url: `${AMUREX_CONFIG.BASE_URL_WEB}/settings`,
   });
 });
+
+// Add dropdown functionality
+const exportButton = document.getElementById('export-button');
+const dropdown = exportButton.closest('.dropdown');
+
+exportButton.addEventListener('click', () => {
+  dropdown.classList.toggle('active');
+});
+
+// Close dropdown when clicking outside
+document.addEventListener('click', (e) => {
+  if (!dropdown.contains(e.target)) {
+    dropdown.classList.remove('active');
+  }
+});
+
+// Share to apps functionality
+document.getElementById('share-to-apps').addEventListener('click', () => {
+  const meetingId = window.location.href.includes('meetingId=') ? 
+    window.location.href.split('meetingId=')[1].split('&')[0] : 
+    'unknown';
+
+  chrome.runtime.sendMessage(
+    {
+      action: "getUserId",
+    },
+    (response) => {
+      if (chrome.runtime.lastError) {
+        console.error("Error getting user id:", chrome.runtime.lastError);
+        return;
+      }
+
+      const userId = response.userId;
+
+      // Make tracking request only if analytics is enabled
+      if (AMUREX_CONFIG.ANALYTICS_ENABLED) {
+        fetch(`${AMUREX_CONFIG.BASE_URL_BACKEND}/track`, {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json",
+            Accept: "application/json",
+          },
+          body: JSON.stringify({ 
+            uuid: userId, 
+            meeting_id: meetingId, 
+            event_type: "share_to_apps" 
+          }),
+        }).catch(error => {
+          console.error("Error tracking share:", error);
+        });
+      }
+
+      // Get transcript from storage
+      chrome.storage.local.get(["transcript"], function(result) {
+        if (!result.transcript) {
+          alert("No transcript available to share");
+          return;
+        }
+
+        const shareOptions = {
+          text: result.transcript,
+          title: 'Meeting Transcript'
+        };
+
+        if (navigator.canShare && navigator.canShare(shareOptions)) {
+          navigator.share(shareOptions)
+            .then(() => {
+              console.log('Shared successfully');
+              dropdown.classList.remove('active');
+            })
+            .catch((error) => {
+              if (error.name !== 'AbortError') {
+                console.error('Error sharing:', error);
+              }
+            });
+        } else {
+          alert('Web Share API is not supported in your browser');
+        }
+      });
+    }
+  );
+});