push

Author: redhatpanda

web/src/FloatingButton.tsx

@@ -8,10 +8,13 @@ import { motion } from "framer-motion";
 
 interface FloatingButtonProps {
   textArea: HTMLTextAreaElement | HTMLElement;
-  getContentEditableText?: (el: HTMLElement) => string;
+  getContentEditableText: boolean;
 }
 
-const FloatingButton: React.FC<FloatingButtonProps> = ({ textArea, getContentEditableText }) => {
+const FloatingButton: React.FC<FloatingButtonProps> = ({
+  textArea,
+  getContentEditableText,
+}) => {
   const [open, setOpen] = useState(false);
   const [text, setText] = useState("");
   const [isTyping, setIsTyping] = useState(false);
@@ -41,10 +44,10 @@ const FloatingButton: React.FC<FloatingButtonProps> = ({ textArea, getContentEdi
   }, [textArea]);
 
   const handleOpen = () => {
-    const extractedText = getContentEditableText
-      ? getContentEditableText(textArea as HTMLElement)
-      : (textArea as HTMLTextAreaElement).value;
-
+    const extractedText =
+      getContentEditableText === true
+        ? (textArea as HTMLElement).innerText
+        : (textArea as HTMLTextAreaElement).value;
     setText(extractedText);
     setOpen(true);
   };
@@ -86,7 +89,10 @@ const FloatingButton: React.FC<FloatingButtonProps> = ({ textArea, getContentEdi
 
       <motion.div
         animate={isTyping ? { rotate: 360 } : { scale: [1, 1.1, 1] }}
-        transition={{ duration: isTyping ? 0.5 : 0.3, repeat: isTyping ? Infinity : 1 }}
+        transition={{
+          duration: isTyping ? 0.5 : 0.3,
+          repeat: isTyping ? Infinity : 1,
+        }}
         whileTap={{ scale: 0.9 }}
         whileHover={{ scale: 1.1 }}
         style={{
@@ -101,7 +107,12 @@ const FloatingButton: React.FC<FloatingButtonProps> = ({ textArea, getContentEdi
         </Fab>
       </motion.div>
 
-      <Sidebar open={open} onClose={() => setOpen(false)} text={text} textArea={textArea} />
+      <Sidebar
+        open={open}
+        onClose={() => setOpen(false)}
+        text={text}
+        textArea={textArea}
+      />
     </>
   );
 };

web/src/inject.tsx

@@ -3,18 +3,29 @@ import FloatingButton from "./FloatingButton";
 
 console.log("✅ Inject script running...");
 
-const getContentEditableText = (el: HTMLElement) => {
-  return el.innerText || "";
-};
-
 function injectUI() {
-  const textAreas = document.querySelectorAll("textarea, [contenteditable='true']");
+  let textAreas: Element[] = Array.from(document.querySelectorAll("textarea, [contenteditable='true']"));
 
   if (textAreas.length === 0) {
     console.warn("⚠️ No text areas found.");
     return;
   }
 
+  console.log("Before Filter", textAreas);
+
+  if (textAreas.length > 1) {
+    const hasTextarea = textAreas.some((el) => el.tagName.toLowerCase() === "textarea");
+    const hasContentEditable = textAreas.some(
+      (el) => el.getAttribute("contenteditable") === "true"
+    );
+
+    if (hasTextarea && hasContentEditable) {
+      textAreas = textAreas.filter((el) => el.tagName.toLowerCase() !== "textarea");
+    }
+  }
+
+  console.log("After Filter", textAreas);
+
   textAreas.forEach((textArea) => {
     if (!textArea.parentElement) return;
 
@@ -34,15 +45,14 @@ function injectUI() {
     const root = createRoot(buttonContainer);
     root.render(
       <FloatingButton
-        textArea={textArea as HTMLTextAreaElement}
-        getContentEditableText={textArea.hasAttribute("contenteditable") ? getContentEditableText : undefined}
+        textArea={textArea as HTMLElement}
+        getContentEditableText={textArea.hasAttribute("contenteditable") ? true : false}
       />
     );
   });
 }
 
 injectUI();
 
-
 const observer = new MutationObserver(() => injectUI());
-observer.observe(document.body, { childList: true, subtree: true });
+observer.observe(document.body, { childList: true, subtree: true });

web/src/sidebar.tsx

@@ -36,6 +36,8 @@ const Sidebar: React.FC<SidebarProps> = ({ open, onClose, text, textArea }) => {
   }, [text]);
 
   const fetchRephrasedPrompts = async () => {
+
+    console.log("Chrome runtime",chrome.runtime);
     setLoading(true);
     if (transcript && transcript.length > 0) {
       console.log("First coniditon", transcript);