weiter

extension/content.js

@@ -6,6 +6,7 @@ const PROCESSED_ATTR = 'data-fb-tracker-processed';
 const PENDING_ATTR = 'data-fb-tracker-pending';
 const DIALOG_ROOT_SELECTOR = '[role="dialog"], [data-pagelet*="Modal"], [data-pagelet="StoriesRecentStoriesFeedSection"]';
 const API_URL = `${API_BASE_URL}/api`;
+const WEBAPP_BASE_URL = API_BASE_URL.replace(/\/+$/, '');
 const MAX_SELECTION_LENGTH = 5000;
 const postSelectionCache = new WeakMap();
 const LAST_SELECTION_MAX_AGE = 5000;
@@ -148,6 +149,28 @@ const aiCredentialCache = {
 
 console.log(`[FB Tracker v${EXTENSION_VERSION}] Extension loaded, API URL:`, API_URL);
 
+function ensureTrackerActionsContainer(container) {
+  if (!container) {
+    return null;
+  }
+
+  let actionsContainer = container.querySelector('.fb-tracker-actions-end');
+  if (actionsContainer && actionsContainer.isConnected) {
+    return actionsContainer;
+  }
+
+  actionsContainer = document.createElement('div');
+  actionsContainer.className = 'fb-tracker-actions-end';
+  actionsContainer.style.cssText = `
+    margin-left: auto;
+    display: inline-flex;
+    align-items: center;
+    gap: 8px;
+  `;
+  container.appendChild(actionsContainer);
+  return actionsContainer;
+}
+
 function backendFetch(url, options = {}) {
   const config = {
     ...options,
@@ -743,6 +766,15 @@ async function addPostToTracking(postUrl, targetCount, profileNumber, options =
       createdByName = extractAuthorName(options.postElement) || null;
     }
 
+    let postText = null;
+    if (options && options.postElement) {
+      try {
+        postText = extractPostText(options.postElement) || null;
+      } catch (error) {
+        console.debug('[FB Tracker] Failed to extract post text:', error);
+      }
+    }
+
     let deadlineIso = null;
     if (options && typeof options.deadline === 'string' && options.deadline.trim()) {
       const parsedDeadline = new Date(options.deadline.trim());
@@ -778,6 +810,10 @@ async function addPostToTracking(postUrl, targetCount, profileNumber, options =
       payload.deadline_at = deadlineIso;
     }
 
+    if (postText) {
+      payload.post_text = postText;
+    }
+
     const response = await backendFetch(`${API_URL}/posts`, {
       method: 'POST',
       headers: {
@@ -1941,6 +1977,61 @@ async function renderTrackedStatus({
 
   container.innerHTML = statusHtml;
 
+  if (postData.id) {
+    const actionsContainer = ensureTrackerActionsContainer(container);
+    if (actionsContainer) {
+      const webAppUrl = (() => {
+        try {
+          const baseUrl = `${WEBAPP_BASE_URL}/`;
+          const url = new URL('', baseUrl);
+          url.searchParams.set('tab', 'all');
+          url.searchParams.set('postId', String(postData.id));
+          if (postData.url) {
+            url.searchParams.set('postUrl', postData.url);
+          }
+          return url.toString();
+      } catch (error) {
+        console.debug('[FB Tracker] Failed to build WebApp URL, falling back to base:', error);
+        return `${WEBAPP_BASE_URL}/?tab=all`;
+      }
+    })();
+
+      let webAppLink = actionsContainer.querySelector('.fb-tracker-webapp-link');
+      if (!webAppLink) {
+        webAppLink = document.createElement('a');
+        webAppLink.className = 'fb-tracker-webapp-link';
+        webAppLink.target = '_blank';
+        webAppLink.rel = 'noopener noreferrer';
+        webAppLink.setAttribute('aria-label', 'In der Webapp anzeigen');
+        webAppLink.title = 'In der Webapp anzeigen';
+        webAppLink.textContent = '📋';
+        webAppLink.style.cssText = `
+          text-decoration: none;
+          font-size: 18px;
+          line-height: 1;
+          padding: 4px 6px;
+          display: inline-flex;
+          align-items: center;
+          justify-content: center;
+          border-radius: 6px;
+          color: inherit;
+          transition: background-color 0.2s ease, transform 0.2s ease;
+          cursor: pointer;
+        `;
+        webAppLink.addEventListener('mouseenter', () => {
+          webAppLink.style.backgroundColor = 'rgba(0, 0, 0, 0.08)';
+          webAppLink.style.transform = 'translateY(-1px)';
+        });
+        webAppLink.addEventListener('mouseleave', () => {
+          webAppLink.style.backgroundColor = 'transparent';
+          webAppLink.style.transform = 'translateY(0)';
+        });
+        actionsContainer.insertBefore(webAppLink, actionsContainer.firstChild);
+      }
+      webAppLink.href = webAppUrl;
+    }
+  }
+
   await addAICommentButton(container, postElement);
 
   const checkBtn = container.querySelector('.fb-tracker-check-btn');
@@ -3716,6 +3807,11 @@ async function addAICommentButton(container, postElement) {
     return;
   }
 
+  const actionsContainer = ensureTrackerActionsContainer(container);
+  if (!actionsContainer) {
+    return;
+  }
+
   const encodedPostUrl = container && container.getAttribute('data-post-url')
     ? container.getAttribute('data-post-url')
     : null;
@@ -3723,7 +3819,6 @@ async function addAICommentButton(container, postElement) {
   const wrapper = document.createElement('div');
   wrapper.className = 'fb-tracker-ai-wrapper';
   wrapper.style.cssText = `
-    margin-left: auto;
     position: relative;
     display: inline-flex;
     align-items: stretch;
@@ -3792,7 +3887,7 @@ async function addAICommentButton(container, postElement) {
   wrapper.appendChild(button);
   wrapper.appendChild(dropdownButton);
   wrapper.appendChild(dropdown);
-  container.appendChild(wrapper);
+  actionsContainer.appendChild(wrapper);
 
   const baseButtonText = button.textContent;