Include component changes for QR code overlay

Signed-off-by: Akashdeep Dhar <akashdeep.dhar@gmail.com>

Author: gridhead

frontend/src/comp/code.jsx

@@ -0,0 +1,20 @@
+import { QRCodeCanvas } from "qrcode.react";
+import { Tooltip } from "react-bootstrap";
+
+function QRCodeOver({ head, link }) {
+  return (
+    <Tooltip>
+      <QRCodeCanvas
+        value={link}
+        size={185}
+        bgColor="rgba(0, 0, 0, 0)"
+        level="L"
+        marginSize={1}
+        title={head}
+        className="filter-success"
+      />
+    </Tooltip>
+  );
+}
+
+export default QRCodeOver;

frontend/src/comp/rssu.jsx

@@ -1,4 +1,6 @@
-import { Accordion, Badge, ListGroup } from "react-bootstrap";
+import { Accordion, Badge, ListGroup, OverlayTrigger } from "react-bootstrap";
+
+import QRCodeOver from "./code.jsx";
 
 function FeedUnit({ data, link }) {
   const burl = new URL(link);
@@ -33,11 +35,13 @@ function FeedUnit({ data, link }) {
                 </span>
               </Accordion.Header>
               <Accordion.Body>
-                <a className="secotext text-success" href={unit.link} target="_blank" rel="noopener noreferrer">
-                  {unit.date}
-                </a>
+                <OverlayTrigger placement="bottom" overlay={QRCodeOver(unit.head, unit.link)}>
+                  <a className="secotext text-success" href={unit.link} target="_blank" rel="noopener noreferrer">
+                    {unit.date}
+                  </a>
+                </OverlayTrigger>
                 <br />
-                {unit.summ}
+                <span>{unit.summ}</span>
               </Accordion.Body>
             </Accordion.Item>
           ))